@etus/ui 0.4.0-beta.1 → 0.4.0-beta.3

package/dist/chunk-23BHD62H.js

@@ -0,0 +1,288 @@
+import { cn } from './chunk-HRNDJU7D.js';
+import { Star, StarHalf } from 'lucide-react';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var ratingVariants = cva(
+  "inline-flex items-center gap-[var(--rating-item-gap)]",
+  {
+    variants: {
+      size: {
+        sm: "[&_svg]:size-[var(--rating-icon-size-sm)]",
+        md: "[&_svg]:size-[var(--rating-icon-size-md)]",
+        lg: "[&_svg]:size-[var(--rating-icon-size-lg)]"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var ratingItemVariants = cva(
+  [
+    "inline-flex items-center justify-center transition-colors",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 rounded-sm"
+  ],
+  {
+    variants: {
+      filled: {
+        empty: "text-[color:var(--rating-icon-color-empty)]",
+        half: "text-[color:var(--rating-icon-color-filled)]",
+        full: "text-[color:var(--rating-icon-color-filled)]"
+      },
+      disabled: {
+        true: "cursor-not-allowed opacity-50",
+        false: ""
+      },
+      readOnly: {
+        true: "cursor-default",
+        false: ""
+      }
+    },
+    compoundVariants: [
+      {
+        disabled: false,
+        readOnly: false,
+        className: "cursor-pointer hover:scale-110 hover:text-[color:var(--rating-icon-color-filled)]"
+      }
+    ],
+    defaultVariants: {
+      filled: "empty",
+      disabled: false,
+      readOnly: false
+    }
+  }
+);
+function RatingItem({
+  index,
+  filled,
+  size: _size,
+  disabled,
+  readOnly,
+  emptyIcon,
+  filledIcon,
+  halfIcon,
+  onClick,
+  onHover,
+  onLeave,
+  onKeyDown,
+  isActive,
+  tabIndex,
+  label
+}) {
+  const isInteractive = !disabled && !readOnly;
+  const renderIcon = () => {
+    if (filled === "full") {
+      return filledIcon ?? /* @__PURE__ */ jsx(Star, { className: "fill-current" });
+    }
+    if (filled === "half") {
+      return halfIcon ?? /* @__PURE__ */ jsxs("span", { className: "relative inline-flex", children: [
+        /* @__PURE__ */ jsx(Star, { className: "fill-muted stroke-muted-foreground" }),
+        /* @__PURE__ */ jsx(StarHalf, { className: "absolute inset-0 fill-current" })
+      ] });
+    }
+    return emptyIcon ?? /* @__PURE__ */ jsx(Star, {});
+  };
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        ratingItemVariants({
+          filled,
+          disabled,
+          readOnly
+        })
+      ),
+      "aria-checked": filled !== "empty",
+      "aria-label": label,
+      "data-active": isActive,
+      "data-filled": filled,
+      "data-index": index,
+      "data-slot": "rating-item",
+      role: "radio",
+      tabIndex,
+      onClick: isInteractive ? onClick : void 0,
+      onKeyDown: isInteractive ? onKeyDown : void 0,
+      onMouseEnter: isInteractive ? onHover : void 0,
+      onMouseLeave: isInteractive ? onLeave : void 0,
+      children: renderIcon()
+    }
+  );
+}
+function Rating({
+  className,
+  value: controlledValue,
+  defaultValue = 0,
+  max = 5,
+  size = "md",
+  allowHalf = false,
+  readOnly = false,
+  disabled = false,
+  emptyIcon,
+  filledIcon,
+  halfIcon,
+  onChange,
+  onHover,
+  name,
+  ...props
+}) {
+  const [internalValue, setInternalValue] = React.useState(defaultValue);
+  const [hoverValue, setHoverValue] = React.useState(null);
+  const [focusedIndex, setFocusedIndex] = React.useState(null);
+  const isControlled = controlledValue !== void 0;
+  const currentValue = isControlled ? controlledValue : internalValue;
+  const displayValue = hoverValue ?? currentValue;
+  const isInteractive = !disabled && !readOnly;
+  const handleClick = (index) => {
+    if (!isInteractive) return;
+    const newValue = allowHalf ? index + 0.5 : index + 1;
+    const finalValue = newValue === currentValue ? 0 : newValue;
+    if (!isControlled) {
+      setInternalValue(finalValue);
+    }
+    onChange?.(finalValue);
+  };
+  const handleFullClick = (index) => {
+    if (!isInteractive) return;
+    const newValue = index + 1;
+    const finalValue = newValue === currentValue ? 0 : newValue;
+    if (!isControlled) {
+      setInternalValue(finalValue);
+    }
+    onChange?.(finalValue);
+  };
+  const handleHover = (index) => {
+    if (!isInteractive) return;
+    const hoverVal = allowHalf ? index + 0.5 : index + 1;
+    setHoverValue(hoverVal);
+    onHover?.(hoverVal);
+  };
+  const handleLeave = () => {
+    if (!isInteractive) return;
+    setHoverValue(null);
+    onHover?.(null);
+  };
+  const focusItemByIndex = (index) => {
+    const item = document.querySelector(
+      `[data-slot="rating-item"][data-index="${String(index)}"]`
+    );
+    item?.focus();
+    setFocusedIndex(index);
+  };
+  const handleKeyDown = (event, _index) => {
+    if (!isInteractive) return;
+    const step = allowHalf ? 0.5 : 1;
+    switch (event.key) {
+      case "ArrowRight":
+      case "ArrowUp": {
+        event.preventDefault();
+        const newValue = Math.min(currentValue + step, max);
+        if (!isControlled) {
+          setInternalValue(newValue);
+        }
+        onChange?.(newValue);
+        const newIndex = Math.ceil(newValue) - 1;
+        focusItemByIndex(Math.min(newIndex, max - 1));
+        break;
+      }
+      case "ArrowLeft":
+      case "ArrowDown": {
+        event.preventDefault();
+        const newValue = Math.max(currentValue - step, 0);
+        if (!isControlled) {
+          setInternalValue(newValue);
+        }
+        onChange?.(newValue);
+        const newIndex = Math.max(Math.ceil(newValue) - 1, 0);
+        focusItemByIndex(newIndex);
+        break;
+      }
+      case "Home": {
+        event.preventDefault();
+        if (!isControlled) {
+          setInternalValue(0);
+        }
+        onChange?.(0);
+        focusItemByIndex(0);
+        break;
+      }
+      case "End": {
+        event.preventDefault();
+        if (!isControlled) {
+          setInternalValue(max);
+        }
+        onChange?.(max);
+        focusItemByIndex(max - 1);
+        break;
+      }
+    }
+  };
+  const getFilledState = (index) => {
+    const itemValue = index + 1;
+    if (displayValue >= itemValue) {
+      return "full";
+    }
+    if (allowHalf && displayValue >= index + 0.5) {
+      return "half";
+    }
+    return "empty";
+  };
+  const items = Array.from({ length: max }, (_, index) => {
+    const filled = getFilledState(index);
+    const isActive = focusedIndex === index;
+    return /* @__PURE__ */ jsx(
+      RatingItem,
+      {
+        disabled,
+        emptyIcon,
+        filled,
+        filledIcon,
+        halfIcon,
+        index,
+        isActive,
+        label: `${String(index + 1)} star${index + 1 === 1 ? "" : "s"}`,
+        readOnly,
+        size,
+        tabIndex: isInteractive && index === Math.max(Math.ceil(currentValue) - 1, 0) ? 0 : -1,
+        onClick: () => {
+          if (allowHalf) {
+            handleFullClick(index);
+          } else {
+            handleClick(index);
+          }
+        },
+        onHover: () => {
+          handleHover(index);
+        },
+        onKeyDown: (e) => {
+          handleKeyDown(e);
+        },
+        onLeave: handleLeave
+      },
+      index
+    );
+  });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "aria-disabled": disabled,
+      "aria-label": props["aria-label"] ?? "Rating",
+      "aria-readonly": readOnly,
+      className: cn(ratingVariants({ size }), className),
+      "data-disabled": disabled || void 0,
+      "data-readonly": readOnly || void 0,
+      "data-slot": "rating",
+      role: "radiogroup",
+      ...props,
+      children: [
+        name && /* @__PURE__ */ jsx("input", { name, type: "hidden", value: currentValue }),
+        items
+      ]
+    }
+  );
+}
+
+export { Rating, ratingItemVariants, ratingVariants };
+//# sourceMappingURL=chunk-23BHD62H.js.map
+//# sourceMappingURL=chunk-23BHD62H.js.map

package/dist/chunk-23BHD62H.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/forms/Rating/Rating.variants.ts","../src/components/forms/Rating/Rating.tsx"],"names":[],"mappings":"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","file":"chunk-23BHD62H.js","sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\"\n\nexport const ratingVariants = cva(\n  \"inline-flex items-center gap-[var(--rating-item-gap)]\",\n  {\n    variants: {\n      size: {\n        sm: \"[&_svg]:size-[var(--rating-icon-size-sm)]\",\n        md: \"[&_svg]:size-[var(--rating-icon-size-md)]\",\n        lg: \"[&_svg]:size-[var(--rating-icon-size-lg)]\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n)\n\nexport const ratingItemVariants = cva(\n  [\n    \"inline-flex items-center justify-center transition-colors\",\n    \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 rounded-sm\",\n  ],\n  {\n    variants: {\n      filled: {\n        empty: \"text-[color:var(--rating-icon-color-empty)]\",\n        half: \"text-[color:var(--rating-icon-color-filled)]\",\n        full: \"text-[color:var(--rating-icon-color-filled)]\",\n      },\n      disabled: {\n        true: \"cursor-not-allowed opacity-50\",\n        false: \"\",\n      },\n      readOnly: {\n        true: \"cursor-default\",\n        false: \"\",\n      },\n    },\n    compoundVariants: [\n      {\n        disabled: false,\n        readOnly: false,\n        className: \"cursor-pointer hover:scale-110 hover:text-[color:var(--rating-icon-color-filled)]\",\n      },\n    ],\n    defaultVariants: {\n      filled: \"empty\",\n      disabled: false,\n      readOnly: false,\n    },\n  }\n)\n\nexport type RatingVariantProps = VariantProps<typeof ratingVariants>\nexport type RatingItemVariantProps = VariantProps<typeof ratingItemVariants>\n","\"use client\"\n\nimport type { RatingItemProps, RatingProps } from \"./Rating.types\"\n\nimport { Star, StarHalf } from \"lucide-react\"\nimport * as React from \"react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport { ratingItemVariants, ratingVariants } from \"./Rating.variants\"\n\nfunction RatingItem({\n  index,\n  filled,\n  size: _size,\n  disabled,\n  readOnly,\n  emptyIcon,\n  filledIcon,\n  halfIcon,\n  onClick,\n  onHover,\n  onLeave,\n  onKeyDown,\n  isActive,\n  tabIndex,\n  label,\n}: RatingItemProps & { label: string }) {\n  const isInteractive = !disabled && !readOnly\n\n  const renderIcon = () => {\n    if (filled === \"full\") {\n      return filledIcon ?? <Star className=\"fill-current\" />\n    }\n    if (filled === \"half\") {\n      return halfIcon ?? (\n        <span className=\"relative inline-flex\">\n          <Star className=\"fill-muted stroke-muted-foreground\" />\n          <StarHalf className=\"absolute inset-0 fill-current\" />\n        </span>\n      )\n    }\n    return emptyIcon ?? <Star />\n  }\n\n  return (\n    <span\n      className={cn(\n        ratingItemVariants({\n          filled,\n          disabled,\n          readOnly,\n        })\n      )}\n      aria-checked={filled !== \"empty\"}\n      aria-label={label}\n      data-active={isActive}\n      data-filled={filled}\n      data-index={index}\n      data-slot=\"rating-item\"\n      role=\"radio\"\n      tabIndex={tabIndex}\n      onClick={isInteractive ? onClick : undefined}\n      onKeyDown={isInteractive ? onKeyDown : undefined}\n      onMouseEnter={isInteractive ? onHover : undefined}\n      onMouseLeave={isInteractive ? onLeave : undefined}\n    >\n      {renderIcon()}\n    </span>\n  )\n}\n\nfunction Rating({\n  className,\n  value: controlledValue,\n  defaultValue = 0,\n  max = 5,\n  size = \"md\",\n  allowHalf = false,\n  readOnly = false,\n  disabled = false,\n  emptyIcon,\n  filledIcon,\n  halfIcon,\n  onChange,\n  onHover,\n  name,\n  ...props\n}: RatingProps) {\n  const [internalValue, setInternalValue] = React.useState(defaultValue)\n  const [hoverValue, setHoverValue] = React.useState<null | number>(null)\n  const [focusedIndex, setFocusedIndex] = React.useState<null | number>(null)\n\n  const isControlled = controlledValue !== undefined\n  const currentValue = isControlled ? controlledValue : internalValue\n  const displayValue = hoverValue ?? currentValue\n\n  const isInteractive = !disabled && !readOnly\n\n  const handleClick = (index: number) => {\n    if (!isInteractive) return\n\n    const newValue = allowHalf ? index + 0.5 : index + 1\n    // If clicking the same value, toggle to 0\n    const finalValue = newValue === currentValue ? 0 : newValue\n\n    if (!isControlled) {\n      setInternalValue(finalValue)\n    }\n    onChange?.(finalValue)\n  }\n\n  const handleFullClick = (index: number) => {\n    if (!isInteractive) return\n\n    const newValue = index + 1\n    const finalValue = newValue === currentValue ? 0 : newValue\n\n    if (!isControlled) {\n      setInternalValue(finalValue)\n    }\n    onChange?.(finalValue)\n  }\n\n  const handleHover = (index: number) => {\n    if (!isInteractive) return\n\n    const hoverVal = allowHalf ? index + 0.5 : index + 1\n    setHoverValue(hoverVal)\n    onHover?.(hoverVal)\n  }\n\n  const handleLeave = () => {\n    if (!isInteractive) return\n\n    setHoverValue(null)\n    onHover?.(null)\n  }\n\n  // Helper to focus an item by index (avoids effect anti-pattern)\n  const focusItemByIndex = (index: number) => {\n    const item = document.querySelector<HTMLElement>(\n      `[data-slot=\"rating-item\"][data-index=\"${String(index)}\"]`\n    )\n    item?.focus()\n    setFocusedIndex(index)\n  }\n\n  const handleKeyDown = (event: React.KeyboardEvent, _index: number) => {\n    if (!isInteractive) return\n\n    const step = allowHalf ? 0.5 : 1\n\n    switch (event.key) {\n      case \"ArrowRight\":\n      case \"ArrowUp\": {\n        event.preventDefault()\n        const newValue = Math.min(currentValue + step, max)\n        if (!isControlled) {\n          setInternalValue(newValue)\n        }\n        onChange?.(newValue)\n        // Move focus to the new index directly (avoids effect anti-pattern)\n        const newIndex = Math.ceil(newValue) - 1\n        focusItemByIndex(Math.min(newIndex, max - 1))\n        break\n      }\n      case \"ArrowLeft\":\n      case \"ArrowDown\": {\n        event.preventDefault()\n        const newValue = Math.max(currentValue - step, 0)\n        if (!isControlled) {\n          setInternalValue(newValue)\n        }\n        onChange?.(newValue)\n        // Move focus to the new index directly (avoids effect anti-pattern)\n        const newIndex = Math.max(Math.ceil(newValue) - 1, 0)\n        focusItemByIndex(newIndex)\n        break\n      }\n      case \"Home\": {\n        event.preventDefault()\n        if (!isControlled) {\n          setInternalValue(0)\n        }\n        onChange?.(0)\n        focusItemByIndex(0)\n        break\n      }\n      case \"End\": {\n        event.preventDefault()\n        if (!isControlled) {\n          setInternalValue(max)\n        }\n        onChange?.(max)\n        focusItemByIndex(max - 1)\n        break\n      }\n    }\n  }\n\n  const getFilledState = (index: number): \"empty\" | \"full\" | \"half\" => {\n    const itemValue = index + 1\n    if (displayValue >= itemValue) {\n      return \"full\"\n    }\n    if (allowHalf && displayValue >= index + 0.5) {\n      return \"half\"\n    }\n    return \"empty\"\n  }\n\n  const items = Array.from({ length: max }, (_, index) => {\n    const filled = getFilledState(index)\n    const isActive = focusedIndex === index\n\n    return (\n      <RatingItem\n        key={index}\n        disabled={disabled}\n        emptyIcon={emptyIcon}\n        filled={filled}\n        filledIcon={filledIcon}\n        halfIcon={halfIcon}\n        index={index}\n        isActive={isActive}\n        label={`${String(index + 1)} star${index + 1 === 1 ? \"\" : \"s\"}`}\n        readOnly={readOnly}\n        size={size}\n        tabIndex={isInteractive && index === Math.max(Math.ceil(currentValue) - 1, 0) ? 0 : -1}\n        onClick={() => { if (allowHalf) { handleFullClick(index); } else { handleClick(index); } }}\n        onHover={() => { handleHover(index); }}\n        onKeyDown={(e) => { handleKeyDown(e, index); }}\n        onLeave={handleLeave}\n      />\n    )\n  })\n\n  return (\n    <div\n      aria-disabled={disabled}\n      aria-label={props[\"aria-label\"] ?? \"Rating\"}\n      aria-readonly={readOnly}\n      className={cn(ratingVariants({ size }), className)}\n      data-disabled={disabled || undefined}\n      data-readonly={readOnly || undefined}\n      data-slot=\"rating\"\n      role=\"radiogroup\"\n      {...props}\n    >\n      {name && (\n        <input name={name} type=\"hidden\" value={currentValue} />\n      )}\n      {items}\n    </div>\n  )\n}\n\nexport { Rating }\n"]}

package/dist/chunk-2D6OFVPN.js

@@ -0,0 +1,145 @@
+import { cn } from './chunk-HRNDJU7D.js';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { X } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var sizeClasses = {
+  "2xl": "sm:max-w-2xl",
+  full: "sm:max-w-[calc(100vw-4rem)]",
+  lg: "sm:max-w-lg",
+  md: "sm:max-w-md",
+  sm: "sm:max-w-sm",
+  xl: "sm:max-w-xl"
+};
+var DEFAULT_FALLBACK_TITLE = "Modal dialog";
+var DEFAULT_FALLBACK_DESCRIPTION = "Use this dialog to complete the current action.";
+var DEFAULT_CLOSE_LABEL = "Close";
+function Modal({
+  children,
+  className,
+  closeLabel = DEFAULT_CLOSE_LABEL,
+  closeOnEscape = true,
+  closeOnOverlayClick = true,
+  defaultOpen = false,
+  description,
+  fallbackDescription = DEFAULT_FALLBACK_DESCRIPTION,
+  fallbackTitle = DEFAULT_FALLBACK_TITLE,
+  footer,
+  onOpenChange,
+  open,
+  overlayClassName,
+  showCloseButton = true,
+  size = "md",
+  title,
+  trigger
+}) {
+  const accessibleTitle = title ?? fallbackTitle;
+  const accessibleDescription = description ?? fallbackDescription;
+  const handleOpenChange = (newOpen) => {
+    onOpenChange?.(newOpen);
+  };
+  const handleEscapeKeyDown = (event) => {
+    if (!closeOnEscape) {
+      event.preventDefault();
+    }
+  };
+  const handleInteractOutside = (event) => {
+    if (!closeOnOverlayClick) {
+      event.preventDefault();
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    DialogPrimitive.Root,
+    {
+      defaultOpen,
+      open,
+      onOpenChange: handleOpenChange,
+      children: [
+        trigger && /* @__PURE__ */ jsx(DialogPrimitive.Trigger, { asChild: true, "data-slot": "modal-trigger", children: trigger }),
+        /* @__PURE__ */ jsxs(DialogPrimitive.Portal, { children: [
+          /* @__PURE__ */ jsx(
+            DialogPrimitive.Overlay,
+            {
+              className: cn(
+                "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-[color:var(--modal-overlay-bg)]",
+                overlayClassName
+              ),
+              "data-slot": "modal-overlay"
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            DialogPrimitive.Content,
+            {
+              className: cn(
+                "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] border duration-200",
+                "bg-[color:var(--modal-content-bg)] border-[color:var(--modal-content-border)] gap-[var(--modal-content-gap)] rounded-[var(--modal-content-radius)] p-[var(--modal-content-padding)] shadow-[var(--modal-content-shadow)]",
+                sizeClasses[size],
+                className
+              ),
+              "data-slot": "modal",
+              onEscapeKeyDown: handleEscapeKeyDown,
+              onInteractOutside: handleInteractOutside,
+              children: [
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: "flex flex-col gap-[var(--modal-header-gap)] text-center sm:text-left",
+                    "data-slot": "modal-header",
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        DialogPrimitive.Title,
+                        {
+                          className: cn(
+                            "text-lg leading-tight font-semibold",
+                            !title && "sr-only"
+                          ),
+                          "data-slot": "modal-title",
+                          children: accessibleTitle
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        DialogPrimitive.Description,
+                        {
+                          className: cn(
+                            "text-muted-foreground text-sm",
+                            !description && "sr-only"
+                          ),
+                          "data-slot": "modal-description",
+                          children: accessibleDescription
+                        }
+                      )
+                    ]
+                  }
+                ),
+                children && /* @__PURE__ */ jsx("div", { "data-slot": "modal-content", children }),
+                footer && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: "flex flex-col-reverse gap-[var(--modal-footer-gap)] sm:flex-row sm:justify-end",
+                    "data-slot": "modal-footer",
+                    children: footer
+                  }
+                ),
+                showCloseButton && /* @__PURE__ */ jsxs(
+                  DialogPrimitive.Close,
+                  {
+                    className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+                    "data-slot": "modal-close",
+                    children: [
+                      /* @__PURE__ */ jsx(X, {}),
+                      /* @__PURE__ */ jsx("span", { className: "sr-only", children: closeLabel })
+                    ]
+                  }
+                )
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+export { Modal };
+//# sourceMappingURL=chunk-2D6OFVPN.js.map
+//# sourceMappingURL=chunk-2D6OFVPN.js.map

package/dist/chunk-2D6OFVPN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/Modal/Modal.tsx"],"names":[],"mappings":";;;;;AAYA,IAAM,WAAA,GAAyC;AAAA,EAC7C,KAAA,EAAO,cAAA;AAAA,EACP,IAAA,EAAM,6BAAA;AAAA,EACN,EAAA,EAAI,aAAA;AAAA,EACJ,EAAA,EAAI,aAAA;AAAA,EACJ,EAAA,EAAI,aAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAGA,IAAM,sBAAA,GAAyB,cAAA;AAC/B,IAAM,4BAAA,GAA+B,iDAAA;AACrC,IAAM,mBAAA,GAAsB,OAAA;AA8B5B,SAAS,KAAA,CAAM;AAAA,EACb,QAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA,GAAa,mBAAA;AAAA,EACb,aAAA,GAAgB,IAAA;AAAA,EAChB,mBAAA,GAAsB,IAAA;AAAA,EACtB,WAAA,GAAc,KAAA;AAAA,EACd,WAAA;AAAA,EACA,mBAAA,GAAsB,4BAAA;AAAA,EACtB,aAAA,GAAgB,sBAAA;AAAA,EAChB,MAAA;AAAA,EACA,YAAA;AAAA,EACA,IAAA;AAAA,EACA,gBAAA;AAAA,EACA,eAAA,GAAkB,IAAA;AAAA,EAClB,IAAA,GAAO,IAAA;AAAA,EACP,KAAA;AAAA,EACA;AACF,CAAA,EAAe;AACb,EAAA,MAAM,kBAAkB,KAAA,IAAS,aAAA;AACjC,EAAA,MAAM,wBAAwB,WAAA,IAAe,mBAAA;AAE7C,EAAA,MAAM,gBAAA,GAAmB,CAAC,OAAA,KAA2B;AACnD,IAAA,YAAA,GAAe,OAAO,CAAA;AAAA,EACxB,CAAA;AAEA,EAAA,MAAM,mBAAA,GAAsB,CAAC,KAAA,KAA+B;AAC1D,IAAA,IAAI,CAAC,aAAA,EAAe;AAClB,MAAA,KAAA,CAAM,cAAA,EAAe;AAAA,IACvB;AAAA,EACF,CAAA;AAEA,EAAA,MAAM,qBAAA,GAAwB,CAC5B,KAAA,KACS;AACT,IAAA,IAAI,CAAC,mBAAA,EAAqB;AACxB,MAAA,KAAA,CAAM,cAAA,EAAe;AAAA,IACvB;AAAA,EACF,CAAA;AAEA,EAAA,uBACE,IAAA;AAAA,IAAiB,eAAA,CAAA,IAAA;AAAA,IAAhB;AAAA,MACC,WAAA;AAAA,MACA,IAAA;AAAA,MACA,YAAA,EAAc,gBAAA;AAAA,MAEb,QAAA,EAAA;AAAA,QAAA,OAAA,wBACkB,eAAA,CAAA,OAAA,EAAhB,EAAwB,SAAO,IAAA,EAAC,WAAA,EAAU,iBACxC,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,wBAGF,IAAA,CAAiB,wBAAhB,EACC,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAiB,eAAA,CAAA,OAAA;AAAA,YAAhB;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,+KAAA;AAAA,gBACA;AAAA,eACF;AAAA,cACA,WAAA,EAAU;AAAA;AAAA,WACZ;AAAA,0BACA,IAAA;AAAA,YAAiB,eAAA,CAAA,OAAA;AAAA,YAAhB;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,oTAAA;AAAA,gBACA,0NAAA;AAAA,gBACA,YAAY,IAAI,CAAA;AAAA,gBAChB;AAAA,eACF;AAAA,cACA,WAAA,EAAU,OAAA;AAAA,cACV,eAAA,EAAiB,mBAAA;AAAA,cACjB,iBAAA,EAAmB,qBAAA;AAAA,cAGnB,QAAA,EAAA;AAAA,gCAAA,IAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAU,sEAAA;AAAA,oBACV,WAAA,EAAU,cAAA;AAAA,oBAEV,QAAA,EAAA;AAAA,sCAAA,GAAA;AAAA,wBAAiB,eAAA,CAAA,KAAA;AAAA,wBAAhB;AAAA,0BACC,SAAA,EAAW,EAAA;AAAA,4BACT,qCAAA;AAAA,4BACA,CAAC,KAAA,IAAS;AAAA,2BACZ;AAAA,0BACA,WAAA,EAAU,aAAA;AAAA,0BAET,QAAA,EAAA;AAAA;AAAA,uBACH;AAAA,sCACA,GAAA;AAAA,wBAAiB,eAAA,CAAA,WAAA;AAAA,wBAAhB;AAAA,0BACC,SAAA,EAAW,EAAA;AAAA,4BACT,+BAAA;AAAA,4BACA,CAAC,WAAA,IAAe;AAAA,2BAClB;AAAA,0BACA,WAAA,EAAU,mBAAA;AAAA,0BAET,QAAA,EAAA;AAAA;AAAA;AACH;AAAA;AAAA,iBACF;AAAA,gBAGC,QAAA,oBAAY,GAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,iBAAiB,QAAA,EAAS,CAAA;AAAA,gBAGrD,MAAA,oBACC,GAAA;AAAA,kBAAC,KAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAU,gFAAA;AAAA,oBACV,WAAA,EAAU,cAAA;AAAA,oBAET,QAAA,EAAA;AAAA;AAAA,iBACH;AAAA,gBAID,eAAA,oBACC,IAAA;AAAA,kBAAiB,eAAA,CAAA,KAAA;AAAA,kBAAhB;AAAA,oBACC,SAAA,EAAU,mWAAA;AAAA,oBACV,WAAA,EAAU,aAAA;AAAA,oBAEV,QAAA,EAAA;AAAA,sCAAA,GAAA,CAAC,CAAA,EAAA,EAAE,CAAA;AAAA,sCACH,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,SAAA,EAAW,QAAA,EAAA,UAAA,EAAW;AAAA;AAAA;AAAA;AACxC;AAAA;AAAA;AAEJ,SAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ","file":"chunk-2D6OFVPN.js","sourcesContent":["\"use client\"\n\nimport type { ModalProps, ModalSize } from \"./Modal.types\"\n\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\"\nimport { X } from \"lucide-react\"\n\nimport { cn } from \"../../../lib/utils\"\n\n/**\n * Size classes for modal widths\n */\nconst sizeClasses: Record<ModalSize, string> = {\n  \"2xl\": \"sm:max-w-2xl\",\n  full: \"sm:max-w-[calc(100vw-4rem)]\",\n  lg: \"sm:max-w-lg\",\n  md: \"sm:max-w-md\",\n  sm: \"sm:max-w-sm\",\n  xl: \"sm:max-w-xl\",\n}\n\n// Default English fallbacks — override via props for i18n (DES-1286 item 7)\nconst DEFAULT_FALLBACK_TITLE = \"Modal dialog\"\nconst DEFAULT_FALLBACK_DESCRIPTION = \"Use this dialog to complete the current action.\"\nconst DEFAULT_CLOSE_LABEL = \"Close\"\n\n/**\n * Modal - Simplified wrapper over Dialog\n *\n * A declarative API for common modal use cases. Provides a simpler interface\n * than Dialog's subcomponents while maintaining full accessibility.\n *\n * @example\n * ```tsx\n * // With trigger (uncontrolled)\n * <Modal\n *   trigger={<Button>Open Modal</Button>}\n *   title=\"Modal Title\"\n *   description=\"Optional description\"\n *   footer={<Button>Save</Button>}\n * >\n *   <p>Modal content here</p>\n * </Modal>\n *\n * // Controlled\n * <Modal\n *   open={isOpen}\n *   onOpenChange={setIsOpen}\n *   title=\"Controlled Modal\"\n * >\n *   <p>Content</p>\n * </Modal>\n * ```\n */\nfunction Modal({\n  children,\n  className,\n  closeLabel = DEFAULT_CLOSE_LABEL,\n  closeOnEscape = true,\n  closeOnOverlayClick = true,\n  defaultOpen = false,\n  description,\n  fallbackDescription = DEFAULT_FALLBACK_DESCRIPTION,\n  fallbackTitle = DEFAULT_FALLBACK_TITLE,\n  footer,\n  onOpenChange,\n  open,\n  overlayClassName,\n  showCloseButton = true,\n  size = \"md\",\n  title,\n  trigger,\n}: ModalProps) {\n  const accessibleTitle = title ?? fallbackTitle\n  const accessibleDescription = description ?? fallbackDescription\n\n  const handleOpenChange = (newOpen: boolean): void => {\n    onOpenChange?.(newOpen)\n  }\n\n  const handleEscapeKeyDown = (event: KeyboardEvent): void => {\n    if (!closeOnEscape) {\n      event.preventDefault()\n    }\n  }\n\n  const handleInteractOutside = (\n    event: CustomEvent<{ originalEvent: Event }>\n  ): void => {\n    if (!closeOnOverlayClick) {\n      event.preventDefault()\n    }\n  }\n\n  return (\n    <DialogPrimitive.Root\n      defaultOpen={defaultOpen}\n      open={open}\n      onOpenChange={handleOpenChange}\n    >\n      {trigger && (\n        <DialogPrimitive.Trigger asChild data-slot=\"modal-trigger\">\n          {trigger}\n        </DialogPrimitive.Trigger>\n      )}\n\n      <DialogPrimitive.Portal>\n        <DialogPrimitive.Overlay\n          className={cn(\n            \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-[color:var(--modal-overlay-bg)]\",\n            overlayClassName\n          )}\n          data-slot=\"modal-overlay\"\n        />\n        <DialogPrimitive.Content\n          className={cn(\n            \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] border duration-200\",\n            \"bg-[color:var(--modal-content-bg)] border-[color:var(--modal-content-border)] gap-[var(--modal-content-gap)] rounded-[var(--modal-content-radius)] p-[var(--modal-content-padding)] shadow-[var(--modal-content-shadow)]\",\n            sizeClasses[size],\n            className\n          )}\n          data-slot=\"modal\"\n          onEscapeKeyDown={handleEscapeKeyDown}\n          onInteractOutside={handleInteractOutside}\n        >\n          {/* Header */}\n          <div\n            className=\"flex flex-col gap-[var(--modal-header-gap)] text-center sm:text-left\"\n            data-slot=\"modal-header\"\n          >\n            <DialogPrimitive.Title\n              className={cn(\n                \"text-lg leading-tight font-semibold\",\n                !title && \"sr-only\"\n              )}\n              data-slot=\"modal-title\"\n            >\n              {accessibleTitle}\n            </DialogPrimitive.Title>\n            <DialogPrimitive.Description\n              className={cn(\n                \"text-muted-foreground text-sm\",\n                !description && \"sr-only\"\n              )}\n              data-slot=\"modal-description\"\n            >\n              {accessibleDescription}\n            </DialogPrimitive.Description>\n          </div>\n\n          {/* Content */}\n          {children && <div data-slot=\"modal-content\">{children}</div>}\n\n          {/* Footer */}\n          {footer && (\n            <div\n              className=\"flex flex-col-reverse gap-[var(--modal-footer-gap)] sm:flex-row sm:justify-end\"\n              data-slot=\"modal-footer\"\n            >\n              {footer}\n            </div>\n          )}\n\n          {/* Close Button */}\n          {showCloseButton && (\n            <DialogPrimitive.Close\n              className=\"ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\"\n              data-slot=\"modal-close\"\n            >\n              <X />\n              <span className=\"sr-only\">{closeLabel}</span>\n            </DialogPrimitive.Close>\n          )}\n        </DialogPrimitive.Content>\n      </DialogPrimitive.Portal>\n    </DialogPrimitive.Root>\n  )\n}\n\nexport { Modal }\n"]}

package/dist/chunk-2IFYXJ3H.js

@@ -0,0 +1,107 @@
+import { cn } from './chunk-HRNDJU7D.js';
+import { cva } from 'class-variance-authority';
+import { jsx } from 'react/jsx-runtime';
+
+var stackVariants = cva("flex", {
+  variants: {
+    /**
+     * Direction of the stack
+     * - column: Elements stacked vertically (default)
+     * - row: Elements in a horizontal line
+     * - wrap: Elements in a row that wraps to new lines
+     */
+    direction: {
+      column: "flex-col",
+      row: "flex-row",
+      wrap: "flex-row flex-wrap"
+    },
+    /**
+     * Spacing between elements (gap)
+     */
+    spacing: {
+      0: "gap-0",
+      1: "gap-1",
+      2: "gap-2",
+      3: "gap-3",
+      4: "gap-4",
+      6: "gap-6",
+      8: "gap-8"
+    },
+    /**
+     * Cross axis alignment (align-items)
+     * - start: Items at the start
+     * - center: Items at the center
+     * - end: Items at the end
+     * - stretch: Items stretched to fill
+     */
+    align: {
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      stretch: "items-stretch"
+    },
+    /**
+     * Main axis alignment (justify-content)
+     * - start: Items at the start
+     * - center: Items at the center
+     * - end: Items at the end
+     * - between: Space between items
+     * - around: Space around items
+     */
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around"
+    },
+    /**
+     * Whether children should grow to fill available space
+     */
+    grow: {
+      true: "[&>*]:flex-1",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    direction: "column",
+    spacing: 4,
+    align: "start",
+    justify: "start",
+    grow: false
+  }
+});
+function Stack({
+  as: Component = "div",
+  direction,
+  spacing,
+  align,
+  justify,
+  grow,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Component,
+    {
+      className: cn(
+        stackVariants({
+          direction,
+          spacing,
+          align,
+          justify,
+          grow
+        }),
+        className
+      ),
+      "data-direction": direction,
+      "data-slot": "stack",
+      "data-spacing": spacing,
+      ...props
+    }
+  );
+}
+
+export { Stack, stackVariants };
+//# sourceMappingURL=chunk-2IFYXJ3H.js.map
+//# sourceMappingURL=chunk-2IFYXJ3H.js.map

package/dist/chunk-2IFYXJ3H.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Stack/Stack.variants.ts","../src/components/layout/Stack/Stack.tsx"],"names":[],"mappings":";;;;AAMO,IAAM,aAAA,GAAgB,IAAI,MAAA,EAAQ;AAAA,EACvC,QAAA,EAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOR,SAAA,EAAW;AAAA,MACT,MAAA,EAAQ,UAAA;AAAA,MACR,GAAA,EAAK,UAAA;AAAA,MACL,IAAA,EAAM;AAAA,KACR;AAAA;AAAA;AAAA;AAAA,IAIA,OAAA,EAAS;AAAA,MACP,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG,OAAA;AAAA,MACH,CAAA,EAAG;AAAA,KACL;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA,KAAA,EAAO;AAAA,MACL,KAAA,EAAO,aAAA;AAAA,MACP,MAAA,EAAQ,cAAA;AAAA,MACR,GAAA,EAAK,WAAA;AAAA,MACL,OAAA,EAAS;AAAA,KACX;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IASA,OAAA,EAAS;AAAA,MACP,KAAA,EAAO,eAAA;AAAA,MACP,MAAA,EAAQ,gBAAA;AAAA,MACR,GAAA,EAAK,aAAA;AAAA,MACL,OAAA,EAAS,iBAAA;AAAA,MACT,MAAA,EAAQ;AAAA,KACV;AAAA;AAAA;AAAA;AAAA,IAIA,IAAA,EAAM;AAAA,MACJ,IAAA,EAAM,cAAA;AAAA,MACN,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,SAAA,EAAW,QAAA;AAAA,IACX,OAAA,EAAS,CAAA;AAAA,IACT,KAAA,EAAO,OAAA;AAAA,IACP,OAAA,EAAS,OAAA;AAAA,IACT,IAAA,EAAM;AAAA;AAEV,CAAC;AC/CD,SAAS,KAAA,CAAM;AAAA,EACb,IAAI,SAAA,GAAY,KAAA;AAAA,EAChB,SAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,IAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAe;AACb,EAAA,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,aAAA,CAAc;AAAA,UACZ,SAAA;AAAA,UACA,OAAA;AAAA,UACA,KAAA;AAAA,UACA,OAAA;AAAA,UACA;AAAA,SACD,CAAA;AAAA,QACD;AAAA,OACF;AAAA,MACA,gBAAA,EAAgB,SAAA;AAAA,MAChB,WAAA,EAAU,OAAA;AAAA,MACV,cAAA,EAAc,OAAA;AAAA,MACb,GAAG;AAAA;AAAA,GACN;AAEJ","file":"chunk-2IFYXJ3H.js","sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\"\n\n/**\n * Stack variant styles\n * Utility component for organizing elements in rows or columns with consistent spacing\n */\nexport const stackVariants = cva(\"flex\", {\n  variants: {\n    /**\n     * Direction of the stack\n     * - column: Elements stacked vertically (default)\n     * - row: Elements in a horizontal line\n     * - wrap: Elements in a row that wraps to new lines\n     */\n    direction: {\n      column: \"flex-col\",\n      row: \"flex-row\",\n      wrap: \"flex-row flex-wrap\",\n    },\n    /**\n     * Spacing between elements (gap)\n     */\n    spacing: {\n      0: \"gap-0\",\n      1: \"gap-1\",\n      2: \"gap-2\",\n      3: \"gap-3\",\n      4: \"gap-4\",\n      6: \"gap-6\",\n      8: \"gap-8\",\n    },\n    /**\n     * Cross axis alignment (align-items)\n     * - start: Items at the start\n     * - center: Items at the center\n     * - end: Items at the end\n     * - stretch: Items stretched to fill\n     */\n    align: {\n      start: \"items-start\",\n      center: \"items-center\",\n      end: \"items-end\",\n      stretch: \"items-stretch\",\n    },\n    /**\n     * Main axis alignment (justify-content)\n     * - start: Items at the start\n     * - center: Items at the center\n     * - end: Items at the end\n     * - between: Space between items\n     * - around: Space around items\n     */\n    justify: {\n      start: \"justify-start\",\n      center: \"justify-center\",\n      end: \"justify-end\",\n      between: \"justify-between\",\n      around: \"justify-around\",\n    },\n    /**\n     * Whether children should grow to fill available space\n     */\n    grow: {\n      true: \"[&>*]:flex-1\",\n      false: \"\",\n    },\n  },\n  defaultVariants: {\n    direction: \"column\",\n    spacing: 4,\n    align: \"start\",\n    justify: \"start\",\n    grow: false,\n  },\n})\n\nexport type StackVariantProps = VariantProps<typeof stackVariants>\n","import type { StackProps } from \"./Stack.types\"\n\nimport { cn } from \"../../../lib/utils\"\nimport { stackVariants } from \"./Stack.variants\"\n\n/**\n * Stack component for organizing elements in rows or columns\n *\n * A utility component that organizes child elements in a flexible box layout\n * with consistent spacing. Simplifies creating layouts without complex Tailwind classes.\n *\n * @example\n * ```tsx\n * <Stack spacing={4}>\n *   <div>Item 1</div>\n *   <div>Item 2</div>\n * </Stack>\n * ```\n *\n * @example\n * ```tsx\n * <Stack direction=\"row\" spacing={2} align=\"center\">\n *   <Button>Save</Button>\n *   <Button>Cancel</Button>\n * </Stack>\n * ```\n */\nfunction Stack({\n  as: Component = \"div\",\n  direction,\n  spacing,\n  align,\n  justify,\n  grow,\n  className,\n  ...props\n}: StackProps) {\n  return (\n    <Component\n      className={cn(\n        stackVariants({\n          direction,\n          spacing,\n          align,\n          justify,\n          grow,\n        }),\n        className\n      )}\n      data-direction={direction}\n      data-slot=\"stack\"\n      data-spacing={spacing}\n      {...props}\n    />\n  )\n}\n\nexport { Stack }\n"]}

package/dist/chunk-2UGDLAYC.js

@@ -0,0 +1,71 @@
+import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
+import { jsx } from 'react/jsx-runtime';
+
+// src/components/primitives/AspectRatio/AspectRatio.tsx
+function AspectRatio({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AspectRatioPrimitive.Root, { "data-slot": "aspect-ratio", ...props });
+}
+
+// src/components/primitives/AspectRatio/AspectRatio.variants.ts
+var PHI = 1.618033988749895;
+var aspectRatios = {
+  // Square
+  /** 1:1 - Perfect square */
+  square: 1,
+  // Standard photo/video
+  /** 4:3 - Traditional TV/photography */
+  landscape: 4 / 3,
+  /** 3:4 - Portrait photography */
+  portrait: 3 / 4,
+  /** 16:9 - Standard video/widescreen */
+  video: 16 / 9,
+  /** 9:16 - Vertical video (Stories, Reels, TikTok) */
+  vertical: 9 / 16,
+  // Classic photo
+  /** 3:2 - Classic 35mm film photography */
+  photo: 3 / 2,
+  /** 2:3 - Portrait classic photo */
+  photoPortrait: 2 / 3,
+  // Display
+  /** 16:10 - Common laptop/monitor display */
+  display: 16 / 10,
+  /** 10:16 - Portrait display */
+  displayPortrait: 10 / 16,
+  // Photo variants
+  /** 5:4 - Medium format photography */
+  photo5x4: 5 / 4,
+  /** 4:5 - Instagram portrait, medium format */
+  photo4x5: 4 / 5,
+  // Panoramic
+  /** 2:1 - Panoramic landscape */
+  panoramic: 2 / 1,
+  /** 1:2 - Panoramic portrait */
+  panoramicPortrait: 1 / 2,
+  // Golden ratio
+  /** 1.618:1 - Golden ratio (φ) */
+  golden: PHI,
+  /** 1:1.618 - Inverse golden ratio */
+  goldenPortrait: 1 / PHI,
+  // Ultrawide/Cinema
+  /** 21:9 - Cinema/ultrawide displays */
+  wide: 21 / 9,
+  /** 9:21 - Portrait ultrawide */
+  widePortrait: 9 / 21,
+  /** 32:9 - Super ultrawide displays */
+  ultrawide: 32 / 9
+};
+function getRatio(preset) {
+  return aspectRatios[preset];
+}
+function calculateRatio(width, height) {
+  if (height === 0) {
+    throw new Error("Height cannot be zero");
+  }
+  return width / height;
+}
+
+export { AspectRatio, aspectRatios, calculateRatio, getRatio };
+//# sourceMappingURL=chunk-2UGDLAYC.js.map
+//# sourceMappingURL=chunk-2UGDLAYC.js.map