@cloudflare/kumo 1.1.0 → 1.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudflare/kumo",
-  "version": "1.1.0",
+  "version": "1.3.0",
   "private": false,
   "type": "module",
   "description": "Kumo - Cloudflare's component library for building modern web applications",
@@ -366,30 +366,6 @@
     "access": "public",
     "registry": "https://registry.npmjs.org"
   },
-  "scripts": {
-    "prepublish": "pnpm run clean && pnpm run build && pnpm run test:unit",
-    "build": "vite build --mode production && tsx scripts/css-build.ts && tsx src/command-line/build-cli.ts",
-    "dev": "vite build --watch --mode development",
-    "new:component": "plop component",
-    "clean": "rm -rf dist",
-    "codegen": "pnpm run codegen:primitives && pnpm run codegen:themes && pnpm run codegen:registry",
-    "codegen:themes": "tsx scripts/theme-generator/index.ts",
-    "migrate:tokens": "tsx scripts/theme-generator/migrate.ts",
-    "codegen:primitives": "tsx scripts/generate-primitives.ts",
-    "codegen:registry": "pnpm --filter @cloudflare/kumo-docs-astro codegen:demos && tsx scripts/component-registry/index.ts",
-    "lint": "pnpm run lint:oxlint && pnpm run lint:eslint",
-    "lint:oxlint": "oxlint --config .oxlintrc.json src/** --type-aware",
-    "lint:eslint": "eslint src/",
-    "test": "CI=true vitest run --project=unit",
-    "test:ui": "vitest --ui",
-    "test:run": "vitest run",
-    "test:unit": "vitest run --project=unit",
-    "test:coverage": "vitest run --coverage",
-    "test:exports": "vitest run --project=unit tests/imports/export-path-validation.test.ts",
-    "typecheck": "tsc --noEmit",
-    "validate:build": "vitest run --project=unit tests/imports/export-path-validation.test.ts",
-    "validate:changeset": "tsx ../../ci/scripts/validate-kumo-changeset.ts"
-  },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.1.10",
     "react": "^18.0.0 || ^19.0.0",
@@ -407,35 +383,59 @@
     "tailwind-merge": "^3.4.0"
   },
   "devDependencies": {
-    "@tailwindcss/cli": "catalog:",
-    "@tailwindcss/vite": "catalog:",
+    "@tailwindcss/cli": "^4.1.17",
+    "@tailwindcss/vite": "^4.1.17",
     "@testing-library/react": "16.3.1",
     "@testing-library/user-event": "14.6.1",
     "@types/glob": "9.0.0",
-    "@types/node": "catalog:",
-    "@types/react": "catalog:",
-    "@types/react-dom": "catalog:",
-    "@vitest/browser": "catalog:",
-    "@vitest/ui": "catalog:",
+    "@types/node": "^22.10.2",
+    "@types/react": "19.2.4",
+    "@types/react-dom": "19.2.3",
+    "@vitest/browser": "^3.2.4",
+    "@vitest/ui": "^3.2.4",
     "esbuild": "0.27.2",
-    "eslint": "catalog:",
-    "eslint-plugin-jsx-a11y": "catalog:",
+    "eslint": "^9.17.0",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
     "glob": "13.0.0",
-    "happy-dom": "catalog:",
-    "oxlint": "catalog:",
-    "oxlint-tsgolint": "catalog:",
-    "playwright": "catalog:",
+    "happy-dom": "^15.11.7",
+    "oxlint": "1.42.0",
+    "oxlint-tsgolint": "0.11.3",
+    "playwright": "^1.57.0",
     "plop": "4.0.4",
     "rollup-plugin-preserve-directives": "0.4.0",
-    "tailwindcss": "catalog:",
+    "tailwindcss": "^4.1.17",
     "ts-json-schema-generator": "2.4.0",
-    "tsx": "catalog:",
-    "typescript": "catalog:",
+    "tsx": "^4.19.2",
+    "typescript": "^5.9.2",
     "typescript-eslint": "^8.18.1",
-    "vite": "catalog:",
-    "vite-plugin-dts": "catalog:",
-    "vitest": "catalog:",
-    "wrangler": "catalog:",
+    "vite": "^7.1.7",
+    "vite-plugin-dts": "^4.3.0",
+    "vitest": "^3.2.4",
+    "wrangler": "^4.59.1",
     "zod": "^4.0.0"
+  },
+  "scripts": {
+    "prepublish": "pnpm run clean && pnpm run build && pnpm run test:unit",
+    "build": "vite build --mode production && tsx scripts/css-build.ts && tsx src/command-line/build-cli.ts",
+    "dev": "vite build --watch --mode development",
+    "new:component": "plop component",
+    "clean": "rm -rf dist",
+    "codegen": "pnpm run codegen:primitives && pnpm run codegen:themes && pnpm run codegen:registry",
+    "codegen:themes": "tsx scripts/theme-generator/index.ts",
+    "migrate:tokens": "tsx scripts/theme-generator/migrate.ts",
+    "codegen:primitives": "tsx scripts/generate-primitives.ts",
+    "codegen:registry": "pnpm --filter @cloudflare/kumo-docs-astro codegen:demos && tsx scripts/component-registry/index.ts",
+    "lint": "pnpm run lint:oxlint && pnpm run lint:eslint",
+    "lint:oxlint": "oxlint --config .oxlintrc.json src/** --type-aware",
+    "lint:eslint": "eslint src/",
+    "test": "CI=true vitest run --project=unit",
+    "test:ui": "vitest --ui",
+    "test:run": "vitest run",
+    "test:unit": "vitest run --project=unit",
+    "test:coverage": "vitest run --coverage",
+    "test:exports": "vitest run --project=unit tests/imports/export-path-validation.test.ts",
+    "typecheck": "tsc --noEmit",
+    "validate:build": "vitest run --project=unit tests/imports/export-path-validation.test.ts",
+    "validate:changeset": "tsx ../../ci/scripts/validate-kumo-changeset.ts"
   }
-}
+}

package/dist/dialog-B1TaN0oR.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dialog-B1TaN0oR.js","sources":["../src/components/dialog/dialog.tsx"],"sourcesContent":["import type { CSSProperties, FC, ReactNode } from \"react\";\nimport { Dialog as DialogBase } from \"@base-ui/react/dialog\";\nimport { Surface } from \"../surface\";\nimport { cn } from \"../../utils/cn\";\n\nexport const KUMO_DIALOG_VARIANTS = {\n  size: {\n    base: {\n      classes: \"min-w-96\",\n      description: \"Default dialog width\",\n    },\n    sm: {\n      classes: \"min-w-72\",\n      description: \"Small dialog for simple confirmations\",\n    },\n    lg: {\n      classes: \"min-w-[32rem]\",\n      description: \"Large dialog for complex content\",\n    },\n    xl: {\n      classes: \"min-w-[48rem]\",\n      description: \"Extra large dialog for detailed views\",\n    },\n  },\n} as const;\n\nexport const KUMO_DIALOG_DEFAULT_VARIANTS = {\n  size: \"base\",\n} as const;\n\nexport const KUMO_DIALOG_STYLING = {\n  dimensions: {\n    sm: {\n      width: 350,\n      titleSize: 20,\n      descSize: 16,\n      padding: 16,\n      gap: 8,\n      buttonSize: \"sm\",\n    },\n    base: {\n      width: 384,\n      titleSize: 20,\n      descSize: 16,\n      padding: 24,\n      gap: 16,\n      buttonSize: \"base\",\n    },\n    lg: {\n      width: 512,\n      titleSize: 20,\n      descSize: 16,\n      padding: 24,\n      gap: 16,\n      buttonSize: \"base\",\n    },\n    xl: {\n      width: 768,\n      titleSize: 20,\n      descSize: 16,\n      padding: 24,\n      gap: 16,\n      buttonSize: \"base\",\n    },\n  },\n  baseTokens: {\n    background: \"color-surface\",\n    text: \"text-color-surface\",\n    borderRadius: 12,\n    shadow: \"shadow-m\",\n  },\n  backdrop: {\n    background: \"color-surface-secondary\",\n    opacity: 0.8,\n  },\n  header: {\n    title: { fontWeight: 600, color: \"text-color-surface\" },\n    closeIcon: { name: \"ph-x\", size: 20, color: \"text-color-muted\" },\n  },\n  description: {\n    fontWeight: 400,\n    color: \"text-color-muted\",\n  },\n  buttons: {\n    primary: { background: \"color-primary\", text: \"white\" },\n    secondary: { ring: \"color-border\", text: \"text-color-surface\" },\n  },\n} as const;\n\n// Derived types from KUMO_DIALOG_VARIANTS\nexport type KumoDialogSize = keyof typeof KUMO_DIALOG_VARIANTS.size;\n\nexport interface KumoDialogVariantsProps {\n  size?: KumoDialogSize;\n}\n\nexport function dialogVariants({\n  size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n}: KumoDialogVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"shadow-m z-modal fixed top-1/2 left-1/2 max-w-[calc(100vw-3rem)] -translate-x-1/2 -translate-y-1/2 overflow-hidden rounded-xl bg-kumo-base text-kumo-default duration-150 data-ending-style:scale-90 data-ending-style:opacity-0 data-starting-style:scale-90 data-starting-style:opacity-0\",\n    // Apply size from KUMO_DIALOG_VARIANTS\n    KUMO_DIALOG_VARIANTS.size[size].classes,\n  );\n}\n\nexport type DialogProps = KumoDialogVariantsProps & {\n  className?: string;\n  children: ReactNode;\n  style?: CSSProperties;\n};\n\nfunction DialogContent({\n  className,\n  children,\n  style,\n  size = KUMO_DIALOG_DEFAULT_VARIANTS.size,\n}: DialogProps) {\n  return (\n    <DialogBase.Portal>\n      <DialogBase.Backdrop className=\"z-modal fixed inset-0 bg-kumo-overlay opacity-80 transition-all duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0\" />\n      <Surface\n        as={DialogBase.Popup}\n        className={cn(dialogVariants({ size }), className)}\n        style={\n          {\n            transitionProperty: \"scale, opacity\",\n            transitionTimingFunction:\n              \"var(--default-transition-timing-function)\",\n            \"--tw-shadow\":\n              \"0 20px 25px -5px rgb(0 0 0 / 0.03), 0 8px 10px -6px rgb(0 0 0 / 0.03)\",\n            ...style,\n          } as CSSProperties\n        }\n      >\n        {children}\n      </Surface>\n    </DialogBase.Portal>\n  );\n}\n\ntype DialogComponent = FC<DialogProps> & {\n  Root: typeof DialogBase.Root;\n  Trigger: typeof DialogBase.Trigger;\n  Title: typeof DialogBase.Title;\n  Description: typeof DialogBase.Description;\n  Close: typeof DialogBase.Close;\n};\n\nconst Dialog = Object.assign(DialogContent, {\n  Root: DialogBase.Root,\n  Trigger: DialogBase.Trigger,\n  Title: DialogBase.Title,\n  Description: DialogBase.Description,\n  Close: DialogBase.Close,\n}) as DialogComponent;\n\nconst DialogRoot = Dialog.Root;\nconst DialogTrigger = Dialog.Trigger;\nconst DialogTitle = Dialog.Title;\nconst DialogDescription = Dialog.Description;\nconst DialogClose = Dialog.Close;\n\nexport {\n  Dialog,\n  DialogRoot,\n  DialogTrigger,\n  DialogTitle,\n  DialogDescription,\n  DialogClose,\n};\n"],"names":["KUMO_DIALOG_VARIANTS","KUMO_DIALOG_DEFAULT_VARIANTS","dialogVariants","size","cn","DialogContent","className","children","style","jsxs","DialogBase.Portal","jsx","DialogBase.Backdrop","Surface","DialogBase.Popup","Dialog","DialogBase.Root","DialogBase.Trigger","DialogBase.Title","DialogBase.Description","DialogBase.Close","DialogRoot","DialogTrigger","DialogTitle","DialogDescription","DialogClose"],"mappings":";;;;;AAKO,MAAMA,IAAuB;AAAA,EAClC,MAAM;AAAA,IACJ,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAA+B;AAAA,EAC1C,MAAM;AACR;AAoEO,SAASC,EAAe;AAAA,EAC7B,MAAAC,IAAOF,EAA6B;AACtC,IAA6B,IAAI;AAC/B,SAAOG;AAAA;AAAA,IAEL;AAAA;AAAA,IAEAJ,EAAqB,KAAKG,CAAI,EAAE;AAAA,EAAA;AAEpC;AAQA,SAASE,EAAc;AAAA,EACrB,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAL,IAAOF,EAA6B;AACtC,GAAgB;AACd,SACE,gBAAAQ,EAACC,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAoB,WAAU,yIAAA,CAAyI;AAAA,IACxK,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,IAAIC;AAAAA,QACJ,WAAWV,EAAGF,EAAe,EAAE,MAAAC,EAAA,CAAM,GAAGG,CAAS;AAAA,QACjD,OACE;AAAA,UACE,oBAAoB;AAAA,UACpB,0BACE;AAAA,UACF,eACE;AAAA,UACF,GAAGE;AAAA,QAAA;AAAA,QAIN,UAAAD;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;AAUA,MAAMQ,IAAS,OAAO,OAAOV,GAAe;AAAA,EAC1C,MAAMW;AAAAA,EACN,SAASC;AAAAA,EACT,OAAOC;AAAAA,EACP,aAAaC;AAAAA,EACb,OAAOC;AACT,CAAC,GAEKC,IAAaN,EAAO,MACpBO,IAAgBP,EAAO,SACvBQ,IAAcR,EAAO,OACrBS,IAAoBT,EAAO,aAC3BU,IAAcV,EAAO;"}

package/dist/toast-8YyyQuqZ.js

@@ -1,69 +0,0 @@
-"use client";
-import { jsxs as e, jsx as t } from "react/jsx-runtime";
-import { c as r } from "./cn-Bhsu1vx2.js";
-import { aS as o, aT as n, aU as i, aV as d, aW as l, aX as c, aY as m, aZ as p, a_ as f } from "./vendor-base-ui-DWIDNgE1.js";
-function x({ children: a }) {
-  return /* @__PURE__ */ e(o, { children: [
-    a,
-    /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(i, { className: "fixed top-auto right-4 bottom-4 z-10 mx-auto flex w-[250px] sm:right-8 sm:bottom-8 sm:w-[300px]", children: /* @__PURE__ */ t(v, {}) }) })
-  ] });
-}
-function v() {
-  const { toasts: a } = d();
-  return a.map((s) => /* @__PURE__ */ t(
-    l,
-    {
-      toast: s,
-      className: r(
-        "absolute right-0 bottom-0 left-auto z-[calc(1000-var(--toast-index))] mr-0 h-[var(--height)] w-full origin-bottom rounded-lg border border-kumo-fill bg-kumo-control bg-clip-padding p-4 shadow-lg select-none",
-        "[--gap:0.75rem] [--height:var(--toast-frontmost-height,var(--toast-height))] [--offset-y:calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y))] [--peek:0.75rem] [--scale:calc(max(0,1-(var(--toast-index)*0.1)))] [--shrink:calc(1-var(--scale))]",
-        "[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)-(var(--toast-index)*var(--peek))-(var(--shrink)*var(--height))))_scale(var(--scale))] [transition:transform_0.5s_cubic-bezier(0.22,1,0.36,1),opacity_0.5s,height_0.15s]",
-        "after:absolute after:top-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']",
-        "data-[ending-style]:opacity-0 data-[expanded]:h-[var(--toast-height)] data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--offset-y)))] data-[limited]:opacity-0 data-[starting-style]:[transform:translateY(150%)]",
-        "data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))] data-[expanded]:data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]",
-        "data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))] data-[expanded]:data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))]",
-        "data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))] data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]",
-        "data-[ending-style]:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))] data-[expanded]:data-[ending-style]:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))]",
-        "[&[data-ending-style]:not([data-limited]):not([data-swipe-direction])]:[transform:translateY(150%)]"
-      ),
-      children: /* @__PURE__ */ e(c, { className: "overflow-hidden transition-opacity [transition-duration:250ms] data-[behind]:pointer-events-none data-[behind]:opacity-0 data-[expanded]:pointer-events-auto data-[expanded]:opacity-100", children: [
-        /* @__PURE__ */ t(m, { className: "text-[0.975rem] leading-5 font-medium text-kumo-default" }),
-        /* @__PURE__ */ t(p, { className: "text-[0.925rem] leading-5 text-kumo-subtle" }),
-        /* @__PURE__ */ t(
-          f,
-          {
-            className: "absolute top-2 right-2 flex h-5 w-5 items-center justify-center rounded border-none bg-transparent text-kumo-subtle hover:bg-kumo-fill-hover hover:text-kumo-strong",
-            "aria-label": "Close",
-            children: /* @__PURE__ */ t(h, { className: "h-4 w-4" })
-          }
-        )
-      ] })
-    },
-    s.id
-  ));
-}
-function h(a) {
-  return /* @__PURE__ */ e(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: "24",
-      height: "24",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      ...a,
-      children: [
-        /* @__PURE__ */ t("path", { d: "M18 6 6 18" }),
-        /* @__PURE__ */ t("path", { d: "m6 6 12 12" })
-      ]
-    }
-  );
-}
-export {
-  x as T
-};
-//# sourceMappingURL=toast-8YyyQuqZ.js.map

package/dist/toast-8YyyQuqZ.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"toast-8YyyQuqZ.js","sources":["../src/components/toast/toast.tsx"],"sourcesContent":["import { Toast } from \"@base-ui/react/toast\";\nimport type React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Toast styling configuration for Figma plugin consumption.\n * Toast has no user-facing variants but documents the styling structure.\n */\nexport const KUMO_TOAST_VARIANTS = {\n  root: {\n    classes: \"rounded-lg border border-kumo-fill bg-kumo-control p-4 shadow-lg\",\n    description: \"Toast container with background, border, and shadow\",\n  },\n  title: {\n    classes: \"text-[0.975rem] leading-5 font-medium text-kumo-default\",\n    description: \"Toast title with primary text color\",\n  },\n  description: {\n    classes: \"text-[0.925rem] leading-5 text-kumo-subtle\",\n    description: \"Toast description with muted text color\",\n  },\n  close: {\n    classes:\n      \"absolute top-2 right-2 flex h-5 w-5 items-center justify-center rounded border-none bg-transparent text-kumo-subtle hover:bg-kumo-fill-hover hover:text-kumo-strong\",\n    description: \"Close button with X icon\",\n  },\n} as const;\n\nexport const KUMO_TOAST_DEFAULT_VARIANTS = {} as const;\n\n/**\n * Toast styling configuration for Figma plugin consumption.\n * Provides structured metadata for generating Toast components in Figma.\n */\nexport const KUMO_TOAST_STYLING = {\n  container: {\n    width: 300,\n    padding: 16,\n    borderRadius: 8,\n    background: \"color-secondary\",\n    border: \"color-color\",\n    shadow: \"shadow-lg\",\n    gap: 4,\n  },\n  title: {\n    fontSize: 16,\n    fontWeight: 500,\n    color: \"text-color-surface\",\n  },\n  description: {\n    fontSize: 15,\n    fontWeight: 400,\n    color: \"text-color-muted\",\n  },\n  closeButton: {\n    size: 20,\n    iconSize: 16,\n    iconName: \"ph-x\",\n    iconColor: \"text-color-muted\",\n    hoverBackground: \"color-color-2\",\n    hoverColor: \"text-color-label\",\n    borderRadius: 4,\n  },\n} as const;\n\n// Derived types from KUMO_TOAST_VARIANTS\nexport interface KumoToastVariantsProps {}\n\nexport function toastVariants(_props: KumoToastVariantsProps = {}) {\n  return cn(\n    // Base styles for toast root\n    \"absolute right-0 bottom-0 left-auto z-[calc(1000-var(--toast-index))] mr-0 h-[var(--height)] w-full origin-bottom rounded-lg border border-kumo-fill bg-kumo-control bg-clip-padding p-4 shadow-lg select-none\",\n  );\n}\n\nexport interface ToastyProps extends KumoToastVariantsProps {\n  children: React.ReactNode;\n}\n\nexport function Toasty({ children }: ToastyProps) {\n  return (\n    <Toast.Provider>\n      {children}\n      <Toast.Portal>\n        <Toast.Viewport className=\"fixed top-auto right-4 bottom-4 z-10 mx-auto flex w-[250px] sm:right-8 sm:bottom-8 sm:w-[300px]\">\n          <ToastList />\n        </Toast.Viewport>\n      </Toast.Portal>\n    </Toast.Provider>\n  );\n}\n\nfunction ToastList() {\n  const { toasts } = Toast.useToastManager();\n  return toasts.map((toast) => (\n    <Toast.Root\n      key={toast.id}\n      toast={toast}\n      className={cn(\n        \"absolute right-0 bottom-0 left-auto z-[calc(1000-var(--toast-index))] mr-0 h-[var(--height)] w-full origin-bottom rounded-lg border border-kumo-fill bg-kumo-control bg-clip-padding p-4 shadow-lg select-none\",\n        \"[--gap:0.75rem] [--height:var(--toast-frontmost-height,var(--toast-height))] [--offset-y:calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y))] [--peek:0.75rem] [--scale:calc(max(0,1-(var(--toast-index)*0.1)))] [--shrink:calc(1-var(--scale))]\",\n        \"[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)-(var(--toast-index)*var(--peek))-(var(--shrink)*var(--height))))_scale(var(--scale))] [transition:transform_0.5s_cubic-bezier(0.22,1,0.36,1),opacity_0.5s,height_0.15s]\",\n        \"after:absolute after:top-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n        \"data-[ending-style]:opacity-0 data-[expanded]:h-[var(--toast-height)] data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--offset-y)))] data-[limited]:opacity-0 data-[starting-style]:[transform:translateY(150%)]\",\n        \"data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))] data-[expanded]:data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]\",\n        \"data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))] data-[expanded]:data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))]\",\n        \"data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))] data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]\",\n        \"data-[ending-style]:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))] data-[expanded]:data-[ending-style]:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))]\",\n        \"[&[data-ending-style]:not([data-limited]):not([data-swipe-direction])]:[transform:translateY(150%)]\",\n      )}\n    >\n      <Toast.Content className=\"overflow-hidden transition-opacity [transition-duration:250ms] data-[behind]:pointer-events-none data-[behind]:opacity-0 data-[expanded]:pointer-events-auto data-[expanded]:opacity-100\">\n        <Toast.Title className=\"text-[0.975rem] leading-5 font-medium text-kumo-default\" />\n        <Toast.Description className=\"text-[0.925rem] leading-5 text-kumo-subtle\" />\n        <Toast.Close\n          className=\"absolute top-2 right-2 flex h-5 w-5 items-center justify-center rounded border-none bg-transparent text-kumo-subtle hover:bg-kumo-fill-hover hover:text-kumo-strong\"\n          aria-label=\"Close\"\n        >\n          <XIcon className=\"h-4 w-4\" />\n        </Toast.Close>\n      </Toast.Content>\n    </Toast.Root>\n  ));\n}\n\nfunction XIcon(props: React.ComponentProps<\"svg\">) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      {...props}\n    >\n      <path d=\"M18 6 6 18\" />\n      <path d=\"m6 6 12 12\" />\n    </svg>\n  );\n}\n"],"names":["Toasty","children","jsxs","Toast.Provider","jsx","Toast.Portal","Toast.Viewport","ToastList","toasts","Toast.useToastManager","toast","Toast.Root","cn","Toast.Content","Toast.Title","Toast.Description","Toast.Close","XIcon","props"],"mappings":";;;;AA+EO,SAASA,EAAO,EAAE,UAAAC,KAAyB;AAChD,SACE,gBAAAC,EAACC,GAAA,EACE,UAAA;AAAA,IAAAF;AAAA,IACD,gBAAAG,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,EAAe,WAAU,mGACxB,UAAA,gBAAAF,EAACG,GAAA,CAAA,CAAU,GACb,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;AAEA,SAASA,IAAY;AACnB,QAAM,EAAE,QAAAC,EAAA,IAAWC,EAAM;AACzB,SAAOD,EAAO,IAAI,CAACE,MACjB,gBAAAN;AAAA,IAACO;AAAAA,IAAA;AAAA,MAEC,OAAAD;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,MAGF,UAAA,gBAAAV,EAACW,GAAA,EAAc,WAAU,4LACvB,UAAA;AAAA,QAAA,gBAAAT,EAACU,GAAA,EAAY,WAAU,0DAAA,CAA0D;AAAA,QACjF,gBAAAV,EAACW,GAAA,EAAkB,WAAU,6CAAA,CAA6C;AAAA,QAC1E,gBAAAX;AAAA,UAACY;AAAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,cAAW;AAAA,YAEX,UAAA,gBAAAZ,EAACa,GAAA,EAAM,WAAU,UAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MAC7B,EAAA,CACF;AAAA,IAAA;AAAA,IAxBKP,EAAM;AAAA,EAAA,CA0Bd;AACH;AAEA,SAASO,EAAMC,GAAoC;AACjD,SACE,gBAAAhB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,QAAO;AAAA,MACP,aAAY;AAAA,MACZ,eAAc;AAAA,MACd,gBAAe;AAAA,MACd,GAAGgB;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAd,EAAC,QAAA,EAAK,GAAE,aAAA,CAAa;AAAA,QACrB,gBAAAA,EAAC,QAAA,EAAK,GAAE,aAAA,CAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG3B;"}