From 88872920abed0254ed3668bf149a8b6c1c22c664 Mon Sep 17 00:00:00 2001 From: Krist Wongsuphasawat Date: Wed, 12 Jun 2019 16:43:12 -0700 Subject: [PATCH] feat: add parseLength function to @superset-ui/dimension (#171) * feat: add parseLength function * feat: export * fix: address Kim's comment --- .../superset-ui-dimension/src/index.ts | 1 + .../superset-ui-dimension/src/parseLength.ts | 15 ++++++++++ .../test/parseLength.test.ts | 29 +++++++++++++++++++ 3 files changed, 45 insertions(+) create mode 100644 superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/src/parseLength.ts create mode 100644 superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/test/parseLength.test.ts diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/src/index.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/src/index.ts index e1856663ca5e5..496b224c0d31c 100644 --- a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/src/index.ts +++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/src/index.ts @@ -1,5 +1,6 @@ export { default as getTextDimension } from './getTextDimension'; export { default as computeMaxFontSize } from './computeMaxFontSize'; export { default as mergeMargin } from './mergeMargin'; +export { default as parseLength } from './parseLength'; export * from './types'; diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/src/parseLength.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/src/parseLength.ts new file mode 100644 index 0000000000000..07057d077acdc --- /dev/null +++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/src/parseLength.ts @@ -0,0 +1,15 @@ +const HUNDRED_PERCENT = { isDynamic: true, multiplier: 1 } as const; + +export default function parseLength( + input: string | number, +): { isDynamic: true; multiplier: number } | { isDynamic: false; value: number } { + if (input === 'auto' || input === '100%') { + return HUNDRED_PERCENT; + } else if (typeof input === 'string' && input.length > 0 && input[input.length - 1] === '%') { + // eslint-disable-next-line no-magic-numbers + return { isDynamic: true, multiplier: parseFloat(input) / 100 }; + } + const value = typeof input === 'number' ? input : parseFloat(input); + + return { isDynamic: false, value }; +} diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/test/parseLength.test.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/test/parseLength.test.ts new file mode 100644 index 0000000000000..e4f13d7140f5a --- /dev/null +++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-dimension/test/parseLength.test.ts @@ -0,0 +1,29 @@ +import parseLength from '../src/parseLength'; + +describe('parseLength(input)', () => { + it('handles string "auto"', () => { + expect(parseLength('auto')).toEqual({ isDynamic: true, multiplier: 1 }); + }); + + it('handles strings with % at the end', () => { + expect(parseLength('100%')).toEqual({ isDynamic: true, multiplier: 1 }); + expect(parseLength('50%')).toEqual({ isDynamic: true, multiplier: 0.5 }); + expect(parseLength('0%')).toEqual({ isDynamic: true, multiplier: 0 }); + }); + + it('handles strings that are numbers with px at the end', () => { + expect(parseLength('100px')).toEqual({ isDynamic: false, value: 100 }); + expect(parseLength('20.5px')).toEqual({ isDynamic: false, value: 20.5 }); + }); + + it('handles strings that are numbers', () => { + expect(parseLength('100')).toEqual({ isDynamic: false, value: 100 }); + expect(parseLength('40.5')).toEqual({ isDynamic: false, value: 40.5 }); + expect(parseLength('20.0')).toEqual({ isDynamic: false, value: 20 }); + }); + + it('handles numbers', () => { + expect(parseLength(100)).toEqual({ isDynamic: false, value: 100 }); + expect(parseLength(0)).toEqual({ isDynamic: false, value: 0 }); + }); +});