wimui 0.1.0

package/dist/components/data-display/Carousel/Carousel.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../../icon/chevron-left.cjs"),r=require("../../../icon/chevron-right.cjs"),i=require("../../media/Icon/Icon.cjs"),a=require("./carousel.module.cjs");let o=require("react");o=e.__toESM(o,1);let s=require("classnames");s=e.__toESM(s,1);let c=require("react/jsx-runtime");var l={slideLabel:e=>`Slide ${e}`,prevSlide:`Previous slide`,nextSlide:`Next slide`,goToSlide:e=>`Go to slide ${e}`},u=(e,t)=>typeof e==`number`?e:e?t>=1280&&e.xl?e.xl:t>=1024&&e.lg?e.lg:t>=768&&e.md?e.md:t>=640&&e.sm?e.sm:e.base||1:1,d=(0,o.forwardRef)(({children:e,autoPlay:d=!1,interval:f=5e3,showIndicators:p=!0,showControls:m=!0,loop:h=!0,slidesToShow:g=1,aspectRatio:_,objectFit:v=`cover`,labels:y,className:b,asChild:x,...S},C)=>{let w=x?t.Root:`div`,T={...l,...y},E=(0,o.useMemo)(()=>o.default.Children.toArray(e),[e]),D=E.length,[O,k]=(0,o.useState)(typeof window<`u`?window.innerWidth:0),[A,j]=(0,o.useState)(h?D:0),[M,N]=(0,o.useState)(!1),[P,F]=(0,o.useState)(!1),I=u(g,O),L=(0,o.useRef)(null),R=(0,o.useRef)(null),z=(0,o.useRef)(null),B=(0,o.useRef)(null);(0,o.useEffect)(()=>{let e=()=>k(window.innerWidth);return window.addEventListener(`resize`,e),()=>window.removeEventListener(`resize`,e)},[]);let V=(0,o.useMemo)(()=>!h||D===0?E:[...E,...E,...E],[E,h,D]),H=(0,o.useCallback)(()=>{if(!M){if(!h){j(e=>Math.min(e+1,D-I));return}N(!0),j(e=>e+1)}},[M,h,D,I]),U=(0,o.useCallback)(()=>{if(!M){if(!h){j(e=>Math.max(e-1,0));return}N(!0),j(e=>e-1)}},[M,h]),W=e=>{M||(h?(N(!0),j(e+D)):j(e))},G=()=>{h&&(N(!1),A>=D*2?j(A-D):A<D&&j(A+D))};(0,o.useEffect)(()=>(d&&!P&&D>I&&(L.current=window.setInterval(H,f)),()=>{L.current&&window.clearInterval(L.current)}),[d,f,H,D,I,P]);let K=e=>{e.key===`ArrowLeft`?U():e.key===`ArrowRight`&&H()},q=e=>{z.current=e.targetTouches[0].clientX},J=e=>{B.current=e.targetTouches[0].clientX},Y=()=>{if(!z.current||!B.current)return;let e=z.current-B.current;e>50?H():e<-50&&U(),z.current=null,B.current=null};if(D===0)return null;let X=100/I,Z=-A*X;return(0,c.jsxs)(w,{ref:C,className:(0,s.default)(`wim-carousel`,a.default.root,b),onMouseEnter:()=>F(!0),onMouseLeave:()=>F(!1),onFocus:()=>F(!0),onBlur:()=>F(!1),onKeyDown:K,tabIndex:0,role:`region`,"aria-roledescription":`carousel`,...S,children:[(0,c.jsx)(`div`,{className:a.default.viewport,children:(0,c.jsx)(`div`,{ref:R,className:(0,s.default)(a.default.track,M&&a.default.transition),style:{transform:`translateX(${Z}%)`},onTransitionEnd:G,onTouchStart:q,onTouchMove:J,onTouchEnd:Y,children:V.map((e,t)=>(0,c.jsx)(`div`,{className:(0,s.default)(a.default.item,_&&a.default.hasAspectRatio),style:{flex:`0 0 ${X}%`,width:`${X}%`,..._?{aspectRatio:_,"--wim-carousel-object-fit":v}:{}},role:`group`,"aria-roledescription":`slide`,"aria-label":T.slideLabel(t%D+1),children:e},t))})}),m&&D>I&&(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(`button`,{className:(0,s.default)(a.default.control,a.default.prev),onClick:U,"aria-label":T.prevSlide,disabled:!h&&A===0,tabIndex:-1,children:(0,c.jsx)(i.Icon,{component:n.default,size:`md`})}),(0,c.jsx)(`button`,{className:(0,s.default)(a.default.control,a.default.next),onClick:H,"aria-label":T.nextSlide,disabled:!h&&A>=D-I,tabIndex:-1,children:(0,c.jsx)(i.Icon,{component:r.default,size:`md`})})]}),p&&D>1&&(0,c.jsx)(`div`,{className:a.default.indicators,children:E.map((e,t)=>{let n=h?A%D===t:A===t;return(0,c.jsx)(`button`,{className:(0,s.default)(a.default.indicator,n&&a.default.active),onClick:()=>W(t),"aria-label":T.goToSlide(t+1),"aria-current":n?`true`:`false`},t)})})]})});d.displayName=`Carousel`,exports.Carousel=d;

package/dist/components/data-display/Carousel/Carousel.d.ts

@@ -0,0 +1,46 @@
+import { default as React } from 'react';
+export type Breakpoints = {
+    base?: number;
+    sm?: number;
+    md?: number;
+    lg?: number;
+    xl?: number;
+};
+export type CarouselLabels = {
+    slideLabel?: (number: number) => string;
+    prevSlide?: string;
+    nextSlide?: string;
+    goToSlide?: (number: number) => string;
+};
+export type CarouselProps = {
+    /** Content of the carousel */
+    children?: React.ReactNode;
+    /** Whether to auto-play */
+    autoPlay?: boolean;
+    /** Auto-play interval (in milliseconds) */
+    interval?: number;
+    /** Whether to show the indicators */
+    showIndicators?: boolean;
+    /** Whether to show the previous/next buttons */
+    showControls?: boolean;
+    /** Whether to loop infinitely (seamless transitions) */
+    loop?: boolean;
+    /** Number of slides to show at once. A number or an object per breakpoint. */
+    slidesToShow?: number | Breakpoints;
+    /** Aspect ratio (e.g. '16/9', '4/3', '1/1'). */
+    aspectRatio?: string;
+    /** How the image fits. Effective when aspectRatio is set. (default: 'cover') */
+    objectFit?: "fill" | "contain" | "cover" | "none" | "scale-down";
+    /** Labels for manual translation. */
+    labels?: CarouselLabels;
+    /** Additional class names */
+    className?: string;
+    /**
+     * Whether to use the Radix Slot pattern
+     */
+    asChild?: boolean;
+};
+/**
+ * `Carousel` は複数のコンテンツをスライドさせて表示するコンポーネントです。
+ */
+export declare const Carousel: React.ForwardRefExoticComponent<CarouselProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/data-display/Carousel/Carousel.js

@@ -0,0 +1,160 @@
+"use client";
+import { Root as e } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
+import t from "../../../icon/chevron-left.js";
+import n from "../../../icon/chevron-right.js";
+import { Icon as r } from "../../media/Icon/Icon.js";
+import i from "./carousel.module.js";
+import a, { forwardRef as o, useCallback as s, useEffect as c, useMemo as l, useRef as u, useState as d } from "react";
+import f from "classnames";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/components/data-display/Carousel/Carousel.tsx
+var g = {
+	slideLabel: (e) => `Slide ${e}`,
+	prevSlide: "Previous slide",
+	nextSlide: "Next slide",
+	goToSlide: (e) => `Go to slide ${e}`
+}, _ = (e, t) => typeof e == "number" ? e : e ? t >= 1280 && e.xl ? e.xl : t >= 1024 && e.lg ? e.lg : t >= 768 && e.md ? e.md : t >= 640 && e.sm ? e.sm : e.base || 1 : 1, v = o(({ children: o, autoPlay: v = !1, interval: y = 5e3, showIndicators: b = !0, showControls: ee = !0, loop: x = !0, slidesToShow: S = 1, aspectRatio: C, objectFit: w = "cover", labels: T, className: E, asChild: D, ...O }, k) => {
+	let A = D ? e : "div", j = {
+		...g,
+		...T
+	}, M = l(() => a.Children.toArray(o), [o]), N = M.length, [P, F] = d(typeof window < "u" ? window.innerWidth : 0), [I, L] = d(x ? N : 0), [R, z] = d(!1), [B, V] = d(!1), H = _(S, P), U = u(null), W = u(null), G = u(null), K = u(null);
+	c(() => {
+		let e = () => F(window.innerWidth);
+		return window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
+	}, []);
+	let q = l(() => !x || N === 0 ? M : [
+		...M,
+		...M,
+		...M
+	], [
+		M,
+		x,
+		N
+	]), J = s(() => {
+		if (!R) {
+			if (!x) {
+				L((e) => Math.min(e + 1, N - H));
+				return;
+			}
+			z(!0), L((e) => e + 1);
+		}
+	}, [
+		R,
+		x,
+		N,
+		H
+	]), Y = s(() => {
+		if (!R) {
+			if (!x) {
+				L((e) => Math.max(e - 1, 0));
+				return;
+			}
+			z(!0), L((e) => e - 1);
+		}
+	}, [R, x]), X = (e) => {
+		R || (x ? (z(!0), L(e + N)) : L(e));
+	}, Z = () => {
+		x && (z(!1), I >= N * 2 ? L(I - N) : I < N && L(I + N));
+	};
+	c(() => (v && !B && N > H && (U.current = window.setInterval(J, y)), () => {
+		U.current && window.clearInterval(U.current);
+	}), [
+		v,
+		y,
+		J,
+		N,
+		H,
+		B
+	]);
+	let Q = (e) => {
+		e.key === "ArrowLeft" ? Y() : e.key === "ArrowRight" && J();
+	}, te = (e) => {
+		G.current = e.targetTouches[0].clientX;
+	}, ne = (e) => {
+		K.current = e.targetTouches[0].clientX;
+	}, re = () => {
+		if (!G.current || !K.current) return;
+		let e = G.current - K.current;
+		e > 50 ? J() : e < -50 && Y(), G.current = null, K.current = null;
+	};
+	if (N === 0) return null;
+	let $ = 100 / H, ie = -I * $;
+	return /* @__PURE__ */ h(A, {
+		ref: k,
+		className: f("wim-carousel", i.root, E),
+		onMouseEnter: () => V(!0),
+		onMouseLeave: () => V(!1),
+		onFocus: () => V(!0),
+		onBlur: () => V(!1),
+		onKeyDown: Q,
+		tabIndex: 0,
+		role: "region",
+		"aria-roledescription": "carousel",
+		...O,
+		children: [
+			/* @__PURE__ */ m("div", {
+				className: i.viewport,
+				children: /* @__PURE__ */ m("div", {
+					ref: W,
+					className: f(i.track, R && i.transition),
+					style: { transform: `translateX(${ie}%)` },
+					onTransitionEnd: Z,
+					onTouchStart: te,
+					onTouchMove: ne,
+					onTouchEnd: re,
+					children: q.map((e, t) => /* @__PURE__ */ m("div", {
+						className: f(i.item, C && i.hasAspectRatio),
+						style: {
+							flex: `0 0 ${$}%`,
+							width: `${$}%`,
+							...C ? {
+								aspectRatio: C,
+								"--wim-carousel-object-fit": w
+							} : {}
+						},
+						role: "group",
+						"aria-roledescription": "slide",
+						"aria-label": j.slideLabel(t % N + 1),
+						children: e
+					}, t))
+				})
+			}),
+			ee && N > H && /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("button", {
+				className: f(i.control, i.prev),
+				onClick: Y,
+				"aria-label": j.prevSlide,
+				disabled: !x && I === 0,
+				tabIndex: -1,
+				children: /* @__PURE__ */ m(r, {
+					component: t,
+					size: "md"
+				})
+			}), /* @__PURE__ */ m("button", {
+				className: f(i.control, i.next),
+				onClick: J,
+				"aria-label": j.nextSlide,
+				disabled: !x && I >= N - H,
+				tabIndex: -1,
+				children: /* @__PURE__ */ m(r, {
+					component: n,
+					size: "md"
+				})
+			})] }),
+			b && N > 1 && /* @__PURE__ */ m("div", {
+				className: i.indicators,
+				children: M.map((e, t) => {
+					let n = x ? I % N === t : I === t;
+					return /* @__PURE__ */ m("button", {
+						className: f(i.indicator, n && i.active),
+						onClick: () => X(t),
+						"aria-label": j.goToSlide(t + 1),
+						"aria-current": n ? "true" : "false"
+					}, t);
+				})
+			})
+		]
+	});
+});
+v.displayName = "Carousel";
+//#endregion
+export { v as Carousel };

package/dist/components/data-display/Carousel/carousel.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_1aok4_2`,t=`_viewport_1aok4_11`,n=`_track_1aok4_15`,r=`_transition_1aok4_19`,i=`_item_1aok4_22`,a=`_hasAspectRatio_1aok4_27`,o=`_control_1aok4_41`,s=`_prev_1aok4_65`,c=`_next_1aok4_68`,l=`_indicators_1aok4_72`,u=`_indicator_1aok4_72`,d=`_active_1aok4_91`,f={root:e,viewport:t,track:n,transition:r,item:i,hasAspectRatio:a,control:o,prev:s,next:c,indicators:l,indicator:u,active:d};exports.active=d,exports.control=o,exports.default=f,exports.hasAspectRatio=a,exports.indicator=u,exports.indicators=l,exports.item=i,exports.next=c,exports.prev=s,exports.root=e,exports.track=n,exports.transition=r,exports.viewport=t;

package/dist/components/data-display/Carousel/carousel.module.js

@@ -0,0 +1,18 @@
+"use client";
+//#region src/components/data-display/Carousel/carousel.module.scss
+var e = "_root_1aok4_2", t = "_viewport_1aok4_11", n = "_track_1aok4_15", r = "_transition_1aok4_19", i = "_item_1aok4_22", a = "_hasAspectRatio_1aok4_27", o = "_control_1aok4_41", s = "_prev_1aok4_65", c = "_next_1aok4_68", l = "_indicators_1aok4_72", u = "_indicator_1aok4_72", d = "_active_1aok4_91", f = {
+	root: e,
+	viewport: t,
+	track: n,
+	transition: r,
+	item: i,
+	hasAspectRatio: a,
+	control: o,
+	prev: s,
+	next: c,
+	indicators: l,
+	indicator: u,
+	active: d
+};
+//#endregion
+export { d as active, o as control, f as default, a as hasAspectRatio, u as indicator, l as indicators, i as item, c as next, s as prev, e as root, n as track, r as transition, t as viewport };

package/dist/components/data-display/Chip/Chip.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../../i18n/useWimTranslation.cjs"),r=require("../../../icon/close.cjs"),i=require("../../media/Icon/Icon.cjs"),a=require("../../_internal/mergeRefs.cjs"),o=require("./chip.module.cjs");let s=require("react");s=e.__toESM(s,1);let c=require("classnames");c=e.__toESM(c,1);let l=require("react/jsx-runtime");var u=s.default.forwardRef(({asChild:e=!1,children:s,content:u,onClick:d,onDelete:f,avatar:p,icon:m,selected:h=!1,disabled:g=!1,intent:_=`primary`,variant:v=`solid`,size:y=`md`,deleteAriaLabel:b,className:x,...S},C)=>{let{t:w}=n.useWimTranslation(`common`),T=b??w(`a11y.delete`),E=e?t.Root:d?`button`:`span`,D=u??s;return(0,l.jsxs)(E,{ref:a.mergeRefs(C),className:(0,c.default)(`wim-chip`,o.default.root,o.default[_],o.default[v],o.default[y],h&&o.default.selected,d&&!g&&o.default.clickable,g&&o.default.disabled,x),onClick:g?void 0:d,...!e&&d?{disabled:g}:{},type:e?void 0:d?`button`:void 0,...S,children:[p&&(0,l.jsx)(`span`,{className:o.default.avatar,children:p}),!p&&m&&(0,l.jsx)(`span`,{className:o.default.icon,children:m}),(0,l.jsx)(`span`,{className:o.default.label,children:(0,l.jsx)(t.Slottable,{children:D})}),f&&!g&&(0,l.jsx)(`button`,{type:`button`,className:o.default.delete,"data-chip-delete":!0,onClick:e=>{e.stopPropagation(),f(e)},"aria-label":T,children:(0,l.jsx)(i.Icon,{component:r.default,size:`sm`})})]})});u.displayName=`Chip`,exports.Chip=u;

package/dist/components/data-display/Chip/Chip.d.ts

@@ -0,0 +1,69 @@
+import { default as React } from 'react';
+import { ComponentSizeBasic, IndicatorIntent, IndicatorVariant } from '../../../types/tokens';
+export type ChipProps = React.HTMLAttributes<HTMLElement> & {
+    /**
+     * If true, the chip will be rendered as its child, merging its props onto that child.
+     */
+    asChild?: boolean;
+    /** Content to display */
+    children?: React.ReactNode;
+    /** Content to display (alternative to children) */
+    content?: React.ReactNode;
+    /** Click event. When provided, the chip behaves as a button. */
+    onClick?: (e: React.MouseEvent<HTMLButtonElement | HTMLSpanElement>) => void;
+    /** Delete event. When provided, a × button is shown. */
+    onDelete?: (e: React.SyntheticEvent) => void;
+    /** Avatar (e.g. an image or initials) */
+    avatar?: React.ReactNode;
+    /** Icon */
+    icon?: React.ReactNode;
+    /** Whether the chip is selected */
+    selected?: boolean;
+    /** Whether the chip is disabled */
+    disabled?: boolean;
+    /** Intent (semantic state) */
+    intent?: IndicatorIntent;
+    /** Visual style variant */
+    variant?: IndicatorVariant;
+    /** Size */
+    size?: ComponentSizeBasic;
+    /** Accessible label for the delete button */
+    deleteAriaLabel?: string;
+    /** Additional class names */
+    className?: string;
+};
+/**
+ * Interactive token used for selection, filtering, or input.
+ */
+export declare const Chip: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
+    /**
+     * If true, the chip will be rendered as its child, merging its props onto that child.
+     */
+    asChild?: boolean;
+    /** Content to display */
+    children?: React.ReactNode;
+    /** Content to display (alternative to children) */
+    content?: React.ReactNode;
+    /** Click event. When provided, the chip behaves as a button. */
+    onClick?: (e: React.MouseEvent<HTMLButtonElement | HTMLSpanElement>) => void;
+    /** Delete event. When provided, a × button is shown. */
+    onDelete?: (e: React.SyntheticEvent) => void;
+    /** Avatar (e.g. an image or initials) */
+    avatar?: React.ReactNode;
+    /** Icon */
+    icon?: React.ReactNode;
+    /** Whether the chip is selected */
+    selected?: boolean;
+    /** Whether the chip is disabled */
+    disabled?: boolean;
+    /** Intent (semantic state) */
+    intent?: IndicatorIntent;
+    /** Visual style variant */
+    variant?: IndicatorVariant;
+    /** Size */
+    size?: ComponentSizeBasic;
+    /** Accessible label for the delete button */
+    deleteAriaLabel?: string;
+    /** Additional class names */
+    className?: string;
+} & React.RefAttributes<HTMLElement>>;

package/dist/components/data-display/Chip/Chip.js

@@ -0,0 +1,52 @@
+"use client";
+import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
+import { useWimTranslation as n } from "../../../i18n/useWimTranslation.js";
+import r from "../../../icon/close.js";
+import { Icon as i } from "../../media/Icon/Icon.js";
+import { mergeRefs as a } from "../../_internal/mergeRefs.js";
+import o from "./chip.module.js";
+import s from "react";
+import c from "classnames";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/data-display/Chip/Chip.tsx
+var d = s.forwardRef(({ asChild: s = !1, children: d, content: f, onClick: p, onDelete: m, avatar: h, icon: g, selected: _ = !1, disabled: v = !1, intent: y = "primary", variant: b = "solid", size: x = "md", deleteAriaLabel: S, className: C, ...w }, T) => {
+	let { t: E } = n("common"), D = S ?? E("a11y.delete"), O = s ? e : p ? "button" : "span", k = f ?? d;
+	return /* @__PURE__ */ u(O, {
+		ref: a(T),
+		className: c("wim-chip", o.root, o[y], o[b], o[x], _ && o.selected, p && !v && o.clickable, v && o.disabled, C),
+		onClick: v ? void 0 : p,
+		...!s && p ? { disabled: v } : {},
+		type: s ? void 0 : p ? "button" : void 0,
+		...w,
+		children: [
+			h && /* @__PURE__ */ l("span", {
+				className: o.avatar,
+				children: h
+			}),
+			!h && g && /* @__PURE__ */ l("span", {
+				className: o.icon,
+				children: g
+			}),
+			/* @__PURE__ */ l("span", {
+				className: o.label,
+				children: /* @__PURE__ */ l(t, { children: k })
+			}),
+			m && !v && /* @__PURE__ */ l("button", {
+				type: "button",
+				className: o.delete,
+				"data-chip-delete": !0,
+				onClick: (e) => {
+					e.stopPropagation(), m(e);
+				},
+				"aria-label": D,
+				children: /* @__PURE__ */ l(i, {
+					component: r,
+					size: "sm"
+				})
+			})
+		]
+	});
+});
+d.displayName = "Chip";
+//#endregion
+export { d as Chip };

package/dist/components/data-display/Chip/chip.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_1whsz_2`,t=`_md_1whsz_18`,n=`_avatar_1whsz_23`,r=`_sm_1whsz_28`,i=`_lg_1whsz_38`,a=`_clickable_1whsz_48`,o=`_primary_1whsz_59`,s=`_solid_1whsz_59`,c=`_outline_1whsz_65`,l=`_subtle_1whsz_70`,u=`_secondary_1whsz_76`,d=`_success_1whsz_93`,f=`_warning_1whsz_110`,p=`_danger_1whsz_127`,m=`_info_1whsz_144`,h=`_neutral_1whsz_161`,g=`_selected_1whsz_178`,_=`_disabled_1whsz_181`,v=`_label_1whsz_205`,y=`_icon_1whsz_210`,b={root:e,md:t,avatar:n,sm:r,lg:i,clickable:a,primary:o,solid:s,outline:c,subtle:l,secondary:u,success:d,warning:f,danger:p,info:m,neutral:h,selected:g,disabled:_,delete:`_delete_1whsz_189`,label:v,icon:y};exports.avatar=n,exports.clickable=a,exports.danger=p,exports.default=b,exports.disabled=_,exports.icon=y,exports.info=m,exports.label=v,exports.lg=i,exports.md=t,exports.neutral=h,exports.outline=c,exports.primary=o,exports.root=e,exports.secondary=u,exports.selected=g,exports.sm=r,exports.solid=s,exports.subtle=l,exports.success=d,exports.warning=f;

package/dist/components/data-display/Chip/chip.module.js

@@ -0,0 +1,27 @@
+"use client";
+//#region src/components/data-display/Chip/chip.module.scss
+var e = "_root_1whsz_2", t = "_md_1whsz_18", n = "_avatar_1whsz_23", r = "_sm_1whsz_28", i = "_lg_1whsz_38", a = "_clickable_1whsz_48", o = "_primary_1whsz_59", s = "_solid_1whsz_59", c = "_outline_1whsz_65", l = "_subtle_1whsz_70", u = "_secondary_1whsz_76", d = "_success_1whsz_93", f = "_warning_1whsz_110", p = "_danger_1whsz_127", m = "_info_1whsz_144", h = "_neutral_1whsz_161", g = "_selected_1whsz_178", _ = "_disabled_1whsz_181", v = "_label_1whsz_205", y = "_icon_1whsz_210", b = {
+	root: e,
+	md: t,
+	avatar: n,
+	sm: r,
+	lg: i,
+	clickable: a,
+	primary: o,
+	solid: s,
+	outline: c,
+	subtle: l,
+	secondary: u,
+	success: d,
+	warning: f,
+	danger: p,
+	info: m,
+	neutral: h,
+	selected: g,
+	disabled: _,
+	delete: "_delete_1whsz_189",
+	label: v,
+	icon: y
+};
+//#endregion
+export { n as avatar, a as clickable, p as danger, b as default, _ as disabled, y as icon, m as info, v as label, i as lg, t as md, h as neutral, c as outline, o as primary, e as root, u as secondary, g as selected, r as sm, s as solid, l as subtle, d as success, f as warning };

package/dist/components/data-display/Countdown/Countdown.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../../i18n/useWimTranslation.cjs"),r=require("./countdown.module.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("classnames");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=e=>e instanceof Date?e.getTime():new Date(e).getTime(),c=e=>String(e).padStart(2,`0`),l=(e,t)=>{let n=Math.floor(e/86400),r=Math.floor(t?e/3600:e%86400/3600),i=Math.floor(e%3600/60),a=e%60,o=[];return!t&&n>0&&o.push({unit:`day`,value:n}),(o.length>0||r>0)&&o.push({unit:`hour`,value:r}),o.push({unit:`minute`,value:i}),o.push({unit:`second`,value:a}),o},u=i.default.forwardRef(({target:e,baseDate:u,variant:d=`digital`,size:f=`md`,locale:p,unitDisplay:m=`short`,paused:h=!1,onComplete:g,completedContent:_,fallback:v,asChild:y=!1,className:b,children:x,...S},C)=>{let{t:w,i18n:T}=n.useWimTranslation(`data-display`),E=p??T?.language??`en`,D=y?t.Root:`time`,O=s(e),k=!Number.isNaN(O),A=u!==void 0,[j,M]=i.default.useState(()=>Date.now()),N=A?s(u):j,P=k?Math.max(0,O-N):0,F=k&&P<=0,I=!A&&!h&&k&&!F;i.default.useEffect(()=>{!h&&!A&&M(Date.now())},[h,A]),i.default.useEffect(()=>{if(!I)return;let e=(O-Date.now())%1e3||1e3,t=window.setTimeout(()=>M(Date.now()),e);return()=>window.clearTimeout(t)},[I,O,j]);let L=i.default.useRef(!1);i.default.useEffect(()=>{L.current=!1},[O]),i.default.useEffect(()=>{!k||A||!F||L.current||(L.current=!0,g?.())},[F,A,k,g]);let R=i.default.useMemo(()=>new Map,[E]),z=(e,t)=>{let n=`${e}-${t}`,r=R.get(n);if(!r){let i={style:`unit`,unit:e,unitDisplay:t};try{r=new Intl.NumberFormat(E,i)}catch{r=new Intl.NumberFormat(`en`,i)}R.set(n,r)}return r},B=e=>z(e.unit,m).formatToParts(e.value).filter(e=>e.type===`unit`).map(e=>e.value).join(``);if(!k)return(0,o.jsxs)(D,{ref:C,className:(0,a.default)(`wim-countdown`,r.default.root,b),...S,children:[(0,o.jsx)(t.Slottable,{children:x}),v]});let V=Math.floor(P/1e3),H=l(V,d===`digital`),U=F&&_!==void 0,W=l(V,!1).map(e=>z(e.unit,`long`).format(e.value)).join(` `);return(0,o.jsxs)(D,{ref:C,role:`timer`,"aria-label":U?void 0:w(`countdown.remaining`,{time:W}),className:(0,a.default)(`wim-countdown`,r.default.root,r.default[d],r.default[f],b),dateTime:new Date(O).toISOString(),...S,children:[(0,o.jsx)(t.Slottable,{children:x}),U?_:d===`digital`?H.map((e,t)=>(0,o.jsxs)(i.default.Fragment,{children:[t>0&&(0,o.jsx)(`span`,{className:r.default.separator,"aria-hidden":`true`,children:`:`}),(0,o.jsx)(`span`,{className:r.default.value,children:c(e.value)})]},e.unit)):H.map(e=>(0,o.jsxs)(`span`,{className:r.default.segment,children:[(0,o.jsx)(`span`,{className:r.default.value,children:e.unit===`day`?String(e.value):c(e.value)}),(0,o.jsx)(`span`,{className:r.default.label,children:B(e)})]},e.unit))]})});u.displayName=`Countdown`,exports.Countdown=u;

package/dist/components/data-display/Countdown/Countdown.d.ts

@@ -0,0 +1,128 @@
+import { default as React } from 'react';
+import { ComponentSizeBasic } from '../../../types/tokens';
+export type CountdownInput = Date | string | number;
+export type CountdownUnit = "day" | "hour" | "minute" | "second";
+export type CountdownProps = Omit<React.ComponentPropsWithoutRef<"time">, "dateTime"> & {
+    /**
+     * The moment the countdown ends, as a Date object, ISO 8601 string,
+     * or epoch milliseconds.
+     */
+    target: CountdownInput;
+    /**
+     * Reference point used as "now". When set, the countdown is frozen at
+     * that instant (useful for snapshots and tests).
+     */
+    baseDate?: CountdownInput;
+    /**
+     * "digital" renders a compact colon-separated clock (04:12:33);
+     * "units" renders one labeled segment per unit (days / hours / min / sec).
+     * @default "digital"
+     */
+    variant?: "digital" | "units";
+    /**
+     * Size of the numbers and labels.
+     * @default "md"
+     */
+    size?: ComponentSizeBasic;
+    /**
+     * BCP 47 locale override for unit labels (e.g. "en", "ja", "pt-BR").
+     * @default current i18next language
+     */
+    locale?: string;
+    /**
+     * Length of the unit labels in the "units" variant.
+     * @default "short"
+     */
+    unitDisplay?: "long" | "short" | "narrow";
+    /**
+     * Pauses the countdown while true. It resumes from the real remaining
+     * time (the target moment does not shift).
+     * @default false
+     */
+    paused?: boolean;
+    /**
+     * Called once when the remaining time reaches zero (also on mount if the
+     * target is already in the past). Not called when baseDate is set.
+     */
+    onComplete?: () => void;
+    /**
+     * Content shown instead of the zeroed digits once the countdown ends.
+     */
+    completedContent?: React.ReactNode;
+    /**
+     * Content shown when the target cannot be parsed.
+     */
+    fallback?: React.ReactNode;
+    /**
+     * If true, the component will be rendered as its child, merging its props onto that child.
+     */
+    asChild?: boolean;
+};
+/**
+ * Countdown displays the time remaining until a target moment as a live
+ * ticking clock, either as compact digits (04:12:33) or as labeled unit
+ * segments for sale banners and maintenance notices. Unit labels are
+ * localized through Intl.NumberFormat, so no locale data is bundled.
+ *
+ * Composition Contract:
+ * - Managed by: App consumption
+ * - Scroll lock: No
+ * - Timers: Owns its own 1-second refresh timer (cleared on unmount).
+ *   Provide baseDate to render a static snapshot, or paused to suspend it.
+ */
+export declare const Countdown: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.TimeHTMLAttributes<HTMLTimeElement>, HTMLTimeElement>, "ref">, "dateTime"> & {
+    /**
+     * The moment the countdown ends, as a Date object, ISO 8601 string,
+     * or epoch milliseconds.
+     */
+    target: CountdownInput;
+    /**
+     * Reference point used as "now". When set, the countdown is frozen at
+     * that instant (useful for snapshots and tests).
+     */
+    baseDate?: CountdownInput;
+    /**
+     * "digital" renders a compact colon-separated clock (04:12:33);
+     * "units" renders one labeled segment per unit (days / hours / min / sec).
+     * @default "digital"
+     */
+    variant?: "digital" | "units";
+    /**
+     * Size of the numbers and labels.
+     * @default "md"
+     */
+    size?: ComponentSizeBasic;
+    /**
+     * BCP 47 locale override for unit labels (e.g. "en", "ja", "pt-BR").
+     * @default current i18next language
+     */
+    locale?: string;
+    /**
+     * Length of the unit labels in the "units" variant.
+     * @default "short"
+     */
+    unitDisplay?: "long" | "short" | "narrow";
+    /**
+     * Pauses the countdown while true. It resumes from the real remaining
+     * time (the target moment does not shift).
+     * @default false
+     */
+    paused?: boolean;
+    /**
+     * Called once when the remaining time reaches zero (also on mount if the
+     * target is already in the past). Not called when baseDate is set.
+     */
+    onComplete?: () => void;
+    /**
+     * Content shown instead of the zeroed digits once the countdown ends.
+     */
+    completedContent?: React.ReactNode;
+    /**
+     * Content shown when the target cannot be parsed.
+     */
+    fallback?: React.ReactNode;
+    /**
+     * If true, the component will be rendered as its child, merging its props onto that child.
+     */
+    asChild?: boolean;
+} & React.RefAttributes<HTMLTimeElement>>;

package/dist/components/data-display/Countdown/Countdown.js

@@ -0,0 +1,100 @@
+"use client";
+import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
+import { useWimTranslation as n } from "../../../i18n/useWimTranslation.js";
+import r from "./countdown.module.js";
+import i from "react";
+import a from "classnames";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/data-display/Countdown/Countdown.tsx
+var c = (e) => e instanceof Date ? e.getTime() : new Date(e).getTime(), l = (e) => String(e).padStart(2, "0"), u = (e, t) => {
+	let n = Math.floor(e / 86400), r = Math.floor(t ? e / 3600 : e % 86400 / 3600), i = Math.floor(e % 3600 / 60), a = e % 60, o = [];
+	return !t && n > 0 && o.push({
+		unit: "day",
+		value: n
+	}), (o.length > 0 || r > 0) && o.push({
+		unit: "hour",
+		value: r
+	}), o.push({
+		unit: "minute",
+		value: i
+	}), o.push({
+		unit: "second",
+		value: a
+	}), o;
+}, d = i.forwardRef(({ target: d, baseDate: f, variant: p = "digital", size: m = "md", locale: h, unitDisplay: g = "short", paused: _ = !1, onComplete: v, completedContent: y, fallback: b, asChild: x = !1, className: S, children: C, ...w }, T) => {
+	let { t: E, i18n: D } = n("data-display"), O = h ?? D?.language ?? "en", k = x ? e : "time", A = c(d), j = !Number.isNaN(A), M = f !== void 0, [N, P] = i.useState(() => Date.now()), F = M ? c(f) : N, I = j ? Math.max(0, A - F) : 0, L = j && I <= 0, R = !M && !_ && j && !L;
+	i.useEffect(() => {
+		!_ && !M && P(Date.now());
+	}, [_, M]), i.useEffect(() => {
+		if (!R) return;
+		let e = (A - Date.now()) % 1e3 || 1e3, t = window.setTimeout(() => P(Date.now()), e);
+		return () => window.clearTimeout(t);
+	}, [
+		R,
+		A,
+		N
+	]);
+	let z = i.useRef(!1);
+	i.useEffect(() => {
+		z.current = !1;
+	}, [A]), i.useEffect(() => {
+		!j || M || !L || z.current || (z.current = !0, v?.());
+	}, [
+		L,
+		M,
+		j,
+		v
+	]);
+	let B = i.useMemo(() => /* @__PURE__ */ new Map(), [O]), V = (e, t) => {
+		let n = `${e}-${t}`, r = B.get(n);
+		if (!r) {
+			let i = {
+				style: "unit",
+				unit: e,
+				unitDisplay: t
+			};
+			try {
+				r = new Intl.NumberFormat(O, i);
+			} catch {
+				r = new Intl.NumberFormat("en", i);
+			}
+			B.set(n, r);
+		}
+		return r;
+	}, H = (e) => V(e.unit, g).formatToParts(e.value).filter((e) => e.type === "unit").map((e) => e.value).join("");
+	if (!j) return /* @__PURE__ */ s(k, {
+		ref: T,
+		className: a("wim-countdown", r.root, S),
+		...w,
+		children: [/* @__PURE__ */ o(t, { children: C }), b]
+	});
+	let U = Math.floor(I / 1e3), W = u(U, p === "digital"), G = L && y !== void 0, K = u(U, !1).map((e) => V(e.unit, "long").format(e.value)).join(" ");
+	return /* @__PURE__ */ s(k, {
+		ref: T,
+		role: "timer",
+		"aria-label": G ? void 0 : E("countdown.remaining", { time: K }),
+		className: a("wim-countdown", r.root, r[p], r[m], S),
+		dateTime: new Date(A).toISOString(),
+		...w,
+		children: [/* @__PURE__ */ o(t, { children: C }), G ? y : p === "digital" ? W.map((e, t) => /* @__PURE__ */ s(i.Fragment, { children: [t > 0 && /* @__PURE__ */ o("span", {
+			className: r.separator,
+			"aria-hidden": "true",
+			children: ":"
+		}), /* @__PURE__ */ o("span", {
+			className: r.value,
+			children: l(e.value)
+		})] }, e.unit)) : W.map((e) => /* @__PURE__ */ s("span", {
+			className: r.segment,
+			children: [/* @__PURE__ */ o("span", {
+				className: r.value,
+				children: e.unit === "day" ? String(e.value) : l(e.value)
+			}), /* @__PURE__ */ o("span", {
+				className: r.label,
+				children: H(e)
+			})]
+		}, e.unit))]
+	});
+});
+d.displayName = "Countdown";
+//#endregion
+export { d as Countdown };

package/dist/components/data-display/Countdown/countdown.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_1cp6b_2`,t=`_value_1cp6b_8`,n=`_digital_1cp6b_13`,r=`_separator_1cp6b_16`,i=`_units_1cp6b_21`,a=`_segment_1cp6b_24`,o=`_label_1cp6b_30`,s=`_sm_1cp6b_34`,c=`_md_1cp6b_41`,l=`_lg_1cp6b_48`,u={root:e,value:t,digital:n,separator:r,units:i,segment:a,label:o,sm:s,md:c,lg:l};exports.default=u,exports.digital=n,exports.label=o,exports.lg=l,exports.md=c,exports.root=e,exports.segment=a,exports.separator=r,exports.sm=s,exports.units=i,exports.value=t;

package/dist/components/data-display/Countdown/countdown.module.js

@@ -0,0 +1,16 @@
+"use client";
+//#region src/components/data-display/Countdown/countdown.module.scss
+var e = "_root_1cp6b_2", t = "_value_1cp6b_8", n = "_digital_1cp6b_13", r = "_separator_1cp6b_16", i = "_units_1cp6b_21", a = "_segment_1cp6b_24", o = "_label_1cp6b_30", s = "_sm_1cp6b_34", c = "_md_1cp6b_41", l = "_lg_1cp6b_48", u = {
+	root: e,
+	value: t,
+	digital: n,
+	separator: r,
+	units: i,
+	segment: a,
+	label: o,
+	sm: s,
+	md: c,
+	lg: l
+};
+//#endregion
+export { u as default, n as digital, o as label, l as lg, c as md, e as root, a as segment, r as separator, s as sm, i as units, t as value };