@codecademy/gamut
68.2.268.2.3-alpha.93a7da.0
dist/DatePicker/DatePickerInput/elements.js+
dist/DatePicker/DatePickerInput/elements.jsNew file+33
Index: package/dist/DatePicker/DatePickerInput/elements.js
===================================================================
--- package/dist/DatePicker/DatePickerInput/elements.js
+++ package/dist/DatePicker/DatePickerInput/elements.js
@@ -0,0 +1,33 @@
+import _styled from "@emotion/styled/base";
+import { variant } from '@codecademy/gamut-styles';
+import { FlexBox } from '../../Box';
+import { formFieldFocusStyles, formFieldStyles, inputSizeStyles } from '../../Form/styles';
+const shellFocusStyles = variant({
+ variants: {
+ error: {
+ // borderColor: 'feedback-error',
+ '&:hover': {
+ borderColor: 'feedback-error'
+ },
+ '&:focus': {
+ borderColor: 'feedback-error',
+ boxShadow: `inset 0 0 0 1px feedback-error`
+ },
+ '&:focus-within': {
+ borderColor: 'feedback-error',
+ boxShadow: `inset 0 0 0 1px feedback-error`
+ }
+ },
+ default: {
+ '&:focus-within': formFieldFocusStyles
+ }
+ }
+});
+/**
+ * Shell uses the same style stack as `Input`. `formFieldStyles` targets `&:focus`, but the host is a
+ * `div` — focus is on inner spinbuttons, so we mirror `Input` focus visuals with `&:focus-within`.
+ */
+export const SegmentedShell = /*#__PURE__*/_styled(FlexBox, {
+ target: "ex306dz0",
+ label: "SegmentedShell"
+})(formFieldStyles, inputSizeStyles, shellFocusStyles, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9EYXRlUGlja2VyL0RhdGVQaWNrZXJJbnB1dC9lbGVtZW50cy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBeUM4QiIsImZpbGUiOiIuLi8uLi8uLi9zcmMvRGF0ZVBpY2tlci9EYXRlUGlja2VySW5wdXQvZWxlbWVudHMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdmFyaWFudCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBTdHlsZVByb3BzIH0gZnJvbSAnQGNvZGVjYWRlbXkvdmFyaWFuY2UnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQgeyBGbGV4Qm94IH0gZnJvbSAnLi4vLi4vQm94JztcbmltcG9ydCB7XG4gIGZvcm1GaWVsZEZvY3VzU3R5bGVzLFxuICBmb3JtRmllbGRTdHlsZXMsXG4gIGlucHV0U2l6ZVN0eWxlcyxcbn0gZnJvbSAnLi4vLi4vRm9ybS9zdHlsZXMnO1xuXG5jb25zdCBzaGVsbEZvY3VzU3R5bGVzID0gdmFyaWFudCh7XG4gIHZhcmlhbnRzOiB7XG4gICAgZXJyb3I6IHtcbiAgICAgIC8vIGJvcmRlckNvbG9yOiAnZmVlZGJhY2stZXJyb3InLFxuICAgICAgJyY6aG92ZXInOiB7XG4gICAgICAgIGJvcmRlckNvbG9yOiAnZmVlZGJhY2stZXJyb3InLFxuICAgICAgfSxcbiAgICAgICcmOmZvY3VzJzoge1xuICAgICAgICBib3JkZXJDb2xvcjogJ2ZlZWRiYWNrLWVycm9yJyxcbiAgICAgICAgYm94U2hhZG93OiBgaW5zZXQgMCAwIDAgMXB4IGZlZWRiYWNrLWVycm9yYCxcbiAgICAgIH0sXG4gICAgICAnJjpmb2N1cy13aXRoaW4nOiB7XG4gICAgICAgIGJvcmRlckNvbG9yOiAnZmVlZGJhY2stZXJyb3InLFxuICAgICAgICBib3hTaGFkb3c6IGBpbnNldCAwIDAgMCAxcHggZmVlZGJhY2stZXJyb3JgLFxuICAgICAgfSxcbiAgICB9LFxuICAgIGRlZmF1bHQ6IHtcbiAgICAgICcmOmZvY3VzLXdpdGhpbic6IGZvcm1GaWVsZEZvY3VzU3R5bGVzLFxuICAgIH0sXG4gIH0sXG59KTtcblxuaW50ZXJmYWNlIFNlZ21lbnRlZFNoZWxsUHJvcHNcbiAgZXh0ZW5kcyBTdHlsZVByb3BzPHR5cGVvZiBpbnB1dFNpemVTdHlsZXM+LFxuICAgIFN0eWxlUHJvcHM8dHlwZW9mIHNoZWxsRm9jdXNTdHlsZXM+IHt9XG5cbi8qKlxuICogU2hlbGwgdXNlcyB0aGUgc2FtZSBzdHlsZSBzdGFjayBhcyBgSW5wdXRgLiBgZm9ybUZpZWxkU3R5bGVzYCB0YXJnZXRzIGAmOmZvY3VzYCwgYnV0IHRoZSBob3N0IGlzIGFcbiAqIGBkaXZgIOKAlCBmb2N1cyBpcyBvbiBpbm5lciBzcGluYnV0dG9ucywgc28gd2UgbWlycm9yIGBJbnB1dGAgZm9jdXMgdmlzdWFscyB3aXRoIGAmOmZvY3VzLXdpdGhpbmAuXG4gKi9cbmV4cG9ydCBjb25zdCBTZWdtZW50ZWRTaGVsbCA9IHN0eWxlZChGbGV4Qm94KTxTZWdtZW50ZWRTaGVsbFByb3BzPihcbiAgZm9ybUZpZWxkU3R5bGVzLFxuICBpbnB1dFNpemVTdHlsZXMsXG4gIHNoZWxsRm9jdXNTdHlsZXNcbik7XG4iXX0= */");
\ No newline at end of file