@shmidko61/lc-ui-kit 0.13.0 → 0.16.0

package/README.md

@@ -158,3 +158,64 @@ Alert, Toast и вызов через NotificationProvider/useNotifications до
 
 Для сравнения API со старой сборкой: pnpm test:compatibility /path/to/previous/package.
 Браузерные проверки: pnpm test:notifications; необходимы локальный Storybook на 6016 и headless Chrome с remote-debugging-port=9237.
+
+## Анимация
+
+Box и основанные на нём Flex и Grid принимают animation в base/md/lg/xl.
+
+```tsx
+<Box
+  animation={{
+    preset: 'spin',
+    duration: '800ms',
+    timingFunction: 'linear',
+    iterationCount: 'infinite',
+    delay: '0ms',
+    direction: 'normal',
+    fillMode: 'none',
+    playState: 'running',
+  }}
+  md={{ animation: { duration: '2s' } }}
+  lg={{ animation: { playState: 'paused' } }}
+  xl={{ animation: 'none' }}
+/>
+```
+
+Объекты наследуются по свойствам. none очищает все параметры, последующий объект начинает с defaults. Сокращение spin выбирает готовый preset; собственное имя @keyframes можно указать в preset. По умолчанию: preset none, duration 1s, timingFunction linear, iterationCount infinite, delay 0ms, direction normal, fillMode none, playState running. CSS animation в явном style имеет приоритет на всех брейкпоинтах. spin запускается через Web Animations API и по умолчанию отключается при prefers-reduced-motion. reducedMotion: keep сохраняет движение. Пользовательское имя CSS @keyframes использует CSS и требует настройки reduced motion в приложении.
+
+### Кадры через props
+
+Для собственной анимации без CSS @keyframes передайте keyframes:
+
+```tsx
+<Box
+  animation={{
+    keyframes: [{ transform: 'rotate(0deg)' }, { transform: 'rotate(360deg)' }],
+    duration: 800,
+    easing: 'linear',
+    iterations: Infinity,
+  }}
+  md={{ animation: { duration: 1500 } }}
+  lg={{ animation: { playState: 'paused' } }}
+  xl={{ animation: 'none' }}
+/>
+```
+
+easing и iterations — синонимы timingFunction и iterationCount; при наследовании побеждает значение, заданное на ближайшем брейкпоинте; в одном объекте синонимы easing/iterations имеют приоритет. Кадры запускаются через Web Animations API после монтирования в браузере. На сервере и без JavaScript элемент остаётся в исходном состоянии. duration и delay принимают число в миллисекундах или CSS-время в ms/s; для кадров CSS-переменные и calc() в этих полях не поддерживаются. Частичные md/lg/xl наследуют keyframes и остальные параметры, none очищает всё, keyframes: null сбрасывает кадры и возвращает выбранный preset. При смене параметров или брейкпоинта анимация запускается заново; при размонтировании останавливается.
+
+При prefers-reduced-motion кадры отключаются по умолчанию. reducedMotion: 'keep' сохраняет анимацию. Явный style.animation или style.animationName отключает Web Animation; style.animationDuration, animationDelay, animationTimingFunction, animationIterationCount, animationDirection, animationFillMode и animationPlayState переопределяют соответствующие параметры; отдельные свойства в style исключаются из кадров и сохраняют приоритет. Готовый preset spin тоже запускается через Web Animations API и не требует CSS @keyframes.
+
+## ProgressBar
+
+[Описание, API и примеры ProgressBar](src/progress-bar/README.md). Компонент доступен через subpath /progress-bar и корневой entrypoint. Storybook: Feedback/ProgressBar/Showcase.
+
+## Tabs
+
+[API, правила наследования и примеры Tabs](src/tabs/README.md). Импорт: @shmidko61/lc-ui-kit/tabs. Витрина: Navigation/Tabs/Showcase. Сборка растущего Storybook запускается с лимитом heap Node 8 ГБ.
+
+## Оформление нативной прокрутки
+
+Box/Flex поддерживают типизированный `scrollbar` в base/md/lg/xl, цветовые токены,
+CSS-размеры, частичное наследование и сброс через `null`. Оформление не включает
+overflow. [API и ограничения](./src/box/README.md). Storybook: **UI Kit / Scrollbar**
+(16 примеров, включая вложенность, сбросы и style escape hatch).

package/dist/box/box.d.ts

@@ -8,5 +8,6 @@ type BoxComponentType = {
     displayName?: string;
 };
 export declare const Box: BoxComponentType;
-export type { BorderRadiusItem, BorderRadiusKeys, BorderRadiusSides, BorderWidthItem, BorderWidthSides, PositionValue, UiKitAnyIndentationMargin, UiKitAnyIndentationPadding, UiKitArrayIndentation, UiKitAspectRatioProps, UiKitAspectRatioValue, UiKitAxisIndentationMargin, UiKitAxisIndentationPadding, UiKitBackgroundProps, UiKitBorderColor, UiKitBorderProps, UiKitBorderRadius, UiKitBorderWidth, UiKitBoxShadowProps, UiKitBoxShadowValue, UiKitColorProps, UiKitColorValue, UiKitCursorProps, UiKitDimensionProps, UiKitDisplayProps, UiKitIndentations, UiKitIndentationsProps, UiKitListStyleProps, UiKitMarginArrayIndentation, UiKitMarginIndentation, UiKitMixedXAxisIndentationMargin, UiKitMixedXAxisIndentationPadding, UiKitMixedYAxisIndentationMargin, UiKitMixedYAxisIndentationPadding, UiKitOpacityProps, UiKitOpacityValue, UiKitOutlineProps, UiKitOverflowProps, UiKitOverflowValue, UiKitPointerEventsProps, UiKitPointerEventsValue, UiKitPositionProps, UiKitTransformOriginValue, UiKitTransformProps, UiKitTransformValue, } from '../types/index';
+export type { ScrollbarLength, ScrollbarStyleProps, UiKitScrollbarProps } from '../types/index';
+export type { BorderRadiusItem, BorderRadiusKeys, BorderRadiusSides, BorderWidthItem, BorderWidthSides, PositionValue, UiKitAnimation, UiKitAnimationProps, UiKitAnimationValue, UiKitAnyIndentationMargin, UiKitAnyIndentationPadding, UiKitArrayIndentation, UiKitAspectRatioProps, UiKitAspectRatioValue, UiKitAxisIndentationMargin, UiKitAxisIndentationPadding, UiKitBackgroundProps, UiKitBorderColor, UiKitBorderProps, UiKitBorderRadius, UiKitBorderWidth, UiKitBoxShadowProps, UiKitBoxShadowValue, UiKitColorProps, UiKitColorValue, UiKitCursorProps, UiKitDimensionProps, UiKitDisplayProps, UiKitIndentations, UiKitIndentationsProps, UiKitListStyleProps, UiKitMarginArrayIndentation, UiKitMarginIndentation, UiKitMixedXAxisIndentationMargin, UiKitMixedXAxisIndentationPadding, UiKitMixedYAxisIndentationMargin, UiKitMixedYAxisIndentationPadding, UiKitOpacityProps, UiKitOpacityValue, UiKitOutlineProps, UiKitOverflowProps, UiKitOverflowValue, UiKitPointerEventsProps, UiKitPointerEventsValue, UiKitPositionProps, UiKitTransformOriginValue, UiKitTransformProps, UiKitTransformValue, } from '../types/index';
 export type { BoxAs, BoxBackgroundValue, BoxBreakpointProps, BoxComponentProps, BoxProps, HoverStyleProps, StateStyleProps, } from './box.types';

package/dist/box/box.types.d.ts

@@ -1,6 +1,6 @@
 import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';
 import { ResponsiveStyleBreakpoint } from '../shared/responsive-style/responsive-style.types';
-import { UiKitAspectRatioProps, UiKitBackgroundProps, UiKitBackgroundValue, UiKitBorderProps, UiKitBoxShadowProps, UiKitColorProps, UiKitCursorProps, UiKitDimensionProps, UiKitDisplayProps, UiKitIndentationsProps, UiKitListStyleProps, UiKitOpacityProps, UiKitOutlineProps, UiKitOverflowProps, UiKitPointerEventsProps, UiKitPositionProps, UiKitTransformProps } from '../types/index';
+import { UiKitAnimationProps, UiKitAspectRatioProps, UiKitBackgroundProps, UiKitBackgroundValue, UiKitBorderProps, UiKitBoxShadowProps, UiKitColorProps, UiKitCursorProps, UiKitDimensionProps, UiKitDisplayProps, UiKitIndentationsProps, UiKitListStyleProps, UiKitOpacityProps, UiKitOutlineProps, UiKitOverflowProps, UiKitPointerEventsProps, UiKitPositionProps, UiKitScrollbarProps, UiKitTransformProps } from '../types/index';
 /**
  * Допустимые HTML-теги для Box.
  *
@@ -20,7 +20,7 @@ export type BoxBackgroundValue = UiKitBackgroundValue;
 /**
  * Стилевые props, общие для base-состояния и responsive overrides.
  */
-export type BoxStyleProps = UiKitDisplayProps & UiKitPositionProps & UiKitOverflowProps & UiKitAspectRatioProps & UiKitTransformProps & UiKitColorProps & UiKitOpacityProps & UiKitPointerEventsProps & UiKitBoxShadowProps & UiKitBackgroundProps & UiKitCursorProps & UiKitIndentationsProps & UiKitOutlineProps & UiKitListStyleProps & UiKitDimensionProps;
+export type BoxStyleProps = UiKitAnimationProps & UiKitScrollbarProps & UiKitDisplayProps & UiKitPositionProps & UiKitOverflowProps & UiKitAspectRatioProps & UiKitTransformProps & UiKitColorProps & UiKitOpacityProps & UiKitPointerEventsProps & UiKitBoxShadowProps & UiKitBackgroundProps & UiKitCursorProps & UiKitIndentationsProps & UiKitOutlineProps & UiKitListStyleProps & UiKitDimensionProps;
 /**
  * Собственные стилевые props Box поверх общих контрактов ui-kit.
  */

package/dist/box/helpers/box-animation.helpers.d.ts

@@ -0,0 +1,8 @@
+import { CSSProperties, ForwardedRef } from 'react';
+import { ResponsiveAnimation } from '../types/index';
+/** Определяет, могут ли заданные настройки запустить Web Animations на каком-либо размере. */
+export declare function hasAnimationKeyframes(props: ResponsiveAnimation): boolean;
+/** Запускает кадры, наследует параметры на брейкпоинтах и освобождает браузерные ресурсы. */
+export declare function attachAnimation(element: Element, props: ResponsiveAnimation, style: CSSProperties | undefined): () => void;
+/** Объединяет публичный ref Box с жизненным циклом Web Animations React 19. */
+export declare function animationRef(ref: ForwardedRef<Element>, props: ResponsiveAnimation, style: CSSProperties | undefined): (element: Element | null) => (() => void) | void;

package/dist/box/helpers/box-scrollbar.helpers.d.ts

@@ -0,0 +1,7 @@
+import { ScrollbarPlanProps, ScrollbarVariableStyle } from '../types/index';
+/**
+ * Накапливает поля base/md/lg/xl и передаёт их через CSS variables + safelisted utilities.
+ * После null накопление начинается заново. Не создаёт классов, если prop не использован.
+ * Переменные --lc-scrollbar-* являются локальными точками переопределения через style.
+ */
+export declare function assignScrollbarPlan(props: ScrollbarPlanProps, classNames: Array<string>, style: ScrollbarVariableStyle): void;

package/dist/box/helpers/index.d.ts

@@ -0,0 +1,2 @@
+export { animationRef, hasAnimationKeyframes } from './box-animation.helpers';
+export { assignScrollbarPlan } from './box-scrollbar.helpers';

package/dist/box/types/box-animation.types.d.ts

@@ -0,0 +1,3 @@
+import { BoxProps } from '..';
+/** Настройки анимации используют общий responsive-контракт Box без дублирования брейкпоинтов. */
+export type ResponsiveAnimation = Pick<BoxProps, 'animation' | 'md' | 'lg' | 'xl'>;

package/dist/box/types/box-scrollbar.types.d.ts

@@ -0,0 +1,7 @@
+import { CSSProperties } from 'react';
+import { responsiveBreakpoints } from '../../shared/responsive-style/index';
+import { UiKitScrollbarProps } from '../../types/index';
+/** Вход responsive-планировщика; Flex использует тот же контракт через Box. */
+export type ScrollbarPlanProps = UiKitScrollbarProps & Partial<Record<(typeof responsiveBreakpoints)[number], UiKitScrollbarProps>>;
+/** Inline style с локальными CSS-переменными, до применения потребительского style. */
+export type ScrollbarVariableStyle = CSSProperties & Record<`--${string}`, string | number>;

package/dist/box/types/index.d.ts

@@ -0,0 +1,2 @@
+export type { ResponsiveAnimation } from './box-animation.types';
+export type { ScrollbarPlanProps, ScrollbarVariableStyle } from './box-scrollbar.types';

package/dist/box.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const bo=require("react/jsx-runtime"),po=require("react"),L=require("./responsive-style.config-B2m9jVlX.cjs");function K({background:t,backgroundColor:o,bg:e,bgSize:a,bgRepeat:n,bgPosition:s,border:m,boxShadow:c,color:r,cursor:u,opacity:l,overflow:d,overflowX:h,overflowY:y,pointerEvents:B,aspectRatio:v,transform:g,transformOrigin:b,p:S,m:x,outlineColor:k,outlineWidth:R,outlineOffset:W,outlineStyle:P,listStyle:C,display:w,position:p,width:N,maxWidth:j,minWidth:I,height:O,maxHeight:E,minHeight:A}){const i={};return e!==void 0?Lo(i,e):t!==void 0&&(i.background=G(t)),o!==void 0&&(i.backgroundColor=G(o)),a!==void 0&&(i.backgroundSize=zo(a)),n!==void 0&&(i.backgroundRepeat=To(n)),s!==void 0&&(i.backgroundPosition=Vo(s)),ko(i,m),c!==void 0&&(i.boxShadow=$(c)),r!==void 0&&(i.color=$(r)),u!==void 0&&(i.cursor=u),l!==void 0&&(i.opacity=typeof l=="number"?l:$(l)),d!==void 0&&(i.overflowX=d,i.overflowY=d),h!==void 0&&(i.overflowX=h),y!==void 0&&(i.overflowY=y),B!==void 0&&(i.pointerEvents=B),v!==void 0&&(i.aspectRatio=typeof v=="number"?String(v):$(v)),g!==void 0&&(i.transform=$(g)),b!==void 0&&(i.transformOrigin=$(b)),Bo(i,S),yo(i,x),k!==void 0&&(i.outlineColor=$(k)),R!==void 0&&(i.outlineWidth=R),W!==void 0&&(i.outlineOffset=W),P!==void 0&&(i.outlineStyle=P),C?.position!==void 0&&(i.listStylePosition=C.position),C?.type!==void 0&&(i.listStyleType=C.type),w!==void 0&&(i.display=Co(w)),p?.type!==void 0&&(i.position=p.type),p?.top!==void 0&&(i.top=H(p.top)),p?.left!==void 0&&(i.left=H(p.left)),p?.right!==void 0&&(i.right=H(p.right)),p?.bottom!==void 0&&(i.bottom=H(p.bottom)),p?.zIndex!==void 0&&(i.zIndex=p.zIndex),N!==void 0&&(i.width=z(N)),j!==void 0&&(i.maxWidth=z(j)),I!==void 0&&(i.minWidth=z(I)),O!==void 0&&(i.height=z(O)),E!==void 0&&(i.maxHeight=z(E)),A!==void 0&&(i.minHeight=z(A)),Object.keys(i).length>0?i:void 0}function mo(t){const o=[],e={},a=t.groupParent===!0;F(t,o,e,{isGroupParent:a});for(const n of L.responsiveBreakpoints){const s=t[n];s&&F(s,o,e,{classPrefix:`${n}:`,variablePrefix:`${n}-`,isGroupParent:a})}return go(t,o,e),{className:o.join(" "),style:Object.keys(e).length>0?e:void 0}}const q=[{prop:"hover",name:"hover",variant:"[@media(hover:hover)_and_(pointer:fine)]:[&:hover:not(:disabled):not([aria-disabled=true]):not([data-disabled=true])]"},{prop:"focusVisible",name:"focus-visible",variant:"[&:focus-visible:not(:disabled):not([aria-disabled=true]):not([data-disabled=true])]"},{prop:"active",name:"active",variant:"[&:active:not(:disabled):not([aria-disabled=true]):not([data-disabled=true])]"},{prop:"disabledStyle",name:"disabled",variant:"[&:is(:disabled,[aria-disabled=true],[data-disabled=true]):is(:disabled,[aria-disabled=true],[data-disabled=true])]"}];function go(t,o,e){const a=[t,...L.responsiveBreakpoints.map(r=>t[r]??{})],n=new Set;for(const r of q)for(const u of a)Object.keys(D(u,r.prop)).forEach(l=>n.add(l)),r.prop==="hover"&&u.hover===null&&n.add("backgroundColor");if(n.size===0)return;for(const r of n){const u=Y(r);for(const l of q)o.push(`[--ui-state-${l.name}-${u}:initial]`)}let s={};const m=new Map,c=new Map;a.forEach((r,u)=>{s={...s,...X(r)};const l=u===0?"":`${L.responsiveBreakpoints[u-1]}:`;for(const d of q){const h=m.get(d.name)??{},y=D(r,d.prop),B=r[d.prop]===null?{}:{...h,...y},v=c.get(d.name)??new Set;Object.keys(y).forEach(g=>v.add(g)),d.prop==="hover"&&r.hover===null&&v.add("backgroundColor"),m.set(d.name,B),c.set(d.name,v);for(const g of v){const b=Y(g),S=s[g]??vo(g,u),x=`--ui-state-normal-${u}-${b}`;e[x]=String(S);const k=`--${d.name}-${u}-${b}`;e[k]=String(B[g]??S);const R=`--ui-state-value-${d.name}-${u}-${b}`;e[R]=B[g]===void 0?"initial":`var(${k})`;const W=`var(--ui-state-disabled-${b},var(--ui-state-active-${b},var(--ui-state-focus-visible-${b},var(--ui-state-hover-${b},var(${x})))))`;o.push(`${l}${d.variant}:[--ui-state-${d.name}-${b}:var(${R})]`,`${l}${d.variant}:[${b}:${W}]`)}}})}function D(t,o){const e=t[o];return e?o!=="hover"&&"outlineWidth"in e&&e.outlineStyle===void 0?X({...e,outlineStyle:"solid"}):X(e):{}}function vo(t,o){const e=t==="color"?"inherit":"initial";if(t!=="background"&&t!=="backgroundColor"&&t!=="color")return e;const a=t==="color"?"color":"bg";let n=`var(--button-${a},${e})`;for(let s=0;s<o;s+=1)n=`var(--${L.responsiveBreakpoints[s]}-button-${a},${n})`;return n}function X(t){const o={...K(t)};if(o.borderWidth!==void 0){const e=String(o.borderWidth).split(/\s+(?![^()]*\))/),a=e[0],n=e[1]??a,s=e[2]??a,m=e[3]??n;Object.assign(o,{borderTopWidth:a,borderRightWidth:n,borderBottomWidth:s,borderLeftWidth:m}),delete o.borderWidth}if(o.borderRadius!==void 0){const[e,a=e]=String(o.borderRadius).split("/"),n=c=>{const r=c.trim().split(/\s+(?![^()]*\))/);return[r[0],r[1]??r[0],r[2]??r[0],r[3]??r[1]??r[0]]},s=n(e),m=n(a);["TopLeft","TopRight","BottomRight","BottomLeft"].forEach((c,r)=>{o[`border${c}Radius`]=`${s[r]} ${m[r]}`}),delete o.borderRadius}return o}function F(t,o,e,{classPrefix:a="",variablePrefix:n="",isGroupParent:s=!1}={}){const m=K(t);for(const[c,r]of Object.entries(m??{})){if(r==null)continue;const u=String(r),l=ho(c,u);if(l){o.push(`${a}${l}`);continue}const d=`${n}${Y(c)}`,h=$o(c,d);h&&(e[`--${d}`]=u,o.push(`${a}${h}`))}if(t.bgGroup!==void 0){const c=`${n}group-background`;e[`--${c}`]=G(t.bgGroup),o.push(`${a}group-hover:[background:var(--${c})]`),s&&o.push(`${a}hover:[background:var(--${c})]`)}}function ho(t,o){if(t==="display")return o==="none"?"hidden":o;if(t==="position")return o==="inherit"?"[position:inherit]":o;if(t==="cursor")return`cursor-${o}`;if(t==="backgroundRepeat")return{"no-repeat":"bg-no-repeat",repeat:"bg-repeat",round:"bg-repeat-round",space:"bg-repeat-space","repeat-x":"bg-repeat-x","repeat-y":"bg-repeat-y"}[o];if(t==="backgroundSize")return{auto:"bg-auto",contain:"bg-contain",cover:"bg-cover"}[o];if(t==="backgroundPosition")return{bottom:"bg-bottom",center:"bg-center",left:"bg-left","left bottom":"bg-left-bottom","left top":"bg-left-top",right:"bg-right","right bottom":"bg-right-bottom","right top":"bg-right-top",top:"bg-top"}[o];if(t==="borderStyle")return o==="none"?"border-none":`border-${o}`;if(t==="outlineStyle")return o==="none"?"outline-none":`outline-${o}`;if(t==="listStylePosition")return`list-${o}`;if(t==="listStyleType")return`list-${o}`}function $o(t,o){const e=`var(--${o})`;return{background:`[background:${e}]`,backgroundColor:`bg-[${e}]`,backgroundPosition:`bg-[position:${e}]`,backgroundSize:`bg-[length:${e}]`,aspectRatio:`[aspect-ratio:${e}]`,borderBottomLeftRadius:`rounded-bl-[${e}]`,borderBottomRightRadius:`rounded-br-[${e}]`,borderBottomWidth:`border-b-[length:${e}]`,borderColor:`border-[color:${e}]`,borderLeftWidth:`border-l-[length:${e}]`,borderRadius:`rounded-[${e}]`,borderRightWidth:`border-r-[length:${e}]`,borderTopLeftRadius:`rounded-tl-[${e}]`,borderTopRightRadius:`rounded-tr-[${e}]`,borderTopWidth:`border-t-[length:${e}]`,borderWidth:`border-[length:${e}]`,boxShadow:`[box-shadow:${e}]`,bottom:`bottom-[${e}]`,color:`[color:${e}]`,height:`h-[${e}]`,left:`left-[${e}]`,margin:`m-[${e}]`,marginBottom:`mb-[${e}]`,marginLeft:`ml-[${e}]`,marginRight:`mr-[${e}]`,marginTop:`mt-[${e}]`,maxHeight:`max-h-[${e}]`,maxWidth:`max-w-[${e}]`,minHeight:`min-h-[${e}]`,minWidth:`min-w-[${e}]`,outlineColor:`outline-[color:${e}]`,outlineOffset:`outline-offset-[${e}]`,outlineWidth:`outline-[length:${e}]`,opacity:`[opacity:${e}]`,overflowX:`[overflow-x:${e}]`,overflowY:`[overflow-y:${e}]`,padding:`p-[${e}]`,paddingBottom:`pb-[${e}]`,paddingLeft:`pl-[${e}]`,paddingRight:`pr-[${e}]`,paddingTop:`pt-[${e}]`,pointerEvents:`[pointer-events:${e}]`,right:`right-[${e}]`,top:`top-[${e}]`,transform:`[transform:${e}]`,transformOrigin:`[transform-origin:${e}]`,width:`w-[${e}]`,zIndex:`z-[${e}]`}[t]}function Y(t){return t.replace(/[A-Z]/g,o=>`-${o.toLowerCase()}`)}function Bo(t,o){if(o!==void 0){if(Array.isArray(o)){t.padding=o.map(f).join(" ");return}if(typeof o!="object"){t.padding=f(o);return}"px"in o&&o.px!==void 0&&(t.paddingLeft=f(o.px),t.paddingRight=f(o.px)),"py"in o&&o.py!==void 0&&(t.paddingTop=f(o.py),t.paddingBottom=f(o.py)),"pt"in o&&o.pt!==void 0&&(t.paddingTop=f(o.pt)),"pb"in o&&o.pb!==void 0&&(t.paddingBottom=f(o.pb)),"pl"in o&&o.pl!==void 0&&(t.paddingLeft=f(o.pl)),"pr"in o&&o.pr!==void 0&&(t.paddingRight=f(o.pr))}}function yo(t,o){if(o!==void 0){if(Array.isArray(o)){t.margin=o.map(f).join(" ");return}if(typeof o!="object"){t.margin=f(o);return}"mx"in o&&o.mx!==void 0&&(t.marginLeft=f(o.mx),t.marginRight=f(o.mx)),"my"in o&&o.my!==void 0&&(t.marginTop=f(o.my),t.marginBottom=f(o.my)),"mt"in o&&o.mt!==void 0&&(t.marginTop=f(o.mt)),"mb"in o&&o.mb!==void 0&&(t.marginBottom=f(o.mb)),"ml"in o&&o.ml!==void 0&&(t.marginLeft=f(o.ml)),"mr"in o&&o.mr!==void 0&&(t.marginRight=f(o.mr))}}function ko(t,o){o&&(o.radius!==void 0&&Ro(t,o.radius),o.color!==void 0&&(t.borderColor=$(o.color)),o.width!==void 0&&So(t,o.width),o.style!==void 0&&(t.borderStyle=o.style))}function Ro(t,o){if(xo(o)){o.topLeft!==void 0&&(t.borderTopLeftRadius=T(o.topLeft)),o.topRight!==void 0&&(t.borderTopRightRadius=T(o.topRight)),o.bottomLeft!==void 0&&(t.borderBottomLeftRadius=T(o.bottomLeft)),o.bottomRight!==void 0&&(t.borderBottomRightRadius=T(o.bottomRight));return}t.borderRadius=T(o)}function So(t,o){if(Wo(o)){o.top!==void 0&&(t.borderTopWidth=V(o.top)),o.bottom!==void 0&&(t.borderBottomWidth=V(o.bottom)),o.left!==void 0&&(t.borderLeftWidth=V(o.left)),o.right!==void 0&&(t.borderRightWidth=V(o.right));return}t.borderWidth=V(o)}function xo(t){return typeof t=="object"}function Wo(t){return typeof t=="object"}function T(t){return t.startsWith("--")?`var(${t})`:t}function V(t){return t.startsWith("--")?`var(${t})`:t}function Co(t){return t==="hidden"?"none":t}function H(t){return typeof t=="number"?`${t}px`:t}function f(t){return typeof t=="number"?`${t}px`:t}function z(t){return typeof t=="number"?`${t}px`:t}function zo(t){return typeof t=="number"?`${t}px`:t}function To(t){return{"no-repeat":"no-repeat",repeat:"repeat","repeat-round":"round","repeat-space":"space","repeat-x":"repeat-x","repeat-y":"repeat-y"}[t]}function Vo(t){return t.replace("-"," ")}function G(t){return $(t)}function Lo(t,o){const e=G(o);if(Po(o)){t.background=e;return}t.backgroundColor=e}function Po(t){const o=t.trim().toLowerCase();return o.includes("url(")||o.includes("gradient(")||o.includes("image-set(")||o.includes("cross-fade(")||o.includes("element(")||o.includes("paint(")}function $(t){return t.startsWith("--")?`var(${t})`:t}function wo(t,o){const{as:e,children:a,className:n,background:s,backgroundColor:m,bg:c,bgSize:r,bgRepeat:u,bgGroup:l,groupParent:d,bgPosition:h,border:y,boxShadow:B,color:v,cursor:g,opacity:b,overflow:S,overflowX:x,overflowY:k,pointerEvents:R,aspectRatio:W,transform:P,transformOrigin:C,p:w,m:p,outlineColor:N,outlineWidth:j,outlineOffset:I,outlineStyle:O,listStyle:E,display:A,position:i,width:Z,maxWidth:J,minWidth:Q,height:U,hover:oo,focusVisible:to,active:eo,disabledStyle:io,maxHeight:ro,minHeight:no,md:ao,lg:so,xl:fo,style:_,...co}=t,uo=e??"div",M=mo({hover:oo,focusVisible:to,active:eo,disabledStyle:io,background:s,backgroundColor:m,bg:c,bgSize:r,bgRepeat:u,bgGroup:l,groupParent:d,bgPosition:h,border:y,boxShadow:B,color:v,cursor:g,opacity:b,overflow:S,overflowX:x,overflowY:k,pointerEvents:R,aspectRatio:W,transform:P,transformOrigin:C,p:w,m:p,outlineColor:N,outlineWidth:j,outlineOffset:I,outlineStyle:O,listStyle:E,display:A,position:i,width:Z,maxWidth:J,minWidth:Q,height:U,maxHeight:ro,minHeight:no,md:ao,lg:so,xl:fo}),lo=M.style||_?{...M.style,..._}:void 0;return bo.jsx(uo,{className:L.cn(M.className,d&&"group",n),ref:o,style:lo,...co,children:a})}const No=po.forwardRef(wo);exports.Box=No;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Bt=require("react/jsx-runtime"),nt=require("react"),y=require("./responsive-style.config-B2m9jVlX.cjs"),L=require("./responsive-style.utils-BdyoDkKg.cjs");function xt(o){return[o.animation,...y.responsiveBreakpoints.map(t=>o[t]?.animation)].some(t=>t==="spin"||typeof t=="object"&&t!==null&&(Array.isArray(t.keyframes)||t.preset==="spin"))}function U(o,t){if(typeof o=="number")return Number.isFinite(o)?o:t;if(o===void 0)return t;const i=/^\s*(-?(?:\d+(?:\.\d*)?|\.\d+))(ms|s)\s*$/.exec(o);return i?Number(i[1])*(i[2]==="s"?1e3:1):t}function tt(o,t,i){const n=y.responsiveBreakpoints.map(e=>window.matchMedia("(min-width: "+y.responsiveBreakpointMinWidth[e]+")")),s=window.matchMedia("(prefers-reduced-motion: reduce)");let r,d="";const u=()=>{let e={};const c=[t.animation,...y.responsiveBreakpoints.map((g,m)=>n[m].matches?t[g]?.animation:void 0)];for(const g of c)if(g!==void 0)if(g==="none")e={};else{const m=g==="spin"?{preset:"spin",keyframes:null}:g;e={...e,...m,...m.easing!==void 0?{timingFunction:m.easing}:{},...m.iterations!==void 0?{iterationCount:m.iterations===1/0?"infinite":m.iterations}:{}}}const b=e.keyframes??(e.preset==="spin"?[{transform:"rotate(0deg)"},{transform:"rotate(360deg)"}]:void 0),l=i?.animation!==void 0||i?.animationName!==void 0||s.matches&&e.reducedMotion!=="keep",f=b?.map(g=>Object.fromEntries(Object.entries(g).filter(([m])=>m==="offset"||m==="easing"||m==="composite"||!(m in(i??{}))))),p=JSON.stringify([f,e,l]);d!==p&&(d=p,r?.cancel(),r=void 0,!(!f?.length||l||typeof o.animate!="function")&&(r=o.animate(f,{duration:Math.max(0,U(i?.animationDuration??e.duration,1e3)),delay:U(i?.animationDelay??e.delay,0),easing:i?.animationTimingFunction??e.timingFunction??"linear",iterations:i?.animationIterationCount!==void 0?i.animationIterationCount==="infinite"?1/0:Math.max(0,Number(i.animationIterationCount)):e.iterationCount==="infinite"||e.iterationCount===void 0?1/0:Math.max(0,e.iterationCount),direction:i?.animationDirection??e.direction??"normal",fill:i?.animationFillMode??e.fillMode??"none"}),(i?.animationPlayState??e.playState)==="paused"&&r.pause()))};for(const e of[...n,s])e.addEventListener("change",u);return u(),()=>{for(const e of[...n,s])e.removeEventListener("change",u);r?.cancel()}}function St(o,t,i){return n=>{if(typeof o=="function"){const r=o(n);if(!n)return;const d=tt(n,t,i);return()=>{d(),typeof r=="function"?r():o(null)}}if(o&&(o.current=n),!n)return;const s=tt(n,t,i);return()=>{s(),o&&(o.current=null)}}}function Rt(o,t,i){if(o.scrollbar===void 0&&y.responsiveBreakpoints.every(r=>o[r]?.scrollbar===void 0))return;let n={};const s=[{value:o.scrollbar,prefix:"",variable:""},...y.responsiveBreakpoints.map(r=>({value:o[r]?.scrollbar,prefix:`${r}:`,variable:`${r}-`}))];t.push("lc-scrollbar");for(const[r,{value:d,prefix:u,variable:e}]of s.entries()){if(d!==void 0&&(n=d===null?{}:{...n,...Object.fromEntries(Object.entries(d).filter(([,f])=>f!==void 0))}),Object.entries(n).some(([f,p])=>f==="buttons"?p==="hidden":f!=="fallbackWidth"&&p!=null&&(typeof p!="number"||Number.isFinite(p)&&p>=0))){const f=y.responsiveBreakpoints[r],p=`${u}${f?`max-${f}:`:""}`;t.push(`${p}lc-scrollbar-custom`)}if(d===void 0)continue;const c=n.thumbColor,b=n.trackColor,l={size:_(n.size,"auto"),"thumb-color":c==null?"initial":L.normalizeCssTokenValue(c),"track-color":b==null?"initial":L.normalizeCssTokenValue(b),"thumb-radius":_(n.thumbRadius,"initial"),"track-radius":_(n.trackRadius,"initial"),buttons:n.buttons==="hidden"?"none":"initial",width:n.fallbackWidth??"auto",colors:c==null&&b==null?"auto":`${c==null?"CanvasText":L.normalizeCssTokenValue(c)} ${b==null?"Canvas":L.normalizeCssTokenValue(b)}`};for(const[f,p]of Object.entries(l))i[`--${e}scrollbar-${f}`]=p,t.push(`${u}[--lc-scrollbar-${f}:var(--${e}scrollbar-${f})]`)}}function _(o,t){return o==null?t:typeof o=="number"?Number.isFinite(o)&&o>=0?`${o}px`:t:L.normalizeCssTokenValue(o)}function et({background:o,backgroundColor:t,bg:i,bgSize:n,bgRepeat:s,bgPosition:r,border:d,boxShadow:u,color:e,cursor:c,opacity:b,overflow:l,overflowX:f,overflowY:p,pointerEvents:g,aspectRatio:m,transform:k,transformOrigin:h,p:R,m:C,outlineColor:x,outlineWidth:S,outlineOffset:W,outlineStyle:V,listStyle:z,display:N,position:$,width:P,maxWidth:I,minWidth:O,height:M,maxHeight:A,minHeight:E}){const a={};return i!==void 0?Dt(a,i):o!==void 0&&(a.background=D(o)),t!==void 0&&(a.backgroundColor=D(t)),n!==void 0&&(a.backgroundSize=Et(n)),s!==void 0&&(a.backgroundRepeat=Ft(s)),r!==void 0&&(a.backgroundPosition=qt(r)),Nt(a,d),u!==void 0&&(a.boxShadow=B(u)),e!==void 0&&(a.color=B(e)),c!==void 0&&(a.cursor=c),b!==void 0&&(a.opacity=typeof b=="number"?b:B(b)),l!==void 0&&(a.overflowX=l,a.overflowY=l),f!==void 0&&(a.overflowX=f),p!==void 0&&(a.overflowY=p),g!==void 0&&(a.pointerEvents=g),m!==void 0&&(a.aspectRatio=typeof m=="number"?String(m):B(m)),k!==void 0&&(a.transform=B(k)),h!==void 0&&(a.transformOrigin=B(h)),jt(a,R),Lt(a,C),x!==void 0&&(a.outlineColor=B(x)),S!==void 0&&(a.outlineWidth=S),W!==void 0&&(a.outlineOffset=W),V!==void 0&&(a.outlineStyle=V),z?.position!==void 0&&(a.listStylePosition=z.position),z?.type!==void 0&&(a.listStyleType=z.type),N!==void 0&&(a.display=At(N)),$?.type!==void 0&&(a.position=$.type),$?.top!==void 0&&(a.top=q($.top)),$?.left!==void 0&&(a.left=q($.left)),$?.right!==void 0&&(a.right=q($.right)),$?.bottom!==void 0&&(a.bottom=q($.bottom)),$?.zIndex!==void 0&&(a.zIndex=$.zIndex),P!==void 0&&(a.width=T(P)),I!==void 0&&(a.maxWidth=T(I)),O!==void 0&&(a.minWidth=T(O)),M!==void 0&&(a.height=T(M)),A!==void 0&&(a.maxHeight=T(A)),E!==void 0&&(a.minHeight=T(E)),Object.keys(a).length>0?a:void 0}function Ct(o){const t=[],i={},n=o.groupParent===!0;it(o,t,i,{isGroupParent:n});for(const s of y.responsiveBreakpoints){const r=o[s];r&&it(r,t,i,{classPrefix:`${s}:`,variablePrefix:`${s}-`,isGroupParent:n})}return Rt(o,t,i),Wt(o,t,i),zt(o,t,i),{className:t.join(" "),style:Object.keys(i).length>0?i:void 0}}function Wt(o,t,i){let n={};const s=[{value:o.animation,prefix:"",variable:""},...y.responsiveBreakpoints.map(r=>({value:o[r]?.animation,prefix:r+":",variable:r+"-"}))];for(const r of s)if(r.value!==void 0){if(r.value==="none")n={},i[`--${r.variable}animation`]="none";else{const d=r.value==="spin"?{preset:"spin",keyframes:null}:r.value;n={...n,...d,...d.easing!==void 0?{timingFunction:d.easing}:{},...d.iterations!==void 0?{iterationCount:d.iterations===1/0?"infinite":d.iterations}:{}};const u=n.keyframes||n.preset==="spin"?"none":n.preset??"none";i[`--${r.variable}animation`]=[u,typeof n.duration=="number"?n.duration+"ms":n.duration??"1s",n.timingFunction??"linear",typeof n.delay=="number"?n.delay+"ms":n.delay??"0ms",n.iterationCount??"infinite",n.direction??"normal",n.fillMode??"none",n.playState??"running"].join(" ")}t.push(`${r.prefix}[animation:var(--${r.variable}animation)]`)}}const K=[{prop:"hover",name:"hover",variant:"[@media(hover:hover)_and_(pointer:fine)]:[&:hover:not(:disabled):not([aria-disabled=true]):not([data-disabled=true])]"},{prop:"focusVisible",name:"focus-visible",variant:"[&:focus-visible:not(:disabled):not([aria-disabled=true]):not([data-disabled=true])]"},{prop:"active",name:"active",variant:"[&:active:not(:disabled):not([aria-disabled=true]):not([data-disabled=true])]"},{prop:"disabledStyle",name:"disabled",variant:"[&:is(:disabled,[aria-disabled=true],[data-disabled=true]):is(:disabled,[aria-disabled=true],[data-disabled=true])]"}];function zt(o,t,i){const n=[o,...y.responsiveBreakpoints.map(e=>o[e]??{})],s=new Set;for(const e of K)for(const c of n)Object.keys(ot(c,e.prop)).forEach(b=>s.add(b)),e.prop==="hover"&&c.hover===null&&s.add("backgroundColor");if(s.size===0)return;for(const e of s){const c=Y(e);for(const b of K)t.push(`[--ui-state-${b.name}-${c}:initial]`)}let r={};const d=new Map,u=new Map;n.forEach((e,c)=>{r={...r,...X(e)};const b=c===0?"":`${y.responsiveBreakpoints[c-1]}:`;for(const l of K){const f=d.get(l.name)??{},p=ot(e,l.prop),g=e[l.prop]===null?{}:{...f,...p},m=u.get(l.name)??new Set;Object.keys(p).forEach(k=>m.add(k)),l.prop==="hover"&&e.hover===null&&m.add("backgroundColor"),d.set(l.name,g),u.set(l.name,m);for(const k of m){const h=Y(k),R=r[k]??Tt(k,c),C=`--ui-state-normal-${c}-${h}`;i[C]=String(R);const x=`--${l.name}-${c}-${h}`;i[x]=String(g[k]??R);const S=`--ui-state-value-${l.name}-${c}-${h}`;i[S]=g[k]===void 0?"initial":`var(${x})`;const W=`var(--ui-state-disabled-${h},var(--ui-state-active-${h},var(--ui-state-focus-visible-${h},var(--ui-state-hover-${h},var(${C})))))`;t.push(`${b}${l.variant}:[--ui-state-${l.name}-${h}:var(${S})]`,`${b}${l.variant}:[${h}:${W}]`)}}})}function ot(o,t){const i=o[t];return i?t!=="hover"&&"outlineWidth"in i&&i.outlineStyle===void 0?X({...i,outlineStyle:"solid"}):X(i):{}}function Tt(o,t){const i=o==="color"?"inherit":"initial";if(o!=="background"&&o!=="backgroundColor"&&o!=="color")return i;const n=o==="color"?"color":"bg";let s=`var(--button-${n},${i})`;for(let r=0;r<t;r+=1)s=`var(--${y.responsiveBreakpoints[r]}-button-${n},${s})`;return s}function X(o){const t={...et(o)};if(t.borderWidth!==void 0){const i=String(t.borderWidth).split(/\s+(?![^()]*\))/),n=i[0],s=i[1]??n,r=i[2]??n,d=i[3]??s;Object.assign(t,{borderTopWidth:n,borderRightWidth:s,borderBottomWidth:r,borderLeftWidth:d}),delete t.borderWidth}if(t.borderRadius!==void 0){const[i,n=i]=String(t.borderRadius).split("/"),s=u=>{const e=u.trim().split(/\s+(?![^()]*\))/);return[e[0],e[1]??e[0],e[2]??e[0],e[3]??e[1]??e[0]]},r=s(i),d=s(n);["TopLeft","TopRight","BottomRight","BottomLeft"].forEach((u,e)=>{t[`border${u}Radius`]=`${r[e]} ${d[e]}`}),delete t.borderRadius}return t}function it(o,t,i,{classPrefix:n="",variablePrefix:s="",isGroupParent:r=!1}={}){const d=et(o);for(const[u,e]of Object.entries(d??{})){if(e==null)continue;const c=String(e),b=Vt(u,c);if(b){t.push(`${n}${b}`);continue}const l=`${s}${Y(u)}`,f=wt(u,l);f&&(i[`--${l}`]=c,t.push(`${n}${f}`))}if(o.bgGroup!==void 0){const u=`${s}group-background`;i[`--${u}`]=D(o.bgGroup),t.push(`${n}group-hover:[background:var(--${u})]`),r&&t.push(`${n}hover:[background:var(--${u})]`)}}function Vt(o,t){if(o==="display")return t==="none"?"hidden":t;if(o==="position")return t==="inherit"?"[position:inherit]":t;if(o==="cursor")return`cursor-${t}`;if(o==="backgroundRepeat")return{"no-repeat":"bg-no-repeat",repeat:"bg-repeat",round:"bg-repeat-round",space:"bg-repeat-space","repeat-x":"bg-repeat-x","repeat-y":"bg-repeat-y"}[t];if(o==="backgroundSize")return{auto:"bg-auto",contain:"bg-contain",cover:"bg-cover"}[t];if(o==="backgroundPosition")return{bottom:"bg-bottom",center:"bg-center",left:"bg-left","left bottom":"bg-left-bottom","left top":"bg-left-top",right:"bg-right","right bottom":"bg-right-bottom","right top":"bg-right-top",top:"bg-top"}[t];if(o==="borderStyle")return t==="none"?"border-none":`border-${t}`;if(o==="outlineStyle")return t==="none"?"outline-none":`outline-${t}`;if(o==="listStylePosition")return`list-${t}`;if(o==="listStyleType")return`list-${t}`}function wt(o,t){const i=`var(--${t})`;return{background:`[background:${i}]`,backgroundColor:`bg-[${i}]`,backgroundPosition:`bg-[position:${i}]`,backgroundSize:`bg-[length:${i}]`,aspectRatio:`[aspect-ratio:${i}]`,borderBottomLeftRadius:`rounded-bl-[${i}]`,borderBottomRightRadius:`rounded-br-[${i}]`,borderBottomWidth:`border-b-[length:${i}]`,borderColor:`border-[color:${i}]`,borderLeftWidth:`border-l-[length:${i}]`,borderRadius:`rounded-[${i}]`,borderRightWidth:`border-r-[length:${i}]`,borderTopLeftRadius:`rounded-tl-[${i}]`,borderTopRightRadius:`rounded-tr-[${i}]`,borderTopWidth:`border-t-[length:${i}]`,borderWidth:`border-[length:${i}]`,boxShadow:`[box-shadow:${i}]`,bottom:`bottom-[${i}]`,color:`[color:${i}]`,height:`h-[${i}]`,left:`left-[${i}]`,margin:`m-[${i}]`,marginBottom:`mb-[${i}]`,marginLeft:`ml-[${i}]`,marginRight:`mr-[${i}]`,marginTop:`mt-[${i}]`,maxHeight:`max-h-[${i}]`,maxWidth:`max-w-[${i}]`,minHeight:`min-h-[${i}]`,minWidth:`min-w-[${i}]`,outlineColor:`outline-[color:${i}]`,outlineOffset:`outline-offset-[${i}]`,outlineWidth:`outline-[length:${i}]`,opacity:`[opacity:${i}]`,overflowX:`[overflow-x:${i}]`,overflowY:`[overflow-y:${i}]`,padding:`p-[${i}]`,paddingBottom:`pb-[${i}]`,paddingLeft:`pl-[${i}]`,paddingRight:`pr-[${i}]`,paddingTop:`pt-[${i}]`,pointerEvents:`[pointer-events:${i}]`,right:`right-[${i}]`,top:`top-[${i}]`,transform:`[transform:${i}]`,transformOrigin:`[transform-origin:${i}]`,width:`w-[${i}]`,zIndex:`z-[${i}]`}[o]}function Y(o){return o.replace(/[A-Z]/g,t=>`-${t.toLowerCase()}`)}function jt(o,t){if(t!==void 0){if(Array.isArray(t)){o.padding=t.map(v).join(" ");return}if(typeof t!="object"){o.padding=v(t);return}"px"in t&&t.px!==void 0&&(o.paddingLeft=v(t.px),o.paddingRight=v(t.px)),"py"in t&&t.py!==void 0&&(o.paddingTop=v(t.py),o.paddingBottom=v(t.py)),"pt"in t&&t.pt!==void 0&&(o.paddingTop=v(t.pt)),"pb"in t&&t.pb!==void 0&&(o.paddingBottom=v(t.pb)),"pl"in t&&t.pl!==void 0&&(o.paddingLeft=v(t.pl)),"pr"in t&&t.pr!==void 0&&(o.paddingRight=v(t.pr))}}function Lt(o,t){if(t!==void 0){if(Array.isArray(t)){o.margin=t.map(v).join(" ");return}if(typeof t!="object"){o.margin=v(t);return}"mx"in t&&t.mx!==void 0&&(o.marginLeft=v(t.mx),o.marginRight=v(t.mx)),"my"in t&&t.my!==void 0&&(o.marginTop=v(t.my),o.marginBottom=v(t.my)),"mt"in t&&t.mt!==void 0&&(o.marginTop=v(t.mt)),"mb"in t&&t.mb!==void 0&&(o.marginBottom=v(t.mb)),"ml"in t&&t.ml!==void 0&&(o.marginLeft=v(t.ml)),"mr"in t&&t.mr!==void 0&&(o.marginRight=v(t.mr))}}function Nt(o,t){t&&(t.radius!==void 0&&Pt(o,t.radius),t.color!==void 0&&(o.borderColor=B(t.color)),t.width!==void 0&&It(o,t.width),t.style!==void 0&&(o.borderStyle=t.style))}function Pt(o,t){if(Ot(t)){t.topLeft!==void 0&&(o.borderTopLeftRadius=w(t.topLeft)),t.topRight!==void 0&&(o.borderTopRightRadius=w(t.topRight)),t.bottomLeft!==void 0&&(o.borderBottomLeftRadius=w(t.bottomLeft)),t.bottomRight!==void 0&&(o.borderBottomRightRadius=w(t.bottomRight));return}o.borderRadius=w(t)}function It(o,t){if(Mt(t)){t.top!==void 0&&(o.borderTopWidth=j(t.top)),t.bottom!==void 0&&(o.borderBottomWidth=j(t.bottom)),t.left!==void 0&&(o.borderLeftWidth=j(t.left)),t.right!==void 0&&(o.borderRightWidth=j(t.right));return}o.borderWidth=j(t)}function Ot(o){return typeof o=="object"}function Mt(o){return typeof o=="object"}function w(o){return o.startsWith("--")?`var(${o})`:o}function j(o){return o.startsWith("--")?`var(${o})`:o}function At(o){return o==="hidden"?"none":o}function q(o){return typeof o=="number"?`${o}px`:o}function v(o){return typeof o=="number"?`${o}px`:o}function T(o){return typeof o=="number"?`${o}px`:o}function Et(o){return typeof o=="number"?`${o}px`:o}function Ft(o){return{"no-repeat":"no-repeat",repeat:"repeat","repeat-round":"round","repeat-space":"space","repeat-x":"repeat-x","repeat-y":"repeat-y"}[o]}function qt(o){return o.replace("-"," ")}function D(o){return B(o)}function Dt(o,t){const i=D(t);if(Ht(t)){o.background=i;return}o.backgroundColor=i}function Ht(o){const t=o.trim().toLowerCase();return t.includes("url(")||t.includes("gradient(")||t.includes("image-set(")||t.includes("cross-fade(")||t.includes("element(")||t.includes("paint(")}function B(o){return o.startsWith("--")?`var(${o})`:o}function Gt(o,t){const{as:i,children:n,className:s,background:r,backgroundColor:d,bg:u,bgSize:e,bgRepeat:c,bgGroup:b,groupParent:l,bgPosition:f,border:p,boxShadow:g,color:m,cursor:k,opacity:h,overflow:R,overflowX:C,overflowY:x,scrollbar:S,pointerEvents:W,animation:V,aspectRatio:z,transform:N,transformOrigin:$,p:P,m:I,outlineColor:O,outlineWidth:M,outlineOffset:A,outlineStyle:E,listStyle:a,display:rt,position:at,width:st,maxWidth:dt,minWidth:ut,height:ct,hover:lt,focusVisible:ft,active:mt,disabledStyle:bt,maxHeight:pt,minHeight:vt,md:J,lg:Z,xl:Q,style:F,...gt}=o,ht=i??"div",H={hover:lt,focusVisible:ft,active:mt,disabledStyle:bt,background:r,backgroundColor:d,bg:u,bgSize:e,bgRepeat:c,bgGroup:b,groupParent:l,bgPosition:f,border:p,boxShadow:g,color:m,cursor:k,opacity:h,overflow:R,overflowX:C,overflowY:x,scrollbar:S,pointerEvents:W,animation:V,aspectRatio:z,transform:N,transformOrigin:$,p:P,m:I,outlineColor:O,outlineWidth:M,outlineOffset:A,outlineStyle:E,listStyle:a,display:rt,position:at,width:st,maxWidth:dt,minWidth:ut,height:ct,maxHeight:pt,minHeight:vt,md:J,lg:Z,xl:Q},$t=JSON.stringify([V,J?.animation,Z?.animation,Q?.animation,F]),yt=nt.useMemo(()=>St(t,H,F),[t,$t]),G=Ct(H),kt=G.style||F?{...G.style,...F}:void 0;return Bt.jsx(ht,{className:y.cn(G.className,l&&"group",s),ref:xt(H)?yt:t,style:kt,...gt,children:n})}const _t=nt.forwardRef(Gt);exports.Box=_t;