@traefik-labs/faency 12.2.1 → 12.2.2

package/dist/components/Select/Select.cjs

@@ -1,239 +1,194 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const reactIcons = require("@radix-ui/react-icons");
-const React = require("react");
-const stitches_config = require("../../stitches.config.cjs");
-const Elevation = require("../Elevation/Elevation.cjs");
-const FOCUS_SHADOW = Elevation.elevationVariants[1].boxShadow;
-const CARET_WIDTH = "15px";
-const StyledCaretSortIcon = stitches_config.styled(reactIcons.CaretSortIcon, {
-  position: "absolute",
-  pointerEvents: "none",
-  display: "inline",
-  variants: {
-    // Use margins instead of top/left to avoid setting "position: relative" on parent,
-    // which would make stacking context tricky with Select used in a control group.
-    size: {
-      small: {
-        marginTop: 5,
-        marginLeft: -16
-      },
-      medium: {
-        marginTop: 9,
-        marginLeft: -16
-      },
-      large: {
-        marginTop: 13,
-        marginLeft: -16
-      }
-    },
-    cursor: {
-      default: {
-        cursor: "default",
-        "&:focus": {
-          cursor: "text"
-        }
-      },
-      text: {
-        cursor: "text"
-      }
-    }
-  },
-  defaultVariants: {
-    size: "medium"
-  }
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+const require_stitches_config = require("../../stitches.config.cjs");
+const require_Elevation = require("../Elevation/Elevation.cjs");
+let _radix_ui_react_icons = require("@radix-ui/react-icons");
+let react = require("react");
+react = require_runtime.__toESM(react, 1);
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region components/Select/Select.tsx
+var FOCUS_SHADOW = require_Elevation.elevationVariants[1].boxShadow;
+var CARET_WIDTH = "15px";
+var StyledCaretSortIcon = require_stitches_config.styled(_radix_ui_react_icons.CaretSortIcon, {
+	position: "absolute",
+	pointerEvents: "none",
+	display: "inline",
+	variants: {
+		size: {
+			small: {
+				marginTop: 5,
+				marginLeft: -16
+			},
+			medium: {
+				marginTop: 9,
+				marginLeft: -16
+			},
+			large: {
+				marginTop: 13,
+				marginLeft: -16
+			}
+		},
+		cursor: {
+			default: {
+				cursor: "default",
+				"&:focus": { cursor: "text" }
+			},
+			text: { cursor: "text" }
+		}
+	},
+	defaultVariants: { size: "medium" }
 });
-const StyledSelect = stitches_config.styled("select", {
-  appearance: "none",
-  backgroundColor: "transparent",
-  border: "none",
-  borderRadius: "inherit",
-  color: "inherit",
-  font: "inherit",
-  outline: "none",
-  width: "100%",
-  height: "100%",
-  pl: "$1",
-  pr: "$3",
-  lineHeight: "25px",
-  overflow: "hidden",
-  textOverflow: "ellipsis",
-  whiteSpace: "nowrap",
-  "& option": {
-    color: "black",
-    bc: "white"
-  },
-  "&:focus-visible": {
-    boxShadow: `inset 0 0 0 2px $colors$selectFocusBorder, ${FOCUS_SHADOW}`
-  },
-  "&:disabled": {
-    pointerEvents: "none",
-    color: "$selectDisabledText"
-  }
+var StyledSelect = require_stitches_config.styled("select", {
+	appearance: "none",
+	backgroundColor: "transparent",
+	border: "none",
+	borderRadius: "inherit",
+	color: "inherit",
+	font: "inherit",
+	outline: "none",
+	width: "100%",
+	height: "100%",
+	pl: "$1",
+	pr: "$3",
+	lineHeight: "25px",
+	overflow: "hidden",
+	textOverflow: "ellipsis",
+	whiteSpace: "nowrap",
+	"& option": {
+		color: "black",
+		bc: "white"
+	},
+	"&:focus-visible": { boxShadow: `inset 0 0 0 2px $colors$selectFocusBorder, ${FOCUS_SHADOW}` },
+	"&:disabled": {
+		pointerEvents: "none",
+		color: "$selectDisabledText"
+	}
 });
-const SelectWrapper = stitches_config.styled("div", {
-  position: "relative",
-  backgroundColor: "$selectBg",
-  borderRadius: "$2",
-  boxShadow: "inset 0 0 0 1px $colors$selectBorder",
-  color: "$selectText",
-  fontFamily: "$rubik",
-  fontSize: "$1",
-  fontVariantNumeric: "tabular-nums",
-  fontWeight: "$regular",
-  height: "$5",
-  flexShrink: 0,
-  "&::before": {
-    boxSizing: "border-box",
-    content: '""',
-    position: "absolute",
-    inset: 0,
-    pointerEvents: "none",
-    borderRadius: "inherit"
-  },
-  "&::after": {
-    boxSizing: "border-box",
-    content: '""',
-    position: "absolute",
-    inset: 0,
-    pointerEvents: "none",
-    borderRadius: "inherit"
-  },
-  "&:focus-visible": {
-    "&::before": {
-      backgroundColor: "$selectFocusBg"
-    },
-    "&::after": {
-      backgroundColor: "$primary",
-      opacity: 0.15
-    }
-  },
-  "@hover": {
-    "&:hover": {
-      "&::before": {
-        backgroundColor: "$selectHoverBg"
-      },
-      "&::after": {
-        backgroundColor: "$primary",
-        opacity: 0.05
-      }
-    }
-  },
-  variants: {
-    disabled: {
-      true: {
-        opacity: 0.7,
-        color: "$selectDisabledText",
-        "@hover": {
-          "&:hover": {
-            "&::before": {
-              display: "none"
-            },
-            "&::after": {
-              display: "none"
-            }
-          }
-        }
-      }
-    },
-    size: {
-      small: {
-        borderRadius: "$2",
-        height: "$5",
-        fontSize: "$1",
-        lineHeight: "$sizes$5",
-        "&:-webkit-autofill::first-line": {
-          fontSize: "$1"
-        },
-        [`& ${StyledSelect}`]: {
-          pl: "$2",
-          pr: `calc($2 + ${CARET_WIDTH})`
-        },
-        [`& ${StyledCaretSortIcon}`]: {
-          right: "calc($2 / 2)"
-        }
-      },
-      medium: {
-        borderRadius: "$3",
-        height: "$6",
-        fontSize: "$3",
-        lineHeight: "$sizes$6",
-        "&:-webkit-autofill::first-line": {
-          fontSize: "$3"
-        },
-        [`& ${StyledSelect}`]: {
-          pl: "$3",
-          pr: `calc($3 + ${CARET_WIDTH})`
-        },
-        [`& ${StyledCaretSortIcon}`]: {
-          right: "calc($3 / 2)"
-        }
-      },
-      large: {
-        borderRadius: "$3",
-        height: "$7",
-        fontSize: "$3",
-        lineHeight: "$sizes$7",
-        "&:-webkit-autofill::first-line": {
-          fontSize: "$3"
-        },
-        [`& ${StyledSelect}`]: {
-          pl: "$3",
-          pr: `calc($3 + ${CARET_WIDTH})`
-        },
-        [`& ${StyledCaretSortIcon}`]: {
-          right: "calc($3 / 2)"
-        }
-      }
-    },
-    variant: {
-      ghost: {
-        boxShadow: "none",
-        backgroundColor: "transparent",
-        "@hover": {
-          "&:hover": {
-            boxShadow: "inset 0 0 0 1px $colors$slateA7",
-            backgroundColor: "$selectHoverBg"
-          }
-        },
-        "&:focus-within": {
-          backgroundColor: "$loContrast",
-          boxShadow: "inset 0px 0px 0px 1px $colors$selectFocusBorder, 0px 0px 0px 1px $colors$selectFocusBorder"
-        }
-      }
-    },
-    state: {
-      invalid: {
-        boxShadow: "inset 0 0 0 1px $colors$selectInvalidBorder",
-        "&:focus-visible": {
-          boxShadow: `inset 0 0 0 2px $colors$selectInvalidBorder, ${FOCUS_SHADOW}`
-        }
-      }
-    }
-  },
-  defaultVariants: {
-    size: "medium"
-  }
+var SelectWrapper = require_stitches_config.styled("div", {
+	position: "relative",
+	backgroundColor: "$selectBg",
+	borderRadius: "$2",
+	boxShadow: "inset 0 0 0 1px $colors$selectBorder",
+	color: "$selectText",
+	fontFamily: "$rubik",
+	fontSize: "$1",
+	fontVariantNumeric: "tabular-nums",
+	fontWeight: "$regular",
+	height: "$5",
+	flexShrink: 0,
+	"&::before": {
+		boxSizing: "border-box",
+		content: "\"\"",
+		position: "absolute",
+		inset: 0,
+		pointerEvents: "none",
+		borderRadius: "inherit"
+	},
+	"&::after": {
+		boxSizing: "border-box",
+		content: "\"\"",
+		position: "absolute",
+		inset: 0,
+		pointerEvents: "none",
+		borderRadius: "inherit"
+	},
+	"&:focus-visible": {
+		"&::before": { backgroundColor: "$selectFocusBg" },
+		"&::after": {
+			backgroundColor: "$primary",
+			opacity: .15
+		}
+	},
+	"@hover": { "&:hover": {
+		"&::before": { backgroundColor: "$selectHoverBg" },
+		"&::after": {
+			backgroundColor: "$primary",
+			opacity: .05
+		}
+	} },
+	variants: {
+		disabled: { true: {
+			opacity: .7,
+			color: "$selectDisabledText",
+			"@hover": { "&:hover": {
+				"&::before": { display: "none" },
+				"&::after": { display: "none" }
+			} }
+		} },
+		size: {
+			small: {
+				borderRadius: "$2",
+				height: "$5",
+				fontSize: "$1",
+				lineHeight: "$sizes$5",
+				"&:-webkit-autofill::first-line": { fontSize: "$1" },
+				[`& ${StyledSelect}`]: {
+					pl: "$2",
+					pr: `calc($2 + ${CARET_WIDTH})`
+				},
+				[`& ${StyledCaretSortIcon}`]: { right: "calc($2 / 2)" }
+			},
+			medium: {
+				borderRadius: "$3",
+				height: "$6",
+				fontSize: "$3",
+				lineHeight: "$sizes$6",
+				"&:-webkit-autofill::first-line": { fontSize: "$3" },
+				[`& ${StyledSelect}`]: {
+					pl: "$3",
+					pr: `calc($3 + ${CARET_WIDTH})`
+				},
+				[`& ${StyledCaretSortIcon}`]: { right: "calc($3 / 2)" }
+			},
+			large: {
+				borderRadius: "$3",
+				height: "$7",
+				fontSize: "$3",
+				lineHeight: "$sizes$7",
+				"&:-webkit-autofill::first-line": { fontSize: "$3" },
+				[`& ${StyledSelect}`]: {
+					pl: "$3",
+					pr: `calc($3 + ${CARET_WIDTH})`
+				},
+				[`& ${StyledCaretSortIcon}`]: { right: "calc($3 / 2)" }
+			}
+		},
+		variant: { ghost: {
+			boxShadow: "none",
+			backgroundColor: "transparent",
+			"@hover": { "&:hover": {
+				boxShadow: "inset 0 0 0 1px $colors$slateA7",
+				backgroundColor: "$selectHoverBg"
+			} },
+			"&:focus-within": {
+				backgroundColor: "$loContrast",
+				boxShadow: "inset 0px 0px 0px 1px $colors$selectFocusBorder, 0px 0px 0px 1px $colors$selectFocusBorder"
+			}
+		} },
+		state: { invalid: {
+			boxShadow: "inset 0 0 0 1px $colors$selectInvalidBorder",
+			"&:focus-visible": { boxShadow: `inset 0 0 0 2px $colors$selectInvalidBorder, ${FOCUS_SHADOW}` }
+		} }
+	},
+	defaultVariants: { size: "medium" }
+});
+var Select = react.default.forwardRef(({ css, size, state, variant, cursor, ...props }, forwardedRef) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(SelectWrapper, {
+		css,
+		size,
+		state,
+		variant,
+		disabled: props.disabled,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledSelect, {
+			ref: forwardedRef,
+			...props
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledCaretSortIcon, {
+			size,
+			cursor
+		})]
+	});
 });
-const Select = React.forwardRef(
-  ({ css, size, state, variant, cursor, ...props }, forwardedRef) => {
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      SelectWrapper,
-      {
-        css,
-        size,
-        state,
-        variant,
-        disabled: props.disabled,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(StyledSelect, { ref: forwardedRef, ...props }),
-          /* @__PURE__ */ jsxRuntime.jsx(StyledCaretSortIcon, { size, cursor })
-        ]
-      }
-    );
-  }
-);
 Select.toString = () => `.${SelectWrapper.className}`;
+//#endregion
 exports.Select = Select;
-//# sourceMappingURL=Select.cjs.map
+
+//# sourceMappingURL=Select.cjs.map

package/dist/components/Select/Select.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Select.cjs","sources":["../../../components/Select/Select.tsx"],"sourcesContent":["import { CaretSortIcon } from '@radix-ui/react-icons';\nimport React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\nconst CARET_WIDTH = '15px';\n\nconst StyledCaretSortIcon = styled(CaretSortIcon, {\n  position: 'absolute',\n  pointerEvents: 'none',\n  display: 'inline',\n\n  variants: {\n    // Use margins instead of top/left to avoid setting \"position: relative\" on parent,\n    // which would make stacking context tricky with Select used in a control group.\n    size: {\n      small: {\n        marginTop: 5,\n        marginLeft: -16,\n      },\n      medium: {\n        marginTop: 9,\n        marginLeft: -16,\n      },\n      large: {\n        marginTop: 13,\n        marginLeft: -16,\n      },\n    },\n    cursor: {\n      default: {\n        cursor: 'default',\n        '&:focus': {\n          cursor: 'text',\n        },\n      },\n      text: {\n        cursor: 'text',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\nconst StyledSelect = styled('select', {\n  appearance: 'none',\n  backgroundColor: 'transparent',\n  border: 'none',\n  borderRadius: 'inherit',\n  color: 'inherit',\n  font: 'inherit',\n  outline: 'none',\n  width: '100%',\n  height: '100%',\n  pl: '$1',\n  pr: '$3',\n  lineHeight: '25px',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n\n  '& option': {\n    color: 'black',\n    bc: 'white',\n  },\n\n  '&:focus-visible': {\n    boxShadow: `inset 0 0 0 2px $colors$selectFocusBorder, ${FOCUS_SHADOW}`,\n  },\n\n  '&:disabled': {\n    pointerEvents: 'none',\n    color: '$selectDisabledText',\n  },\n});\n\nconst SelectWrapper = styled('div', {\n  position: 'relative',\n  backgroundColor: '$selectBg',\n  borderRadius: '$2',\n  boxShadow: 'inset 0 0 0 1px $colors$selectBorder',\n  color: '$selectText',\n  fontFamily: '$rubik',\n  fontSize: '$1',\n  fontVariantNumeric: 'tabular-nums',\n  fontWeight: '$regular',\n  height: '$5',\n  flexShrink: 0,\n\n  '&::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n    borderRadius: 'inherit',\n  },\n  '&::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n    borderRadius: 'inherit',\n  },\n\n  '&:focus-visible': {\n    '&::before': {\n      backgroundColor: '$selectFocusBg',\n    },\n    '&::after': {\n      backgroundColor: '$primary',\n      opacity: 0.15,\n    },\n  },\n\n  '@hover': {\n    '&:hover': {\n      '&::before': {\n        backgroundColor: '$selectHoverBg',\n      },\n      '&::after': {\n        backgroundColor: '$primary',\n        opacity: 0.05,\n      },\n    },\n  },\n\n  variants: {\n    disabled: {\n      true: {\n        opacity: 0.7,\n        color: '$selectDisabledText',\n        '@hover': {\n          '&:hover': {\n            '&::before': {\n              display: 'none',\n            },\n            '&::after': {\n              display: 'none',\n            },\n          },\n        },\n      },\n    },\n    size: {\n      small: {\n        borderRadius: '$2',\n        height: '$5',\n        fontSize: '$1',\n        lineHeight: '$sizes$5',\n        '&:-webkit-autofill::first-line': {\n          fontSize: '$1',\n        },\n        [`& ${StyledSelect}`]: {\n          pl: '$2',\n          pr: `calc($2 + ${CARET_WIDTH})`,\n        },\n        [`& ${StyledCaretSortIcon}`]: {\n          right: 'calc($2 / 2)',\n        },\n      },\n      medium: {\n        borderRadius: '$3',\n        height: '$6',\n        fontSize: '$3',\n        lineHeight: '$sizes$6',\n        '&:-webkit-autofill::first-line': {\n          fontSize: '$3',\n        },\n        [`& ${StyledSelect}`]: {\n          pl: '$3',\n          pr: `calc($3 + ${CARET_WIDTH})`,\n        },\n        [`& ${StyledCaretSortIcon}`]: {\n          right: 'calc($3 / 2)',\n        },\n      },\n      large: {\n        borderRadius: '$3',\n        height: '$7',\n        fontSize: '$3',\n        lineHeight: '$sizes$7',\n        '&:-webkit-autofill::first-line': {\n          fontSize: '$3',\n        },\n        [`& ${StyledSelect}`]: {\n          pl: '$3',\n          pr: `calc($3 + ${CARET_WIDTH})`,\n        },\n        [`& ${StyledCaretSortIcon}`]: {\n          right: 'calc($3 / 2)',\n        },\n      },\n    },\n    variant: {\n      ghost: {\n        boxShadow: 'none',\n        backgroundColor: 'transparent',\n        '@hover': {\n          '&:hover': {\n            boxShadow: 'inset 0 0 0 1px $colors$slateA7',\n            backgroundColor: '$selectHoverBg',\n          },\n        },\n        '&:focus-within': {\n          backgroundColor: '$loContrast',\n          boxShadow:\n            'inset 0px 0px 0px 1px $colors$selectFocusBorder, 0px 0px 0px 1px $colors$selectFocusBorder',\n        },\n      },\n    },\n    state: {\n      invalid: {\n        boxShadow: 'inset 0 0 0 1px $colors$selectInvalidBorder',\n        '&:focus-visible': {\n          boxShadow: `inset 0 0 0 2px $colors$selectInvalidBorder, ${FOCUS_SHADOW}`,\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\nexport type SelectVariants = VariantProps<typeof StyledSelect> &\n  VariantProps<typeof SelectWrapper> &\n  VariantProps<typeof StyledCaretSortIcon>;\n\nexport type SelectProps = Omit<React.ComponentProps<typeof StyledSelect>, 'size'> &\n  SelectVariants & { css?: CSS };\n\nexport const Select = React.forwardRef<React.ElementRef<typeof StyledSelect>, SelectProps>(\n  ({ css, size, state, variant, cursor, ...props }, forwardedRef) => {\n    return (\n      <SelectWrapper\n        css={css}\n        size={size}\n        state={state}\n        variant={variant}\n        disabled={props.disabled}\n      >\n        <StyledSelect ref={forwardedRef} {...props} />\n        <StyledCaretSortIcon size={size} cursor={cursor} />\n      </SelectWrapper>\n    );\n  }\n);\n\nSelect.toString = () => `.${SelectWrapper.className}`;\n"],"names":["elevationVariants","styled","CaretSortIcon","jsxs","jsx"],"mappings":"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"}
+{"version":3,"file":"Select.cjs","names":[],"sources":["../../../components/Select/Select.tsx"],"sourcesContent":["import { CaretSortIcon } from '@radix-ui/react-icons';\nimport React from 'react';\n\nimport { CSS, styled, VariantProps } from '../../stitches.config';\nimport { elevationVariants } from '../Elevation';\n\n// CONSTANTS\nconst FOCUS_SHADOW = elevationVariants[1].boxShadow; // apply elevation $1 when focus\nconst CARET_WIDTH = '15px';\n\nconst StyledCaretSortIcon = styled(CaretSortIcon, {\n  position: 'absolute',\n  pointerEvents: 'none',\n  display: 'inline',\n\n  variants: {\n    // Use margins instead of top/left to avoid setting \"position: relative\" on parent,\n    // which would make stacking context tricky with Select used in a control group.\n    size: {\n      small: {\n        marginTop: 5,\n        marginLeft: -16,\n      },\n      medium: {\n        marginTop: 9,\n        marginLeft: -16,\n      },\n      large: {\n        marginTop: 13,\n        marginLeft: -16,\n      },\n    },\n    cursor: {\n      default: {\n        cursor: 'default',\n        '&:focus': {\n          cursor: 'text',\n        },\n      },\n      text: {\n        cursor: 'text',\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\nconst StyledSelect = styled('select', {\n  appearance: 'none',\n  backgroundColor: 'transparent',\n  border: 'none',\n  borderRadius: 'inherit',\n  color: 'inherit',\n  font: 'inherit',\n  outline: 'none',\n  width: '100%',\n  height: '100%',\n  pl: '$1',\n  pr: '$3',\n  lineHeight: '25px',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n\n  '& option': {\n    color: 'black',\n    bc: 'white',\n  },\n\n  '&:focus-visible': {\n    boxShadow: `inset 0 0 0 2px $colors$selectFocusBorder, ${FOCUS_SHADOW}`,\n  },\n\n  '&:disabled': {\n    pointerEvents: 'none',\n    color: '$selectDisabledText',\n  },\n});\n\nconst SelectWrapper = styled('div', {\n  position: 'relative',\n  backgroundColor: '$selectBg',\n  borderRadius: '$2',\n  boxShadow: 'inset 0 0 0 1px $colors$selectBorder',\n  color: '$selectText',\n  fontFamily: '$rubik',\n  fontSize: '$1',\n  fontVariantNumeric: 'tabular-nums',\n  fontWeight: '$regular',\n  height: '$5',\n  flexShrink: 0,\n\n  '&::before': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n    borderRadius: 'inherit',\n  },\n  '&::after': {\n    boxSizing: 'border-box',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    pointerEvents: 'none',\n    borderRadius: 'inherit',\n  },\n\n  '&:focus-visible': {\n    '&::before': {\n      backgroundColor: '$selectFocusBg',\n    },\n    '&::after': {\n      backgroundColor: '$primary',\n      opacity: 0.15,\n    },\n  },\n\n  '@hover': {\n    '&:hover': {\n      '&::before': {\n        backgroundColor: '$selectHoverBg',\n      },\n      '&::after': {\n        backgroundColor: '$primary',\n        opacity: 0.05,\n      },\n    },\n  },\n\n  variants: {\n    disabled: {\n      true: {\n        opacity: 0.7,\n        color: '$selectDisabledText',\n        '@hover': {\n          '&:hover': {\n            '&::before': {\n              display: 'none',\n            },\n            '&::after': {\n              display: 'none',\n            },\n          },\n        },\n      },\n    },\n    size: {\n      small: {\n        borderRadius: '$2',\n        height: '$5',\n        fontSize: '$1',\n        lineHeight: '$sizes$5',\n        '&:-webkit-autofill::first-line': {\n          fontSize: '$1',\n        },\n        [`& ${StyledSelect}`]: {\n          pl: '$2',\n          pr: `calc($2 + ${CARET_WIDTH})`,\n        },\n        [`& ${StyledCaretSortIcon}`]: {\n          right: 'calc($2 / 2)',\n        },\n      },\n      medium: {\n        borderRadius: '$3',\n        height: '$6',\n        fontSize: '$3',\n        lineHeight: '$sizes$6',\n        '&:-webkit-autofill::first-line': {\n          fontSize: '$3',\n        },\n        [`& ${StyledSelect}`]: {\n          pl: '$3',\n          pr: `calc($3 + ${CARET_WIDTH})`,\n        },\n        [`& ${StyledCaretSortIcon}`]: {\n          right: 'calc($3 / 2)',\n        },\n      },\n      large: {\n        borderRadius: '$3',\n        height: '$7',\n        fontSize: '$3',\n        lineHeight: '$sizes$7',\n        '&:-webkit-autofill::first-line': {\n          fontSize: '$3',\n        },\n        [`& ${StyledSelect}`]: {\n          pl: '$3',\n          pr: `calc($3 + ${CARET_WIDTH})`,\n        },\n        [`& ${StyledCaretSortIcon}`]: {\n          right: 'calc($3 / 2)',\n        },\n      },\n    },\n    variant: {\n      ghost: {\n        boxShadow: 'none',\n        backgroundColor: 'transparent',\n        '@hover': {\n          '&:hover': {\n            boxShadow: 'inset 0 0 0 1px $colors$slateA7',\n            backgroundColor: '$selectHoverBg',\n          },\n        },\n        '&:focus-within': {\n          backgroundColor: '$loContrast',\n          boxShadow:\n            'inset 0px 0px 0px 1px $colors$selectFocusBorder, 0px 0px 0px 1px $colors$selectFocusBorder',\n        },\n      },\n    },\n    state: {\n      invalid: {\n        boxShadow: 'inset 0 0 0 1px $colors$selectInvalidBorder',\n        '&:focus-visible': {\n          boxShadow: `inset 0 0 0 2px $colors$selectInvalidBorder, ${FOCUS_SHADOW}`,\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'medium',\n  },\n});\n\nexport type SelectVariants = VariantProps<typeof StyledSelect> &\n  VariantProps<typeof SelectWrapper> &\n  VariantProps<typeof StyledCaretSortIcon>;\n\nexport type SelectProps = Omit<React.ComponentProps<typeof StyledSelect>, 'size'> &\n  SelectVariants & { css?: CSS };\n\nexport const Select = React.forwardRef<React.ElementRef<typeof StyledSelect>, SelectProps>(\n  ({ css, size, state, variant, cursor, ...props }, forwardedRef) => {\n    return (\n      <SelectWrapper\n        css={css}\n        size={size}\n        state={state}\n        variant={variant}\n        disabled={props.disabled}\n      >\n        <StyledSelect ref={forwardedRef} {...props} />\n        <StyledCaretSortIcon size={size} cursor={cursor} />\n      </SelectWrapper>\n    );\n  }\n);\n\nSelect.toString = () => `.${SelectWrapper.className}`;\n"],"mappings":"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"}