frey-ui 1.0.11 → 1.0.13

package/README.md

@@ -21,6 +21,18 @@ Frey UI is built with **WCAG 2.1 AA** compliance as a goal:
 
 Automated checks run through [`jest-axe`](https://github.com/nickcolley/jest-axe) in unit tests and [`@storybook/addon-a11y`](https://storybook.js.org/addons/@storybook/addon-a11y) in Storybook.
 
+### Test Environment Notes
+
+Unit tests run in JSDOM, which does not provide a full layout engine. Positioning assertions for portal overlays may require mocked geometry APIs (`getBoundingClientRect`, viewport size), and focus-trap behavior is validated at a best-effort level in unit tests.
+
+Browser E2E coverage is available via Playwright in `apps/playwright` for real-world overlay focus and positioning checks, and can be expanded as overlay scenarios grow.
+
+### Overlay Focus Management
+
+- `Dialog` uses the native `<dialog>` element and modal behavior.
+- `Popover` and `DropdownMenu` use `FloatingFocusManager` in modal mode.
+- When a `Popover` or `DropdownMenu` is open, keyboard focus is trapped inside the overlay and focus returns to the trigger when it closes.
+
 ## Installation
 
 ```bash
@@ -34,7 +46,7 @@ npm install frey-ui
 Import the stylesheet once in your app root (for example `App.tsx` or `layout.tsx`):
 
 ```tsx
-import 'frey-ui/style.css';
+import 'frey-ui/theme.css';
 ```
 
 ## Public Subpath Imports
@@ -74,6 +86,28 @@ pnpm install
 pnpm storybook
 ```
 
+## Brand Token Generator
+
+Frey UI includes a contributor CLI utility to generate CSS variable overrides from a small set of brand colors.
+
+```bash
+pnpm theme:tokens -- --primary "#0f62fe"
+```
+
+You can optionally override additional semantic colors:
+
+```bash
+pnpm theme:tokens -- --primary "#0f62fe" --success "#198038" --warning "#f1c21b" --error "#da1e28" --info "#0043ce" > brand-theme.css
+```
+
+Then load the generated CSS after `frey-ui/theme.css` in your application so your brand tokens override defaults.
+
+## Roadmap Notes
+
+- `Combobox / Autocomplete`: planned to support searchable long-option datasets with robust keyboard semantics.
+- `Drawer / Slide-over`: planned for mobile-first and dense settings workflows.
+- Accordion content animation: current grid-based animation uses `overflow: hidden` on the inner content wrapper, which can clip inner tooltips and extended focus rings. Prefer external tooltip portals and avoid relying on overflow-visible descendants inside accordion content.
+
 ## License
 
 [MIT](./LICENSE)

package/dist/cjs/Accordion/accordion.css

@@ -0,0 +1,80 @@
+.accordion_8f91be6e {
+  width: 100%;
+}
+
+.accordion_item_2d6abc63 {
+  border-bottom: 1px solid var(--frey-color-border-subtle);
+}
+
+.accordion_item_2d6abc63:last-child {
+  border-bottom: none;
+}
+
+.accordion_header_c9933178 {
+  display: flex;
+}
+
+.accordion_trigger_1c357514 {
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: space-between;
+  padding: 1rem 0;
+  font-weight: 500;
+  font-size: 0.875rem;
+  background: none;
+  border: none;
+  cursor: pointer;
+  color: var(--frey-color-text);
+  transition: all 0.2s ease-in-out;
+  text-align: left;
+  outline: none;
+}
+
+.accordion_trigger_1c357514:hover {
+  text-decoration: underline;
+}
+
+.accordion_trigger_1c357514:focus-visible {
+  border-radius: var(--frey-radius-sm);
+  box-shadow:
+    0 0 0 2px var(--frey-color-surface),
+    0 0 0 4px var(--frey-color-focus-ring);
+}
+
+.accordion_chevron_c55f991e {
+  transition: transform 0.2s ease-in-out;
+  color: var(--frey-color-text-muted);
+}
+
+.accordion_chevron_open_44560e91 {
+  transform: rotate(180deg);
+}
+
+/* 
+  CSS Grid trick for animating height 
+  Transitions from 0fr to 1fr
+*/
+.accordion_content_wrapper_357a0679 {
+  display: grid;
+  grid-template-rows: 0fr;
+  transition: grid-template-rows 0.2s ease-out;
+}
+
+.accordion_content_wrapper_open_02841768 {
+  grid-template-rows: 1fr;
+}
+
+.accordion_content_945ef079 {
+  overflow: hidden; /* Important for grid animation to hide contents when 0fr */
+  padding-bottom: 1rem;
+  color: var(--frey-color-text-muted);
+  font-size: 0.875rem;
+  line-height: 1.5;
+}
+
+/* Remove padding if closed to avoid seeing whitespace inside 0fr */
+.accordion_content_wrapper_357a0679:not(.accordion_content_wrapper_open_02841768)
+.accordion_content_945ef079 {
+  padding-bottom: 0;
+}

package/dist/cjs/Accordion/accordion.module.css.cjs

@@ -1,9 +1,10 @@
 'use client';
 'use strict';
+require('./accordion.css');
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"accordion":"accordion-module_accordion__AORof","accordion_item":"accordion-module_accordion_item__45nmM","accordion_header":"accordion-module_accordion_header__zEieN","accordion_trigger":"accordion-module_accordion_trigger__6Mbf8","accordion_chevron":"accordion-module_accordion_chevron__rMna-","accordion_chevron_open":"accordion-module_accordion_chevron_open__wQtp8","accordion_content_wrapper":"accordion-module_accordion_content_wrapper__QpRcb","accordion_content_wrapper_open":"accordion-module_accordion_content_wrapper_open__FWN9R","accordion_content":"accordion-module_accordion_content__1WN6n"};
+var styles = {"accordion":"accordion_8f91be6e","accordion_item":"accordion_item_2d6abc63","accordion_header":"accordion_header_c9933178","accordion_trigger":"accordion_trigger_1c357514","accordion_chevron":"accordion_chevron_c55f991e","accordion_chevron_open":"accordion_chevron_open_44560e91","accordion_content_wrapper":"accordion_content_wrapper_357a0679","accordion_content_wrapper_open":"accordion_content_wrapper_open_02841768","accordion_content":"accordion_content_945ef079"};
 
 exports.default = styles;
 //# sourceMappingURL=accordion.module.css.cjs.map

package/dist/cjs/Accordion/index.cjs

@@ -6,7 +6,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var React = require('react');
-var index = require('../Icons/index.cjs');
+var ChevronDownIcon = require('../Icons/ChevronDownIcon.cjs');
 var accordion_module = require('./accordion.module.css.cjs');
 
 const AccordionContext = React.createContext(null);
@@ -32,7 +32,7 @@ const AccordionRoot = React.forwardRef(function Accordion({ type = 'single', val
     const currentValue = isControlled ? value : uncontrolledValue;
     const idPrefix = React.useId();
     const handleValueChange = React.useCallback((nextValue) => {
-        let resolvedValue = nextValue;
+        let resolvedValue;
         if (type === 'single') {
             const valueAsStr = typeof currentValue === 'string' ? currentValue : '';
             resolvedValue = valueAsStr === nextValue ? '' : nextValue;
@@ -75,7 +75,7 @@ AccordionItem.displayName = 'Accordion.Item';
 const AccordionTrigger = React.forwardRef(function AccordionTrigger({ className, children, ...props }, ref) {
     const { onValueChange, idPrefix } = useAccordionContext();
     const { value, isOpen } = useAccordionItemContext();
-    return (jsxRuntime.jsx("div", { className: accordion_module.default.accordion_header, children: jsxRuntime.jsxs("button", { ref: ref, type: 'button', id: `${idPrefix}-trigger-${value}`, "aria-controls": `${idPrefix}-content-${value}`, "aria-expanded": isOpen, onClick: () => onValueChange(value), className: clsx(accordion_module.default.accordion_trigger, className), ...props, children: [children, jsxRuntime.jsx(index.ChevronDownIcon, { className: clsx(accordion_module.default.accordion_chevron, {
+    return (jsxRuntime.jsx("div", { className: accordion_module.default.accordion_header, children: jsxRuntime.jsxs("button", { ref: ref, type: 'button', id: `${idPrefix}-trigger-${value}`, "aria-controls": `${idPrefix}-content-${value}`, "aria-expanded": isOpen, onClick: () => onValueChange(value), className: clsx(accordion_module.default.accordion_trigger, className), ...props, children: [children, jsxRuntime.jsx(ChevronDownIcon.ChevronDownIcon, { className: clsx(accordion_module.default.accordion_chevron, {
                         [accordion_module.default.accordion_chevron_open]: isOpen
                     }), size: 16 })] }) }));
 });

package/dist/cjs/Alert/alert.css

@@ -0,0 +1,63 @@
+.alert_7c07a8c0 {
+  display: flex;
+  align-items: flex-start;
+  gap: 0.75rem;
+  padding: 0.75rem 1rem;
+  border-radius: 0.375rem;
+  border: 1px solid;
+  font-size: 0.875rem;
+  line-height: 1.5;
+}
+
+/* Variants */
+.alert-error_1de19fed {
+  color: var(--frey-color-error);
+  background-color: var(--frey-color-error-bg);
+  border-color: var(--frey-color-error-border);
+}
+
+.alert-success_38713508 {
+  color: var(--frey-color-success);
+  background-color: var(--frey-color-success-bg);
+  border-color: var(--frey-color-success-border);
+}
+
+.alert-warning_931806ff {
+  color: var(--frey-color-warning);
+  background-color: var(--frey-color-warning-bg);
+  border-color: var(--frey-color-warning-border);
+}
+
+.alert-info_183c5a6f {
+  color: var(--frey-color-info);
+  background-color: var(--frey-color-info-bg);
+  border-color: var(--frey-color-info-border);
+}
+
+.alert-icon_b4aefb94 {
+  flex-shrink: 0;
+  width: 1.25rem;
+  height: 1.3125rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.alert_icon_svg_1e243ee4 {
+  width: 1.25rem;
+  height: 1.25rem;
+}
+
+.alert-content_17fc1725 {
+  flex: 1;
+  min-width: 0;
+}
+
+.alert-title_1260729c {
+  font-weight: 600;
+  margin: 0 0 0.25rem;
+}
+
+.alert-message_af65e832 {
+  margin: 0;
+}

package/dist/cjs/Alert/alert.module.css.cjs

@@ -1,9 +1,10 @@
 'use client';
 'use strict';
+require('./alert.css');
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"alert":"alert-module_alert__j-fLL","alert-error":"alert-module_alert-error__U8yC8","alert-success":"alert-module_alert-success__FYP1Q","alert-warning":"alert-module_alert-warning__tuLWQ","alert-info":"alert-module_alert-info__d2xVj","alert-icon":"alert-module_alert-icon__j-8MC","alert_icon_svg":"alert-module_alert_icon_svg__EBN75","alert-content":"alert-module_alert-content__PUQPc","alert-title":"alert-module_alert-title__3yZS1","alert-message":"alert-module_alert-message__0AJ04"};
+var styles = {"alert":"alert_7c07a8c0","alert-error":"alert-error_1de19fed","alert-success":"alert-success_38713508","alert-warning":"alert-warning_931806ff","alert-info":"alert-info_183c5a6f","alert-icon":"alert-icon_b4aefb94","alert_icon_svg":"alert_icon_svg_1e243ee4","alert-content":"alert-content_17fc1725","alert-title":"alert-title_1260729c","alert-message":"alert-message_af65e832"};
 
 exports.default = styles;
 //# sourceMappingURL=alert.module.css.cjs.map

package/dist/cjs/Alert/index.cjs

@@ -6,7 +6,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var React = require('react');
-var index = require('../Icons/index.cjs');
+var CircleCheckIcon = require('../Icons/CircleCheckIcon.cjs');
+var CircleInfoIcon = require('../Icons/CircleInfoIcon.cjs');
+var CircleXIcon = require('../Icons/CircleXIcon.cjs');
+var TriangleAlertIcon = require('../Icons/TriangleAlertIcon.cjs');
 var alert_module = require('./alert.module.css.cjs');
 
 const VariantClassMap = {
@@ -22,10 +25,10 @@ const VariantRoleMap = {
     info: 'status'
 };
 const icons = {
-    error: (jsxRuntime.jsx(index.CircleXIcon, { size: 'lg', strokeWidth: 'bold', className: alert_module.default.alert_icon_svg })),
-    success: (jsxRuntime.jsx(index.CircleCheckIcon, { size: 'lg', strokeWidth: 'bold', className: alert_module.default.alert_icon_svg })),
-    warning: (jsxRuntime.jsx(index.TriangleAlertIcon, { size: 'lg', strokeWidth: 'bold', className: alert_module.default.alert_icon_svg })),
-    info: (jsxRuntime.jsx(index.CircleInfoIcon, { size: 'lg', strokeWidth: 'bold', className: alert_module.default.alert_icon_svg }))
+    error: (jsxRuntime.jsx(CircleXIcon.CircleXIcon, { size: 'lg', strokeWidth: 'bold', className: alert_module.default.alert_icon_svg })),
+    success: (jsxRuntime.jsx(CircleCheckIcon.CircleCheckIcon, { size: 'lg', strokeWidth: 'bold', className: alert_module.default.alert_icon_svg })),
+    warning: (jsxRuntime.jsx(TriangleAlertIcon.TriangleAlertIcon, { size: 'lg', strokeWidth: 'bold', className: alert_module.default.alert_icon_svg })),
+    info: (jsxRuntime.jsx(CircleInfoIcon.CircleInfoIcon, { size: 'lg', strokeWidth: 'bold', className: alert_module.default.alert_icon_svg }))
 };
 const Alert = React.forwardRef(function Alert({ variant = 'info', title, children, className, style }, ref) {
     return (jsxRuntime.jsxs("div", { ref: ref, role: VariantRoleMap[variant], className: clsx(alert_module.default.alert, VariantClassMap[variant], className), style: style, children: [jsxRuntime.jsx("span", { className: alert_module.default['alert-icon'], children: icons[variant] }), jsxRuntime.jsxs("div", { className: alert_module.default['alert-content'], children: [title && jsxRuntime.jsx("p", { className: alert_module.default['alert-title'], children: title }), jsxRuntime.jsx("p", { className: alert_module.default['alert-message'], children: children })] })] }));

package/dist/cjs/Avatar/avatar.css

@@ -0,0 +1,107 @@
+.avatar_69ecdff2 {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  vertical-align: middle;
+  overflow: hidden;
+  user-select: none;
+  border-radius: 9999px;
+  border: 1px solid var(--frey-color-border-subtle);
+  background-color: var(--frey-color-surface-hover);
+  color: var(--frey-color-text);
+}
+
+.avatar_sm_a7074618 {
+  width: 2rem;
+  height: 2rem;
+}
+
+.avatar_md_b160648e {
+  width: 2.5rem;
+  height: 2.5rem;
+}
+
+.avatar_lg_470c9abd {
+  width: 3.5rem;
+  height: 3.5rem;
+}
+
+.avatar_image_7164259b {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  border-radius: inherit;
+}
+
+.avatar_fallback_f8d02776 {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: var(--frey-color-surface-active);
+  font-weight: 500;
+  text-transform: uppercase;
+}
+
+.avatar_sm_a7074618 .avatar_fallback_f8d02776 {
+  font-size: 0.875rem;
+}
+
+.avatar_md_b160648e .avatar_fallback_f8d02776 {
+  font-size: 1rem;
+}
+
+.avatar_lg_470c9abd .avatar_fallback_f8d02776 {
+  font-size: 1.25rem;
+}
+
+/* Status Indicator */
+.avatar_status_indicator_3b42fd0a {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  border-radius: 50%;
+  border: 2px solid var(--frey-color-surface);
+  background-color: var(--frey-color-border-subtle); /* default offline color */
+}
+
+/* Size adjustments for status indicator */
+.avatar_sm_a7074618 .avatar_status_indicator_3b42fd0a {
+  width: 0.5rem;
+  height: 0.5rem;
+  right: 0.1rem;
+  bottom: 0.1rem;
+}
+
+.avatar_md_b160648e .avatar_status_indicator_3b42fd0a {
+  width: 0.625rem;
+  height: 0.625rem;
+  right: 0.125rem;
+  bottom: 0.125rem;
+}
+
+.avatar_lg_470c9abd .avatar_status_indicator_3b42fd0a {
+  width: 0.875rem;
+  height: 0.875rem;
+  right: 0.15rem;
+  bottom: 0.15rem;
+}
+
+/* Status variants */
+.avatar_status_online_5ccf7e50 {
+  background-color: var(--frey-color-success);
+}
+
+.avatar_status_idle_f558cd51 {
+  background-color: var(--frey-color-warning);
+}
+
+.avatar_status_dnd_38c6115c {
+  background-color: var(--frey-color-error);
+}
+
+.avatar_status_offline_c805801a {
+  background-color: var(--frey-color-border-subtle);
+}

package/dist/cjs/Avatar/avatar.module.css.cjs

@@ -1,9 +1,10 @@
 'use client';
 'use strict';
+require('./avatar.css');
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"avatar":"avatar-module_avatar__I5DCB","avatar_sm":"avatar-module_avatar_sm__pJcLU","avatar_md":"avatar-module_avatar_md__IZwdq","avatar_lg":"avatar-module_avatar_lg__2v383","avatar_image":"avatar-module_avatar_image__a-ctN","avatar_fallback":"avatar-module_avatar_fallback__QlF5F","avatar_status_indicator":"avatar-module_avatar_status_indicator__v2V8V","avatar_status_online":"avatar-module_avatar_status_online__1IxYF","avatar_status_idle":"avatar-module_avatar_status_idle__VbZ3q","avatar_status_dnd":"avatar-module_avatar_status_dnd__0fZbP","avatar_status_offline":"avatar-module_avatar_status_offline__A4iJp"};
+var styles = {"avatar":"avatar_69ecdff2","avatar_sm":"avatar_sm_a7074618","avatar_md":"avatar_md_b160648e","avatar_lg":"avatar_lg_470c9abd","avatar_image":"avatar_image_7164259b","avatar_fallback":"avatar_fallback_f8d02776","avatar_status_indicator":"avatar_status_indicator_3b42fd0a","avatar_status_online":"avatar_status_online_5ccf7e50","avatar_status_idle":"avatar_status_idle_f558cd51","avatar_status_dnd":"avatar_status_dnd_38c6115c","avatar_status_offline":"avatar_status_offline_c805801a"};
 
 exports.default = styles;
 //# sourceMappingURL=avatar.module.css.cjs.map

package/dist/cjs/Badge/badge.css

@@ -0,0 +1,75 @@
+.badge_bce67ff7 {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--frey-radius-full);
+  border: 1px solid transparent;
+  font-weight: 600;
+  line-height: 1;
+  white-space: nowrap;
+}
+
+.badge-sm_dc3de36d {
+  padding: 0.125rem 0.5rem;
+  font-size: 0.75rem;
+}
+
+.badge-md_d88ccac8 {
+  padding: 0.25rem 0.625rem;
+  font-size: 0.8125rem;
+}
+
+.badge-subtle-neutral_dc27f7b9 {
+  background-color: var(--frey-color-surface-subtle);
+  color: var(--frey-color-text-primary);
+  border-color: var(--frey-color-border-subtle);
+}
+
+.badge-subtle-info_9088d0b2 {
+  background-color: var(--frey-color-info-bg);
+  color: var(--frey-color-info);
+  border-color: var(--frey-color-info-border);
+}
+
+.badge-subtle-success_a8938864 {
+  background-color: var(--frey-color-success-bg);
+  color: var(--frey-color-success);
+  border-color: var(--frey-color-success-border);
+}
+
+.badge-subtle-warning_9b7640b7 {
+  background-color: var(--frey-color-warning-bg);
+  color: var(--frey-color-warning);
+  border-color: var(--frey-color-warning-border);
+}
+
+.badge-subtle-error_e6426ff9 {
+  background-color: var(--frey-color-error-bg);
+  color: var(--frey-color-error);
+  border-color: var(--frey-color-error-border);
+}
+
+.badge-solid-neutral_ac7e9431 {
+  background-color: var(--frey-color-text-primary);
+  color: var(--frey-color-surface);
+}
+
+.badge-solid-info_ecba7d59 {
+  background-color: var(--frey-color-info);
+  color: var(--frey-palette-white);
+}
+
+.badge-solid-success_28241077 {
+  background-color: var(--frey-color-success);
+  color: var(--frey-palette-white);
+}
+
+.badge-solid-warning_d28d237d {
+  background-color: var(--frey-color-warning);
+  color: var(--frey-palette-black);
+}
+
+.badge-solid-error_e87eabc7 {
+  background-color: var(--frey-color-error);
+  color: var(--frey-palette-white);
+}

package/dist/cjs/Badge/badge.module.css.cjs

@@ -0,0 +1,10 @@
+'use client';
+'use strict';
+require('./badge.css');
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {"badge":"badge_bce67ff7","badge-sm":"badge-sm_dc3de36d","badge-md":"badge-md_d88ccac8","badge-subtle-neutral":"badge-subtle-neutral_dc27f7b9","badge-subtle-info":"badge-subtle-info_9088d0b2","badge-subtle-success":"badge-subtle-success_a8938864","badge-subtle-warning":"badge-subtle-warning_9b7640b7","badge-subtle-error":"badge-subtle-error_e6426ff9","badge-solid-neutral":"badge-solid-neutral_ac7e9431","badge-solid-info":"badge-solid-info_ecba7d59","badge-solid-success":"badge-solid-success_28241077","badge-solid-warning":"badge-solid-warning_d28d237d","badge-solid-error":"badge-solid-error_e87eabc7"};
+
+exports.default = styles;
+//# sourceMappingURL=badge.module.css.cjs.map

package/dist/cjs/Badge/index.cjs

@@ -0,0 +1,37 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var clsx = require('clsx');
+var React = require('react');
+var badge_module = require('./badge.module.css.cjs');
+
+const SizeClassMap = {
+    sm: badge_module.default['badge-sm'],
+    md: badge_module.default['badge-md']
+};
+const ToneVariantClassMap = {
+    subtle: {
+        neutral: badge_module.default['badge-subtle-neutral'],
+        info: badge_module.default['badge-subtle-info'],
+        success: badge_module.default['badge-subtle-success'],
+        warning: badge_module.default['badge-subtle-warning'],
+        error: badge_module.default['badge-subtle-error']
+    },
+    solid: {
+        neutral: badge_module.default['badge-solid-neutral'],
+        info: badge_module.default['badge-solid-info'],
+        success: badge_module.default['badge-solid-success'],
+        warning: badge_module.default['badge-solid-warning'],
+        error: badge_module.default['badge-solid-error']
+    }
+};
+const Badge = React.forwardRef(function Badge({ tone = 'neutral', variant = 'subtle', size = 'md', className, ...props }, ref) {
+    return (jsxRuntime.jsx("span", { ref: ref, className: clsx(badge_module.default.badge, SizeClassMap[size], ToneVariantClassMap[variant][tone], className), ...props }));
+});
+Badge.displayName = 'Badge';
+
+exports.default = Badge;
+//# sourceMappingURL=index.cjs.map

package/dist/cjs/Box/box.css

@@ -0,0 +1,3 @@
+.box_01090d66 {
+  box-sizing: border-box;
+}

package/dist/cjs/Box/box.module.css.cjs

@@ -0,0 +1,10 @@
+'use client';
+'use strict';
+require('./box.css');
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {"box":"box_01090d66"};
+
+exports.default = styles;
+//# sourceMappingURL=box.module.css.cjs.map