@artsy/palette 37.0.0-canary.1250.29294.0 → 37.0.0-canary.1250.29301.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/elements/Input/Input.d.ts +1 -2
- package/dist/elements/Input/Input.js +7 -9
- package/dist/elements/Input/Input.js.map +1 -1
- package/dist/elements/LabeledInput/LabeledInput.js +4 -2
- package/dist/elements/LabeledInput/LabeledInput.js.map +1 -1
- package/dist/elements/MultiSelect/tokens.js +1 -1
- package/dist/elements/MultiSelect/tokens.js.map +1 -1
- package/dist/elements/Select/Select.js +1 -1
- package/dist/elements/Select/Select.js.map +1 -1
- package/dist/elements/Select/tokens.js +2 -2
- package/dist/elements/Select/tokens.js.map +1 -1
- package/package.json +2 -2
|
@@ -9,8 +9,7 @@ export interface InputProps extends BoxProps, Omit<React.InputHTMLAttributes<HTM
|
|
|
9
9
|
hover?: boolean;
|
|
10
10
|
required?: boolean;
|
|
11
11
|
title?: string;
|
|
12
|
-
|
|
13
|
-
suffixOffset?: number;
|
|
12
|
+
labelOffset?: number;
|
|
14
13
|
showCounter?: boolean;
|
|
15
14
|
}
|
|
16
15
|
/** Input component */
|
|
@@ -15,7 +15,7 @@ var _Text = require("../Text");
|
|
|
15
15
|
var _Tooltip = require("../Tooltip");
|
|
16
16
|
var _tokens = require("./tokens");
|
|
17
17
|
var _helpers = require("../../helpers");
|
|
18
|
-
var _excluded = ["children", "className", "description", "disabled", "error", "required", "focus", "hover", "title", "height", "
|
|
18
|
+
var _excluded = ["children", "className", "description", "disabled", "error", "required", "focus", "hover", "title", "height", "labelOffset", "showCounter"];
|
|
19
19
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
20
20
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
21
21
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
@@ -40,8 +40,7 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
|
40
40
|
hover = _ref.hover,
|
|
41
41
|
title = _ref.title,
|
|
42
42
|
height = _ref.height,
|
|
43
|
-
|
|
44
|
-
suffixOffset = _ref.suffixOffset,
|
|
43
|
+
labelOffset = _ref.labelOffset,
|
|
45
44
|
showCounter = _ref.showCounter,
|
|
46
45
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
47
46
|
var _splitBoxProps = (0, _Box.splitBoxProps)(rest),
|
|
@@ -78,8 +77,7 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
|
78
77
|
height: height !== null && height !== void 0 ? height : 50,
|
|
79
78
|
name: inputProps.name,
|
|
80
79
|
title: title,
|
|
81
|
-
|
|
82
|
-
prefixOffset: prefixOffset,
|
|
80
|
+
labelOffset: labelOffset,
|
|
83
81
|
onChange: function onChange(e) {
|
|
84
82
|
var _inputProps$onChange;
|
|
85
83
|
(_inputProps$onChange = inputProps.onChange) === null || _inputProps$onChange === void 0 ? void 0 : _inputProps$onChange.call(inputProps, e);
|
|
@@ -89,7 +87,7 @@ var Input = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
|
|
|
89
87
|
},
|
|
90
88
|
placeholder: inputProps.placeholder || " "
|
|
91
89
|
}, inputProps)), !!title && /*#__PURE__*/_react.default.createElement(StyledLabel, {
|
|
92
|
-
|
|
90
|
+
labelOffset: labelOffset,
|
|
93
91
|
htmlFor: inputProps.name
|
|
94
92
|
}, title, /*#__PURE__*/_react.default.createElement("span", null)), children), (required || (inputProps === null || inputProps === void 0 ? void 0 : inputProps.maxLength) && showCounter) && !(error && typeof error === "string") && /*#__PURE__*/_react.default.createElement(_Box.Box, {
|
|
95
93
|
display: "flex",
|
|
@@ -115,13 +113,13 @@ var StyledInput = _styledComponents.default.input.withConfig({
|
|
|
115
113
|
displayName: "Input__StyledInput",
|
|
116
114
|
componentId: "bysdh7-0"
|
|
117
115
|
})(["width:100%;padding:0 ", ";appearance:none;line-height:1;border:1px solid;border-radius:3px;transition:border-color 0.25s,color 0.25s;font-family:", ";", ";::placeholder{transition:color 0.25s,opacity 0.25s;}", ";"], (0, _themeGet.themeGet)("space.1"), (0, _themeGet.themeGet)("fonts.sans"), _styledSystem.height, function (props) {
|
|
118
|
-
return (0, _styledComponents.css)(["", " ", " ", " ", " ", " ", "
|
|
116
|
+
return (0, _styledComponents.css)(["", " ", " ", " ", " ", " ", " &:hover{", "}&:not(:placeholder-shown){", " ", "}&:focus{outline:none;", ":not(:placeholder-shown){", " ", "}}&:disabled{cursor:default;", "}", ""], _tokens.INPUT_STATES.default, props.hover && _tokens.INPUT_STATES.hover, props.focus && _tokens.INPUT_STATES.focus, props.active && _tokens.INPUT_STATES.active, props.disabled && _tokens.INPUT_STATES.disabled, props.error && _tokens.INPUT_STATES.error, _tokens.INPUT_STATES.hover, _tokens.INPUT_STATES.completed, props.error && _tokens.INPUT_STATES.error, _tokens.INPUT_STATES.focus, _tokens.INPUT_STATES.active, props.error && _tokens.INPUT_STATES.error, _tokens.INPUT_STATES.disabled, props.title && (0, _styledComponents.css)(["::placeholder{opacity:0;}"]));
|
|
119
117
|
});
|
|
120
118
|
var StyledLabel = _styledComponents.default.label.withConfig({
|
|
121
119
|
displayName: "Input__StyledLabel",
|
|
122
120
|
componentId: "bysdh7-1"
|
|
123
121
|
})(["position:absolute;top:50%;left:5px;padding:0 5px;background-color:transparent;transform:translateY(-50%);transition:", ";transition-property:color,transform,padding,font-size;font-family:", ";pointer-events:none;& > span{background-color:", ";height:100%;width:100%;display:block;position:absolute;top:0;left:0;z-index:-1;transition:", ";transition-property:height,top;transition-delay:0.1s;}", ""], _helpers.FORM_ELEMENT_TRANSITION, (0, _themeGet.themeGet)("fonts.sans"), (0, _themeGet.themeGet)("colors.white100"), _helpers.FORM_ELEMENT_TRANSITION, function (_ref2) {
|
|
124
|
-
var
|
|
125
|
-
return !!
|
|
122
|
+
var labelOffset = _ref2.labelOffset;
|
|
123
|
+
return !!labelOffset && (0, _styledComponents.css)(["padding-left:", "px;"], labelOffset - 5);
|
|
126
124
|
});
|
|
127
125
|
//# sourceMappingURL=Input.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","names":["_themeGet","require","_react","_interopRequireDefault","_styledComponents","_interopRequireWildcard","_styledSystem","_RequiredField","_Box","_Text","_Tooltip","_tokens","_helpers","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Input","React","forwardRef","_ref","ref","children","className","description","disabled","error","required","focus","hover","title","height","prefixOffset","suffixOffset","showCounter","rest","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","inputProps","_React$useState","useState","_React$useState2","charCount","setCharCount","countChars","e","createElement","Box","width","Tooltip","pointer","content","placement","Text","variant","color","textAlign","position","StyledInput","onChange","_inputProps$onChange","maxLength","placeholder","StyledLabel","htmlFor","display","mt","mx","RequiredField","flex","ml","exports","displayName","styled","input","withConfig","componentId","themeGet","systemHeight","props","css","INPUT_STATES","active","completed","label","FORM_ELEMENT_TRANSITION","_ref2"],"sources":["../../../src/elements/Input/Input.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { height as systemHeight } from \"styled-system\"\nimport { RequiredField } from \"../../shared/RequiredField\"\nimport { Box, BoxProps, splitBoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Tooltip } from \"../Tooltip\"\nimport { INPUT_STATES } from \"./tokens\"\nimport { FORM_ELEMENT_TRANSITION } from \"../../helpers\"\n\nexport interface InputProps\n extends BoxProps,\n Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"width\" | \"height\" | \"capture\"\n > {\n active?: boolean\n description?: string\n disabled?: boolean\n error?: string | boolean\n focus?: boolean\n hover?: boolean\n required?: boolean\n title?: string\n prefixOffset?: number\n suffixOffset?: number\n showCounter?: boolean\n}\n\n/** Input component */\nexport const Input: React.ForwardRefExoticComponent<\n InputProps & { ref?: React.Ref<HTMLInputElement> }\n> = React.forwardRef(\n (\n {\n children,\n className,\n description,\n disabled,\n error,\n required,\n focus,\n hover,\n title,\n height,\n prefixOffset,\n suffixOffset,\n showCounter,\n ...rest\n },\n ref\n ) => {\n const [boxProps, inputProps] = splitBoxProps(rest)\n const [charCount, setCharCount] = React.useState(0)\n\n const countChars = (e: React.ChangeEvent<HTMLInputElement>) => {\n setCharCount(e.target.value.length)\n }\n\n return (\n <Box width=\"100%\" className={className} {...boxProps}>\n {!!description && (\n <Tooltip pointer content={description} placement=\"top-end\">\n <Text variant=\"xs\" color=\"black60\" textAlign=\"right\">\n <u>What is this?</u>\n </Text>\n </Tooltip>\n )}\n\n <Box position=\"relative\">\n <StyledInput\n ref={ref as any}\n disabled={disabled}\n focus={focus}\n hover={hover}\n error={!!error}\n required={required}\n height={(height ?? 50) as any}\n name={inputProps.name}\n title={title}\n suffixOffset={suffixOffset}\n prefixOffset={prefixOffset}\n onChange={(e) => {\n inputProps.onChange?.(e)\n if (inputProps.maxLength) {\n countChars(e)\n }\n }}\n placeholder={inputProps.placeholder || \" \"}\n {...inputProps}\n />\n\n {!!title && (\n <StyledLabel prefixOffset={prefixOffset} htmlFor={inputProps.name}>\n {title}\n <span />\n </StyledLabel>\n )}\n\n {children}\n </Box>\n\n {(required || (inputProps?.maxLength && showCounter)) &&\n !(error && typeof error === \"string\") && (\n <Box display=\"flex\" mt={0.5} mx={1}>\n {required && <RequiredField flex={1} />}\n\n {!!inputProps?.maxLength && showCounter && (\n <Text flex={1} variant=\"xs\" color=\"black60\" textAlign=\"right\">\n {charCount}/{inputProps.maxLength}\n </Text>\n )}\n </Box>\n )}\n\n {error && typeof error === \"string\" && (\n <Text variant=\"xs\" mt={0.5} ml={1} color=\"red100\">\n {error}\n </Text>\n )}\n </Box>\n )\n }\n)\n\nInput.displayName = \"Input\"\n\ntype StyledInputProps = Pick<\n InputProps,\n | \"disabled\"\n | \"error\"\n | \"hover\"\n | \"focus\"\n | \"active\"\n | \"title\"\n | \"suffixOffset\"\n | \"prefixOffset\"\n>\n\nconst StyledInput = styled.input<StyledInputProps>`\n width: 100%;\n padding: 0 ${themeGet(\"space.1\")};\n appearance: none;\n line-height: 1;\n border: 1px solid;\n border-radius: 3px;\n transition: border-color 0.25s, color 0.25s;\n font-family: ${themeGet(\"fonts.sans\")};\n ${systemHeight};\n\n ::placeholder {\n transition: color 0.25s, opacity 0.25s;\n }\n\n ${(props) => {\n return css`\n ${INPUT_STATES.default}\n ${props.hover && INPUT_STATES.hover}\n ${props.focus && INPUT_STATES.focus}\n ${props.active && INPUT_STATES.active}\n ${props.disabled && INPUT_STATES.disabled}\n ${props.error && INPUT_STATES.error}\n ${!!props.prefixOffset &&\n css`\n padding-left: ${props.prefixOffset}px;\n `}\n ${!!props.suffixOffset &&\n css`\n padding-right: ${props.suffixOffset}px;\n `}\n\n &:hover {\n ${INPUT_STATES.hover}\n }\n\n &:not(:placeholder-shown) {\n ${INPUT_STATES.completed}\n ${props.error && INPUT_STATES.error}\n }\n\n &:focus {\n outline: none;\n ${INPUT_STATES.focus}\n\n :not(:placeholder-shown) {\n ${INPUT_STATES.active}\n ${props.error && INPUT_STATES.error}\n }\n }\n\n &:disabled {\n cursor: default;\n ${INPUT_STATES.disabled}\n }\n\n ${props.title &&\n css`\n ::placeholder {\n opacity: 0;\n }\n `}\n `\n }};\n`\n\nconst StyledLabel = styled.label<StyledInputProps>`\n position: absolute;\n top: 50%;\n left: 5px;\n padding: 0 5px;\n background-color: transparent;\n transform: translateY(-50%);\n transition: ${FORM_ELEMENT_TRANSITION};\n transition-property: color, transform, padding, font-size;\n font-family: ${themeGet(\"fonts.sans\")};\n pointer-events: none;\n\n & > span {\n background-color: ${themeGet(\"colors.white100\")};\n height: 100%;\n width: 100%;\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n z-index: -1;\n transition: ${FORM_ELEMENT_TRANSITION};\n transition-property: height, top;\n transition-delay: 0.1s;\n }\n\n ${({ prefixOffset }) =>\n !!prefixOffset &&\n css`\n padding-left: ${prefixOffset - 5}px;\n `}\n`\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Input.js","names":["_themeGet","require","_react","_interopRequireDefault","_styledComponents","_interopRequireWildcard","_styledSystem","_RequiredField","_Box","_Text","_Tooltip","_tokens","_helpers","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Input","React","forwardRef","_ref","ref","children","className","description","disabled","error","required","focus","hover","title","height","labelOffset","showCounter","rest","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","inputProps","_React$useState","useState","_React$useState2","charCount","setCharCount","countChars","e","createElement","Box","width","Tooltip","pointer","content","placement","Text","variant","color","textAlign","position","StyledInput","onChange","_inputProps$onChange","maxLength","placeholder","StyledLabel","htmlFor","display","mt","mx","RequiredField","flex","ml","exports","displayName","styled","input","withConfig","componentId","themeGet","systemHeight","props","css","INPUT_STATES","active","completed","label","FORM_ELEMENT_TRANSITION","_ref2"],"sources":["../../../src/elements/Input/Input.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { height as systemHeight } from \"styled-system\"\nimport { RequiredField } from \"../../shared/RequiredField\"\nimport { Box, BoxProps, splitBoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Tooltip } from \"../Tooltip\"\nimport { INPUT_STATES } from \"./tokens\"\nimport { FORM_ELEMENT_TRANSITION } from \"../../helpers\"\n\nexport interface InputProps\n extends BoxProps,\n Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n \"size\" | \"width\" | \"height\" | \"capture\"\n > {\n active?: boolean\n description?: string\n disabled?: boolean\n error?: string | boolean\n focus?: boolean\n hover?: boolean\n required?: boolean\n title?: string\n labelOffset?: number\n showCounter?: boolean\n}\n\n/** Input component */\nexport const Input: React.ForwardRefExoticComponent<\n InputProps & { ref?: React.Ref<HTMLInputElement> }\n> = React.forwardRef(\n (\n {\n children,\n className,\n description,\n disabled,\n error,\n required,\n focus,\n hover,\n title,\n height,\n labelOffset,\n showCounter,\n ...rest\n },\n ref\n ) => {\n const [boxProps, inputProps] = splitBoxProps(rest)\n const [charCount, setCharCount] = React.useState(0)\n\n const countChars = (e: React.ChangeEvent<HTMLInputElement>) => {\n setCharCount(e.target.value.length)\n }\n\n return (\n <Box width=\"100%\" className={className} {...boxProps}>\n {!!description && (\n <Tooltip pointer content={description} placement=\"top-end\">\n <Text variant=\"xs\" color=\"black60\" textAlign=\"right\">\n <u>What is this?</u>\n </Text>\n </Tooltip>\n )}\n\n <Box position=\"relative\">\n <StyledInput\n ref={ref as any}\n disabled={disabled}\n focus={focus}\n hover={hover}\n error={!!error}\n required={required}\n height={(height ?? 50) as any}\n name={inputProps.name}\n title={title}\n labelOffset={labelOffset}\n onChange={(e) => {\n inputProps.onChange?.(e)\n if (inputProps.maxLength) {\n countChars(e)\n }\n }}\n placeholder={inputProps.placeholder || \" \"}\n {...inputProps}\n />\n\n {!!title && (\n <StyledLabel labelOffset={labelOffset} htmlFor={inputProps.name}>\n {title}\n <span />\n </StyledLabel>\n )}\n\n {children}\n </Box>\n\n {(required || (inputProps?.maxLength && showCounter)) &&\n !(error && typeof error === \"string\") && (\n <Box display=\"flex\" mt={0.5} mx={1}>\n {required && <RequiredField flex={1} />}\n\n {!!inputProps?.maxLength && showCounter && (\n <Text flex={1} variant=\"xs\" color=\"black60\" textAlign=\"right\">\n {charCount}/{inputProps.maxLength}\n </Text>\n )}\n </Box>\n )}\n\n {error && typeof error === \"string\" && (\n <Text variant=\"xs\" mt={0.5} ml={1} color=\"red100\">\n {error}\n </Text>\n )}\n </Box>\n )\n }\n)\n\nInput.displayName = \"Input\"\n\ntype StyledInputProps = Pick<\n InputProps,\n \"disabled\" | \"error\" | \"hover\" | \"focus\" | \"active\" | \"title\" | \"labelOffset\"\n>\n\nconst StyledInput = styled.input<StyledInputProps>`\n width: 100%;\n padding: 0 ${themeGet(\"space.1\")};\n appearance: none;\n line-height: 1;\n border: 1px solid;\n border-radius: 3px;\n transition: border-color 0.25s, color 0.25s;\n font-family: ${themeGet(\"fonts.sans\")};\n ${systemHeight};\n\n ::placeholder {\n transition: color 0.25s, opacity 0.25s;\n }\n\n ${(props) => {\n return css`\n ${INPUT_STATES.default}\n ${props.hover && INPUT_STATES.hover}\n ${props.focus && INPUT_STATES.focus}\n ${props.active && INPUT_STATES.active}\n ${props.disabled && INPUT_STATES.disabled}\n ${props.error && INPUT_STATES.error}\n\n &:hover {\n ${INPUT_STATES.hover}\n }\n\n &:not(:placeholder-shown) {\n ${INPUT_STATES.completed}\n ${props.error && INPUT_STATES.error}\n }\n\n &:focus {\n outline: none;\n ${INPUT_STATES.focus}\n\n :not(:placeholder-shown) {\n ${INPUT_STATES.active}\n ${props.error && INPUT_STATES.error}\n }\n }\n\n &:disabled {\n cursor: default;\n ${INPUT_STATES.disabled}\n }\n\n ${props.title &&\n css`\n ::placeholder {\n opacity: 0;\n }\n `}\n `\n }};\n`\n\nconst StyledLabel = styled.label<StyledInputProps>`\n position: absolute;\n top: 50%;\n left: 5px;\n padding: 0 5px;\n background-color: transparent;\n transform: translateY(-50%);\n transition: ${FORM_ELEMENT_TRANSITION};\n transition-property: color, transform, padding, font-size;\n font-family: ${themeGet(\"fonts.sans\")};\n pointer-events: none;\n\n & > span {\n background-color: ${themeGet(\"colors.white100\")};\n height: 100%;\n width: 100%;\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n z-index: -1;\n transition: ${FORM_ELEMENT_TRANSITION};\n transition-property: height, top;\n transition-delay: 0.1s;\n }\n\n ${({ labelOffset }) =>\n !!labelOffset &&\n css`\n padding-left: ${labelOffset - 5}px;\n `}\n`\n"],"mappings":"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"}
|
|
@@ -51,8 +51,10 @@ var LabeledInput = /*#__PURE__*/_react.default.forwardRef(function (_ref, forwar
|
|
|
51
51
|
position: "relative"
|
|
52
52
|
}, boxProps), /*#__PURE__*/_react.default.createElement(_Input.Input, _extends({
|
|
53
53
|
ref: forwardedRef,
|
|
54
|
-
height: height
|
|
55
|
-
|
|
54
|
+
height: height,
|
|
55
|
+
labelOffset: isPrefix ? offset + 15 : undefined,
|
|
56
|
+
style: _defineProperty({}, isPrefix ? "paddingLeft" : "paddingRight", offset + 15)
|
|
57
|
+
}, inputProps), /*#__PURE__*/_react.default.createElement(_Box.Box, _extends({
|
|
56
58
|
ref: labelRef,
|
|
57
59
|
position: "absolute",
|
|
58
60
|
display: "flex",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LabeledInput.js","names":["_react","_interopRequireWildcard","require","_isText2","_Box","_Input","_Text","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_defineProperty","value","_toPropertyKey","enumerable","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","TypeError","Number","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","LabeledInput","React","forwardRef","_ref","forwardedRef","label","height","_ref$variant","variant","rest","labelRef","useRef","_useState","useState","_useState2","offset","setOffset","useEffect","current","offsetWidth","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","inputProps","isText","_isText","isPrefix","createElement","Box","position","Input","ref","display","alignItems","top","bottom","style","pointerEvents","Text","color","lineHeight","exports","displayName"],"sources":["../../../src/elements/LabeledInput/LabeledInput.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\"\nimport { isText as _isText } from \"../../helpers/isText\"\nimport { Box, splitBoxProps } from \"../Box\"\nimport { Input, InputProps } from \"../Input\"\nimport { Text } from \"../Text\"\n\nexport interface LabeledInputProps extends InputProps {\n label: React.ReactNode\n variant?: \"suffix\" | \"prefix\"\n}\n\n/** Input with a right-aligned or left-aligned label */\nexport const LabeledInput: React.ForwardRefExoticComponent<\n LabeledInputProps & { ref?: React.Ref<HTMLInputElement> }\n> = React.forwardRef(\n ({ label, height, variant = \"suffix\", ...rest }, forwardedRef) => {\n const labelRef = useRef<HTMLDivElement | null>(null)\n const [offset, setOffset] = useState(0)\n\n useEffect(() => {\n if (labelRef.current === null) return\n setOffset(labelRef.current.offsetWidth)\n }, [])\n\n const [boxProps, inputProps] = splitBoxProps(rest)\n\n const isText = _isText(label)\n\n const isPrefix = variant === \"prefix\"\n\n return (\n <Box position=\"relative\" {...boxProps}>\n <Input\n ref={forwardedRef}\n height={height}\n {...{ [isPrefix ? \"prefixOffset\" : \"suffixOffset\"]: offset + 15 }}\n {...inputProps}\n >\n <Box\n ref={labelRef as any}\n position=\"absolute\"\n display=\"flex\"\n alignItems=\"center\"\n top={0}\n bottom={0}\n style={{ pointerEvents: isText ? \"none\" : undefined }}\n {...{ [isPrefix ? \"left\" : \"right\"]: 1 }}\n >\n {isText ? (\n <Text variant=\"sm-display\" color=\"black60\" lineHeight={1}>\n {label}\n </Text>\n ) : (\n label\n )}\n </Box>\n </Input>\n </Box>\n )\n }\n)\n\nLabeledInput.displayName = \"LabeledInput\"\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"LabeledInput.js","names":["_react","_interopRequireWildcard","require","_isText2","_Box","_Input","_Text","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_defineProperty","value","_toPropertyKey","enumerable","configurable","writable","arg","_toPrimitive","String","input","hint","prim","Symbol","toPrimitive","undefined","res","TypeError","Number","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","LabeledInput","React","forwardRef","_ref","forwardedRef","label","height","_ref$variant","variant","rest","labelRef","useRef","_useState","useState","_useState2","offset","setOffset","useEffect","current","offsetWidth","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","inputProps","isText","_isText","isPrefix","createElement","Box","position","Input","ref","labelOffset","style","display","alignItems","top","bottom","pointerEvents","Text","color","lineHeight","exports","displayName"],"sources":["../../../src/elements/LabeledInput/LabeledInput.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\"\nimport { isText as _isText } from \"../../helpers/isText\"\nimport { Box, splitBoxProps } from \"../Box\"\nimport { Input, InputProps } from \"../Input\"\nimport { Text } from \"../Text\"\n\nexport interface LabeledInputProps extends InputProps {\n label: React.ReactNode\n variant?: \"suffix\" | \"prefix\"\n}\n\n/** Input with a right-aligned or left-aligned label */\nexport const LabeledInput: React.ForwardRefExoticComponent<\n LabeledInputProps & { ref?: React.Ref<HTMLInputElement> }\n> = React.forwardRef(\n ({ label, height, variant = \"suffix\", ...rest }, forwardedRef) => {\n const labelRef = useRef<HTMLDivElement | null>(null)\n const [offset, setOffset] = useState(0)\n\n useEffect(() => {\n if (labelRef.current === null) return\n setOffset(labelRef.current.offsetWidth)\n }, [])\n\n const [boxProps, inputProps] = splitBoxProps(rest)\n\n const isText = _isText(label)\n\n const isPrefix = variant === \"prefix\"\n\n return (\n <Box position=\"relative\" {...boxProps}>\n <Input\n ref={forwardedRef}\n height={height}\n labelOffset={isPrefix ? offset + 15 : undefined}\n style={{ [isPrefix ? \"paddingLeft\" : \"paddingRight\"]: offset + 15 }}\n {...inputProps}\n >\n <Box\n ref={labelRef as any}\n position=\"absolute\"\n display=\"flex\"\n alignItems=\"center\"\n top={0}\n bottom={0}\n style={{ pointerEvents: isText ? \"none\" : undefined }}\n {...{ [isPrefix ? \"left\" : \"right\"]: 1 }}\n >\n {isText ? (\n <Text variant=\"sm-display\" color=\"black60\" lineHeight={1}>\n {label}\n </Text>\n ) : (\n label\n )}\n </Box>\n </Input>\n </Box>\n )\n }\n)\n\nLabeledInput.displayName = \"LabeledInput\"\n"],"mappings":"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"}
|
|
@@ -9,7 +9,7 @@ var _styledComponents = require("styled-components");
|
|
|
9
9
|
var MULTISELECT_STATES = {
|
|
10
10
|
default: (0, _styledComponents.css)(["height:50px;font-size:", ";color:", ";border-color:", ";& > label{color:", ";font-size:", ";}"], (0, _themeGet.themeGet)("textVariants.sm-display.fontSize"), (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("colors.black30"), (0, _themeGet.themeGet)("colors.black60"), (0, _themeGet.themeGet)("textVariants.sm-display.fontSize")),
|
|
11
11
|
focus: (0, _styledComponents.css)(["color:", ";border-color:", ";text-decoration:underline;& > label{color:", ";transform:translateY(-250%);font-size:", ";}"], (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("colors.blue100"), (0, _themeGet.themeGet)("colors.blue100"), (0, _themeGet.themeGet)("textVariants.xs.fontSize")),
|
|
12
|
-
hover: (0, _styledComponents.css)(["color:", ";border-color:", ";text-decoration:underline;& > label{color:", ";", "
|
|
12
|
+
hover: (0, _styledComponents.css)(["color:", ";border-color:", ";text-decoration:underline;& > label{color:", ";", "}"], (0, _themeGet.themeGet)("colors.blue100"), (0, _themeGet.themeGet)("colors.black60"), (0, _themeGet.themeGet)("colors.blue100"), function (_ref) {
|
|
13
13
|
var complete = _ref.complete;
|
|
14
14
|
return !complete && (0, _styledComponents.css)(["text-decoration:underline;"]);
|
|
15
15
|
}),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tokens.js","names":["_themeGet","require","_styledComponents","MULTISELECT_STATES","default","css","themeGet","focus","hover","_ref","complete","completed","disabled","error","exports"],"sources":["../../../src/elements/MultiSelect/tokens.ts"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport { css } from \"styled-components\"\nimport { State } from \"../Select/types\"\n\nexport const MULTISELECT_STATES: Record<State, any> = {\n default: css`\n height: 50px;\n font-size: ${themeGet(\"textVariants.sm-display.fontSize\")};\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.black30\")};\n\n & > label {\n color: ${themeGet(\"colors.black60\")};\n font-size: ${themeGet(\"textVariants.sm-display.fontSize\")};\n }\n `,\n focus: css`\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.blue100\")};\n text-decoration: underline;\n\n & > label {\n color: ${themeGet(\"colors.blue100\")};\n transform: translateY(-250%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n }\n `,\n hover: css`\n color: ${themeGet(\"colors.blue100\")};\n border-color: ${themeGet(\"colors.black60\")};\n text-decoration: underline;\n\n & > label {\n color: ${themeGet(\"colors.blue100\")};\n\n ${({ complete }) =>\n !complete &&\n css`\n text-decoration: underline;\n `}
|
|
1
|
+
{"version":3,"file":"tokens.js","names":["_themeGet","require","_styledComponents","MULTISELECT_STATES","default","css","themeGet","focus","hover","_ref","complete","completed","disabled","error","exports"],"sources":["../../../src/elements/MultiSelect/tokens.ts"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport { css } from \"styled-components\"\nimport { State } from \"../Select/types\"\n\nexport const MULTISELECT_STATES: Record<State, any> = {\n default: css`\n height: 50px;\n font-size: ${themeGet(\"textVariants.sm-display.fontSize\")};\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.black30\")};\n\n & > label {\n color: ${themeGet(\"colors.black60\")};\n font-size: ${themeGet(\"textVariants.sm-display.fontSize\")};\n }\n `,\n focus: css`\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.blue100\")};\n text-decoration: underline;\n\n & > label {\n color: ${themeGet(\"colors.blue100\")};\n transform: translateY(-250%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n }\n `,\n hover: css`\n color: ${themeGet(\"colors.blue100\")};\n border-color: ${themeGet(\"colors.black60\")};\n text-decoration: underline;\n\n & > label {\n color: ${themeGet(\"colors.blue100\")};\n\n ${({ complete }) =>\n !complete &&\n css`\n text-decoration: underline;\n `}\n }\n `,\n completed: css`\n border-color: ${themeGet(\"colors.black60\")};\n text-decoration: none;\n\n & > label {\n color: ${themeGet(\"colors.black60\")};\n transform: translateY(-250%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n }\n `,\n disabled: css`\n color: ${themeGet(\"colors.black30\")};\n border-color: ${themeGet(\"colors.black30\")};\n text-decoration: none;\n\n & > label {\n color: ${themeGet(\"colors.black30\")};\n text-decoration: none;\n }\n `,\n error: css`\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.red100\")};\n\n & > label {\n color: ${themeGet(\"colors.red100\")};\n }\n `,\n}\n"],"mappings":";;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AAGO,IAAME,kBAAsC,GAAG;EACpDC,OAAO,MAAEC,qBAAG,qGAEG,IAAAC,kBAAQ,EAAC,kCAAkC,CAAC,EAChD,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EACpB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAG/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EACtB,IAAAA,kBAAQ,EAAC,kCAAkC,CAAC,CAE5D;EACDC,KAAK,MAAEF,qBAAG,gIACC,IAAAC,kBAAQ,EAAC,iBAAiB,CAAC,EACpB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAI/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAEtB,IAAAA,kBAAQ,EAAC,0BAA0B,CAAC,CAEpD;EACDE,KAAK,MAAEH,qBAAG,yFACC,IAAAC,kBAAQ,EAAC,gBAAgB,CAAC,EACnB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAI/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAEjC,UAAAG,IAAA;IAAA,IAAGC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAA,OACX,CAACA,QAAQ,QACTL,qBAAG,iCAEF;EAAA,EAEN;EACDM,SAAS,MAAEN,qBAAG,gHACI,IAAAC,kBAAQ,EAAC,gBAAgB,CAAC,EAI/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAEtB,IAAAA,kBAAQ,EAAC,0BAA0B,CAAC,CAEpD;EACDM,QAAQ,MAAEP,qBAAG,qGACF,IAAAC,kBAAQ,EAAC,gBAAgB,CAAC,EACnB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAI/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,CAGtC;EACDO,KAAK,MAAER,qBAAG,2DACC,IAAAC,kBAAQ,EAAC,iBAAiB,CAAC,EACpB,IAAAA,kBAAQ,EAAC,eAAe,CAAC,EAG9B,IAAAA,kBAAQ,EAAC,eAAe,CAAC;AAGxC,CAAC;AAAAQ,OAAA,CAAAX,kBAAA,GAAAA,kBAAA"}
|
|
@@ -133,7 +133,7 @@ var Container = (0, _styledComponents.default)(_Box.Box).withConfig({
|
|
|
133
133
|
displayName: "Select__Container",
|
|
134
134
|
componentId: "sc-1weszjl-0"
|
|
135
135
|
})(["position:relative;width:100%;> select{", ";width:100%;padding:0 24px 0 ", ";font-family:", ";border:1px solid;border-radius:3px;border-color:", ";cursor:pointer;line-height:1;transition:color 0.25s,background-color 0.25s,border-color 0.25s;", ";}", ""], resetMixin, (0, _themeGet.themeGet)("space.1"), (0, _themeGet.themeGet)("fonts.sans"), (0, _themeGet.themeGet)("colors.black30"), function (props) {
|
|
136
|
-
return (0, _styledComponents.css)(["", " ", " ", " ", " ", " &:hover{", "}&:focus{", "}&:disabled{cursor:default;", "}&:not(:focus):not(:has(option[value=\"\"]:checked)){", " ", "}", "
|
|
136
|
+
return (0, _styledComponents.css)(["", " ", " ", " ", " ", " &:hover{", "}&:focus{", "}&:disabled{cursor:default;", "}&:not(:focus):not(:has(option[value=\"\"]:checked)){", " ", "}&:not(:focus){", "}&:not(:focus):has(option[value=\"\"]:checked){", "}&:not(:focus){", "}"], _tokens.SELECT_STATES.default, props.hover && _tokens.SELECT_STATES.hover, props.focus && _tokens.SELECT_STATES.focus, props.disabled && _tokens.SELECT_STATES.disabled, props.error && _tokens.SELECT_STATES.error, _tokens.SELECT_STATES.hover, _tokens.SELECT_STATES.focus, _tokens.SELECT_STATES.disabled, !(props.disabled || props.focus) && _tokens.SELECT_STATES.completed, props.error && _tokens.SELECT_STATES.error, !!props.optionSelected && (0, _styledComponents.css)(["", " ", ""], !(props.disabled || props.focus) && _tokens.SELECT_STATES.completed, props.error && _tokens.SELECT_STATES.error), props.title && (0, _styledComponents.css)(["color:transparent;"]), props.title && !props.optionSelected && (0, _styledComponents.css)(["color:transparent;"]));
|
|
137
137
|
}, caretMixin);
|
|
138
138
|
var StyledLabel = _styledComponents.default.label.withConfig({
|
|
139
139
|
displayName: "Select__StyledLabel",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","names":["_themeGet","require","_react","_interopRequireWildcard","_styledComponents","_helpers","_RequiredField","_Box","_Text","_Tooltip","_tokens","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Select","forwardRef","_ref","ref","description","disabled","error","focus","hover","id","options","required","selected","title","onSelect","onChange","rest","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","selectProps","_useState","useState","_useState2","selectedOption","setSelectedOption","_useState3","_useState4","isFocused","setIsFocused","_useState5","_useState6","isHovered","setIsHovered","createElement","Box","width","Tooltip","pointer","content","placement","Text","variant","color","textAlign","Container","onMouseEnter","onMouseLeave","onFocus","onBlur","optionSelected","event","map","_ref2","text","StyledLabel","htmlFor","RequiredField","mt","ml","exports","displayName","resetMixin","css","caretMixin","themeGet","_ref3","styled","withConfig","componentId","props","SELECT_STATES","completed","label","FORM_ELEMENT_TRANSITION"],"sources":["../../../src/elements/Select/Select.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React, {\n forwardRef,\n ForwardRefExoticComponent,\n Ref,\n useState,\n} from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { FORM_ELEMENT_TRANSITION } from \"../../helpers\"\nimport { RequiredField } from \"../../shared/RequiredField\"\nimport { Box, BoxProps, splitBoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Tooltip } from \"../Tooltip\"\nimport { SELECT_STATES } from \"./tokens\"\n\nexport interface Option {\n value: string\n text: string\n}\n\nexport interface SelectProps\n extends BoxProps,\n Omit<React.SelectHTMLAttributes<HTMLSelectElement>, \"onSelect\" | \"size\"> {\n description?: string\n disabled?: boolean\n error?: string | boolean\n focus?: boolean\n hover?: boolean\n name?: string\n options: Option[]\n required?: boolean\n selected?: string\n title?: string\n onSelect?: (value: string) => void\n}\n\n/** A drop-down select menu */\nexport const Select: ForwardRefExoticComponent<\n SelectProps & { ref?: Ref<HTMLElement> }\n> = forwardRef(\n (\n {\n description,\n disabled,\n error,\n focus,\n hover,\n id,\n name,\n options,\n required,\n selected,\n title,\n onSelect,\n onChange,\n value,\n ...rest\n },\n ref\n ) => {\n const [boxProps, selectProps] = splitBoxProps(rest)\n // due to :has not available in Firefox yet, we need to add the styles to the label using JS\n const [selectedOption, setSelectedOption] = useState(selected || value)\n const [isFocused, setIsFocused] = useState(false)\n const [isHovered, setIsHovered] = useState(false)\n\n return (\n <Box width=\"100%\" {...boxProps}>\n {!!description && (\n <Tooltip pointer content={description} placement=\"top-end\">\n <Text variant=\"xs\" color=\"black60\" textAlign=\"right\">\n <u>What is this?</u>\n </Text>\n </Tooltip>\n )}\n\n <Container\n disabled={!!disabled}\n hover={!!hover || isHovered}\n error={error!}\n focus={!!focus || isFocused}\n title={title}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n optionSelected={!!selectedOption}\n >\n <select\n ref={ref as any}\n id={id}\n disabled={disabled}\n name={name}\n value={selected || value}\n onChange={(event) => {\n onSelect && onSelect(event.target.value)\n onChange && onChange(event)\n setSelectedOption(event.target.value)\n }}\n {...selectProps}\n >\n {options.map(({ value, text }) => {\n return (\n <option value={value} key={value}>\n {text}\n </option>\n )\n })}\n </select>\n\n {!!title && (\n <StyledLabel htmlFor={id}>\n {title}\n\n <span />\n </StyledLabel>\n )}\n </Container>\n\n {required && !(error && typeof error === \"string\") && (\n <RequiredField mt={0.5} ml={1} />\n )}\n\n {error && typeof error === \"string\" && (\n <Text variant=\"xs\" mt={0.5} ml={1} color=\"red100\">\n {error}\n </Text>\n )}\n </Box>\n )\n }\n)\n\nSelect.displayName = \"Select\"\n\nconst resetMixin = css`\n appearance: none;\n background: none;\n border: none;\n outline: 0;\n text-indent: 0.01px;\n text-overflow: \"\";\n border-radius: 0;\n\n &:-moz-focusring {\n color: transparent;\n text-shadow: 0 0 0 black;\n }\n\n option:not(:checked) {\n color: black; /* prevent <option>s from becoming transparent as well */\n }\n`\n\n/** Creates a small caret */\nexport const caretMixin = css`\n &::after {\n content: \"\";\n cursor: inherit;\n width: 0;\n height: 0;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n right: ${themeGet(\"space.1\")};\n pointer-events: none;\n border-left: 4px solid transparent;\n border-right: 4px solid transparent;\n border-top: 4px solid\n ${({ disabled }) => {\n return disabled\n ? themeGet(\"colors.black10\")\n : themeGet(\"colors.black100\")\n }};\n }\n`\n\ntype ContainerProps = Required<\n Pick<SelectProps, \"disabled\" | \"error\" | \"hover\" | \"focus\">\n // adding optionSelected here to use it locally without adding it to the Select's props\n> & { optionSelected: boolean }\n\nconst Container = styled(Box)<ContainerProps>`\n position: relative;\n width: 100%;\n\n > select {\n ${resetMixin};\n width: 100%;\n /* 24px = space.1 + 4px-wide caret + space.1 */\n padding: 0 24px 0 ${themeGet(\"space.1\")};\n font-family: ${themeGet(\"fonts.sans\")};\n border: 1px solid;\n border-radius: 3px;\n border-color: ${themeGet(\"colors.black30\")};\n cursor: pointer;\n line-height: 1;\n transition: color 0.25s, background-color 0.25s, border-color 0.25s;\n\n ${(props) => {\n return css`\n ${SELECT_STATES.default}\n\n ${props.hover && SELECT_STATES.hover}\n ${props.focus && SELECT_STATES.focus}\n ${props.disabled && SELECT_STATES.disabled}\n ${props.error && SELECT_STATES.error}\n\n &:hover {\n ${SELECT_STATES.hover}\n }\n\n &:focus {\n ${SELECT_STATES.focus}\n }\n\n &:disabled {\n cursor: default;\n ${SELECT_STATES.disabled}\n }\n\n &:not(:focus):not(:has(option[value=\"\"]:checked)) {\n ${!(props.disabled || props.focus) && SELECT_STATES.completed}\n ${props.error && SELECT_STATES.error}\n }\n\n // Firefox polyfill for :has\n ${!props.focus &&\n !!props.optionSelected &&\n css`\n ${!(props.disabled || props.focus) && SELECT_STATES.completed}\n ${props.error && SELECT_STATES.error}\n `}\n\n &:not(:focus):has(option[value=\"\"]:checked) {\n ${props.title &&\n css`\n color: transparent;\n `}\n }\n\n // Firefox polyfill for :has\n ${!props.focus &&\n !props.optionSelected &&\n props.title &&\n css`\n color: transparent !important;\n `}\n `\n }};\n }\n\n ${caretMixin}\n`\n\nconst StyledLabel = styled.label`\n position: absolute;\n top: 50%;\n left: 5px;\n padding: 0 5px;\n pointer-events: none;\n transform: translateY(-50%);\n transition: ${FORM_ELEMENT_TRANSITION};\n transition-property: color, font-size, transform;\n background-color: transparent;\n font-family: ${themeGet(\"fonts.sans\")};\n\n & > span {\n background-color: ${themeGet(\"colors.white100\")};\n height: 100%;\n width: 100%;\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n z-index: -1;\n transition: ${FORM_ELEMENT_TRANSITION};\n transition-property: height, top;\n transition-delay: 0.1s;\n }\n`\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Select.js","names":["_themeGet","require","_react","_interopRequireWildcard","_styledComponents","_helpers","_RequiredField","_Box","_Text","_Tooltip","_tokens","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","Select","forwardRef","_ref","ref","description","disabled","error","focus","hover","id","options","required","selected","title","onSelect","onChange","rest","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","selectProps","_useState","useState","_useState2","selectedOption","setSelectedOption","_useState3","_useState4","isFocused","setIsFocused","_useState5","_useState6","isHovered","setIsHovered","createElement","Box","width","Tooltip","pointer","content","placement","Text","variant","color","textAlign","Container","onMouseEnter","onMouseLeave","onFocus","onBlur","optionSelected","event","map","_ref2","text","StyledLabel","htmlFor","RequiredField","mt","ml","exports","displayName","resetMixin","css","caretMixin","themeGet","_ref3","styled","withConfig","componentId","props","SELECT_STATES","completed","label","FORM_ELEMENT_TRANSITION"],"sources":["../../../src/elements/Select/Select.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React, {\n forwardRef,\n ForwardRefExoticComponent,\n Ref,\n useState,\n} from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { FORM_ELEMENT_TRANSITION } from \"../../helpers\"\nimport { RequiredField } from \"../../shared/RequiredField\"\nimport { Box, BoxProps, splitBoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Tooltip } from \"../Tooltip\"\nimport { SELECT_STATES } from \"./tokens\"\n\nexport interface Option {\n value: string\n text: string\n}\n\nexport interface SelectProps\n extends BoxProps,\n Omit<React.SelectHTMLAttributes<HTMLSelectElement>, \"onSelect\" | \"size\"> {\n description?: string\n disabled?: boolean\n error?: string | boolean\n focus?: boolean\n hover?: boolean\n name?: string\n options: Option[]\n required?: boolean\n selected?: string\n title?: string\n onSelect?: (value: string) => void\n}\n\n/** A drop-down select menu */\nexport const Select: ForwardRefExoticComponent<\n SelectProps & { ref?: Ref<HTMLElement> }\n> = forwardRef(\n (\n {\n description,\n disabled,\n error,\n focus,\n hover,\n id,\n name,\n options,\n required,\n selected,\n title,\n onSelect,\n onChange,\n value,\n ...rest\n },\n ref\n ) => {\n const [boxProps, selectProps] = splitBoxProps(rest)\n // due to :has not available in Firefox yet, we need to add the styles to the label using JS\n const [selectedOption, setSelectedOption] = useState(selected || value)\n const [isFocused, setIsFocused] = useState(false)\n const [isHovered, setIsHovered] = useState(false)\n\n return (\n <Box width=\"100%\" {...boxProps}>\n {!!description && (\n <Tooltip pointer content={description} placement=\"top-end\">\n <Text variant=\"xs\" color=\"black60\" textAlign=\"right\">\n <u>What is this?</u>\n </Text>\n </Tooltip>\n )}\n\n <Container\n disabled={!!disabled}\n hover={!!hover || isHovered}\n error={error!}\n focus={!!focus || isFocused}\n title={title}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n optionSelected={!!selectedOption}\n >\n <select\n ref={ref as any}\n id={id}\n disabled={disabled}\n name={name}\n value={selected || value}\n onChange={(event) => {\n onSelect && onSelect(event.target.value)\n onChange && onChange(event)\n setSelectedOption(event.target.value)\n }}\n {...selectProps}\n >\n {options.map(({ value, text }) => {\n return (\n <option value={value} key={value}>\n {text}\n </option>\n )\n })}\n </select>\n\n {!!title && (\n <StyledLabel htmlFor={id}>\n {title}\n\n <span />\n </StyledLabel>\n )}\n </Container>\n\n {required && !(error && typeof error === \"string\") && (\n <RequiredField mt={0.5} ml={1} />\n )}\n\n {error && typeof error === \"string\" && (\n <Text variant=\"xs\" mt={0.5} ml={1} color=\"red100\">\n {error}\n </Text>\n )}\n </Box>\n )\n }\n)\n\nSelect.displayName = \"Select\"\n\nconst resetMixin = css`\n appearance: none;\n background: none;\n border: none;\n outline: 0;\n text-indent: 0.01px;\n text-overflow: \"\";\n border-radius: 0;\n\n &:-moz-focusring {\n color: transparent;\n text-shadow: 0 0 0 black;\n }\n\n option:not(:checked) {\n color: black; /* prevent <option>s from becoming transparent as well */\n }\n`\n\n/** Creates a small caret */\nexport const caretMixin = css`\n &::after {\n content: \"\";\n cursor: inherit;\n width: 0;\n height: 0;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n right: ${themeGet(\"space.1\")};\n pointer-events: none;\n border-left: 4px solid transparent;\n border-right: 4px solid transparent;\n border-top: 4px solid\n ${({ disabled }) => {\n return disabled\n ? themeGet(\"colors.black10\")\n : themeGet(\"colors.black100\")\n }};\n }\n`\n\ntype ContainerProps = Required<\n Pick<SelectProps, \"disabled\" | \"error\" | \"hover\" | \"focus\">\n // adding optionSelected here to use it locally without adding it to the Select's props\n> & { optionSelected: boolean }\n\nconst Container = styled(Box)<ContainerProps>`\n position: relative;\n width: 100%;\n\n > select {\n ${resetMixin};\n width: 100%;\n /* 24px = space.1 + 4px-wide caret + space.1 */\n padding: 0 24px 0 ${themeGet(\"space.1\")};\n font-family: ${themeGet(\"fonts.sans\")};\n border: 1px solid;\n border-radius: 3px;\n border-color: ${themeGet(\"colors.black30\")};\n cursor: pointer;\n line-height: 1;\n transition: color 0.25s, background-color 0.25s, border-color 0.25s;\n\n ${(props) => {\n return css`\n ${SELECT_STATES.default}\n\n ${props.hover && SELECT_STATES.hover}\n ${props.focus && SELECT_STATES.focus}\n ${props.disabled && SELECT_STATES.disabled}\n ${props.error && SELECT_STATES.error}\n\n &:hover {\n ${SELECT_STATES.hover}\n }\n\n &:focus {\n ${SELECT_STATES.focus}\n }\n\n &:disabled {\n cursor: default;\n ${SELECT_STATES.disabled}\n }\n\n &:not(:focus):not(:has(option[value=\"\"]:checked)) {\n ${!(props.disabled || props.focus) && SELECT_STATES.completed}\n ${props.error && SELECT_STATES.error}\n }\n\n &:not(:focus) {\n // Firefox polyfill for :has\n ${!!props.optionSelected &&\n css`\n ${!(props.disabled || props.focus) && SELECT_STATES.completed}\n ${props.error && SELECT_STATES.error}\n `}\n }\n\n &:not(:focus):has(option[value=\"\"]:checked) {\n ${props.title &&\n css`\n color: transparent;\n `}\n }\n\n &:not(:focus) {\n // Firefox polyfill for :has\n ${props.title &&\n !props.optionSelected &&\n css`\n color: transparent;\n `}\n }\n `\n }};\n }\n\n ${caretMixin}\n`\n\nconst StyledLabel = styled.label`\n position: absolute;\n top: 50%;\n left: 5px;\n padding: 0 5px;\n pointer-events: none;\n transform: translateY(-50%);\n transition: ${FORM_ELEMENT_TRANSITION};\n transition-property: color, font-size, transform;\n background-color: transparent;\n font-family: ${themeGet(\"fonts.sans\")};\n\n & > span {\n background-color: ${themeGet(\"colors.white100\")};\n height: 100%;\n width: 100%;\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n z-index: -1;\n transition: ${FORM_ELEMENT_TRANSITION};\n transition-property: height, top;\n transition-delay: 0.1s;\n }\n`\n"],"mappings":";;;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AAMA,IAAAG,iBAAA,GAAAD,uBAAA,CAAAF,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,cAAA,GAAAL,OAAA;AACA,IAAAM,IAAA,GAAAN,OAAA;AACA,IAAAO,KAAA,GAAAP,OAAA;AACA,IAAAQ,QAAA,GAAAR,OAAA;AACA,IAAAS,OAAA,GAAAT,OAAA;AAAwC,IAAAU,SAAA;AAAA,SAAAC,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAV,wBAAAc,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,aAAAE,OAAA,CAAAF,GAAA,yBAAAA,GAAA,4BAAAG,OAAA,EAAAH,GAAA,UAAAI,KAAA,GAAAT,wBAAA,CAAAC,WAAA,OAAAQ,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAL,GAAA,YAAAI,KAAA,CAAAE,GAAA,CAAAN,GAAA,SAAAO,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAZ,GAAA,QAAAY,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAf,GAAA,EAAAY,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAX,GAAA,EAAAY,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAZ,GAAA,CAAAY,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAH,GAAA,MAAAI,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAjB,GAAA,EAAAO,MAAA,YAAAA,MAAA;AAAA,SAAAW,SAAA,IAAAA,QAAA,GAAAT,MAAA,CAAAU,MAAA,GAAAV,MAAA,CAAAU,MAAA,CAAAC,IAAA,eAAAC,MAAA,aAAAC,CAAA,MAAAA,CAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAF,CAAA,UAAAG,MAAA,GAAAF,SAAA,CAAAD,CAAA,YAAAV,GAAA,IAAAa,MAAA,QAAAhB,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAU,MAAA,EAAAb,GAAA,KAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,gBAAAS,MAAA,YAAAH,QAAA,CAAAQ,KAAA,OAAAH,SAAA;AAAA,SAAAI,eAAAC,GAAA,EAAAN,CAAA,WAAAO,eAAA,CAAAD,GAAA,KAAAE,qBAAA,CAAAF,GAAA,EAAAN,CAAA,KAAAS,2BAAA,CAAAH,GAAA,EAAAN,CAAA,KAAAU,gBAAA;AAAA,SAAAA,iBAAA,cAAAC,SAAA;AAAA,SAAAF,4BAAAG,CAAA,EAAAC,MAAA,SAAAD,CAAA,qBAAAA,CAAA,sBAAAE,iBAAA,CAAAF,CAAA,EAAAC,MAAA,OAAAE,CAAA,GAAA5B,MAAA,CAAAI,SAAA,CAAAyB,QAAA,CAAAvB,IAAA,CAAAmB,CAAA,EAAAK,KAAA,aAAAF,CAAA,iBAAAH,CAAA,CAAAM,WAAA,EAAAH,CAAA,GAAAH,CAAA,CAAAM,WAAA,CAAAC,IAAA,MAAAJ,CAAA,cAAAA,CAAA,mBAAAK,KAAA,CAAAC,IAAA,CAAAT,CAAA,OAAAG,CAAA,+DAAAO,IAAA,CAAAP,CAAA,UAAAD,iBAAA,CAAAF,CAAA,EAAAC,MAAA;AAAA,SAAAC,kBAAAR,GAAA,EAAAiB,GAAA,QAAAA,GAAA,YAAAA,GAAA,GAAAjB,GAAA,CAAAJ,MAAA,EAAAqB,GAAA,GAAAjB,GAAA,CAAAJ,MAAA,WAAAF,CAAA,MAAAwB,IAAA,OAAAJ,KAAA,CAAAG,GAAA,GAAAvB,CAAA,GAAAuB,GAAA,EAAAvB,CAAA,MAAAwB,IAAA,CAAAxB,CAAA,IAAAM,GAAA,CAAAN,CAAA,YAAAwB,IAAA;AAAA,SAAAhB,sBAAAF,GAAA,EAAAN,CAAA,QAAAyB,EAAA,WAAAnB,GAAA,gCAAAoB,MAAA,IAAApB,GAAA,CAAAoB,MAAA,CAAAC,QAAA,KAAArB,GAAA,4BAAAmB,EAAA,QAAAG,EAAA,EAAAC,EAAA,EAAAC,EAAA,EAAAC,EAAA,EAAAC,IAAA,OAAAC,EAAA,OAAAC,EAAA,iBAAAJ,EAAA,IAAAL,EAAA,GAAAA,EAAA,CAAAhC,IAAA,CAAAa,GAAA,GAAA6B,IAAA,QAAAnC,CAAA,QAAAb,MAAA,CAAAsC,EAAA,MAAAA,EAAA,UAAAQ,EAAA,uBAAAA,EAAA,IAAAL,EAAA,GAAAE,EAAA,CAAArC,IAAA,CAAAgC,EAAA,GAAAW,IAAA,MAAAJ,IAAA,CAAAK,IAAA,CAAAT,EAAA,CAAAU,KAAA,GAAAN,IAAA,CAAA9B,MAAA,KAAAF,CAAA,GAAAiC,EAAA,sBAAAM,GAAA,IAAAL,EAAA,OAAAL,EAAA,GAAAU,GAAA,yBAAAN,EAAA,YAAAR,EAAA,CAAAe,MAAA,KAAAT,EAAA,GAAAN,EAAA,CAAAe,MAAA,IAAArD,MAAA,CAAA4C,EAAA,MAAAA,EAAA,2BAAAG,EAAA,QAAAL,EAAA,aAAAG,IAAA;AAAA,SAAAzB,gBAAAD,GAAA,QAAAc,KAAA,CAAAqB,OAAA,CAAAnC,GAAA,UAAAA,GAAA;AAAA,SAAAoC,yBAAAvC,MAAA,EAAAwC,QAAA,QAAAxC,MAAA,yBAAAJ,MAAA,GAAA6C,6BAAA,CAAAzC,MAAA,EAAAwC,QAAA,OAAArD,GAAA,EAAAU,CAAA,MAAAb,MAAA,CAAA0D,qBAAA,QAAAC,gBAAA,GAAA3D,MAAA,CAAA0D,qBAAA,CAAA1C,MAAA,QAAAH,CAAA,MAAAA,CAAA,GAAA8C,gBAAA,CAAA5C,MAAA,EAAAF,CAAA,MAAAV,GAAA,GAAAwD,gBAAA,CAAA9C,CAAA,OAAA2C,QAAA,CAAAI,OAAA,CAAAzD,GAAA,uBAAAH,MAAA,CAAAI,SAAA,CAAAyD,oBAAA,CAAAvD,IAAA,CAAAU,MAAA,EAAAb,GAAA,aAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,cAAAS,MAAA;AAAA,SAAA6C,8BAAAzC,MAAA,EAAAwC,QAAA,QAAAxC,MAAA,yBAAAJ,MAAA,WAAAkD,UAAA,GAAA9D,MAAA,CAAA+D,IAAA,CAAA/C,MAAA,OAAAb,GAAA,EAAAU,CAAA,OAAAA,CAAA,MAAAA,CAAA,GAAAiD,UAAA,CAAA/C,MAAA,EAAAF,CAAA,MAAAV,GAAA,GAAA2D,UAAA,CAAAjD,CAAA,OAAA2C,QAAA,CAAAI,OAAA,CAAAzD,GAAA,kBAAAS,MAAA,CAAAT,GAAA,IAAAa,MAAA,CAAAb,GAAA,YAAAS,MAAA;AAuBxC;AACO,IAAMoD,MAEZ,gBAAG,IAAAC,iBAAU,EACZ,UAAAC,IAAA,EAkBEC,GAAG,EACA;EAAA,IAjBDC,WAAW,GAAAF,IAAA,CAAXE,WAAW;IACXC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,KAAK,GAAAJ,IAAA,CAALI,KAAK;IACLC,KAAK,GAAAL,IAAA,CAALK,KAAK;IACLC,KAAK,GAAAN,IAAA,CAALM,KAAK;IACLC,EAAE,GAAAP,IAAA,CAAFO,EAAE;IACFzC,IAAI,GAAAkC,IAAA,CAAJlC,IAAI;IACJ0C,OAAO,GAAAR,IAAA,CAAPQ,OAAO;IACPC,QAAQ,GAAAT,IAAA,CAARS,QAAQ;IACRC,QAAQ,GAAAV,IAAA,CAARU,QAAQ;IACRC,KAAK,GAAAX,IAAA,CAALW,KAAK;IACLC,QAAQ,GAAAZ,IAAA,CAARY,QAAQ;IACRC,SAAQ,GAAAb,IAAA,CAARa,QAAQ;IACR5B,KAAK,GAAAe,IAAA,CAALf,KAAK;IACF6B,IAAI,GAAAzB,wBAAA,CAAAW,IAAA,EAAAjF,SAAA;EAIT,IAAAgG,cAAA,GAAgC,IAAAC,kBAAa,EAACF,IAAI,CAAC;IAAAG,eAAA,GAAAjE,cAAA,CAAA+D,cAAA;IAA5CG,QAAQ,GAAAD,eAAA;IAAEE,WAAW,GAAAF,eAAA;EAC5B;EACA,IAAAG,SAAA,GAA4C,IAAAC,eAAQ,EAACX,QAAQ,IAAIzB,KAAK,CAAC;IAAAqC,UAAA,GAAAtE,cAAA,CAAAoE,SAAA;IAAhEG,cAAc,GAAAD,UAAA;IAAEE,iBAAiB,GAAAF,UAAA;EACxC,IAAAG,UAAA,GAAkC,IAAAJ,eAAQ,EAAC,KAAK,CAAC;IAAAK,UAAA,GAAA1E,cAAA,CAAAyE,UAAA;IAA1CE,SAAS,GAAAD,UAAA;IAAEE,YAAY,GAAAF,UAAA;EAC9B,IAAAG,UAAA,GAAkC,IAAAR,eAAQ,EAAC,KAAK,CAAC;IAAAS,UAAA,GAAA9E,cAAA,CAAA6E,UAAA;IAA1CE,SAAS,GAAAD,UAAA;IAAEE,YAAY,GAAAF,UAAA;EAE9B,oBACExH,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACtH,IAAA,CAAAuH,GAAG,EAAA3F,QAAA;IAAC4F,KAAK,EAAC;EAAM,GAAKjB,QAAQ,GAC3B,CAAC,CAAChB,WAAW,iBACZ5F,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACpH,QAAA,CAAAuH,OAAO;IAACC,OAAO;IAACC,OAAO,EAAEpC,WAAY;IAACqC,SAAS,EAAC;EAAS,gBACxDjI,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACrH,KAAA,CAAA4H,IAAI;IAACC,OAAO,EAAC,IAAI;IAACC,KAAK,EAAC,SAAS;IAACC,SAAS,EAAC;EAAO,gBAClDrI,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,YAAG,eAAa,CAAI,CACf,CAEV,eAED3H,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACW,SAAS;IACRzC,QAAQ,EAAE,CAAC,CAACA,QAAS;IACrBG,KAAK,EAAE,CAAC,CAACA,KAAK,IAAIyB,SAAU;IAC5B3B,KAAK,EAAEA,KAAO;IACdC,KAAK,EAAE,CAAC,CAACA,KAAK,IAAIsB,SAAU;IAC5BhB,KAAK,EAAEA,KAAM;IACbkC,YAAY,EAAE,SAAAA,aAAA;MAAA,OAAMb,YAAY,CAAC,IAAI,CAAC;IAAA,CAAC;IACvCc,YAAY,EAAE,SAAAA,aAAA;MAAA,OAAMd,YAAY,CAAC,KAAK,CAAC;IAAA,CAAC;IACxCe,OAAO,EAAE,SAAAA,QAAA;MAAA,OAAMnB,YAAY,CAAC,IAAI,CAAC;IAAA,CAAC;IAClCoB,MAAM,EAAE,SAAAA,OAAA;MAAA,OAAMpB,YAAY,CAAC,KAAK,CAAC;IAAA,CAAC;IAClCqB,cAAc,EAAE,CAAC,CAAC1B;EAAe,gBAEjCjH,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,WAAA1F,QAAA;IACE0D,GAAG,EAAEA,GAAW;IAChBM,EAAE,EAAEA,EAAG;IACPJ,QAAQ,EAAEA,QAAS;IACnBrC,IAAI,EAAEA,IAAK;IACXmB,KAAK,EAAEyB,QAAQ,IAAIzB,KAAM;IACzB4B,QAAQ,EAAE,SAAAA,SAACqC,KAAK,EAAK;MACnBtC,QAAQ,IAAIA,QAAQ,CAACsC,KAAK,CAACxG,MAAM,CAACuC,KAAK,CAAC;MACxC4B,SAAQ,IAAIA,SAAQ,CAACqC,KAAK,CAAC;MAC3B1B,iBAAiB,CAAC0B,KAAK,CAACxG,MAAM,CAACuC,KAAK,CAAC;IACvC;EAAE,GACEkC,WAAW,GAEdX,OAAO,CAAC2C,GAAG,CAAC,UAAAC,KAAA,EAAqB;IAAA,IAAlBnE,KAAK,GAAAmE,KAAA,CAALnE,KAAK;MAAEoE,IAAI,GAAAD,KAAA,CAAJC,IAAI;IACzB,oBACE/I,MAAA,CAAAkB,OAAA,CAAAyG,aAAA;MAAQhD,KAAK,EAAEA,KAAM;MAAChD,GAAG,EAAEgD;IAAM,GAC9BoE,IAAI,CACE;EAEb,CAAC,CAAC,CACK,EAER,CAAC,CAAC1C,KAAK,iBACNrG,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACqB,WAAW;IAACC,OAAO,EAAEhD;EAAG,GACtBI,KAAK,eAENrG,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,cAAQ,CAEX,CACS,EAEXxB,QAAQ,IAAI,EAAEL,KAAK,IAAI,OAAOA,KAAK,KAAK,QAAQ,CAAC,iBAChD9F,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACvH,cAAA,CAAA8I,aAAa;IAACC,EAAE,EAAE,GAAI;IAACC,EAAE,EAAE;EAAE,EAC/B,EAEAtD,KAAK,IAAI,OAAOA,KAAK,KAAK,QAAQ,iBACjC9F,MAAA,CAAAkB,OAAA,CAAAyG,aAAA,CAACrH,KAAA,CAAA4H,IAAI;IAACC,OAAO,EAAC,IAAI;IAACgB,EAAE,EAAE,GAAI;IAACC,EAAE,EAAE,CAAE;IAAChB,KAAK,EAAC;EAAQ,GAC9CtC,KAAK,CAET,CACG;AAEV,CAAC,CACF;AAAAuD,OAAA,CAAA7D,MAAA,GAAAA,MAAA;AAEDA,MAAM,CAAC8D,WAAW,GAAG,QAAQ;AAE7B,IAAMC,UAAU,OAAGC,qBAAG,iNAiBrB;;AAED;AACO,IAAMC,UAAU,OAAGD,qBAAG,kPAShB,IAAAE,kBAAQ,EAAC,SAAS,CAAC,EAKxB,UAAAC,KAAA,EAAkB;EAAA,IAAf9D,QAAQ,GAAA8D,KAAA,CAAR9D,QAAQ;EACX,OAAOA,QAAQ,GACX,IAAA6D,kBAAQ,EAAC,gBAAgB,CAAC,GAC1B,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC;AACjC,CAAC,CAEN;AAAAL,OAAA,CAAAI,UAAA,GAAAA,UAAA;AAOD,IAAMnB,SAAS,GAAG,IAAAsB,yBAAM,EAAChC,QAAG,CAAC,CAAAiC,UAAA;EAAAP,WAAA;EAAAQ,WAAA;AAAA,mQAKvBP,UAAU,EAGQ,IAAAG,kBAAQ,EAAC,SAAS,CAAC,EACxB,IAAAA,kBAAQ,EAAC,YAAY,CAAC,EAGrB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAKxC,UAACK,KAAK,EAAK;EACX,WAAOP,qBAAG,iPACNQ,qBAAa,CAAC9I,OAAO,EAErB6I,KAAK,CAAC/D,KAAK,IAAIgE,qBAAa,CAAChE,KAAK,EAClC+D,KAAK,CAAChE,KAAK,IAAIiE,qBAAa,CAACjE,KAAK,EAClCgE,KAAK,CAAClE,QAAQ,IAAImE,qBAAa,CAACnE,QAAQ,EACxCkE,KAAK,CAACjE,KAAK,IAAIkE,qBAAa,CAAClE,KAAK,EAGhCkE,qBAAa,CAAChE,KAAK,EAInBgE,qBAAa,CAACjE,KAAK,EAKnBiE,qBAAa,CAACnE,QAAQ,EAItB,EAAEkE,KAAK,CAAClE,QAAQ,IAAIkE,KAAK,CAAChE,KAAK,CAAC,IAAIiE,qBAAa,CAACC,SAAS,EAC3DF,KAAK,CAACjE,KAAK,IAAIkE,qBAAa,CAAClE,KAAK,EAKlC,CAAC,CAACiE,KAAK,CAACpB,cAAc,QACxBa,qBAAG,iBACC,EAAEO,KAAK,CAAClE,QAAQ,IAAIkE,KAAK,CAAChE,KAAK,CAAC,IAAIiE,qBAAa,CAACC,SAAS,EAC3DF,KAAK,CAACjE,KAAK,IAAIkE,qBAAa,CAAClE,KAAK,CACrC,EAICiE,KAAK,CAAC1D,KAAK,QACbmD,qBAAG,yBAEF,EAKCO,KAAK,CAAC1D,KAAK,IACb,CAAC0D,KAAK,CAACpB,cAAc,QACrBa,qBAAG,yBAEF;AAGP,CAAC,EAGDC,UAAU,CACb;AAED,IAAMT,WAAW,GAAGY,yBAAM,CAACM,KAAK,CAAAL,UAAA;EAAAP,WAAA;EAAAQ,WAAA;AAAA,yYAOhBK,gCAAuB,EAGtB,IAAAT,kBAAQ,EAAC,YAAY,CAAC,EAGf,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EAQjCS,gCAAuB,CAIxC"}
|
|
@@ -22,11 +22,11 @@ var SELECT_STATES = {
|
|
|
22
22
|
}),
|
|
23
23
|
completed: (0, _styledComponents.css)(["border-color:", ";text-decoration:none;+ label{color:", ";}&:not(:has(option[value=\"\"]:checked)) + label{transform:translateY(-150%);font-size:", ";& > span{height:2px;top:50%;}}", ""], (0, _themeGet.themeGet)("colors.black60"), (0, _themeGet.themeGet)("colors.black60"), (0, _themeGet.themeGet)("textVariants.xs.fontSize"), function (_ref4) {
|
|
24
24
|
var optionSelected = _ref4.optionSelected;
|
|
25
|
-
return optionSelected && (0, _styledComponents.css)(["+ label{transform:translateY(-150%);font-size:", ";& > span{height:2px;top:50%;}"], (0, _themeGet.themeGet)("textVariants.xs.fontSize"));
|
|
25
|
+
return optionSelected && (0, _styledComponents.css)(["+ label{transform:translateY(-150%);font-size:", ";& > span{height:2px;top:50%;}}"], (0, _themeGet.themeGet)("textVariants.xs.fontSize"));
|
|
26
26
|
}),
|
|
27
27
|
disabled: (0, _styledComponents.css)(["color:", ";border-color:", ";text-decoration:none;+ label{color:", ";text-decoration:none;}&:not(:has(option[value=\"\"]:checked)) + label{transform:translateY(-150%);font-size:", ";& > span{height:2px;top:50%;}}", ""], (0, _themeGet.themeGet)("colors.black30"), (0, _themeGet.themeGet)("colors.black30"), (0, _themeGet.themeGet)("colors.black30"), (0, _themeGet.themeGet)("textVariants.xs.fontSize"), function (_ref5) {
|
|
28
28
|
var optionSelected = _ref5.optionSelected;
|
|
29
|
-
return optionSelected && (0, _styledComponents.css)(["+ label{transform:translateY(-150%);font-size:", ";& > span{height:2px;top:50%;}"], (0, _themeGet.themeGet)("textVariants.xs.fontSize"));
|
|
29
|
+
return optionSelected && (0, _styledComponents.css)(["+ label{transform:translateY(-150%);font-size:", ";& > span{height:2px;top:50%;}}"], (0, _themeGet.themeGet)("textVariants.xs.fontSize"));
|
|
30
30
|
}),
|
|
31
31
|
error: (0, _styledComponents.css)(["color:", ";border-color:", ";+ label{color:", ";}"], (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("colors.red100"), (0, _themeGet.themeGet)("colors.red100"))
|
|
32
32
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tokens.js","names":["_themeGet","require","_styledComponents","SELECT_STATES","default","css","themeGet","_ref","optionSelected","focus","_ref2","hover","_ref3","disabled","completed","_ref4","_ref5","error","exports"],"sources":["../../../src/elements/Select/tokens.ts"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport { css } from \"styled-components\"\nimport { State } from \"./types\"\n\nexport const SELECT_STATES: Record<State, any> = {\n default: css`\n height: 50px;\n font-size: ${themeGet(\"textVariants.sm-display.fontSize\")};\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.black30\")};\n\n + label {\n color: ${themeGet(\"colors.black60\")};\n font-size: ${themeGet(\"textVariants.sm-display.fontSize\")};\n }\n\n &:not(:has(option[value=\"\"]:checked)) + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n\n // Firefox polyfill for :has\n ${({ optionSelected }) =>\n optionSelected &&\n css`\n + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n `}\n `,\n focus: css`\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.blue100\")};\n text-decoration: underline;\n\n + label {\n color: ${themeGet(\"colors.blue100\")};\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n\n &:has(option[value=\"\"]:checked) + label {\n text-decoration: underline;\n }\n\n // Firefox polyfill for :has\n ${({ optionSelected }) =>\n !optionSelected &&\n css`\n + label {\n text-decoration: underline;\n }\n `}\n `,\n hover: css`\n color: ${themeGet(\"colors.blue100\")};\n border-color: ${themeGet(\"colors.black60\")};\n text-decoration: underline;\n\n + label {\n color: ${themeGet(\"colors.black60\")};\n }\n\n &:has(option[value=\"\"]:checked):not(:disabled) + label {\n color: ${themeGet(\"colors.blue100\")};\n text-decoration: underline;\n }\n\n // Firefox polyfill for :has\n ${({ optionSelected, disabled }) =>\n !optionSelected &&\n !disabled &&\n css`\n + label {\n color: ${themeGet(\"colors.blue100\")};\n text-decoration: underline;\n }\n `}\n `,\n completed: css`\n border-color: ${themeGet(\"colors.black60\")};\n text-decoration: none;\n\n + label {\n color: ${themeGet(\"colors.black60\")};\n }\n\n &:not(:has(option[value=\"\"]:checked)) + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n\n // Firefox polyfill for :has\n ${({ optionSelected }) =>\n optionSelected &&\n css`\n + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n
|
|
1
|
+
{"version":3,"file":"tokens.js","names":["_themeGet","require","_styledComponents","SELECT_STATES","default","css","themeGet","_ref","optionSelected","focus","_ref2","hover","_ref3","disabled","completed","_ref4","_ref5","error","exports"],"sources":["../../../src/elements/Select/tokens.ts"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport { css } from \"styled-components\"\nimport { State } from \"./types\"\n\nexport const SELECT_STATES: Record<State, any> = {\n default: css`\n height: 50px;\n font-size: ${themeGet(\"textVariants.sm-display.fontSize\")};\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.black30\")};\n\n + label {\n color: ${themeGet(\"colors.black60\")};\n font-size: ${themeGet(\"textVariants.sm-display.fontSize\")};\n }\n\n &:not(:has(option[value=\"\"]:checked)) + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n\n // Firefox polyfill for :has\n ${({ optionSelected }) =>\n optionSelected &&\n css`\n + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n `}\n `,\n focus: css`\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.blue100\")};\n text-decoration: underline;\n\n + label {\n color: ${themeGet(\"colors.blue100\")};\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n\n &:has(option[value=\"\"]:checked) + label {\n text-decoration: underline;\n }\n\n // Firefox polyfill for :has\n ${({ optionSelected }) =>\n !optionSelected &&\n css`\n + label {\n text-decoration: underline;\n }\n `}\n `,\n hover: css`\n color: ${themeGet(\"colors.blue100\")};\n border-color: ${themeGet(\"colors.black60\")};\n text-decoration: underline;\n\n + label {\n color: ${themeGet(\"colors.black60\")};\n }\n\n &:has(option[value=\"\"]:checked):not(:disabled) + label {\n color: ${themeGet(\"colors.blue100\")};\n text-decoration: underline;\n }\n\n // Firefox polyfill for :has\n ${({ optionSelected, disabled }) =>\n !optionSelected &&\n !disabled &&\n css`\n + label {\n color: ${themeGet(\"colors.blue100\")};\n text-decoration: underline;\n }\n `}\n `,\n completed: css`\n border-color: ${themeGet(\"colors.black60\")};\n text-decoration: none;\n\n + label {\n color: ${themeGet(\"colors.black60\")};\n }\n\n &:not(:has(option[value=\"\"]:checked)) + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n\n // Firefox polyfill for :has\n ${({ optionSelected }) =>\n optionSelected &&\n css`\n + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n `}\n `,\n disabled: css`\n color: ${themeGet(\"colors.black30\")};\n border-color: ${themeGet(\"colors.black30\")};\n text-decoration: none;\n\n + label {\n color: ${themeGet(\"colors.black30\")};\n text-decoration: none;\n }\n\n &:not(:has(option[value=\"\"]:checked)) + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n\n // Firefox polyfill for :has\n ${({ optionSelected }) =>\n optionSelected &&\n css`\n + label {\n transform: translateY(-150%);\n font-size: ${themeGet(\"textVariants.xs.fontSize\")};\n\n & > span {\n height: 2px;\n top: 50%;\n }\n }\n `}\n `,\n error: css`\n color: ${themeGet(\"colors.black100\")};\n border-color: ${themeGet(\"colors.red100\")};\n\n + label {\n color: ${themeGet(\"colors.red100\")};\n }\n `,\n}\n"],"mappings":";;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AAGO,IAAME,aAAiC,GAAG;EAC/CC,OAAO,MAAEC,qBAAG,gOAEG,IAAAC,kBAAQ,EAAC,kCAAkC,CAAC,EAChD,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EACpB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAG/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EACtB,IAAAA,kBAAQ,EAAC,kCAAkC,CAAC,EAK5C,IAAAA,kBAAQ,EAAC,0BAA0B,CAAC,EASjD,UAAAC,IAAA;IAAA,IAAGC,cAAc,GAAAD,IAAA,CAAdC,cAAc;IAAA,OACjBA,cAAc,QACdH,qBAAG,yFAGc,IAAAC,kBAAQ,EAAC,0BAA0B,CAAC,CAOpD;EAAA,EACJ;EACDG,KAAK,MAAEJ,qBAAG,oOACC,IAAAC,kBAAQ,EAAC,iBAAiB,CAAC,EACpB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAI/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAEtB,IAAAA,kBAAQ,EAAC,0BAA0B,CAAC,EAajD,UAAAI,KAAA;IAAA,IAAGF,cAAc,GAAAE,KAAA,CAAdF,cAAc;IAAA,OACjB,CAACA,cAAc,QACfH,qBAAG,0CAIF;EAAA,EACJ;EACDM,KAAK,MAAEN,qBAAG,sLACC,IAAAC,kBAAQ,EAAC,gBAAgB,CAAC,EACnB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAI/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAI1B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAKnC,UAAAM,KAAA;IAAA,IAAGJ,cAAc,GAAAI,KAAA,CAAdJ,cAAc;MAAEK,QAAQ,GAAAD,KAAA,CAARC,QAAQ;IAAA,OAC3B,CAACL,cAAc,IACf,CAACK,QAAQ,QACTR,qBAAG,sDAEU,IAAAC,kBAAQ,EAAC,gBAAgB,CAAC,CAGtC;EAAA,EACJ;EACDQ,SAAS,MAAET,qBAAG,gMACI,IAAAC,kBAAQ,EAAC,gBAAgB,CAAC,EAI/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAKtB,IAAAA,kBAAQ,EAAC,0BAA0B,CAAC,EASjD,UAAAS,KAAA;IAAA,IAAGP,cAAc,GAAAO,KAAA,CAAdP,cAAc;IAAA,OACjBA,cAAc,QACdH,qBAAG,yFAGc,IAAAC,kBAAQ,EAAC,0BAA0B,CAAC,CAOpD;EAAA,EACJ;EACDO,QAAQ,MAAER,qBAAG,gOACF,IAAAC,kBAAQ,EAAC,gBAAgB,CAAC,EACnB,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAI/B,IAAAA,kBAAQ,EAAC,gBAAgB,CAAC,EAMtB,IAAAA,kBAAQ,EAAC,0BAA0B,CAAC,EASjD,UAAAU,KAAA;IAAA,IAAGR,cAAc,GAAAQ,KAAA,CAAdR,cAAc;IAAA,OACjBA,cAAc,QACdH,qBAAG,yFAGc,IAAAC,kBAAQ,EAAC,0BAA0B,CAAC,CAOpD;EAAA,EACJ;EACDW,KAAK,MAAEZ,qBAAG,yDACC,IAAAC,kBAAQ,EAAC,iBAAiB,CAAC,EACpB,IAAAA,kBAAQ,EAAC,eAAe,CAAC,EAG9B,IAAAA,kBAAQ,EAAC,eAAe,CAAC;AAGxC,CAAC;AAAAY,OAAA,CAAAf,aAAA,GAAAA,aAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@artsy/palette",
|
|
3
|
-
"version": "37.0.0-canary.1250.
|
|
3
|
+
"version": "37.0.0-canary.1250.29301.0",
|
|
4
4
|
"description": "Design system library for react components",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"publishConfig": {
|
|
@@ -182,5 +182,5 @@
|
|
|
182
182
|
"url": "http://localhost"
|
|
183
183
|
}
|
|
184
184
|
},
|
|
185
|
-
"gitHead": "
|
|
185
|
+
"gitHead": "455d5a57f7b9d36d25dfbb974cc6b5e6c181d108"
|
|
186
186
|
}
|