@exsto/ds 0.0.1-rc.13 → 0.0.1-rc.14

package/dist/{chunks/input-syWxjY2U.js → ui/src/components/ui/button/button.js}

@@ -1,27 +1,8 @@
+import { cn } from "../../../lib/utils.js";
 import { isValidElement } from "react";
 import { jsx } from "react/jsx-runtime";
 import { Button } from "@base-ui/react/button";
-import { clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
 import { cva } from "class-variance-authority";
-import { Popover } from "@base-ui/react/popover";
-import { Input } from "@base-ui/react/input";
-//#region ../ui/src/lib/utils.ts
-var cn = (...inputs) => twMerge(clsx(inputs));
-/**
-* Normalise a size prop to a CSS length.
-*
-* Bare numbers become px, which is also what a bare numeric *string* means: an
-* element attribute arrives as a string, so `width="480"` and `width={480}` have
-* to land on the same value. Anything with a unit, a percentage or a keyword
-* passes through untouched.
-*/
-var cssLength = (value) => {
-	if (value == null || value === "") return;
-	if (typeof value === "number") return Number.isFinite(value) ? `${value}px` : void 0;
-	return /^-?\d*\.?\d+$/.test(value.trim()) ? `${value.trim()}px` : value;
-};
-//#endregion
 //#region ../ui/src/components/ui/button/button.tsx
 /**
 * The fill of a disabled Button that has one: muted, whichever way it is disabled (a button's own disabled, Base UI's
@@ -107,66 +88,6 @@ var Button$1 = ({ className, variant = "default", size = "default", ...props })
 	});
 };
 //#endregion
-//#region ../ui/src/components/ui/popover/popover.tsx
-var Popover$1 = ({ ...props }) => {
-	return /* @__PURE__ */ jsx(Popover.Root, {
-		"data-slot": "popover",
-		...props
-	});
-};
-var PopoverTrigger = ({ ...props }) => {
-	return /* @__PURE__ */ jsx(Popover.Trigger, {
-		"data-slot": "popover-trigger",
-		...props
-	});
-};
-var PopoverContent = ({ className, align = "center", alignOffset = 0, side = "bottom", sideOffset = 4, anchor, ...props }) => {
-	return /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsx(Popover.Positioner, {
-		align,
-		alignOffset,
-		anchor,
-		side,
-		sideOffset,
-		className: "isolate z-50",
-		children: /* @__PURE__ */ jsx(Popover.Popup, {
-			"data-slot": "popover-content",
-			className: cn("z-50 flex w-72 origin-(--transform-origin) flex-col gap-2.5 rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 motion-reduce:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
-			...props
-		})
-	}) });
-};
-var PopoverHeader = ({ className, ...props }) => {
-	return /* @__PURE__ */ jsx("div", {
-		"data-slot": "popover-header",
-		className: cn("flex flex-col gap-0.5 text-sm", className),
-		...props
-	});
-};
-var PopoverTitle = ({ className, ...props }) => {
-	return /* @__PURE__ */ jsx(Popover.Title, {
-		"data-slot": "popover-title",
-		className: cn("font-medium", className),
-		...props
-	});
-};
-var PopoverDescription = ({ className, ...props }) => {
-	return /* @__PURE__ */ jsx(Popover.Description, {
-		"data-slot": "popover-description",
-		className: cn("text-muted-foreground", className),
-		...props
-	});
-};
-//#endregion
-//#region ../ui/src/components/ui/input/input.tsx
-var Input$1 = ({ className, type, ...props }) => {
-	return /* @__PURE__ */ jsx(Input, {
-		type,
-		"data-slot": "input",
-		className: cn("h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40", className),
-		...props
-	});
-};
-//#endregion
-export { PopoverHeader as a, Button$1 as c, cssLength as d, PopoverDescription as i, buttonVariants as l, Popover$1 as n, PopoverTitle as o, PopoverContent as r, PopoverTrigger as s, Input$1 as t, cn as u };
+export { Button$1 as Button, buttonVariants };
 
-//# sourceMappingURL=input-syWxjY2U.js.map
+//# sourceMappingURL=button.js.map

package/dist/ui/src/components/ui/button/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","names":[],"sources":["../../../../../../../ui/src/components/ui/button/button.tsx"],"sourcesContent":["import { Button as ButtonPrimitive } from '@base-ui/react/button';\nimport { cn } from '@edyn/ui/lib/utils';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { isValidElement } from 'react';\n\n/**\n * The fill of a disabled Button that has one: muted, whichever way it is disabled (a button's own disabled, Base UI's\n * data-disabled, or aria-disabled on a link), in the dark theme too, where the variants set their own fill. Ghost and link\n * have no fill to begin with and are given none: a grey box would turn a link into a button.\n */\nconst DISABLED_FILL =\n  'disabled:bg-muted data-disabled:bg-muted aria-disabled:bg-muted dark:disabled:bg-muted dark:data-disabled:bg-muted dark:aria-disabled:bg-muted';\n\nexport const buttonVariants = cva(\n  \"group/button inline-flex shrink-0 cursor-pointer items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all motion-reduce:transition-none motion-reduce:transform-none outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:not-aria-disabled:translate-y-px disabled:pointer-events-none disabled:border-transparent disabled:text-foreground/60 disabled:shadow-none disabled:focus-visible:ring-0 dark:disabled:border-transparent data-link-disabled:pointer-events-none data-link-disabled:focus-visible:ring-0 data-disabled:border-transparent data-disabled:text-foreground/60 data-disabled:shadow-none dark:data-disabled:border-transparent aria-disabled:border-transparent aria-disabled:text-foreground/60 aria-disabled:shadow-none dark:aria-disabled:border-transparent aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default: `bg-primary text-primary-foreground hover:bg-primary/80 ${DISABLED_FILL}`,\n        outline: `border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50 ${DISABLED_FILL}`,\n        secondary: `bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground ${DISABLED_FILL}`,\n        ghost:\n          'hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50 aria-disabled:hover:bg-transparent dark:aria-disabled:hover:bg-transparent',\n        destructive: `bg-destructive/10 text-destructive hover:bg-destructive/15 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/15 dark:hover:bg-destructive/20 dark:focus-visible:ring-destructive/40 ${DISABLED_FILL}`,\n        link: 'text-primary underline-offset-4 hover:underline aria-disabled:hover:no-underline',\n      },\n      size: {\n        default: 'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',\n        xs: \"h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: \"h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5\",\n        lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',\n        icon: 'size-8',\n        'icon-xs': \"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3\",\n        'icon-sm': 'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg',\n        'icon-lg': 'size-9',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  },\n);\n\n/**\n * Whether this Button is rendering a link rather than a button, so it can keep\n * link semantics. Covers `render={<a href=\"...\" />}` and a routing component\n * that takes an `href` (Next's Link). A component with a different prop for its\n * destination (react-router's `to`) cannot be recognised from here: give those\n * `nativeButton={false} role={undefined}` directly.\n */\nconst rendersALink = (render: ButtonPrimitive.Props['render']): boolean =>\n  isValidElement(render) && (render.type === 'a' || typeof (render.props as { href?: unknown }).href === 'string');\n\n/**\n * A link that looks like a button is still a link, and has to be announced as\n * one: it opens in a new tab, it has an address, Enter follows it and Space\n * scrolls the page.\n *\n * Base UI needs telling, in two steps. Rendering an anchor while `nativeButton`\n * is true (its default) warns in development and puts `type=\"button\"` on the\n * anchor; following the warning and passing `nativeButton={false}` then adds\n * `role=\"button\"`, which is what takes the link semantics away. So this does\n * both: non-native, with the role and the tabindex Base UI would add cleared\n * again. An explicit prop from the caller still wins over either.\n */\nconst LINK_PROPS = { nativeButton: false, role: undefined, tabIndex: undefined } as const;\n\n/**\n * A disabled link is not :disabled (only a form control can be), so the markup has to say it: Base UI already marks it\n * `aria-disabled` and `data-disabled` and stops the click, and this takes it out of the tab order, which LINK_PROPS\n * would otherwise leave to the browser. The href is kept on purpose, so a routing component that requires one keeps\n * working; the pointer is kept off the link by `data-link-disabled:pointer-events-none`, which also covers a middle\n * click and the context menu, and the click and Enter are stopped by Base UI. It is a data attribute of its own, not\n * `aria-disabled`, because an aria-disabled button (`focusableWhenDisabled`) is meant to stay hoverable and focusable so it\n * can say why it cannot act; only a native :disabled button and this link are inert.\n */\nconst DISABLED_LINK_PROPS = { ...LINK_PROPS, tabIndex: -1, 'data-link-disabled': '' } as const;\n\nexport const Button = ({\n  className,\n  variant = 'default',\n  size = 'default',\n  ...props\n}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) => {\n  return (\n    <ButtonPrimitive\n      data-slot=\"button\"\n      {...(rendersALink(props.render) ? (props.disabled ? DISABLED_LINK_PROPS : LINK_PROPS) : {})}\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;AAUA,IAAM,gBACJ;AAEF,IAAa,iBAAiB,IAC5B,qoCACA;CACE,UAAU;EACR,SAAS;GACP,SAAS,0DAA0D;GACnE,SAAS,mLAAmL;GAC5L,WAAW,kLAAkL;GAC7L,OACE;GACF,aAAa,+NAA+N;GAC5O,MAAM;EACR;EACA,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,MAAM;GACN,WAAW;GACX,WAAW;GACX,WAAW;EACb;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CACF;;;;;;;;AASA,IAAM,gBAAgB,WACpB,eAAe,MAAM,MAAM,OAAO,SAAS,OAAO,OAAQ,OAAO,MAA6B,SAAS;;;;;;;;;;;;;AAczG,IAAM,aAAa;CAAE,cAAc;CAAO,MAAM,KAAA;CAAW,UAAU,KAAA;AAAU;;;;;;;;;;AAW/E,IAAM,sBAAsB;CAAE,GAAG;CAAY,UAAU;CAAI,sBAAsB;AAAG;AAEpF,IAAa,YAAU,EACrB,WACA,UAAU,WACV,OAAO,WACP,GAAG,YAC8D;CACjE,OACE,oBAAC,QAAD;EACE,aAAU;EACV,GAAK,aAAa,MAAM,MAAM,IAAK,MAAM,WAAW,sBAAsB,aAAc,CAAC;EACzF,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;EAAU,CAAC,CAAC;EAC1D,GAAI;CACL,CAAA;AAEL"}

package/dist/ui/src/components/ui/button-group/button-group.js

@@ -0,0 +1,37 @@
+import { cn } from "../../../lib/utils.js";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+//#region ../ui/src/components/ui/button-group/button-group.tsx
+var ButtonGroupContext = React.createContext("horizontal");
+var ButtonGroup = ({ className, orientation = "horizontal", ...props }) => {
+	return /* @__PURE__ */ jsx(ButtonGroupContext.Provider, {
+		value: orientation,
+		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "button-group",
+			"data-orientation": orientation,
+			className: cn("inline-flex items-center", "[&>*:not(:first-child):not(:last-child)]:rounded-none", "data-[orientation=horizontal]:[&>*:first-child]:rounded-r-none", "data-[orientation=horizontal]:[&>*:last-child]:rounded-l-none", "data-[orientation=horizontal]:[&>*:not(:first-child)]:-ml-px", "data-[orientation=vertical]:flex-col", "data-[orientation=vertical]:[&>*:first-child]:rounded-b-none", "data-[orientation=vertical]:[&>*:last-child]:rounded-t-none", "data-[orientation=vertical]:[&>*:not(:first-child)]:-mt-px", "[&>*]:relative [&>*]:z-0 [&>*:focus-visible]:z-10 [&>*:hover]:z-10", className),
+			...props
+		})
+	});
+};
+var ButtonGroupSeparator = ({ className, ...props }) => {
+	const orientation = React.useContext(ButtonGroupContext);
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "button-group-separator",
+		role: "separator",
+		"aria-orientation": orientation === "horizontal" ? "vertical" : "horizontal",
+		className: cn("inline-flex shrink-0 self-stretch bg-border", "in-data-[orientation=horizontal]:w-px", "in-data-[orientation=vertical]:h-px in-data-[orientation=vertical]:self-auto in-data-[orientation=vertical]:w-full", className),
+		...props
+	});
+};
+var ButtonGroupText = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "button-group-text",
+		className: cn("inline-flex shrink-0 items-center justify-center rounded-none border border-border bg-muted px-2.5 text-sm text-muted-foreground select-none", className),
+		...props
+	});
+};
+//#endregion
+export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText };
+
+//# sourceMappingURL=button-group.js.map

package/dist/ui/src/components/ui/button-group/button-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-group.js","names":[],"sources":["../../../../../../../ui/src/components/ui/button-group/button-group.tsx"],"sourcesContent":["import { cn } from '@edyn/ui/lib/utils';\nimport * as React from 'react';\n\nexport type TButtonGroupOrientation = 'horizontal' | 'vertical';\n\nexport interface IButtonGroupProps extends React.ComponentProps<'div'> {\n  orientation?: TButtonGroupOrientation;\n}\n\nconst ButtonGroupContext = React.createContext<TButtonGroupOrientation>('horizontal');\n\nexport const ButtonGroup = ({ className, orientation = 'horizontal', ...props }: IButtonGroupProps) => {\n  return (\n    <ButtonGroupContext.Provider value={orientation}>\n      <div\n        data-slot=\"button-group\"\n        data-orientation={orientation}\n        className={cn(\n          'inline-flex items-center',\n          '[&>*:not(:first-child):not(:last-child)]:rounded-none',\n          'data-[orientation=horizontal]:[&>*:first-child]:rounded-r-none',\n          'data-[orientation=horizontal]:[&>*:last-child]:rounded-l-none',\n          'data-[orientation=horizontal]:[&>*:not(:first-child)]:-ml-px',\n          'data-[orientation=vertical]:flex-col',\n          'data-[orientation=vertical]:[&>*:first-child]:rounded-b-none',\n          'data-[orientation=vertical]:[&>*:last-child]:rounded-t-none',\n          'data-[orientation=vertical]:[&>*:not(:first-child)]:-mt-px',\n          '[&>*]:relative [&>*]:z-0 [&>*:focus-visible]:z-10 [&>*:hover]:z-10',\n          className,\n        )}\n        {...props}\n      />\n    </ButtonGroupContext.Provider>\n  );\n};\n\nexport interface IButtonGroupSeparatorProps extends React.ComponentProps<'span'> {}\n\nexport const ButtonGroupSeparator = ({ className, ...props }: IButtonGroupSeparatorProps) => {\n  const orientation = React.useContext(ButtonGroupContext);\n\n  return (\n    // biome-ignore lint/a11y/useFocusableInteractive: decorative visual divider between buttons; not an interactive widget\n    // biome-ignore lint/a11y/useSemanticElements: <span> is intentional; no semantic HTML equivalent for an inline button-group separator\n    <span\n      data-slot=\"button-group-separator\"\n      // biome-ignore lint/a11y/useAriaPropsForRole: aria-valuenow applies only when separator acts as a range slider; this is a static divider\n      role=\"separator\"\n      // The separator runs perpendicular to the group's axis.\n      aria-orientation={orientation === 'horizontal' ? 'vertical' : 'horizontal'}\n      className={cn(\n        'inline-flex shrink-0 self-stretch bg-border',\n        'in-data-[orientation=horizontal]:w-px',\n        'in-data-[orientation=vertical]:h-px in-data-[orientation=vertical]:self-auto in-data-[orientation=vertical]:w-full',\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n\nexport interface IButtonGroupTextProps extends React.ComponentProps<'span'> {}\n\nexport const ButtonGroupText = ({ className, ...props }: IButtonGroupTextProps) => {\n  return (\n    <span\n      data-slot=\"button-group-text\"\n      className={cn(\n        'inline-flex shrink-0 items-center justify-center rounded-none border border-border bg-muted px-2.5 text-sm text-muted-foreground select-none',\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n"],"mappings":";;;;AASA,IAAM,qBAAqB,MAAM,cAAuC,YAAY;AAEpF,IAAa,eAAe,EAAE,WAAW,cAAc,cAAc,GAAG,YAA+B;CACrG,OACE,oBAAC,mBAAmB,UAApB;EAA6B,OAAO;EAClC,UAAA,oBAAC,OAAD;GACE,aAAU;GACV,oBAAkB;GAClB,WAAW,GACT,4BACA,yDACA,kEACA,iEACA,gEACA,wCACA,gEACA,+DACA,8DACA,sEACA,SACF;GACA,GAAI;EACL,CAAA;CAC0B,CAAA;AAEjC;AAIA,IAAa,wBAAwB,EAAE,WAAW,GAAG,YAAwC;CAC3F,MAAM,cAAc,MAAM,WAAW,kBAAkB;CAEvD,OAGE,oBAAC,QAAD;EACE,aAAU;EAEV,MAAK;EAEL,oBAAkB,gBAAgB,eAAe,aAAa;EAC9D,WAAW,GACT,+CACA,yCACA,sHACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAIA,IAAa,mBAAmB,EAAE,WAAW,GAAG,YAAmC;CACjF,OACE,oBAAC,QAAD;EACE,aAAU;EACV,WAAW,GACT,gJACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/{chunks/date-range-picker-CWVcHgy2.js → ui/src/components/ui/calendar/calendar.js}

@@ -1,7 +1,8 @@
-import { c as Button, l as buttonVariants, n as Popover, r as PopoverContent, s as PopoverTrigger, u as cn } from "./input-syWxjY2U.js";
+import { cn } from "../../../lib/utils.js";
+import { Button, buttonVariants } from "../button/button.js";
 import * as React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { IconCalendar, IconChevronDown, IconChevronLeft, IconChevronRight } from "@tabler/icons-react";
+import { jsx } from "react/jsx-runtime";
+import { IconChevronDown, IconChevronLeft, IconChevronRight } from "@tabler/icons-react";
 import { DayPicker, getDefaultClassNames } from "react-day-picker";
 //#region ../ui/src/components/ui/calendar/calendar.tsx
 var Calendar = ({ className, classNames, showOutsideDays = true, captionLayout = "label", buttonVariant = "ghost", locale, formatters, components, ...props }) => {
@@ -104,101 +105,6 @@ var CalendarDayButton = ({ className, day, modifiers, locale, ...props }) => {
 	});
 };
 //#endregion
-//#region ../ui/src/hooks/use-mobile.ts
-var MOBILE_BREAKPOINT = 768;
-var useIsMobile = () => {
-	const [isMobile, setIsMobile] = React.useState(void 0);
-	React.useEffect(() => {
-		const mql = window.matchMedia(`(max-width: 767px)`);
-		const onChange = () => {
-			setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-		};
-		mql.addEventListener("change", onChange);
-		setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
-		return () => mql.removeEventListener("change", onChange);
-	}, []);
-	return !!isMobile;
-};
-//#endregion
-//#region ../ui/src/lib/first-weekday.ts
-var SUNDAY_FIRST = /* @__PURE__ */ new Set([
-	"US",
-	"CA",
-	"MX",
-	"BR",
-	"JP",
-	"IL",
-	"IN",
-	"PH",
-	"ZA",
-	"KR",
-	"TW",
-	"HK",
-	"SA"
-]);
-/**
-* The weekday a locale starts its week on, 0 for Sunday to 6 for Saturday, from Intl, so en-GB starts on Monday and en-US on
-* Sunday with no locale data of our own shipped. A browser without week info gets the region's usual start.
-*/
-var firstWeekdayOf = (locale) => {
-	try {
-		const info = new Intl.Locale(locale);
-		const first = info.getWeekInfo?.().firstDay ?? info.weekInfo?.firstDay;
-		if (first !== void 0) return first % 7;
-		return SUNDAY_FIRST.has(info.region ?? "") ? 0 : 1;
-	} catch {
-		return 0;
-	}
-};
-//#endregion
-//#region ../ui/src/components/edyn/date-range-picker/date-range-picker.tsx
-var dayToDate = (value) => value === void 0 ? void 0 : /* @__PURE__ */ new Date(`${value}T12:00:00`);
-var dateToDay = (date) => date === void 0 ? void 0 : `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, "0")}-${String(date.getDate()).padStart(2, "0")}`;
-/** A range of calendar days, either end optional; two months side by side, one on a phone. */
-var DateRangePicker = ({ id, value, onValueChange, placeholder = "Select date range", locale = "en-GB", summary = "range", "aria-label": ariaLabel, className, ...props }) => {
-	const isMobile = useIsMobile();
-	const from = dayToDate(value.from);
-	const to = dayToDate(value.to);
-	const format = new Intl.DateTimeFormat(locale, {
-		day: "2-digit",
-		month: "short",
-		year: "numeric"
-	});
-	const ends = [from, to].filter((date) => date !== void 0).map((date) => format.format(date));
-	return /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsxs(PopoverTrigger, {
-		render: /* @__PURE__ */ jsx(Button, {
-			...props,
-			id,
-			"aria-label": ariaLabel,
-			"data-slot": "date-range-picker-trigger",
-			"data-set": ends.length > 0 ? "" : void 0,
-			variant: "outline",
-			className: cn("w-full min-w-0 justify-start font-normal", ends.length === 0 && "text-muted-foreground", className)
-		}),
-		children: [/* @__PURE__ */ jsx(IconCalendar, { "aria-hidden": "true" }), /* @__PURE__ */ jsx("span", {
-			className: "truncate",
-			children: ends.length === 0 || summary === "label" ? placeholder : ends.join(" – ")
-		})]
-	}), /* @__PURE__ */ jsx(PopoverContent, {
-		align: "start",
-		className: "w-auto p-0",
-		children: /* @__PURE__ */ jsx(Calendar, {
-			mode: "range",
-			defaultMonth: from,
-			numberOfMonths: isMobile ? 1 : 2,
-			weekStartsOn: firstWeekdayOf(locale),
-			selected: {
-				from,
-				to
-			},
-			onSelect: (range) => onValueChange({
-				from: dateToDay(range?.from),
-				to: dateToDay(range?.to)
-			})
-		})
-	})] });
-};
-//#endregion
-export { useIsMobile as a, firstWeekdayOf as i, dateToDay as n, Calendar as o, dayToDate as r, CalendarDayButton as s, DateRangePicker as t };
+export { Calendar, CalendarDayButton };
 
-//# sourceMappingURL=date-range-picker-CWVcHgy2.js.map
+//# sourceMappingURL=calendar.js.map

package/dist/ui/src/components/ui/calendar/calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.js","names":[],"sources":["../../../../../../../ui/src/components/ui/calendar/calendar.tsx"],"sourcesContent":["import { cn } from '@edyn/ui/lib/utils';\nimport { IconChevronDown, IconChevronLeft, IconChevronRight } from '@tabler/icons-react';\nimport * as React from 'react';\nimport { type DayButton, DayPicker, getDefaultClassNames, type Locale } from 'react-day-picker';\nimport { Button, buttonVariants } from '../button';\n\nexport const Calendar = ({\n  className,\n  classNames,\n  showOutsideDays = true,\n  captionLayout = 'label',\n  buttonVariant = 'ghost',\n  locale,\n  formatters,\n  components,\n  ...props\n}: React.ComponentProps<typeof DayPicker> & {\n  buttonVariant?: React.ComponentProps<typeof Button>['variant'];\n}) => {\n  const defaultClassNames = getDefaultClassNames();\n\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      className={cn(\n        'group/calendar bg-background p-2 [--cell-radius:var(--radius-md)] [--cell-size:--spacing(7)] in-data-[slot=card-content]:bg-transparent in-data-[slot=popover-content]:bg-transparent',\n        String.raw`rtl:**:[.rdp-button\\_next>svg]:rotate-180`,\n        String.raw`rtl:**:[.rdp-button\\_previous>svg]:rotate-180`,\n        className,\n      )}\n      captionLayout={captionLayout}\n      locale={locale}\n      formatters={{\n        formatMonthDropdown: (date) => date.toLocaleString(locale?.code, { month: 'short' }),\n        ...formatters,\n      }}\n      classNames={{\n        root: cn('w-fit', defaultClassNames.root),\n        months: cn('relative flex flex-col gap-4 md:flex-row', defaultClassNames.months),\n        month: cn('flex w-full flex-col gap-4', defaultClassNames.month),\n        nav: cn('absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1', defaultClassNames.nav),\n        button_previous: cn(\n          buttonVariants({ variant: buttonVariant }),\n          'size-(--cell-size) p-0 select-none aria-disabled:opacity-50',\n          defaultClassNames.button_previous,\n        ),\n        button_next: cn(\n          buttonVariants({ variant: buttonVariant }),\n          'size-(--cell-size) p-0 select-none aria-disabled:opacity-50',\n          defaultClassNames.button_next,\n        ),\n        month_caption: cn('flex h-(--cell-size) w-full items-center justify-center px-(--cell-size)', defaultClassNames.month_caption),\n        dropdowns: cn('flex h-(--cell-size) w-full items-center justify-center gap-1.5 text-sm font-medium', defaultClassNames.dropdowns),\n        dropdown_root: cn('relative rounded-(--cell-radius)', defaultClassNames.dropdown_root),\n        dropdown: cn('absolute inset-0 bg-popover opacity-0', defaultClassNames.dropdown),\n        caption_label: cn(\n          'font-medium select-none',\n          captionLayout === 'label'\n            ? 'text-sm'\n            : 'flex items-center gap-1 rounded-(--cell-radius) text-sm [&>svg]:size-3.5 [&>svg]:text-muted-foreground',\n          defaultClassNames.caption_label,\n        ),\n        month_grid: cn('w-full border-collapse', defaultClassNames.month_grid),\n        weekdays: cn('flex', defaultClassNames.weekdays),\n        weekday: cn('flex-1 rounded-(--cell-radius) text-[0.8rem] font-normal text-muted-foreground select-none', defaultClassNames.weekday),\n        week: cn('mt-2 flex w-full', defaultClassNames.week),\n        week_number_header: cn('w-(--cell-size) select-none', defaultClassNames.week_number_header),\n        week_number: cn('text-[0.8rem] text-muted-foreground select-none', defaultClassNames.week_number),\n        day: cn(\n          'group/day relative aspect-square h-full w-full rounded-(--cell-radius) p-0 text-center select-none [&:last-child[data-selected=true]_button]:rounded-r-(--cell-radius)',\n          props.showWeekNumber\n            ? '[&:nth-child(2)[data-selected=true]_button]:rounded-l-(--cell-radius)'\n            : '[&:first-child[data-selected=true]_button]:rounded-l-(--cell-radius)',\n          defaultClassNames.day,\n        ),\n        range_start: cn(\n          'relative isolate z-0 rounded-l-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:right-0 after:w-4 after:bg-muted',\n          defaultClassNames.range_start,\n        ),\n        range_middle: cn('rounded-none', defaultClassNames.range_middle),\n        range_end: cn(\n          'relative isolate z-0 rounded-r-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:left-0 after:w-4 after:bg-muted',\n          defaultClassNames.range_end,\n        ),\n        today: cn('rounded-(--cell-radius) bg-muted text-foreground data-[selected=true]:rounded-none', defaultClassNames.today),\n        outside: cn('text-muted-foreground aria-selected:text-muted-foreground', defaultClassNames.outside),\n        disabled: cn('text-muted-foreground opacity-50', defaultClassNames.disabled),\n        hidden: cn('invisible', defaultClassNames.hidden),\n        ...classNames,\n      }}\n      components={{\n        Root: ({ className, rootRef, ...props }) => {\n          return <div data-slot=\"calendar\" ref={rootRef} className={cn(className)} {...props} />;\n        },\n        Chevron: ({ className, orientation, ...props }) => {\n          if (orientation === 'left') {\n            return <IconChevronLeft className={cn('size-4', className)} {...props} />;\n          }\n\n          if (orientation === 'right') {\n            return <IconChevronRight className={cn('size-4', className)} {...props} />;\n          }\n\n          return <IconChevronDown className={cn('size-4', className)} {...props} />;\n        },\n        DayButton: ({ ...props }) => <CalendarDayButton locale={locale} {...props} />,\n        WeekNumber: ({ children, ...props }) => {\n          return (\n            <td {...props}>\n              <div className=\"flex size-(--cell-size) items-center justify-center text-center\">{children}</div>\n            </td>\n          );\n        },\n        ...components,\n      }}\n      {...props}\n    />\n  );\n};\n\nexport const CalendarDayButton = ({\n  className,\n  day,\n  modifiers,\n  locale,\n  ...props\n}: React.ComponentProps<typeof DayButton> & { locale?: Partial<Locale> }) => {\n  const defaultClassNames = getDefaultClassNames();\n\n  const refButton = React.useRef<HTMLButtonElement>(null);\n  React.useEffect(() => {\n    if (modifiers.focused) {\n      refButton.current?.focus();\n    }\n  }, [modifiers.focused]);\n\n  return (\n    <Button\n      ref={refButton}\n      variant=\"ghost\"\n      size=\"icon\"\n      data-day={day.date.toLocaleDateString(locale?.code)}\n      data-selected-single={modifiers.selected && !modifiers.range_start && !modifiers.range_end && !modifiers.range_middle}\n      data-range-start={modifiers.range_start}\n      data-range-end={modifiers.range_end}\n      data-range-middle={modifiers.range_middle}\n      className={cn(\n        'relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 border-0 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-[3px] group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-(--cell-radius) data-[range-end=true]:rounded-r-(--cell-radius) data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-muted data-[range-middle=true]:text-foreground data-[range-start=true]:rounded-(--cell-radius) data-[range-start=true]:rounded-l-(--cell-radius) data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground dark:hover:text-foreground [&>span]:text-xs [&>span]:opacity-70',\n        defaultClassNames.day,\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n"],"mappings":"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"}

package/dist/ui/src/components/ui/card/card.js

@@ -0,0 +1,57 @@
+import { cn } from "../../../lib/utils.js";
+import { jsx } from "react/jsx-runtime";
+//#region ../ui/src/components/ui/card/card.tsx
+var Card = ({ className, size = "default", ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card",
+		"data-size": size,
+		className: cn("group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl", className),
+		...props
+	});
+};
+var CardHeader = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-header",
+		className: cn("group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3", className),
+		...props
+	});
+};
+var CardTitle = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-title",
+		className: cn("text-base leading-snug font-medium group-data-[size=sm]/card:text-sm", className),
+		...props
+	});
+};
+var CardDescription = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-description",
+		className: cn("text-sm text-muted-foreground", className),
+		...props
+	});
+};
+var CardAction = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-action",
+		className: cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className),
+		...props
+	});
+};
+var CardContent = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-content",
+		className: cn("px-4 group-data-[size=sm]/card:px-3", className),
+		...props
+	});
+};
+var CardFooter = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "card-footer",
+		className: cn("flex items-center rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/card:p-3", className),
+		...props
+	});
+};
+//#endregion
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
+
+//# sourceMappingURL=card.js.map

package/dist/ui/src/components/ui/card/card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.js","names":[],"sources":["../../../../../../../ui/src/components/ui/card/card.tsx"],"sourcesContent":["import { cn } from '@edyn/ui/lib/utils';\nimport type * as React from 'react';\n\nexport const Card = ({ className, size = 'default', ...props }: React.ComponentProps<'div'> & { size?: 'default' | 'sm' }) => {\n  return (\n    <div\n      data-slot=\"card\"\n      data-size={size}\n      className={cn(\n        'group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl',\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n\nexport const CardHeader = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      data-slot=\"card-header\"\n      className={cn(\n        'group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3',\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n\nexport const CardTitle = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  return <div data-slot=\"card-title\" className={cn('text-base leading-snug font-medium group-data-[size=sm]/card:text-sm', className)} {...props} />;\n};\n\nexport const CardDescription = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  return <div data-slot=\"card-description\" className={cn('text-sm text-muted-foreground', className)} {...props} />;\n};\n\nexport const CardAction = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  return <div data-slot=\"card-action\" className={cn('col-start-2 row-span-2 row-start-1 self-start justify-self-end', className)} {...props} />;\n};\n\nexport const CardContent = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  return <div data-slot=\"card-content\" className={cn('px-4 group-data-[size=sm]/card:px-3', className)} {...props} />;\n};\n\nexport const CardFooter = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  return (\n    <div\n      data-slot=\"card-footer\"\n      className={cn('flex items-center rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/card:p-3', className)}\n      {...props}\n    />\n  );\n};\n"],"mappings":";;;AAGA,IAAa,QAAQ,EAAE,WAAW,OAAO,WAAW,GAAG,YAAuE;CAC5H,OACE,oBAAC,OAAD;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,wVACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,cAAc,EAAE,WAAW,GAAG,YAAyC;CAClF,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,sSACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,aAAa,EAAE,WAAW,GAAG,YAAyC;CACjF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAa,WAAW,GAAG,wEAAwE,SAAS;EAAG,GAAI;CAAQ,CAAA;AACnJ;AAEA,IAAa,mBAAmB,EAAE,WAAW,GAAG,YAAyC;CACvF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAmB,WAAW,GAAG,iCAAiC,SAAS;EAAG,GAAI;CAAQ,CAAA;AAClH;AAEA,IAAa,cAAc,EAAE,WAAW,GAAG,YAAyC;CAClF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAc,WAAW,GAAG,kEAAkE,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC9I;AAEA,IAAa,eAAe,EAAE,WAAW,GAAG,YAAyC;CACnF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAe,WAAW,GAAG,uCAAuC,SAAS;EAAG,GAAI;CAAQ,CAAA;AACpH;AAEA,IAAa,cAAc,EAAE,WAAW,GAAG,YAAyC;CAClF,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,yFAAyF,SAAS;EAChH,GAAI;CACL,CAAA;AAEL"}

package/dist/ui/src/components/ui/carousel/carousel.js

@@ -0,0 +1,136 @@
+"use client";
+import { cn } from "../../../lib/utils.js";
+import { Button } from "../button/button.js";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { IconChevronLeft, IconChevronRight } from "@tabler/icons-react";
+import useEmblaCarousel from "embla-carousel-react";
+//#region ../ui/src/components/ui/carousel/carousel.tsx
+var CarouselContext = React.createContext(null);
+var useCarousel = () => {
+	const context = React.useContext(CarouselContext);
+	if (!context) throw new Error("useCarousel must be used within a <Carousel />");
+	return context;
+};
+var Carousel = ({ orientation = "horizontal", opts, setApi, plugins, className, children, ...props }) => {
+	const [carouselRef, api] = useEmblaCarousel({
+		...opts,
+		axis: orientation === "horizontal" ? "x" : "y"
+	}, plugins);
+	const [canScrollPrev, setCanScrollPrev] = React.useState(false);
+	const [canScrollNext, setCanScrollNext] = React.useState(false);
+	const onSelect = React.useCallback((api) => {
+		if (!api) return;
+		setCanScrollPrev(api.canScrollPrev());
+		setCanScrollNext(api.canScrollNext());
+	}, []);
+	const scrollPrev = React.useCallback(() => {
+		api?.scrollPrev();
+	}, [api]);
+	const scrollNext = React.useCallback(() => {
+		api?.scrollNext();
+	}, [api]);
+	const handleKeyDown = React.useCallback((event) => {
+		if (event.key === "ArrowLeft") {
+			event.preventDefault();
+			scrollPrev();
+		} else if (event.key === "ArrowRight") {
+			event.preventDefault();
+			scrollNext();
+		}
+	}, [scrollPrev, scrollNext]);
+	React.useEffect(() => {
+		if (!api || !setApi) return;
+		setApi(api);
+	}, [api, setApi]);
+	React.useEffect(() => {
+		if (!api) return;
+		onSelect(api);
+		api.on("reInit", onSelect);
+		api.on("select", onSelect);
+		return () => {
+			api.off("reInit", onSelect);
+			api.off("select", onSelect);
+		};
+	}, [api, onSelect]);
+	return /* @__PURE__ */ jsx(CarouselContext.Provider, {
+		value: {
+			carouselRef,
+			api,
+			opts,
+			orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
+			scrollPrev,
+			scrollNext,
+			canScrollPrev,
+			canScrollNext
+		},
+		children: /* @__PURE__ */ jsx("div", {
+			onKeyDownCapture: handleKeyDown,
+			className: cn("relative", className),
+			role: "region",
+			"aria-roledescription": "carousel",
+			"data-slot": "carousel",
+			...props,
+			children
+		})
+	});
+};
+var CarouselContent = ({ className, ...props }) => {
+	const { carouselRef, orientation } = useCarousel();
+	return /* @__PURE__ */ jsx("div", {
+		ref: carouselRef,
+		className: "overflow-hidden",
+		"data-slot": "carousel-content",
+		"data-focus": "inset",
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn("flex", orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col", className),
+			...props
+		})
+	});
+};
+var CarouselItem = ({ className, ...props }) => {
+	const { orientation } = useCarousel();
+	return /* @__PURE__ */ jsx("div", {
+		role: "group",
+		"aria-roledescription": "slide",
+		"data-slot": "carousel-item",
+		className: cn("min-w-0 shrink-0 grow-0 basis-full", orientation === "horizontal" ? "pl-4" : "pt-4", className),
+		...props
+	});
+};
+var CarouselPrevious = ({ className, variant = "outline", size = "icon-sm", ...props }) => {
+	const { orientation, scrollPrev, canScrollPrev } = useCarousel();
+	return /* @__PURE__ */ jsxs(Button, {
+		"data-slot": "carousel-previous",
+		variant,
+		size,
+		className: cn("absolute touch-manipulation rounded-full", orientation === "horizontal" ? "inset-y-0 -left-12 my-auto" : "-top-12 left-1/2 -translate-x-1/2 rotate-90", className),
+		disabled: !canScrollPrev,
+		onClick: scrollPrev,
+		...props,
+		children: [/* @__PURE__ */ jsx(IconChevronLeft, {}), /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: "Previous slide"
+		})]
+	});
+};
+var CarouselNext = ({ className, variant = "outline", size = "icon-sm", ...props }) => {
+	const { orientation, scrollNext, canScrollNext } = useCarousel();
+	return /* @__PURE__ */ jsxs(Button, {
+		"data-slot": "carousel-next",
+		variant,
+		size,
+		className: cn("absolute touch-manipulation rounded-full", orientation === "horizontal" ? "inset-y-0 -right-12 my-auto" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90", className),
+		disabled: !canScrollNext,
+		onClick: scrollNext,
+		...props,
+		children: [/* @__PURE__ */ jsx(IconChevronRight, {}), /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: "Next slide"
+		})]
+	});
+};
+//#endregion
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, useCarousel };
+
+//# sourceMappingURL=carousel.js.map

package/dist/ui/src/components/ui/carousel/carousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.js","names":[],"sources":["../../../../../../../ui/src/components/ui/carousel/carousel.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@edyn/ui/lib/utils';\nimport { IconChevronLeft, IconChevronRight } from '@tabler/icons-react';\nimport useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react';\nimport * as React from 'react';\nimport { Button } from '../button';\n\nexport type TCarouselApi = UseEmblaCarouselType[1];\ntype TUseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype TCarouselOptions = TUseCarouselParameters[0];\ntype TCarouselPlugin = TUseCarouselParameters[1];\n\ntype TCarouselProps = {\n  opts?: TCarouselOptions;\n  plugins?: TCarouselPlugin;\n  orientation?: 'horizontal' | 'vertical';\n  setApi?: (api: TCarouselApi) => void;\n};\n\ntype TCarouselContextProps = {\n  carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n  api: ReturnType<typeof useEmblaCarousel>[1];\n  scrollPrev: () => void;\n  scrollNext: () => void;\n  canScrollPrev: boolean;\n  canScrollNext: boolean;\n} & TCarouselProps;\n\nconst CarouselContext = React.createContext<TCarouselContextProps | null>(null);\n\nexport const useCarousel = () => {\n  const context = React.useContext(CarouselContext);\n\n  if (!context) {\n    throw new Error('useCarousel must be used within a <Carousel />');\n  }\n\n  return context;\n};\n\nexport const Carousel = ({\n  orientation = 'horizontal',\n  opts,\n  setApi,\n  plugins,\n  className,\n  children,\n  ...props\n}: React.ComponentProps<'div'> & TCarouselProps) => {\n  const [carouselRef, api] = useEmblaCarousel(\n    {\n      ...opts,\n      axis: orientation === 'horizontal' ? 'x' : 'y',\n    },\n    plugins,\n  );\n  const [canScrollPrev, setCanScrollPrev] = React.useState(false);\n  const [canScrollNext, setCanScrollNext] = React.useState(false);\n\n  const onSelect = React.useCallback((api: TCarouselApi) => {\n    if (!api) {\n      return;\n    }\n    setCanScrollPrev(api.canScrollPrev());\n    setCanScrollNext(api.canScrollNext());\n  }, []);\n\n  const scrollPrev = React.useCallback(() => {\n    api?.scrollPrev();\n  }, [api]);\n\n  const scrollNext = React.useCallback(() => {\n    api?.scrollNext();\n  }, [api]);\n\n  const handleKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (event.key === 'ArrowLeft') {\n        event.preventDefault();\n        scrollPrev();\n      } else if (event.key === 'ArrowRight') {\n        event.preventDefault();\n        scrollNext();\n      }\n    },\n    [scrollPrev, scrollNext],\n  );\n\n  React.useEffect(() => {\n    if (!api || !setApi) {\n      return;\n    }\n    setApi(api);\n  }, [api, setApi]);\n\n  React.useEffect(() => {\n    if (!api) {\n      return;\n    }\n    onSelect(api);\n    api.on('reInit', onSelect);\n    api.on('select', onSelect);\n\n    return () => {\n      api.off('reInit', onSelect);\n      api.off('select', onSelect);\n    };\n  }, [api, onSelect]);\n\n  return (\n    <CarouselContext.Provider\n      value={{\n        carouselRef,\n        api: api,\n        opts,\n        orientation: orientation || (opts?.axis === 'y' ? 'vertical' : 'horizontal'),\n        scrollPrev,\n        scrollNext,\n        canScrollPrev,\n        canScrollNext,\n      }}\n    >\n      {/* The generated shadcn carousel deliberately uses ARIA carousel semantics on a div. */}\n      {/* biome-ignore lint/a11y/useSemanticElements: section would change the public root element. */}\n      <div\n        onKeyDownCapture={handleKeyDown}\n        className={cn('relative', className)}\n        role=\"region\"\n        aria-roledescription=\"carousel\"\n        data-slot=\"carousel\"\n        {...props}\n      >\n        {children}\n      </div>\n    </CarouselContext.Provider>\n  );\n};\n\nexport const CarouselContent = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  const { carouselRef, orientation } = useCarousel();\n\n  return (\n    <div ref={carouselRef} className=\"overflow-hidden\" data-slot=\"carousel-content\" data-focus=\"inset\">\n      <div className={cn('flex', orientation === 'horizontal' ? '-ml-4' : '-mt-4 flex-col', className)} {...props} />\n    </div>\n  );\n};\n\nexport const CarouselItem = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  const { orientation } = useCarousel();\n\n  return (\n    // The generated shadcn carousel deliberately uses the ARIA group role for each slide.\n    // biome-ignore lint/a11y/useSemanticElements: fieldset is not an equivalent carousel slide element.\n    <div\n      role=\"group\"\n      aria-roledescription=\"slide\"\n      data-slot=\"carousel-item\"\n      className={cn('min-w-0 shrink-0 grow-0 basis-full', orientation === 'horizontal' ? 'pl-4' : 'pt-4', className)}\n      {...props}\n    />\n  );\n};\n\nexport const CarouselPrevious = ({ className, variant = 'outline', size = 'icon-sm', ...props }: React.ComponentProps<typeof Button>) => {\n  const { orientation, scrollPrev, canScrollPrev } = useCarousel();\n\n  return (\n    <Button\n      data-slot=\"carousel-previous\"\n      variant={variant}\n      size={size}\n      className={cn(\n        'absolute touch-manipulation rounded-full',\n        orientation === 'horizontal' ? 'inset-y-0 -left-12 my-auto' : '-top-12 left-1/2 -translate-x-1/2 rotate-90',\n        className,\n      )}\n      disabled={!canScrollPrev}\n      onClick={scrollPrev}\n      {...props}\n    >\n      <IconChevronLeft />\n      <span className=\"sr-only\">Previous slide</span>\n    </Button>\n  );\n};\n\nexport const CarouselNext = ({ className, variant = 'outline', size = 'icon-sm', ...props }: React.ComponentProps<typeof Button>) => {\n  const { orientation, scrollNext, canScrollNext } = useCarousel();\n\n  return (\n    <Button\n      data-slot=\"carousel-next\"\n      variant={variant}\n      size={size}\n      className={cn(\n        'absolute touch-manipulation rounded-full',\n        orientation === 'horizontal' ? 'inset-y-0 -right-12 my-auto' : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',\n        className,\n      )}\n      disabled={!canScrollNext}\n      onClick={scrollNext}\n      {...props}\n    >\n      <IconChevronRight />\n      <span className=\"sr-only\">Next slide</span>\n    </Button>\n  );\n};\n"],"mappings":"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"}