diff --git a/src/js/css-gradient.ts b/src/js/css-gradient.ts index 2bbe4ac..bb284c0 100644 --- a/src/js/css-gradient.ts +++ b/src/js/css-gradient.ts @@ -226,7 +226,9 @@ export const parseGradient = ( const type = getGradientType(value); const gradValue = value.replace(REG_GRAD, '').replace(/\)$/, ''); if (type && gradValue) { - const [lineOrColorStop = '', ...colorStops] = splitValue(gradValue, ','); + const [lineOrColorStop = '', ...colorStops] = splitValue(gradValue, { + delimiter: ',' + }); const dimension = /^(?:repeating-)?conic-gradient$/.test(type) ? DIM_ANGLE_PCT : DIM_LEN_PCT; diff --git a/src/js/typedef.ts b/src/js/typedef.ts index 1aaec48..873badf 100644 --- a/src/js/typedef.ts +++ b/src/js/typedef.ts @@ -24,6 +24,7 @@ export interface Options { dimension?: Record number)>; format?: string; nullable?: boolean; + preserveComment?: boolean; } /** diff --git a/src/js/util.ts b/src/js/util.ts index 93c1fa3..75463b8 100644 --- a/src/js/util.ts +++ b/src/js/util.ts @@ -38,15 +38,16 @@ const REG_MIX = new RegExp(SYN_MIX); /** * split value * @param value - CSS value - * @param [delimiter] - comma or space + * @param [opt] - options * @returns array of values, NOTE: comments are stripped */ -export const splitValue = (value: string, delimiter: string = ''): string[] => { +export const splitValue = (value: string, opt: Options = {}): string[] => { if (isString(value)) { value = value.trim(); } else { throw new TypeError(`${value} is not a string.`); } + const { delimiter = ' ', preserveComment = false } = opt; const cacheKey: string = createCacheKey( { namespace: NAMESPACE, @@ -54,7 +55,8 @@ export const splitValue = (value: string, delimiter: string = ''): string[] => { value }, { - delimiter + delimiter, + preserveComment } ); const cachedResult = getCache(cacheKey); @@ -83,6 +85,9 @@ export const splitValue = (value: string, delimiter: string = ''): string[] => { break; } case COMMENT: { + if (preserveComment && delimiter === ',') { + str += value; + } break; } case FUNC: diff --git a/test/util.test.ts b/test/util.test.ts index 364e464..78ec940 100644 --- a/test/util.test.ts +++ b/test/util.test.ts @@ -38,7 +38,9 @@ describe('split value', () => { }); it('should get value', () => { - const res = func('foo bar', ','); + const res = func('foo bar', { + delimiter: ',' + }); assert.deepEqual(res, ['foo bar'], 'result'); }); @@ -48,7 +50,9 @@ describe('split value', () => { }); it('should get value', () => { - const res = func('foo bar', ','); + const res = func('foo bar', { + delimiter: ',' + }); assert.deepEqual(res, ['foo bar'], 'result'); }); @@ -58,19 +62,48 @@ describe('split value', () => { }); it('should get value', () => { - const res = func('foo /* comment */ , bar', ','); + const res = func('foo /* comment */ , bar', { + delimiter: ',' + }); + assert.deepEqual(res, ['foo', 'bar'], 'result'); + }); + + it('should get value', () => { + const res = func('foo /* comment */ bar', { + preserveComment: true + }); assert.deepEqual(res, ['foo', 'bar'], 'result'); }); it('should get value', () => { - const res = func(',', ','); + const res = func('foo /* comment */ , bar', { + delimiter: ',', + preserveComment: true + }); + assert.deepEqual(res, ['foo /* comment */', 'bar'], 'result'); + }); + + it('should get value', () => { + const res = func('foo /* comment */ bar, baz', { + delimiter: ',', + preserveComment: true + }); + assert.deepEqual(res, ['foo /* comment */ bar', 'baz'], 'result'); + }); + + it('should get value', () => { + const res = func(',', { + delimiter: ',' + }); assert.deepEqual(res, ['', ''], 'result'); }); it('should get value', () => { const res = func( 'linear-gradient(red, blue), radial-gradient(yellow, green)', - ',' + { + delimiter: ',' + } ); assert.deepEqual( res,