@veeqo/ui 14.7.1 → 14.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Checkbox/Checkbox.cjs +2 -2
- package/dist/components/Checkbox/Checkbox.cjs.map +1 -1
- package/dist/components/Checkbox/Checkbox.js +2 -2
- package/dist/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.module.scss.cjs +9 -0
- package/dist/components/Checkbox/Checkbox.module.scss.cjs.map +1 -0
- package/dist/components/Checkbox/Checkbox.module.scss.js +7 -0
- package/dist/components/Checkbox/Checkbox.module.scss.js.map +1 -0
- package/dist/components/Choice/Choice.cjs +21 -11
- package/dist/components/Choice/Choice.cjs.map +1 -1
- package/dist/components/Choice/Choice.js +21 -11
- package/dist/components/Choice/Choice.js.map +1 -1
- package/dist/components/Choice/Choice.module.scss.cjs +9 -0
- package/dist/components/Choice/Choice.module.scss.cjs.map +1 -0
- package/dist/components/Choice/Choice.module.scss.js +7 -0
- package/dist/components/Choice/Choice.module.scss.js.map +1 -0
- package/dist/components/ChoiceList/ChoiceList.cjs +3 -3
- package/dist/components/ChoiceList/ChoiceList.cjs.map +1 -1
- package/dist/components/ChoiceList/ChoiceList.js +3 -3
- package/dist/components/ChoiceList/ChoiceList.js.map +1 -1
- package/dist/components/ChoiceList/ChoiceList.module.scss.cjs +9 -0
- package/dist/components/ChoiceList/ChoiceList.module.scss.cjs.map +1 -0
- package/dist/components/ChoiceList/ChoiceList.module.scss.js +7 -0
- package/dist/components/ChoiceList/ChoiceList.module.scss.js.map +1 -0
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs +4 -2
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs.map +1 -1
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js +4 -2
- package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js.map +1 -1
- package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.cjs +4 -2
- package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.cjs.map +1 -1
- package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.js +4 -2
- package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.js.map +1 -1
- package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs +4 -2
- package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs.map +1 -1
- package/dist/components/DataGrid/components/GridContainer/GridContainer.js +4 -2
- package/dist/components/DataGrid/components/GridContainer/GridContainer.js.map +1 -1
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.cjs +4 -2
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.cjs.map +1 -1
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.js +4 -2
- package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.js.map +1 -1
- package/dist/components/DimensionsInput/DimensionsInput.cjs +0 -1
- package/dist/components/DimensionsInput/DimensionsInput.cjs.map +1 -1
- package/dist/components/DimensionsInput/DimensionsInput.js +0 -1
- package/dist/components/DimensionsInput/DimensionsInput.js.map +1 -1
- package/dist/components/InputAffix/InputAffix.cjs +6 -10
- package/dist/components/InputAffix/InputAffix.cjs.map +1 -1
- package/dist/components/InputAffix/InputAffix.d.ts +4 -6
- package/dist/components/InputAffix/InputAffix.js +6 -9
- package/dist/components/InputAffix/InputAffix.js.map +1 -1
- package/dist/components/InputAffix/InputAffix.module.scss.cjs +9 -0
- package/dist/components/InputAffix/InputAffix.module.scss.cjs.map +1 -0
- package/dist/components/InputAffix/InputAffix.module.scss.js +7 -0
- package/dist/components/InputAffix/InputAffix.module.scss.js.map +1 -0
- package/dist/components/PriceInput/PriceInput.cjs +1 -1
- package/dist/components/PriceInput/PriceInput.cjs.map +1 -1
- package/dist/components/PriceInput/PriceInput.js +1 -1
- package/dist/components/PriceInput/PriceInput.js.map +1 -1
- package/dist/components/Radio/Radio.cjs +2 -2
- package/dist/components/Radio/Radio.cjs.map +1 -1
- package/dist/components/Radio/Radio.js +2 -2
- package/dist/components/Radio/Radio.js.map +1 -1
- package/dist/components/Radio/Radio.module.scss.cjs +9 -0
- package/dist/components/Radio/Radio.module.scss.cjs.map +1 -0
- package/dist/components/Radio/Radio.module.scss.js +7 -0
- package/dist/components/Radio/Radio.module.scss.js.map +1 -0
- package/dist/components/ToggleButton/ToggleButton.cjs +2 -2
- package/dist/components/ToggleButton/ToggleButton.cjs.map +1 -1
- package/dist/components/ToggleButton/ToggleButton.d.ts +2 -8
- package/dist/components/ToggleButton/ToggleButton.js +2 -2
- package/dist/components/ToggleButton/ToggleButton.js.map +1 -1
- package/dist/components/ToggleButton/types.d.ts +8 -0
- package/dist/components/WeightInput/WeightInput.cjs +0 -1
- package/dist/components/WeightInput/WeightInput.cjs.map +1 -1
- package/dist/components/WeightInput/WeightInput.js +0 -1
- package/dist/components/WeightInput/WeightInput.js.map +1 -1
- package/dist/utils/forms/inputStyles.cjs +1 -2
- package/dist/utils/forms/inputStyles.cjs.map +1 -1
- package/dist/utils/forms/inputStyles.js +2 -2
- package/dist/utils/forms/inputStyles.js.map +1 -1
- package/package.json +1 -1
- package/dist/components/Checkbox/styled.cjs +0 -14
- package/dist/components/Checkbox/styled.cjs.map +0 -1
- package/dist/components/Checkbox/styled.d.ts +0 -1
- package/dist/components/Checkbox/styled.js +0 -8
- package/dist/components/Checkbox/styled.js.map +0 -1
- package/dist/components/Choice/components/styled.cjs +0 -30
- package/dist/components/Choice/components/styled.cjs.map +0 -1
- package/dist/components/Choice/components/styled.d.ts +0 -14
- package/dist/components/Choice/components/styled.js +0 -18
- package/dist/components/Choice/components/styled.js.map +0 -1
- package/dist/components/ChoiceList/styled.cjs +0 -15
- package/dist/components/ChoiceList/styled.cjs.map +0 -1
- package/dist/components/ChoiceList/styled.d.ts +0 -2
- package/dist/components/ChoiceList/styled.js +0 -8
- package/dist/components/ChoiceList/styled.js.map +0 -1
- package/dist/components/Radio/styled.cjs +0 -12
- package/dist/components/Radio/styled.cjs.map +0 -1
- package/dist/components/Radio/styled.d.ts +0 -1
- package/dist/components/Radio/styled.js +0 -6
- package/dist/components/Radio/styled.js.map +0 -1
- package/dist/components/ToggleButton/styled.cjs +0 -49
- package/dist/components/ToggleButton/styled.cjs.map +0 -1
- package/dist/components/ToggleButton/styled.d.ts +0 -1
- package/dist/components/ToggleButton/styled.js +0 -43
- package/dist/components/ToggleButton/styled.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PriceInput.cjs","sources":["../../../src/components/PriceInput/PriceInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { PriceInputProps } from './types';\n\nimport { Stepper } from '../Stepper';\nimport { InputAffix } from '../InputAffix';\nimport { InputGroup } from '../InputGroup';\nimport { TextField, TextFieldProps } from '../TextField';\n\nconst fractionDigits = 2;\n\nconst flexStyle = { flex: 1 };\n\nfunction stringToFixed(price: string) {\n const floatPrice = parseFloat(price.replace(',', '.'));\n return floatPrice.toFixed(fractionDigits);\n}\n\nexport const PriceInput = withLabels<PriceInputProps>(\n ({\n className = '',\n hasError,\n currency,\n disabled = false,\n onChange,\n onPriceChange,\n priceValue,\n step = '0.1',\n size = 'base',\n ...otherProps\n }) => {\n const handleChange = (value: string) =>\n onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));\n\n const handleBlur: TextFieldProps['onBlur'] = (e) => {\n const target = e.target as HTMLInputElement;\n const { value } = target;\n\n if (!value) {\n onPriceChange('');\n\n return;\n }\n\n const roundedValue = stringToFixed(value);\n\n onPriceChange(roundedValue);\n };\n\n const handleIncrement = (callback = onPriceChange) => {\n const currentPrice = parseFloat(priceValue) || 0;\n const currentStep = parseFloat(step);\n\n callback((currentPrice + currentStep).toFixed(fractionDigits));\n };\n const handleDecrement = (callback = onPriceChange) => {\n const currentPrice = parseFloat(priceValue) || 0;\n const currentStep = parseFloat(step);\n\n callback((currentPrice - currentStep).toFixed(fractionDigits));\n };\n\n const handleKeyDown: TextFieldProps['onKeyDown'] = (e) => {\n const { key } = e;\n const target = e.target as HTMLInputElement;\n const isInForm = target.form;\n\n if (!isInForm) {\n if (key === 'Enter') target.blur();\n }\n if (key === 'ArrowUp') handleIncrement(onChange);\n if (key === 'ArrowDown') handleDecrement(onChange);\n };\n\n const compact = size === 'sm';\n\n return (\n <InputGroup hasError={hasError} style={flexStyle} className={className}>\n <InputAffix compact={compact}
|
|
1
|
+
{"version":3,"file":"PriceInput.cjs","sources":["../../../src/components/PriceInput/PriceInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { PriceInputProps } from './types';\n\nimport { Stepper } from '../Stepper';\nimport { InputAffix } from '../InputAffix';\nimport { InputGroup } from '../InputGroup';\nimport { TextField, TextFieldProps } from '../TextField';\n\nconst fractionDigits = 2;\n\nconst flexStyle = { flex: 1 };\n\nfunction stringToFixed(price: string) {\n const floatPrice = parseFloat(price.replace(',', '.'));\n return floatPrice.toFixed(fractionDigits);\n}\n\nexport const PriceInput = withLabels<PriceInputProps>(\n ({\n className = '',\n hasError,\n currency,\n disabled = false,\n onChange,\n onPriceChange,\n priceValue,\n step = '0.1',\n size = 'base',\n ...otherProps\n }) => {\n const handleChange = (value: string) =>\n onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));\n\n const handleBlur: TextFieldProps['onBlur'] = (e) => {\n const target = e.target as HTMLInputElement;\n const { value } = target;\n\n if (!value) {\n onPriceChange('');\n\n return;\n }\n\n const roundedValue = stringToFixed(value);\n\n onPriceChange(roundedValue);\n };\n\n const handleIncrement = (callback = onPriceChange) => {\n const currentPrice = parseFloat(priceValue) || 0;\n const currentStep = parseFloat(step);\n\n callback((currentPrice + currentStep).toFixed(fractionDigits));\n };\n const handleDecrement = (callback = onPriceChange) => {\n const currentPrice = parseFloat(priceValue) || 0;\n const currentStep = parseFloat(step);\n\n callback((currentPrice - currentStep).toFixed(fractionDigits));\n };\n\n const handleKeyDown: TextFieldProps['onKeyDown'] = (e) => {\n const { key } = e;\n const target = e.target as HTMLInputElement;\n const isInForm = target.form;\n\n if (!isInForm) {\n if (key === 'Enter') target.blur();\n }\n if (key === 'ArrowUp') handleIncrement(onChange);\n if (key === 'ArrowDown') handleDecrement(onChange);\n };\n\n const compact = size === 'sm';\n\n return (\n <InputGroup hasError={hasError} style={flexStyle} className={className}>\n <InputAffix compact={compact}>\n {currency}\n </InputAffix>\n <TextField\n placeholder=\"0.00\"\n value={priceValue}\n step={step}\n onChange={handleChange}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={disabled}\n size={size}\n hasError={hasError}\n style={flexStyle}\n {...otherProps}\n />\n <Stepper\n onIncrement={() => handleIncrement()}\n onDecrement={() => handleDecrement()}\n disabled={disabled}\n hasError={hasError}\n size={size}\n />\n </InputGroup>\n );\n },\n);\n\nPriceInput.displayName = 'PriceInput';\n"],"names":["withLabels","React","InputGroup","InputAffix","TextField","Stepper"],"mappings":"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"}
|
|
@@ -48,7 +48,7 @@ const PriceInput = withLabels(({ className = '', hasError, currency, disabled =
|
|
|
48
48
|
};
|
|
49
49
|
const compact = size === 'sm';
|
|
50
50
|
return (React__default.createElement(InputGroup, { hasError: hasError, style: flexStyle, className: className },
|
|
51
|
-
React__default.createElement(InputAffix, { compact: compact
|
|
51
|
+
React__default.createElement(InputAffix, { compact: compact }, currency),
|
|
52
52
|
React__default.createElement(TextField, { placeholder: "0.00", value: priceValue, step: step, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, disabled: disabled, size: size, hasError: hasError, style: flexStyle, ...otherProps }),
|
|
53
53
|
React__default.createElement(Stepper, { onIncrement: () => handleIncrement(), onDecrement: () => handleDecrement(), disabled: disabled, hasError: hasError, size: size })));
|
|
54
54
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PriceInput.js","sources":["../../../src/components/PriceInput/PriceInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { PriceInputProps } from './types';\n\nimport { Stepper } from '../Stepper';\nimport { InputAffix } from '../InputAffix';\nimport { InputGroup } from '../InputGroup';\nimport { TextField, TextFieldProps } from '../TextField';\n\nconst fractionDigits = 2;\n\nconst flexStyle = { flex: 1 };\n\nfunction stringToFixed(price: string) {\n const floatPrice = parseFloat(price.replace(',', '.'));\n return floatPrice.toFixed(fractionDigits);\n}\n\nexport const PriceInput = withLabels<PriceInputProps>(\n ({\n className = '',\n hasError,\n currency,\n disabled = false,\n onChange,\n onPriceChange,\n priceValue,\n step = '0.1',\n size = 'base',\n ...otherProps\n }) => {\n const handleChange = (value: string) =>\n onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));\n\n const handleBlur: TextFieldProps['onBlur'] = (e) => {\n const target = e.target as HTMLInputElement;\n const { value } = target;\n\n if (!value) {\n onPriceChange('');\n\n return;\n }\n\n const roundedValue = stringToFixed(value);\n\n onPriceChange(roundedValue);\n };\n\n const handleIncrement = (callback = onPriceChange) => {\n const currentPrice = parseFloat(priceValue) || 0;\n const currentStep = parseFloat(step);\n\n callback((currentPrice + currentStep).toFixed(fractionDigits));\n };\n const handleDecrement = (callback = onPriceChange) => {\n const currentPrice = parseFloat(priceValue) || 0;\n const currentStep = parseFloat(step);\n\n callback((currentPrice - currentStep).toFixed(fractionDigits));\n };\n\n const handleKeyDown: TextFieldProps['onKeyDown'] = (e) => {\n const { key } = e;\n const target = e.target as HTMLInputElement;\n const isInForm = target.form;\n\n if (!isInForm) {\n if (key === 'Enter') target.blur();\n }\n if (key === 'ArrowUp') handleIncrement(onChange);\n if (key === 'ArrowDown') handleDecrement(onChange);\n };\n\n const compact = size === 'sm';\n\n return (\n <InputGroup hasError={hasError} style={flexStyle} className={className}>\n <InputAffix compact={compact}
|
|
1
|
+
{"version":3,"file":"PriceInput.js","sources":["../../../src/components/PriceInput/PriceInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { PriceInputProps } from './types';\n\nimport { Stepper } from '../Stepper';\nimport { InputAffix } from '../InputAffix';\nimport { InputGroup } from '../InputGroup';\nimport { TextField, TextFieldProps } from '../TextField';\n\nconst fractionDigits = 2;\n\nconst flexStyle = { flex: 1 };\n\nfunction stringToFixed(price: string) {\n const floatPrice = parseFloat(price.replace(',', '.'));\n return floatPrice.toFixed(fractionDigits);\n}\n\nexport const PriceInput = withLabels<PriceInputProps>(\n ({\n className = '',\n hasError,\n currency,\n disabled = false,\n onChange,\n onPriceChange,\n priceValue,\n step = '0.1',\n size = 'base',\n ...otherProps\n }) => {\n const handleChange = (value: string) =>\n onChange(value.replace(/[a-zA-Z]/g, '').replace(',', '.'));\n\n const handleBlur: TextFieldProps['onBlur'] = (e) => {\n const target = e.target as HTMLInputElement;\n const { value } = target;\n\n if (!value) {\n onPriceChange('');\n\n return;\n }\n\n const roundedValue = stringToFixed(value);\n\n onPriceChange(roundedValue);\n };\n\n const handleIncrement = (callback = onPriceChange) => {\n const currentPrice = parseFloat(priceValue) || 0;\n const currentStep = parseFloat(step);\n\n callback((currentPrice + currentStep).toFixed(fractionDigits));\n };\n const handleDecrement = (callback = onPriceChange) => {\n const currentPrice = parseFloat(priceValue) || 0;\n const currentStep = parseFloat(step);\n\n callback((currentPrice - currentStep).toFixed(fractionDigits));\n };\n\n const handleKeyDown: TextFieldProps['onKeyDown'] = (e) => {\n const { key } = e;\n const target = e.target as HTMLInputElement;\n const isInForm = target.form;\n\n if (!isInForm) {\n if (key === 'Enter') target.blur();\n }\n if (key === 'ArrowUp') handleIncrement(onChange);\n if (key === 'ArrowDown') handleDecrement(onChange);\n };\n\n const compact = size === 'sm';\n\n return (\n <InputGroup hasError={hasError} style={flexStyle} className={className}>\n <InputAffix compact={compact}>\n {currency}\n </InputAffix>\n <TextField\n placeholder=\"0.00\"\n value={priceValue}\n step={step}\n onChange={handleChange}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={disabled}\n size={size}\n hasError={hasError}\n style={flexStyle}\n {...otherProps}\n />\n <Stepper\n onIncrement={() => handleIncrement()}\n onDecrement={() => handleDecrement()}\n disabled={disabled}\n hasError={hasError}\n size={size}\n />\n </InputGroup>\n );\n },\n);\n\nPriceInput.displayName = 'PriceInput';\n"],"names":["React"],"mappings":"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"}
|
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var Choice = require('../Choice/Choice.cjs');
|
|
5
|
-
var styled = require('./styled.cjs');
|
|
6
5
|
var generateId = require('../../utils/generateId.cjs');
|
|
6
|
+
var Radio_module = require('./Radio.module.scss.cjs');
|
|
7
7
|
|
|
8
8
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
9
9
|
|
|
@@ -16,7 +16,7 @@ const Radio = React.forwardRef(({ checked, value, name, hint, disabled, onChange
|
|
|
16
16
|
const componentId = React.useMemo(() => id !== null && id !== void 0 ? id : generateId.generateId('radio'), [id]);
|
|
17
17
|
const ariaDescribedBy = hint ? `hint-${componentId}` : undefined;
|
|
18
18
|
return (React__default.default.createElement(Choice.Choice, { htmlFor: componentId, disabled: disabled, hint: hint, ...otherProps },
|
|
19
|
-
React__default.default.createElement(
|
|
19
|
+
React__default.default.createElement("input", { className: Radio_module.input, id: componentId, type: "radio", checked: checked, value: value, name: name, disabled: disabled, onChange: handleChange, ref: ref, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy }),
|
|
20
20
|
children));
|
|
21
21
|
});
|
|
22
22
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Radio.cjs","sources":["../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React, { AriaAttributes, ReactNode, forwardRef, useCallback, useMemo } from 'react';\nimport { Choice, ForwardedChoiceProps } from '../Choice';\nimport {
|
|
1
|
+
{"version":3,"file":"Radio.cjs","sources":["../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React, { AriaAttributes, ReactNode, forwardRef, useCallback, useMemo } from 'react';\nimport { Choice, ForwardedChoiceProps } from '../Choice';\nimport { generateId } from '../../utils/generateId';\n\nimport styles from './Radio.module.scss';\n\ntype RadioValue = string | number;\n\nexport interface RadioProps extends ForwardedChoiceProps, Pick<AriaAttributes, 'aria-label'> {\n id?: string;\n className?: string;\n checked: boolean;\n value?: RadioValue;\n disabled?: boolean;\n name?: string;\n onChange: (checked: boolean, value?: RadioValue) => void;\n children?: ReactNode;\n}\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(\n (\n {\n checked,\n value,\n name,\n hint,\n disabled,\n onChange,\n id,\n children,\n 'aria-label': ariaLabel,\n ...otherProps\n }: RadioProps,\n ref,\n ) => {\n const handleChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n onChange(e.currentTarget.checked, value);\n },\n [onChange, value],\n );\n\n const componentId = useMemo(() => id ?? generateId('radio'), [id]);\n const ariaDescribedBy = hint ? `hint-${componentId}` : undefined;\n\n return (\n <Choice htmlFor={componentId} disabled={disabled} hint={hint} {...otherProps}>\n <input\n className={styles.input}\n id={componentId}\n type=\"radio\"\n checked={checked}\n value={value}\n name={name}\n disabled={disabled}\n onChange={handleChange}\n ref={ref}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedBy}\n />\n {children}\n </Choice>\n );\n },\n);\n"],"names":["forwardRef","useCallback","useMemo","generateId","React","Choice","styles"],"mappings":";;;;;;;;;;;AAmBO,MAAM,KAAK,GAAGA,gBAAU,CAC7B,CACE,EACE,OAAO,EACP,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,EAAE,EACF,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,GAAG,UAAU,EACF,EACb,GAAG,KACD;AACF,IAAA,MAAM,YAAY,GAAGC,iBAAW,CAC9B,CAAC,CAAsC,KAAI;QACzC,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC;AAC1C,IAAA,CAAC,EACD,CAAC,QAAQ,EAAE,KAAK,CAAC,CAClB;IAED,MAAM,WAAW,GAAGC,aAAO,CAAC,MAAM,EAAE,KAAA,IAAA,IAAF,EAAE,KAAA,MAAA,GAAF,EAAE,GAAIC,qBAAU,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;AAClE,IAAA,MAAM,eAAe,GAAG,IAAI,GAAG,CAAA,KAAA,EAAQ,WAAW,CAAA,CAAE,GAAG,SAAS;AAEhE,IAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,aAAM,EAAA,EAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,KAAM,UAAU,EAAA;AAC1E,QAAAD,sBAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,SAAS,EAAEE,YAAM,CAAC,KAAK,EACvB,EAAE,EAAE,WAAW,EACf,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,YAAY,EACtB,GAAG,EAAE,GAAG,gBACI,SAAS,EAAA,kBAAA,EACH,eAAe,EAAA,CACjC;QACD,QAAQ,CACF;AAEb,CAAC;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React__default, { forwardRef, useCallback, useMemo } from 'react';
|
|
2
2
|
import { Choice } from '../Choice/Choice.js';
|
|
3
|
-
import { Input } from './styled.js';
|
|
4
3
|
import { generateId } from '../../utils/generateId.js';
|
|
4
|
+
import styles from './Radio.module.scss.js';
|
|
5
5
|
|
|
6
6
|
const Radio = forwardRef(({ checked, value, name, hint, disabled, onChange, id, children, 'aria-label': ariaLabel, ...otherProps }, ref) => {
|
|
7
7
|
const handleChange = useCallback((e) => {
|
|
@@ -10,7 +10,7 @@ const Radio = forwardRef(({ checked, value, name, hint, disabled, onChange, id,
|
|
|
10
10
|
const componentId = useMemo(() => id !== null && id !== void 0 ? id : generateId('radio'), [id]);
|
|
11
11
|
const ariaDescribedBy = hint ? `hint-${componentId}` : undefined;
|
|
12
12
|
return (React__default.createElement(Choice, { htmlFor: componentId, disabled: disabled, hint: hint, ...otherProps },
|
|
13
|
-
React__default.createElement(
|
|
13
|
+
React__default.createElement("input", { className: styles.input, id: componentId, type: "radio", checked: checked, value: value, name: name, disabled: disabled, onChange: handleChange, ref: ref, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy }),
|
|
14
14
|
children));
|
|
15
15
|
});
|
|
16
16
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Radio.js","sources":["../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React, { AriaAttributes, ReactNode, forwardRef, useCallback, useMemo } from 'react';\nimport { Choice, ForwardedChoiceProps } from '../Choice';\nimport {
|
|
1
|
+
{"version":3,"file":"Radio.js","sources":["../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React, { AriaAttributes, ReactNode, forwardRef, useCallback, useMemo } from 'react';\nimport { Choice, ForwardedChoiceProps } from '../Choice';\nimport { generateId } from '../../utils/generateId';\n\nimport styles from './Radio.module.scss';\n\ntype RadioValue = string | number;\n\nexport interface RadioProps extends ForwardedChoiceProps, Pick<AriaAttributes, 'aria-label'> {\n id?: string;\n className?: string;\n checked: boolean;\n value?: RadioValue;\n disabled?: boolean;\n name?: string;\n onChange: (checked: boolean, value?: RadioValue) => void;\n children?: ReactNode;\n}\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(\n (\n {\n checked,\n value,\n name,\n hint,\n disabled,\n onChange,\n id,\n children,\n 'aria-label': ariaLabel,\n ...otherProps\n }: RadioProps,\n ref,\n ) => {\n const handleChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n onChange(e.currentTarget.checked, value);\n },\n [onChange, value],\n );\n\n const componentId = useMemo(() => id ?? generateId('radio'), [id]);\n const ariaDescribedBy = hint ? `hint-${componentId}` : undefined;\n\n return (\n <Choice htmlFor={componentId} disabled={disabled} hint={hint} {...otherProps}>\n <input\n className={styles.input}\n id={componentId}\n type=\"radio\"\n checked={checked}\n value={value}\n name={name}\n disabled={disabled}\n onChange={handleChange}\n ref={ref}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedBy}\n />\n {children}\n </Choice>\n );\n },\n);\n"],"names":["React"],"mappings":";;;;;AAmBO,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EACE,OAAO,EACP,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,QAAQ,EACR,EAAE,EACF,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,GAAG,UAAU,EACF,EACb,GAAG,KACD;AACF,IAAA,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,CAAsC,KAAI;QACzC,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC;AAC1C,IAAA,CAAC,EACD,CAAC,QAAQ,EAAE,KAAK,CAAC,CAClB;IAED,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM,EAAE,KAAA,IAAA,IAAF,EAAE,KAAA,MAAA,GAAF,EAAE,GAAI,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;AAClE,IAAA,MAAM,eAAe,GAAG,IAAI,GAAG,CAAA,KAAA,EAAQ,WAAW,CAAA,CAAE,GAAG,SAAS;AAEhE,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,KAAM,UAAU,EAAA;AAC1E,QAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,EAAE,EAAE,WAAW,EACf,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,YAAY,EACtB,GAAG,EAAE,GAAG,gBACI,SAAS,EAAA,kBAAA,EACH,eAAe,EAAA,CACjC;QACD,QAAQ,CACF;AAEb,CAAC;;;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
|
|
4
|
+
|
|
5
|
+
___$insertStyle("._input_1ycnq_1 {\n appearance: none;\n box-sizing: border-box;\n flex-shrink: 0;\n width: 18px;\n height: 18px;\n margin: 3px;\n background-color: transparent;\n border: 2px solid var(--colors-neutral-ink-light);\n border-radius: 50%;\n outline: none;\n cursor: pointer;\n transition: box-shadow 0.1s;\n}\n._input_1ycnq_1:checked {\n position: relative;\n border-color: var(--colors-secondary-blue-base);\n}\n._input_1ycnq_1:checked::before {\n content: \"\";\n width: 10px;\n height: 10px;\n position: absolute;\n top: 2px;\n left: 2px;\n background-color: var(--colors-secondary-blue-base);\n border-radius: 50%;\n}\n._input_1ycnq_1:hover {\n border-color: var(--colors-secondary-blue-base);\n}\n._input_1ycnq_1:active {\n border-color: var(--colors-secondary-blue-base);\n}\n._input_1ycnq_1:focus {\n box-shadow: 0 0 0 var(--sizes-xs) var(--colors-secondary-blue-light);\n outline: 0;\n}\n._input_1ycnq_1:disabled {\n box-shadow: none;\n background-color: var(--colors-neutral-grey-base);\n border-color: var(--colors-neutral-ink-lightest);\n cursor: default;\n}\n._input_1ycnq_1:disabled::before {\n background-color: var(--colors-neutral-ink-light);\n}");
|
|
6
|
+
var styles = {"input":"_input_1ycnq_1"};
|
|
7
|
+
|
|
8
|
+
module.exports = styles;
|
|
9
|
+
//# sourceMappingURL=Radio.module.scss.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Radio.module.scss.cjs","sources":["../../../src/components/Radio/Radio.module.scss"],"sourcesContent":[".input {\n appearance: none;\n box-sizing: border-box;\n flex-shrink: 0;\n width: 18px;\n height: 18px;\n margin: 3px;\n background-color: transparent;\n border: 2px solid var(--colors-neutral-ink-light);\n border-radius: 50%;\n outline: none;\n cursor: pointer;\n\n transition: box-shadow 0.1s;\n\n &:checked {\n position: relative;\n border-color: var(--colors-secondary-blue-base);\n }\n\n &:checked::before {\n content: '';\n width: 10px;\n height: 10px;\n position: absolute;\n top: 2px;\n left: 2px;\n background-color: var(--colors-secondary-blue-base);\n border-radius: 50%;\n }\n\n &:hover {\n border-color: var(--colors-secondary-blue-base);\n }\n\n &:active {\n border-color: var(--colors-secondary-blue-base);\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--sizes-xs) var(--colors-secondary-blue-light);\n outline: 0;\n }\n\n &:disabled {\n box-shadow: none;\n background-color: var(--colors-neutral-grey-base);\n border-color: var(--colors-neutral-ink-lightest);\n cursor: default;\n }\n\n &:disabled::before {\n background-color: var(--colors-neutral-ink-light);\n }\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,uqCAAA;AACA,aAAA,CAAA,OAAA,CAAA,gBAAA;;;;"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import insertStyle from '../../_virtual/____insertStyle.js';
|
|
2
|
+
|
|
3
|
+
insertStyle("._input_1ycnq_1 {\n appearance: none;\n box-sizing: border-box;\n flex-shrink: 0;\n width: 18px;\n height: 18px;\n margin: 3px;\n background-color: transparent;\n border: 2px solid var(--colors-neutral-ink-light);\n border-radius: 50%;\n outline: none;\n cursor: pointer;\n transition: box-shadow 0.1s;\n}\n._input_1ycnq_1:checked {\n position: relative;\n border-color: var(--colors-secondary-blue-base);\n}\n._input_1ycnq_1:checked::before {\n content: \"\";\n width: 10px;\n height: 10px;\n position: absolute;\n top: 2px;\n left: 2px;\n background-color: var(--colors-secondary-blue-base);\n border-radius: 50%;\n}\n._input_1ycnq_1:hover {\n border-color: var(--colors-secondary-blue-base);\n}\n._input_1ycnq_1:active {\n border-color: var(--colors-secondary-blue-base);\n}\n._input_1ycnq_1:focus {\n box-shadow: 0 0 0 var(--sizes-xs) var(--colors-secondary-blue-light);\n outline: 0;\n}\n._input_1ycnq_1:disabled {\n box-shadow: none;\n background-color: var(--colors-neutral-grey-base);\n border-color: var(--colors-neutral-ink-lightest);\n cursor: default;\n}\n._input_1ycnq_1:disabled::before {\n background-color: var(--colors-neutral-ink-light);\n}");
|
|
4
|
+
var styles = {"input":"_input_1ycnq_1"};
|
|
5
|
+
|
|
6
|
+
export { styles as default };
|
|
7
|
+
//# sourceMappingURL=Radio.module.scss.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Radio.module.scss.js","sources":["../../../src/components/Radio/Radio.module.scss"],"sourcesContent":[".input {\n appearance: none;\n box-sizing: border-box;\n flex-shrink: 0;\n width: 18px;\n height: 18px;\n margin: 3px;\n background-color: transparent;\n border: 2px solid var(--colors-neutral-ink-light);\n border-radius: 50%;\n outline: none;\n cursor: pointer;\n\n transition: box-shadow 0.1s;\n\n &:checked {\n position: relative;\n border-color: var(--colors-secondary-blue-base);\n }\n\n &:checked::before {\n content: '';\n width: 10px;\n height: 10px;\n position: absolute;\n top: 2px;\n left: 2px;\n background-color: var(--colors-secondary-blue-base);\n border-radius: 50%;\n }\n\n &:hover {\n border-color: var(--colors-secondary-blue-base);\n }\n\n &:active {\n border-color: var(--colors-secondary-blue-base);\n }\n\n &:focus {\n box-shadow: 0 0 0 var(--sizes-xs) var(--colors-secondary-blue-light);\n outline: 0;\n }\n\n &:disabled {\n box-shadow: none;\n background-color: var(--colors-neutral-grey-base);\n border-color: var(--colors-neutral-ink-lightest);\n cursor: default;\n }\n\n &:disabled::before {\n background-color: var(--colors-neutral-ink-light);\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,uqCAAA;AACA,aAAA,CAAA,OAAA,CAAA,gBAAA;;;;"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
|
-
var
|
|
4
|
+
var Action = require('../Action/Action.cjs');
|
|
5
5
|
|
|
6
6
|
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
7
7
|
|
|
8
8
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
9
9
|
|
|
10
|
-
const ToggleButton = ({ children, checked, size = 'base', disabled = false, onChange, }) => (React__default.default.createElement(
|
|
10
|
+
const ToggleButton = ({ children, checked, size = 'base', disabled = false, onChange, }) => (React__default.default.createElement(Action.Action, { variant: checked ? 'primary' : 'default', size: size, disabled: disabled, "aria-pressed": checked, onClick: () => onChange(!checked) }, children));
|
|
11
11
|
|
|
12
12
|
exports.ToggleButton = ToggleButton;
|
|
13
13
|
//# sourceMappingURL=ToggleButton.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleButton.cjs","sources":["../../../src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import React
|
|
1
|
+
{"version":3,"file":"ToggleButton.cjs","sources":["../../../src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Action } from '../Action';\n\nimport { ToggleButtonProps } from './types';\n\nexport const ToggleButton = ({\n children,\n checked,\n size = 'base',\n disabled = false,\n onChange,\n}: ToggleButtonProps) => (\n <Action\n variant={checked ? 'primary' : 'default'}\n size={size}\n disabled={disabled}\n aria-pressed={checked}\n onClick={() => onChange(!checked)}\n >\n {children}\n </Action>\n);\n"],"names":["React","Action"],"mappings":";;;;;;;;;AAMO,MAAM,YAAY,GAAG,CAAC,EAC3B,QAAQ,EACR,OAAO,EACP,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,QAAQ,GACU,MAClBA,sBAAA,CAAA,aAAA,CAACC,aAAM,EAAA,EACL,OAAO,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,EACxC,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAAA,cAAA,EACJ,OAAO,EACrB,OAAO,EAAE,MAAM,QAAQ,CAAC,CAAC,OAAO,CAAC,EAAA,EAEhC,QAAQ,CACF;;;;"}
|
|
@@ -1,9 +1,3 @@
|
|
|
1
|
-
import React
|
|
2
|
-
|
|
3
|
-
children: ReactNode;
|
|
4
|
-
checked: boolean;
|
|
5
|
-
size?: 'sm' | 'base';
|
|
6
|
-
disabled?: boolean;
|
|
7
|
-
onChange: (checked: boolean) => void;
|
|
8
|
-
}
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ToggleButtonProps } from './types';
|
|
9
3
|
export declare const ToggleButton: ({ children, checked, size, disabled, onChange, }: ToggleButtonProps) => React.JSX.Element;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { Action } from '../Action/Action.js';
|
|
3
3
|
|
|
4
|
-
const ToggleButton = ({ children, checked, size = 'base', disabled = false, onChange, }) => (React__default.createElement(
|
|
4
|
+
const ToggleButton = ({ children, checked, size = 'base', disabled = false, onChange, }) => (React__default.createElement(Action, { variant: checked ? 'primary' : 'default', size: size, disabled: disabled, "aria-pressed": checked, onClick: () => onChange(!checked) }, children));
|
|
5
5
|
|
|
6
6
|
export { ToggleButton };
|
|
7
7
|
//# sourceMappingURL=ToggleButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleButton.js","sources":["../../../src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import React
|
|
1
|
+
{"version":3,"file":"ToggleButton.js","sources":["../../../src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Action } from '../Action';\n\nimport { ToggleButtonProps } from './types';\n\nexport const ToggleButton = ({\n children,\n checked,\n size = 'base',\n disabled = false,\n onChange,\n}: ToggleButtonProps) => (\n <Action\n variant={checked ? 'primary' : 'default'}\n size={size}\n disabled={disabled}\n aria-pressed={checked}\n onClick={() => onChange(!checked)}\n >\n {children}\n </Action>\n);\n"],"names":["React"],"mappings":";;;AAMO,MAAM,YAAY,GAAG,CAAC,EAC3B,QAAQ,EACR,OAAO,EACP,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,QAAQ,GACU,MAClBA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,EACxC,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAAA,cAAA,EACJ,OAAO,EACrB,OAAO,EAAE,MAAM,QAAQ,CAAC,CAAC,OAAO,CAAC,EAAA,EAEhC,QAAQ,CACF;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WeightInput.cjs","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n stack: Partial<StackProps>;\n inputGroup: Partial<InputGroupProps>;\n textField: Partial<TextFieldProps>;\n inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n const { size = 'base', hasError, disabled, className } = props;\n\n const compact = size === 'sm';\n\n const childProps: ChildComponentProps = {\n stack: {\n direction: 'horizontal',\n alignY: 'center',\n spacing: 'base',\n },\n inputGroup: {\n style: flexStyle,\n },\n textField: {\n type: 'number',\n placeholder: '0',\n min: '0',\n step: 'any',\n size,\n disabled,\n hasError,\n onKeyDown: blockInvalidChars,\n style: flexStyle,\n },\n inputAffix: {\n compact,\n
|
|
1
|
+
{"version":3,"file":"WeightInput.cjs","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n stack: Partial<StackProps>;\n inputGroup: Partial<InputGroupProps>;\n textField: Partial<TextFieldProps>;\n inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n const { size = 'base', hasError, disabled, className } = props;\n\n const compact = size === 'sm';\n\n const childProps: ChildComponentProps = {\n stack: {\n direction: 'horizontal',\n alignY: 'center',\n spacing: 'base',\n },\n inputGroup: {\n style: flexStyle,\n },\n textField: {\n type: 'number',\n placeholder: '0',\n min: '0',\n step: 'any',\n size,\n disabled,\n hasError,\n onKeyDown: blockInvalidChars,\n style: flexStyle,\n },\n inputAffix: {\n compact,\n },\n };\n\n // If the weight is metric, render grams\n if (isWeightMetric(props)) {\n return (\n <InputGroup {...childProps.inputGroup} className={className}>\n <TextField\n {...childProps.textField}\n name=\"gram\"\n value={props.gram}\n aria-label=\"Grams\"\n onChange={props.handleChangeGram}\n />\n <InputAffix {...childProps.inputAffix}>g</InputAffix>\n </InputGroup>\n );\n }\n\n // If the weight is imperial, render pounds and ounces\n if (isWeightImperial(props)) {\n return (\n <Stack {...childProps.stack} className={className}>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"pound\"\n value={props.pound}\n aria-label=\"Pounds\"\n onChange={props.handleChangePound}\n />\n <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n </InputGroup>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"ounce\"\n value={props.ounce}\n aria-label=\"Ounces\"\n onChange={props.handleChangeOunce}\n />\n <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n </InputGroup>\n </Stack>\n );\n }\n\n // If neither metric nor imperial, return null or handle as needed\n return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n\nWeightInput.defaultProps = {\n weightUnit: 'lb',\n};\n"],"names":["blockInvalidCharacters","invalidCharsList","withLabels","isWeightMetric","React","InputGroup","TextField","InputAffix","isWeightImperial","Stack"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"WeightInput.js","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n stack: Partial<StackProps>;\n inputGroup: Partial<InputGroupProps>;\n textField: Partial<TextFieldProps>;\n inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n const { size = 'base', hasError, disabled, className } = props;\n\n const compact = size === 'sm';\n\n const childProps: ChildComponentProps = {\n stack: {\n direction: 'horizontal',\n alignY: 'center',\n spacing: 'base',\n },\n inputGroup: {\n style: flexStyle,\n },\n textField: {\n type: 'number',\n placeholder: '0',\n min: '0',\n step: 'any',\n size,\n disabled,\n hasError,\n onKeyDown: blockInvalidChars,\n style: flexStyle,\n },\n inputAffix: {\n compact,\n
|
|
1
|
+
{"version":3,"file":"WeightInput.js","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n stack: Partial<StackProps>;\n inputGroup: Partial<InputGroupProps>;\n textField: Partial<TextFieldProps>;\n inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n const { size = 'base', hasError, disabled, className } = props;\n\n const compact = size === 'sm';\n\n const childProps: ChildComponentProps = {\n stack: {\n direction: 'horizontal',\n alignY: 'center',\n spacing: 'base',\n },\n inputGroup: {\n style: flexStyle,\n },\n textField: {\n type: 'number',\n placeholder: '0',\n min: '0',\n step: 'any',\n size,\n disabled,\n hasError,\n onKeyDown: blockInvalidChars,\n style: flexStyle,\n },\n inputAffix: {\n compact,\n },\n };\n\n // If the weight is metric, render grams\n if (isWeightMetric(props)) {\n return (\n <InputGroup {...childProps.inputGroup} className={className}>\n <TextField\n {...childProps.textField}\n name=\"gram\"\n value={props.gram}\n aria-label=\"Grams\"\n onChange={props.handleChangeGram}\n />\n <InputAffix {...childProps.inputAffix}>g</InputAffix>\n </InputGroup>\n );\n }\n\n // If the weight is imperial, render pounds and ounces\n if (isWeightImperial(props)) {\n return (\n <Stack {...childProps.stack} className={className}>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"pound\"\n value={props.pound}\n aria-label=\"Pounds\"\n onChange={props.handleChangePound}\n />\n <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n </InputGroup>\n <InputGroup {...childProps.inputGroup}>\n <TextField\n {...childProps.textField}\n name=\"ounce\"\n value={props.ounce}\n aria-label=\"Ounces\"\n onChange={props.handleChangeOunce}\n />\n <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n </InputGroup>\n </Stack>\n );\n }\n\n // If neither metric nor imperial, return null or handle as needed\n return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n\nWeightInput.defaultProps = {\n weightUnit: 'lb',\n};\n"],"names":["React"],"mappings":"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"}
|
|
@@ -26,10 +26,9 @@ const inputBaseStyles = ({ compact }) => styled.css `${variables.inputVariableSt
|
|
|
26
26
|
* @deprecated
|
|
27
27
|
* use css modules instead from src/utils/forms/form.module.scss
|
|
28
28
|
*/
|
|
29
|
-
|
|
29
|
+
styled.css `${inputBaseStyles} ${inputDisabledStyles} ${inputFocusStyles} &::placeholder{${utils.getTextStyles(text.placeholder)}}&:invalid{box-shadow:0 0 0 var(--outline-size)var(--shadow-color);border-color:${colors.secondary.red.base};}`;
|
|
30
30
|
|
|
31
31
|
exports.inputBaseStyles = inputBaseStyles;
|
|
32
32
|
exports.inputDisabledStyles = inputDisabledStyles;
|
|
33
33
|
exports.inputFocusStyles = inputFocusStyles;
|
|
34
|
-
exports.inputFullStyles = inputFullStyles;
|
|
35
34
|
//# sourceMappingURL=inputStyles.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inputStyles.cjs","sources":["../../../src/utils/forms/inputStyles.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { FormComponentProps } from '../../components/types';\nimport { getTextStyles, theme } from '../../theme';\nimport { inputVariableStyles } from './variables';\n\nconst { colors, radius, sizes, text } = theme;\n\n/**\n * @deprecated\n * Styles in this file have been converted to CSS modules in src/utils/forms/form.module.scss\n */\nexport const inputFocusStyles = ({ hasError }: FormComponentProps) => css`\n &:focus {\n --border-color: ${hasError ? colors.secondary.red.base : colors.secondary.blue.base};\n border-color: var(--border-color);\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n outline: 0;\n }\n`;\n/**\n * @deprecated\n * use css modules instead\n */\nexport const inputDisabledStyles = css`\n &:disabled,\n &[data-disabled] {\n opacity: 1;\n box-shadow: none;\n background-color: ${colors.neutral.grey.light};\n cursor: not-allowed;\n }\n`;\n\n/**\n *\n * @deprecated\n * use css modules instead\n */\nexport const inputBaseStyles = ({ compact }: FormComponentProps) => css`\n ${inputVariableStyles}\n ${getTextStyles(text.body)}\n\n appearance: none;\n box-sizing: border-box;\n\n background-color: white;\n text-align: left;\n\n min-height: ${compact ? sizes[8] : sizes[10]};\n padding-inline: var(--padding);\n border: 1px solid var(--border-color);\n border-radius: ${radius.base};\n\n display: flex;\n align-items: center;\n justify-content: flex-start;\n\n /* When inside an InputGroup, reduce inline padding to bring content closer together */\n [data-input-group] > &:first-child {\n padding-right: calc(var(--padding-right) - ${sizes[1]});\n }\n\n [data-input-group] > &:last-child {\n padding-left: ${sizes[2]};\n }\n\n [data-input-group] > &:not(:first-child):not(:last-child) {\n padding-inline: ${sizes[2]};\n }\n`;\n\n/**\n * @deprecated\n * use css modules instead from src/utils/forms/form.module.scss\n */\nexport const inputFullStyles = css`\n ${inputBaseStyles}\n ${inputDisabledStyles}\n ${inputFocusStyles}\n\n &::placeholder {\n ${getTextStyles(text.placeholder)}\n }\n\n &:invalid {\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n border-color: ${colors.secondary.red.base};\n }\n`;\n"],"names":["theme","css","inputVariableStyles","getTextStyles"],"mappings":";;;;;;;AAKA,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAGA,WAAK;AAE7C;;;AAGG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAsB,KAAKC,UAAG,CAAA,CAAA,uBAAA,EAEnD,QAAQ,GAAG,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,GAAG,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI;AAMvF;;;AAGG;AACI,MAAM,mBAAmB,GAAGA,UAAG,CAAA,CAAA,uEAAA,EAKd,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK;AAKjD;;;;AAIG;AACI,MAAM,eAAe,GAAG,CAAC,EAAE,OAAO,EAAsB,KAAKA,UAAG,CAAA,CAAA,EACnEC,6BAAmB,CAAA,CAAA,EACnBC,mBAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA,yFAAA,EAQZ,OAAO,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,CAAA,kFAAA,EAG3B,MAAM,CAAC,IAAI,CAAA,yIAAA,EAQmB,KAAK,CAAC,CAAC,CAAC,CAAA,kDAAA,EAIrC,KAAK,CAAC,CAAC,CAAC,CAAA,2EAAA,EAIN,KAAK,CAAC,CAAC,CAAC,CAAA,EAAA;AAI9B;;;AAGG;
|
|
1
|
+
{"version":3,"file":"inputStyles.cjs","sources":["../../../src/utils/forms/inputStyles.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { FormComponentProps } from '../../components/types';\nimport { getTextStyles, theme } from '../../theme';\nimport { inputVariableStyles } from './variables';\n\nconst { colors, radius, sizes, text } = theme;\n\n/**\n * @deprecated\n * Styles in this file have been converted to CSS modules in src/utils/forms/form.module.scss\n */\nexport const inputFocusStyles = ({ hasError }: FormComponentProps) => css`\n &:focus {\n --border-color: ${hasError ? colors.secondary.red.base : colors.secondary.blue.base};\n border-color: var(--border-color);\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n outline: 0;\n }\n`;\n/**\n * @deprecated\n * use css modules instead\n */\nexport const inputDisabledStyles = css`\n &:disabled,\n &[data-disabled] {\n opacity: 1;\n box-shadow: none;\n background-color: ${colors.neutral.grey.light};\n cursor: not-allowed;\n }\n`;\n\n/**\n *\n * @deprecated\n * use css modules instead\n */\nexport const inputBaseStyles = ({ compact }: FormComponentProps) => css`\n ${inputVariableStyles}\n ${getTextStyles(text.body)}\n\n appearance: none;\n box-sizing: border-box;\n\n background-color: white;\n text-align: left;\n\n min-height: ${compact ? sizes[8] : sizes[10]};\n padding-inline: var(--padding);\n border: 1px solid var(--border-color);\n border-radius: ${radius.base};\n\n display: flex;\n align-items: center;\n justify-content: flex-start;\n\n /* When inside an InputGroup, reduce inline padding to bring content closer together */\n [data-input-group] > &:first-child {\n padding-right: calc(var(--padding-right) - ${sizes[1]});\n }\n\n [data-input-group] > &:last-child {\n padding-left: ${sizes[2]};\n }\n\n [data-input-group] > &:not(:first-child):not(:last-child) {\n padding-inline: ${sizes[2]};\n }\n`;\n\n/**\n * @deprecated\n * use css modules instead from src/utils/forms/form.module.scss\n */\nexport const inputFullStyles = css`\n ${inputBaseStyles}\n ${inputDisabledStyles}\n ${inputFocusStyles}\n\n &::placeholder {\n ${getTextStyles(text.placeholder)}\n }\n\n &:invalid {\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n border-color: ${colors.secondary.red.base};\n }\n`;\n"],"names":["theme","css","inputVariableStyles","getTextStyles"],"mappings":";;;;;;;AAKA,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAGA,WAAK;AAE7C;;;AAGG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAsB,KAAKC,UAAG,CAAA,CAAA,uBAAA,EAEnD,QAAQ,GAAG,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,GAAG,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI;AAMvF;;;AAGG;AACI,MAAM,mBAAmB,GAAGA,UAAG,CAAA,CAAA,uEAAA,EAKd,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK;AAKjD;;;;AAIG;AACI,MAAM,eAAe,GAAG,CAAC,EAAE,OAAO,EAAsB,KAAKA,UAAG,CAAA,CAAA,EACnEC,6BAAmB,CAAA,CAAA,EACnBC,mBAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA,yFAAA,EAQZ,OAAO,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,CAAA,kFAAA,EAG3B,MAAM,CAAC,IAAI,CAAA,yIAAA,EAQmB,KAAK,CAAC,CAAC,CAAC,CAAA,kDAAA,EAIrC,KAAK,CAAC,CAAC,CAAC,CAAA,2EAAA,EAIN,KAAK,CAAC,CAAC,CAAC,CAAA,EAAA;AAI9B;;;AAGG;AAC4BF,UAAG,CAAA,CAAA,EAC9B,eAAe,CAAA,CAAA,EACf,mBAAmB,CAAA,CAAA,EACnB,gBAAgB,CAAA,gBAAA,EAGdE,mBAAa,CAAC,IAAI,CAAC,WAAW,CAAC,CAAA,gFAAA,EAKjB,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA,EAAA;;;;;;"}
|
|
@@ -24,7 +24,7 @@ const inputBaseStyles = ({ compact }) => css `${inputVariableStyles} ${getTextSt
|
|
|
24
24
|
* @deprecated
|
|
25
25
|
* use css modules instead from src/utils/forms/form.module.scss
|
|
26
26
|
*/
|
|
27
|
-
|
|
27
|
+
css `${inputBaseStyles} ${inputDisabledStyles} ${inputFocusStyles} &::placeholder{${getTextStyles(text.placeholder)}}&:invalid{box-shadow:0 0 0 var(--outline-size)var(--shadow-color);border-color:${colors.secondary.red.base};}`;
|
|
28
28
|
|
|
29
|
-
export { inputBaseStyles, inputDisabledStyles, inputFocusStyles
|
|
29
|
+
export { inputBaseStyles, inputDisabledStyles, inputFocusStyles };
|
|
30
30
|
//# sourceMappingURL=inputStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inputStyles.js","sources":["../../../src/utils/forms/inputStyles.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { FormComponentProps } from '../../components/types';\nimport { getTextStyles, theme } from '../../theme';\nimport { inputVariableStyles } from './variables';\n\nconst { colors, radius, sizes, text } = theme;\n\n/**\n * @deprecated\n * Styles in this file have been converted to CSS modules in src/utils/forms/form.module.scss\n */\nexport const inputFocusStyles = ({ hasError }: FormComponentProps) => css`\n &:focus {\n --border-color: ${hasError ? colors.secondary.red.base : colors.secondary.blue.base};\n border-color: var(--border-color);\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n outline: 0;\n }\n`;\n/**\n * @deprecated\n * use css modules instead\n */\nexport const inputDisabledStyles = css`\n &:disabled,\n &[data-disabled] {\n opacity: 1;\n box-shadow: none;\n background-color: ${colors.neutral.grey.light};\n cursor: not-allowed;\n }\n`;\n\n/**\n *\n * @deprecated\n * use css modules instead\n */\nexport const inputBaseStyles = ({ compact }: FormComponentProps) => css`\n ${inputVariableStyles}\n ${getTextStyles(text.body)}\n\n appearance: none;\n box-sizing: border-box;\n\n background-color: white;\n text-align: left;\n\n min-height: ${compact ? sizes[8] : sizes[10]};\n padding-inline: var(--padding);\n border: 1px solid var(--border-color);\n border-radius: ${radius.base};\n\n display: flex;\n align-items: center;\n justify-content: flex-start;\n\n /* When inside an InputGroup, reduce inline padding to bring content closer together */\n [data-input-group] > &:first-child {\n padding-right: calc(var(--padding-right) - ${sizes[1]});\n }\n\n [data-input-group] > &:last-child {\n padding-left: ${sizes[2]};\n }\n\n [data-input-group] > &:not(:first-child):not(:last-child) {\n padding-inline: ${sizes[2]};\n }\n`;\n\n/**\n * @deprecated\n * use css modules instead from src/utils/forms/form.module.scss\n */\nexport const inputFullStyles = css`\n ${inputBaseStyles}\n ${inputDisabledStyles}\n ${inputFocusStyles}\n\n &::placeholder {\n ${getTextStyles(text.placeholder)}\n }\n\n &:invalid {\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n border-color: ${colors.secondary.red.base};\n }\n`;\n"],"names":[],"mappings":";;;;;AAKA,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,KAAK;AAE7C;;;AAGG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAsB,KAAK,GAAG,CAAA,CAAA,uBAAA,EAEnD,QAAQ,GAAG,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,GAAG,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI;AAMvF;;;AAGG;AACI,MAAM,mBAAmB,GAAG,GAAG,CAAA,CAAA,uEAAA,EAKd,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK;AAKjD;;;;AAIG;AACI,MAAM,eAAe,GAAG,CAAC,EAAE,OAAO,EAAsB,KAAK,GAAG,CAAA,CAAA,EACnE,mBAAmB,CAAA,CAAA,EACnB,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA,yFAAA,EAQZ,OAAO,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,CAAA,kFAAA,EAG3B,MAAM,CAAC,IAAI,CAAA,yIAAA,EAQmB,KAAK,CAAC,CAAC,CAAC,CAAA,kDAAA,EAIrC,KAAK,CAAC,CAAC,CAAC,CAAA,2EAAA,EAIN,KAAK,CAAC,CAAC,CAAC,CAAA,EAAA;AAI9B;;;AAGG;
|
|
1
|
+
{"version":3,"file":"inputStyles.js","sources":["../../../src/utils/forms/inputStyles.ts"],"sourcesContent":["import { css } from 'styled-components';\nimport { FormComponentProps } from '../../components/types';\nimport { getTextStyles, theme } from '../../theme';\nimport { inputVariableStyles } from './variables';\n\nconst { colors, radius, sizes, text } = theme;\n\n/**\n * @deprecated\n * Styles in this file have been converted to CSS modules in src/utils/forms/form.module.scss\n */\nexport const inputFocusStyles = ({ hasError }: FormComponentProps) => css`\n &:focus {\n --border-color: ${hasError ? colors.secondary.red.base : colors.secondary.blue.base};\n border-color: var(--border-color);\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n outline: 0;\n }\n`;\n/**\n * @deprecated\n * use css modules instead\n */\nexport const inputDisabledStyles = css`\n &:disabled,\n &[data-disabled] {\n opacity: 1;\n box-shadow: none;\n background-color: ${colors.neutral.grey.light};\n cursor: not-allowed;\n }\n`;\n\n/**\n *\n * @deprecated\n * use css modules instead\n */\nexport const inputBaseStyles = ({ compact }: FormComponentProps) => css`\n ${inputVariableStyles}\n ${getTextStyles(text.body)}\n\n appearance: none;\n box-sizing: border-box;\n\n background-color: white;\n text-align: left;\n\n min-height: ${compact ? sizes[8] : sizes[10]};\n padding-inline: var(--padding);\n border: 1px solid var(--border-color);\n border-radius: ${radius.base};\n\n display: flex;\n align-items: center;\n justify-content: flex-start;\n\n /* When inside an InputGroup, reduce inline padding to bring content closer together */\n [data-input-group] > &:first-child {\n padding-right: calc(var(--padding-right) - ${sizes[1]});\n }\n\n [data-input-group] > &:last-child {\n padding-left: ${sizes[2]};\n }\n\n [data-input-group] > &:not(:first-child):not(:last-child) {\n padding-inline: ${sizes[2]};\n }\n`;\n\n/**\n * @deprecated\n * use css modules instead from src/utils/forms/form.module.scss\n */\nexport const inputFullStyles = css`\n ${inputBaseStyles}\n ${inputDisabledStyles}\n ${inputFocusStyles}\n\n &::placeholder {\n ${getTextStyles(text.placeholder)}\n }\n\n &:invalid {\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n border-color: ${colors.secondary.red.base};\n }\n`;\n"],"names":[],"mappings":";;;;;AAKA,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,KAAK;AAE7C;;;AAGG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAsB,KAAK,GAAG,CAAA,CAAA,uBAAA,EAEnD,QAAQ,GAAG,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,GAAG,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI;AAMvF;;;AAGG;AACI,MAAM,mBAAmB,GAAG,GAAG,CAAA,CAAA,uEAAA,EAKd,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK;AAKjD;;;;AAIG;AACI,MAAM,eAAe,GAAG,CAAC,EAAE,OAAO,EAAsB,KAAK,GAAG,CAAA,CAAA,EACnE,mBAAmB,CAAA,CAAA,EACnB,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA,yFAAA,EAQZ,OAAO,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,CAAA,kFAAA,EAG3B,MAAM,CAAC,IAAI,CAAA,yIAAA,EAQmB,KAAK,CAAC,CAAC,CAAC,CAAA,kDAAA,EAIrC,KAAK,CAAC,CAAC,CAAC,CAAA,2EAAA,EAIN,KAAK,CAAC,CAAC,CAAC,CAAA,EAAA;AAI9B;;;AAGG;AAC4B,GAAG,CAAA,CAAA,EAC9B,eAAe,CAAA,CAAA,EACf,mBAAmB,CAAA,CAAA,EACnB,gBAAgB,CAAA,gBAAA,EAGd,aAAa,CAAC,IAAI,CAAC,WAAW,CAAC,CAAA,gFAAA,EAKjB,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA,EAAA;;;;"}
|
package/package.json
CHANGED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var styled = require('styled-components');
|
|
4
|
-
var index = require('../../theme/index.cjs');
|
|
5
|
-
|
|
6
|
-
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
7
|
-
|
|
8
|
-
var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
|
|
9
|
-
|
|
10
|
-
const { colors, sizes, radius } = index.theme;
|
|
11
|
-
const Input = styled__default.default.input.withConfig({ displayName: "vui--Input", componentId: "vui--hippn5" }) `appearance:none;width:18px;height:18px;background-color:transparent;border:2px solid ${colors.neutral.ink.lightest};border-radius:${radius.base};cursor:pointer;flex-shrink:0;transition:box-shadow 0.1s,background-color 0.1s;&:checked{background-color:${colors.secondary.blue.base};border-color:${colors.secondary.blue.base};background-image:url("data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M8.56846 16.3657L3.86697 11.6642L2.2998 13.2313L8.56846 19.5L22.0013 6.06716L20.4341 4.5L8.56846 16.3657Z' fill='white' /></svg>");background-repeat:no-repeat;background-size:${sizes[4]};background-position:center;}&:hover{border-color:${colors.secondary.blue.base};}&:active{border-color:${colors.secondary.blue.base};}&:focus{box-shadow:0 0 0 4px ${colors.secondary.blue.light};outline:0;}&:indeterminate{background-color:${colors.secondary.blue.base};border-color:${colors.secondary.blue.base};background-image:url("data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect x='5' y='11' width='14' height='3' fill='white'/></svg>");background-repeat:no-repeat;background-size:${sizes[4]};background-position:center;}&:disabled{box-shadow:none;background-color:${colors.neutral.grey.base};border-color:${colors.neutral.grey.base};color:${colors.neutral.ink.light};cursor:default;}&:checked:disabled{background-image:url("data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M8.56846 16.3657L3.86697 11.6642L2.2998 13.2313L8.56846 19.5L22.0013 6.06716L20.4341 4.5L8.56846 16.3657Z' fill='%23637381' /></svg>");}&:indeterminate:disabled{background-image:url("data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect x='5' y='11' width='14' height='3' fill='%23637381'/></svg>");}`;
|
|
12
|
-
|
|
13
|
-
exports.Input = Input;
|
|
14
|
-
//# sourceMappingURL=styled.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.cjs","sources":["../../../src/components/Checkbox/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { theme } from '../../theme';\n\nconst { colors, sizes, radius } = theme;\n\nexport const Input = styled.input`\n appearance: none;\n width: 18px;\n height: 18px;\n background-color: transparent;\n border: 2px solid ${colors.neutral.ink.lightest};\n border-radius: ${radius.base};\n cursor: pointer;\n flex-shrink: 0;\n\n transition:\n box-shadow 0.1s,\n background-color 0.1s;\n\n &:checked {\n background-color: ${colors.secondary.blue.base};\n border-color: ${colors.secondary.blue.base};\n background-image: url(\"data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M8.56846 16.3657L3.86697 11.6642L2.2998 13.2313L8.56846 19.5L22.0013 6.06716L20.4341 4.5L8.56846 16.3657Z' fill='white' /></svg>\");\n background-repeat: no-repeat;\n background-size: ${sizes[4]};\n background-position: center;\n }\n\n &:hover {\n border-color: ${colors.secondary.blue.base};\n }\n\n &:active {\n border-color: ${colors.secondary.blue.base};\n }\n\n &:focus {\n box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n outline: 0;\n }\n\n &:indeterminate {\n background-color: ${colors.secondary.blue.base};\n border-color: ${colors.secondary.blue.base};\n background-image: url(\"data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect x='5' y='11' width='14' height='3' fill='white'/></svg>\");\n background-repeat: no-repeat;\n background-size: ${sizes[4]};\n background-position: center;\n }\n\n &:disabled {\n box-shadow: none;\n background-color: ${colors.neutral.grey.base};\n border-color: ${colors.neutral.grey.base};\n color: ${colors.neutral.ink.light};\n cursor: default;\n }\n\n &:checked:disabled {\n background-image: url(\"data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M8.56846 16.3657L3.86697 11.6642L2.2998 13.2313L8.56846 19.5L22.0013 6.06716L20.4341 4.5L8.56846 16.3657Z' fill='%23637381' /></svg>\");\n }\n\n &:indeterminate:disabled {\n background-image: url(\"data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect x='5' y='11' width='14' height='3' fill='%23637381'/></svg>\");\n }\n`;\n"],"names":["theme","styled"],"mappings":";;;;;;;;;AAIA,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAGA,WAAK;AAEhC,MAAM,KAAK,GAAGC,uBAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,qFAAA,EAKX,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,eAAA,EAC9B,MAAM,CAAC,IAAI,6GASN,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,cAAA,EAC9B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,uUAAA,EAGvB,KAAK,CAAC,CAAC,CAAC,qDAKX,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,wBAAA,EAI1B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,+BAAA,EAIlB,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAA,6CAAA,EAK/B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,cAAA,EAC9B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,2PAAA,EAGvB,KAAK,CAAC,CAAC,CAAC,CAAA,yEAAA,EAMP,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,cAAA,EAC5B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,OAAA,EAC/B,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAA,miBAAA;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const Input: import("styled-components").StyledComponent<"input", any, {}, never>;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
2
|
-
import { theme } from '../../theme/index.js';
|
|
3
|
-
|
|
4
|
-
const { colors, sizes, radius } = theme;
|
|
5
|
-
const Input = styled.input.withConfig({ displayName: "vui--Input", componentId: "vui--hippn5" }) `appearance:none;width:18px;height:18px;background-color:transparent;border:2px solid ${colors.neutral.ink.lightest};border-radius:${radius.base};cursor:pointer;flex-shrink:0;transition:box-shadow 0.1s,background-color 0.1s;&:checked{background-color:${colors.secondary.blue.base};border-color:${colors.secondary.blue.base};background-image:url("data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M8.56846 16.3657L3.86697 11.6642L2.2998 13.2313L8.56846 19.5L22.0013 6.06716L20.4341 4.5L8.56846 16.3657Z' fill='white' /></svg>");background-repeat:no-repeat;background-size:${sizes[4]};background-position:center;}&:hover{border-color:${colors.secondary.blue.base};}&:active{border-color:${colors.secondary.blue.base};}&:focus{box-shadow:0 0 0 4px ${colors.secondary.blue.light};outline:0;}&:indeterminate{background-color:${colors.secondary.blue.base};border-color:${colors.secondary.blue.base};background-image:url("data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect x='5' y='11' width='14' height='3' fill='white'/></svg>");background-repeat:no-repeat;background-size:${sizes[4]};background-position:center;}&:disabled{box-shadow:none;background-color:${colors.neutral.grey.base};border-color:${colors.neutral.grey.base};color:${colors.neutral.ink.light};cursor:default;}&:checked:disabled{background-image:url("data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M8.56846 16.3657L3.86697 11.6642L2.2998 13.2313L8.56846 19.5L22.0013 6.06716L20.4341 4.5L8.56846 16.3657Z' fill='%23637381' /></svg>");}&:indeterminate:disabled{background-image:url("data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect x='5' y='11' width='14' height='3' fill='%23637381'/></svg>");}`;
|
|
6
|
-
|
|
7
|
-
export { Input };
|
|
8
|
-
//# sourceMappingURL=styled.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.js","sources":["../../../src/components/Checkbox/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { theme } from '../../theme';\n\nconst { colors, sizes, radius } = theme;\n\nexport const Input = styled.input`\n appearance: none;\n width: 18px;\n height: 18px;\n background-color: transparent;\n border: 2px solid ${colors.neutral.ink.lightest};\n border-radius: ${radius.base};\n cursor: pointer;\n flex-shrink: 0;\n\n transition:\n box-shadow 0.1s,\n background-color 0.1s;\n\n &:checked {\n background-color: ${colors.secondary.blue.base};\n border-color: ${colors.secondary.blue.base};\n background-image: url(\"data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M8.56846 16.3657L3.86697 11.6642L2.2998 13.2313L8.56846 19.5L22.0013 6.06716L20.4341 4.5L8.56846 16.3657Z' fill='white' /></svg>\");\n background-repeat: no-repeat;\n background-size: ${sizes[4]};\n background-position: center;\n }\n\n &:hover {\n border-color: ${colors.secondary.blue.base};\n }\n\n &:active {\n border-color: ${colors.secondary.blue.base};\n }\n\n &:focus {\n box-shadow: 0 0 0 4px ${colors.secondary.blue.light};\n outline: 0;\n }\n\n &:indeterminate {\n background-color: ${colors.secondary.blue.base};\n border-color: ${colors.secondary.blue.base};\n background-image: url(\"data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect x='5' y='11' width='14' height='3' fill='white'/></svg>\");\n background-repeat: no-repeat;\n background-size: ${sizes[4]};\n background-position: center;\n }\n\n &:disabled {\n box-shadow: none;\n background-color: ${colors.neutral.grey.base};\n border-color: ${colors.neutral.grey.base};\n color: ${colors.neutral.ink.light};\n cursor: default;\n }\n\n &:checked:disabled {\n background-image: url(\"data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M8.56846 16.3657L3.86697 11.6642L2.2998 13.2313L8.56846 19.5L22.0013 6.06716L20.4341 4.5L8.56846 16.3657Z' fill='%23637381' /></svg>\");\n }\n\n &:indeterminate:disabled {\n background-image: url(\"data:image/svg+xml;utf-8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><rect x='5' y='11' width='14' height='3' fill='%23637381'/></svg>\");\n }\n`;\n"],"names":[],"mappings":";;;AAIA,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK;AAEhC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,qFAAA,EAKX,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,eAAA,EAC9B,MAAM,CAAC,IAAI,6GASN,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,cAAA,EAC9B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,uUAAA,EAGvB,KAAK,CAAC,CAAC,CAAC,qDAKX,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,wBAAA,EAI1B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,+BAAA,EAIlB,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAA,6CAAA,EAK/B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,cAAA,EAC9B,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,2PAAA,EAGvB,KAAK,CAAC,CAAC,CAAC,CAAA,yEAAA,EAMP,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,cAAA,EAC5B,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,OAAA,EAC/B,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAA,miBAAA;;;;"}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var styled = require('styled-components');
|
|
4
|
-
var Tooltip = require('../../Tooltip/Tooltip.cjs');
|
|
5
|
-
var index = require('../../../theme/index.cjs');
|
|
6
|
-
|
|
7
|
-
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
8
|
-
|
|
9
|
-
var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
|
|
10
|
-
|
|
11
|
-
const alignMap = {
|
|
12
|
-
top: 'flex-start',
|
|
13
|
-
center: 'center',
|
|
14
|
-
};
|
|
15
|
-
const RootLayout = styled__default.default.div.withConfig({ displayName: "vui--RootLayout", componentId: "vui--11nf17l" }) `display:flex;align-items:center;& > * + *{margin-left:${index.theme.sizes.base};}`;
|
|
16
|
-
const InputLayout = styled__default.default.div.withConfig({ displayName: "vui--InputLayout", componentId: "vui--1yac6kr" }) `align-self:stretch;display:flex;align-items:${(props) => alignMap[props.align]};`;
|
|
17
|
-
const AccessoryLayout = styled__default.default.div.withConfig({ displayName: "vui--AccessoryLayout", componentId: "vui--qbgrc7" }) `align-self:center;display:flex;align-items:center;`;
|
|
18
|
-
const TextLayout = styled__default.default.div.withConfig({ displayName: "vui--TextLayout", componentId: "vui--1uu3ed5" }) `flex:1;& > * + *{margin-top:${index.theme.sizes.sm};}`;
|
|
19
|
-
const Wrapper = styled__default.default.label.withConfig({ displayName: "vui--Wrapper", componentId: "vui--taq5r4" }) `box-sizing:border-box;&:hover{cursor:${(props) => (props.disabled ? 'default' : 'pointer')};}`;
|
|
20
|
-
const BorderedWrapper = styled__default.default(Wrapper).withConfig({ displayName: "vui--BorderedWrapper", componentId: "vui--f5wv6j" }) `border:2px solid ${index.theme.colors.neutral.grey.dark};border-radius:${index.theme.radius.md};padding:${index.theme.sizes.base} 0.75rem;&:hover{border-color:${index.theme.colors.secondary.blue.base};}`;
|
|
21
|
-
const BlockTooltip = styled__default.default(Tooltip.Tooltip).withConfig({ displayName: "vui--BlockTooltip", componentId: "vui--1n3z4wy" }) `display:block;&-hoverable{display:block;}`;
|
|
22
|
-
|
|
23
|
-
exports.AccessoryLayout = AccessoryLayout;
|
|
24
|
-
exports.BlockTooltip = BlockTooltip;
|
|
25
|
-
exports.BorderedWrapper = BorderedWrapper;
|
|
26
|
-
exports.InputLayout = InputLayout;
|
|
27
|
-
exports.RootLayout = RootLayout;
|
|
28
|
-
exports.TextLayout = TextLayout;
|
|
29
|
-
exports.Wrapper = Wrapper;
|
|
30
|
-
//# sourceMappingURL=styled.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.cjs","sources":["../../../../src/components/Choice/components/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Tooltip } from '../../Tooltip';\nimport { theme } from '../../../theme';\n\nconst alignMap = {\n top: 'flex-start',\n center: 'center',\n};\n\nexport const RootLayout = styled.div`\n display: flex;\n align-items: center;\n\n & > * + * {\n margin-left: ${theme.sizes.base};\n }\n`;\n\nexport interface InputLayoutProps {\n align: 'top' | 'center';\n}\n\nexport const InputLayout = styled.div<InputLayoutProps>`\n align-self: stretch;\n display: flex;\n align-items: ${(props) => alignMap[props.align]};\n`;\n\nexport const AccessoryLayout = styled.div`\n align-self: center;\n display: flex;\n align-items: center;\n`;\n\nexport const TextLayout = styled.div`\n flex: 1;\n\n & > * + * {\n margin-top: ${theme.sizes.sm};\n }\n`;\n\nexport const Wrapper = styled.label<{ disabled: boolean }>`\n box-sizing: border-box;\n\n &:hover {\n cursor: ${(props) => (props.disabled ? 'default' : 'pointer')};\n }\n`;\n\nexport const BorderedWrapper = styled(Wrapper)`\n border: 2px solid ${theme.colors.neutral.grey.dark};\n border-radius: ${theme.radius.md};\n padding: ${theme.sizes.base} 0.75rem;\n\n &:hover {\n border-color: ${theme.colors.secondary.blue.base};\n }\n`;\n\nexport const BlockTooltip = styled(Tooltip)`\n /* Tooltip uses inline-block containers which add more height when\n the child component is an inline element (e.g. Glyph or an SVG),\n so we need to set to block to preserve the height and fix alignment. */\n display: block;\n &-hoverable {\n display: block;\n }\n`;\n"],"names":["styled","theme","Tooltip"],"mappings":";;;;;;;;;;AAIA,MAAM,QAAQ,GAAG;AACf,IAAA,GAAG,EAAE,YAAY;AACjB,IAAA,MAAM,EAAE,QAAQ;CACjB;AAEM,MAAM,UAAU,GAAGA,uBAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,sDAAA,EAKjBC,WAAK,CAAC,KAAK,CAAC,IAAI;MAQtB,WAAW,GAAGD,uBAAM,CAAC,GAAG,6HAGpB,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;MAGpC,eAAe,GAAGA,uBAAM,CAAC,GAAG;AAMlC,MAAM,UAAU,GAAGA,uBAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,4BAAA,EAIlBC,WAAK,CAAC,KAAK,CAAC,EAAE;AAIzB,MAAM,OAAO,GAAGD,uBAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,cAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAIrB,CAAC,KAAK,MAAM,KAAK,CAAC,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAC,CAAA,EAAA;AAI1D,MAAM,eAAe,GAAGA,uBAAM,CAAC,OAAO,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,sBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,iBAAA,EACxBC,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,eAAA,EACjCA,WAAK,CAAC,MAAM,CAAC,EAAE,CAAA,SAAA,EACrBA,WAAK,CAAC,KAAK,CAAC,IAAI,CAAA,8BAAA,EAGTA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI;MAIvC,YAAY,GAAGD,uBAAM,CAACE,eAAO,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,yCAAA;;;;;;;;;;"}
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
export declare const RootLayout: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
2
|
-
export interface InputLayoutProps {
|
|
3
|
-
align: 'top' | 'center';
|
|
4
|
-
}
|
|
5
|
-
export declare const InputLayout: import("styled-components").StyledComponent<"div", any, InputLayoutProps, never>;
|
|
6
|
-
export declare const AccessoryLayout: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
7
|
-
export declare const TextLayout: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
8
|
-
export declare const Wrapper: import("styled-components").StyledComponent<"label", any, {
|
|
9
|
-
disabled: boolean;
|
|
10
|
-
}, never>;
|
|
11
|
-
export declare const BorderedWrapper: import("styled-components").StyledComponent<"label", any, {
|
|
12
|
-
disabled: boolean;
|
|
13
|
-
}, never>;
|
|
14
|
-
export declare const BlockTooltip: import("styled-components").StyledComponent<({ children, text, content, config, reversed, className, withTriangle, initialShouldShow, useReactPortal, }: import("../../Tooltip/types").TooltipProps) => JSX.Element | null, any, {}, never>;
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
2
|
-
import { Tooltip } from '../../Tooltip/Tooltip.js';
|
|
3
|
-
import { theme } from '../../../theme/index.js';
|
|
4
|
-
|
|
5
|
-
const alignMap = {
|
|
6
|
-
top: 'flex-start',
|
|
7
|
-
center: 'center',
|
|
8
|
-
};
|
|
9
|
-
const RootLayout = styled.div.withConfig({ displayName: "vui--RootLayout", componentId: "vui--11nf17l" }) `display:flex;align-items:center;& > * + *{margin-left:${theme.sizes.base};}`;
|
|
10
|
-
const InputLayout = styled.div.withConfig({ displayName: "vui--InputLayout", componentId: "vui--1yac6kr" }) `align-self:stretch;display:flex;align-items:${(props) => alignMap[props.align]};`;
|
|
11
|
-
const AccessoryLayout = styled.div.withConfig({ displayName: "vui--AccessoryLayout", componentId: "vui--qbgrc7" }) `align-self:center;display:flex;align-items:center;`;
|
|
12
|
-
const TextLayout = styled.div.withConfig({ displayName: "vui--TextLayout", componentId: "vui--1uu3ed5" }) `flex:1;& > * + *{margin-top:${theme.sizes.sm};}`;
|
|
13
|
-
const Wrapper = styled.label.withConfig({ displayName: "vui--Wrapper", componentId: "vui--taq5r4" }) `box-sizing:border-box;&:hover{cursor:${(props) => (props.disabled ? 'default' : 'pointer')};}`;
|
|
14
|
-
const BorderedWrapper = styled(Wrapper).withConfig({ displayName: "vui--BorderedWrapper", componentId: "vui--f5wv6j" }) `border:2px solid ${theme.colors.neutral.grey.dark};border-radius:${theme.radius.md};padding:${theme.sizes.base} 0.75rem;&:hover{border-color:${theme.colors.secondary.blue.base};}`;
|
|
15
|
-
const BlockTooltip = styled(Tooltip).withConfig({ displayName: "vui--BlockTooltip", componentId: "vui--1n3z4wy" }) `display:block;&-hoverable{display:block;}`;
|
|
16
|
-
|
|
17
|
-
export { AccessoryLayout, BlockTooltip, BorderedWrapper, InputLayout, RootLayout, TextLayout, Wrapper };
|
|
18
|
-
//# sourceMappingURL=styled.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.js","sources":["../../../../src/components/Choice/components/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Tooltip } from '../../Tooltip';\nimport { theme } from '../../../theme';\n\nconst alignMap = {\n top: 'flex-start',\n center: 'center',\n};\n\nexport const RootLayout = styled.div`\n display: flex;\n align-items: center;\n\n & > * + * {\n margin-left: ${theme.sizes.base};\n }\n`;\n\nexport interface InputLayoutProps {\n align: 'top' | 'center';\n}\n\nexport const InputLayout = styled.div<InputLayoutProps>`\n align-self: stretch;\n display: flex;\n align-items: ${(props) => alignMap[props.align]};\n`;\n\nexport const AccessoryLayout = styled.div`\n align-self: center;\n display: flex;\n align-items: center;\n`;\n\nexport const TextLayout = styled.div`\n flex: 1;\n\n & > * + * {\n margin-top: ${theme.sizes.sm};\n }\n`;\n\nexport const Wrapper = styled.label<{ disabled: boolean }>`\n box-sizing: border-box;\n\n &:hover {\n cursor: ${(props) => (props.disabled ? 'default' : 'pointer')};\n }\n`;\n\nexport const BorderedWrapper = styled(Wrapper)`\n border: 2px solid ${theme.colors.neutral.grey.dark};\n border-radius: ${theme.radius.md};\n padding: ${theme.sizes.base} 0.75rem;\n\n &:hover {\n border-color: ${theme.colors.secondary.blue.base};\n }\n`;\n\nexport const BlockTooltip = styled(Tooltip)`\n /* Tooltip uses inline-block containers which add more height when\n the child component is an inline element (e.g. Glyph or an SVG),\n so we need to set to block to preserve the height and fix alignment. */\n display: block;\n &-hoverable {\n display: block;\n }\n`;\n"],"names":[],"mappings":";;;;AAIA,MAAM,QAAQ,GAAG;AACf,IAAA,GAAG,EAAE,YAAY;AACjB,IAAA,MAAM,EAAE,QAAQ;CACjB;AAEM,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,sDAAA,EAKjB,KAAK,CAAC,KAAK,CAAC,IAAI;MAQtB,WAAW,GAAG,MAAM,CAAC,GAAG,6HAGpB,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;MAGpC,eAAe,GAAG,MAAM,CAAC,GAAG;AAMlC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,4BAAA,EAIlB,KAAK,CAAC,KAAK,CAAC,EAAE;AAIzB,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,cAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAIrB,CAAC,KAAK,MAAM,KAAK,CAAC,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAC,CAAA,EAAA;AAI1D,MAAM,eAAe,GAAG,MAAM,CAAC,OAAO,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,sBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,iBAAA,EACxB,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,eAAA,EACjC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAA,SAAA,EACrB,KAAK,CAAC,KAAK,CAAC,IAAI,CAAA,8BAAA,EAGT,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI;MAIvC,YAAY,GAAG,MAAM,CAAC,OAAO,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,yCAAA;;;;"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var styled = require('styled-components');
|
|
4
|
-
var index = require('../../theme/index.cjs');
|
|
5
|
-
|
|
6
|
-
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
7
|
-
|
|
8
|
-
var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
|
|
9
|
-
|
|
10
|
-
const Fieldset = styled__default.default.fieldset.withConfig({ displayName: "vui--Fieldset", componentId: "vui--bygv6o" }) `padding:0;display:flex;flex-direction:column;border:0;& > * + *{margin-top:16px;}`;
|
|
11
|
-
const Legend = styled__default.default.legend.withConfig({ displayName: "vui--Legend", componentId: "vui--18baj4v" }) `font-family:${index.theme.text.inputLabel.fontFamily};font-size:${index.theme.text.inputLabel.fontSize};font-style:${index.theme.text.inputLabel.fontStyle};font-weight:${index.theme.text.inputLabel.fontWeight};line-height:${index.theme.text.inputLabel.lineHeight};text-decoration:${index.theme.text.inputLabel.textDecoration};color:${index.theme.text.inputLabel.color};`;
|
|
12
|
-
|
|
13
|
-
exports.Fieldset = Fieldset;
|
|
14
|
-
exports.Legend = Legend;
|
|
15
|
-
//# sourceMappingURL=styled.cjs.map
|