@atom-learning/components 6.4.2 → 6.5.0

package/dist/components/tabs/TabsTriggerList.js

@@ -1,2 +1,76 @@
-import{ChevronLeft as y,ChevronRight as C}from"@atom-learning/icons";import{List as v}from"@radix-ui/react-tabs";import t from"react";import{ColorScheme as x}from"../../experiments/color-scheme/ColorScheme.js";import{styled as l}from"../../styled.js";import{useCallbackRefState as k}from"../../utilities/hooks/useCallbackRef.js";import{useScrollPosition as w}from"../../utilities/hooks/useScrollPosition.js";import{useSize as E}from"../../utilities/hooks/useSize.js";import{ActionIcon as I}from"../action-icon/ActionIcon.js";import{Icon as a}from"../icon/Icon.js";const L=l(x,{base:["relative","border-b","border-b-(--base-4)","w-full"]}),S=l(v,{base:["shrink-0","flex","w-full","overflow-x-auto","-webkit-scrollbar:hidden","[scrollbar-width:none]"]}),s=l(I,{base:["h-full!","absolute","top-1/2","-translate-y-1/2","cursor-pointer","bg-(--base-1)!","text-(--interactive-1)!","rounded-none","opacity-90"]}),c=.8,n=({children:m,colorScheme:d={},...b})=>{const[e,f]=k(),{width:h}=E({element:e,delay:500}),{left:r}=w({element:e,delay:100,delayMethod:"debounce"}),o=t.useMemo(()=>e?e.scrollWidth>e.clientWidth:!1,[h,e]),u=t.useMemo(()=>o?r>0:!1,[r,o]),p=t.useMemo(()=>!e||!o?!1:e.scrollWidth-r-e.clientWidth>1,[e,r,o]),i=t.useCallback(g=>{e&&e.scroll({left:e.scrollLeft+e.clientWidth*g,behavior:"smooth"})},[e]);return t.createElement(L,{base:"grey1",accent:"primary1",interactive:"hiContrast",...d,...b},t.createElement(S,{ref:f},m),u&&t.createElement(s,{label:"scroll left",size:"md",onClick:()=>i(-c),tabIndex:-1,className:"left-0"},t.createElement(a,{is:y})),p&&t.createElement(s,{label:"scroll right",size:"md",onClick:()=>i(c),tabIndex:-1,className:"right-0"},t.createElement(a,{is:C})))};n.displayName="TabsTriggerList";export{n as TabsTriggerList};
-//# sourceMappingURL=TabsTriggerList.js.map
+import { styled as e } from "../../styled.js";
+import { ColorScheme as t } from "../../experiments/color-scheme/ColorScheme.js";
+import { Icon as n } from "../icon/Icon.js";
+import { ActionIcon as r } from "../action-icon/ActionIcon.js";
+import { useCallbackRefState as i } from "../../utilities/hooks/useCallbackRef.js";
+import { useScrollPosition as a } from "../../utilities/hooks/useScrollPosition.js";
+import { useSize as o } from "../../utilities/hooks/useSize.js";
+import s from "react";
+import { ChevronLeft as c, ChevronRight as l } from "@atom-learning/icons";
+import { List as u } from "@radix-ui/react-tabs";
+//#region src/components/tabs/TabsTriggerList.tsx
+var d = e(t, { base: [
+	"relative",
+	"border-b",
+	"border-b-(--base-4)",
+	"w-full"
+] }), f = e(u, { base: [
+	"shrink-0",
+	"flex",
+	"w-full",
+	"overflow-x-auto",
+	"-webkit-scrollbar:hidden",
+	"[scrollbar-width:none]"
+] }), p = e(r, { base: [
+	"h-full!",
+	"absolute",
+	"top-1/2",
+	"-translate-y-1/2",
+	"cursor-pointer",
+	"bg-(--base-1)!",
+	"text-(--interactive-1)!",
+	"rounded-none",
+	"opacity-90"
+] }), m = .8, h = ({ children: e, colorScheme: t = {}, ...r }) => {
+	let [u, h] = i(), { width: g } = o({
+		element: u,
+		delay: 500
+	}), { left: _ } = a({
+		element: u,
+		delay: 100,
+		delayMethod: "debounce"
+	}), v = s.useMemo(() => u ? u.scrollWidth > u.clientWidth : !1, [g, u]), y = s.useMemo(() => v ? _ > 0 : !1, [_, v]), b = s.useMemo(() => !u || !v ? !1 : u.scrollWidth - _ - u.clientWidth > 1, [
+		u,
+		_,
+		v
+	]), x = s.useCallback((e) => {
+		u && u.scroll({
+			left: u.scrollLeft + u.clientWidth * e,
+			behavior: "smooth"
+		});
+	}, [u]);
+	return /* @__PURE__ */ s.createElement(d, {
+		base: "grey1",
+		accent: "primary1",
+		interactive: "hiContrast",
+		...t,
+		...r
+	}, /* @__PURE__ */ s.createElement(f, { ref: h }, e), y && /* @__PURE__ */ s.createElement(p, {
+		label: "scroll left",
+		size: "md",
+		onClick: () => x(-m),
+		tabIndex: -1,
+		className: "left-0"
+	}, /* @__PURE__ */ s.createElement(n, { is: c })), b && /* @__PURE__ */ s.createElement(p, {
+		label: "scroll right",
+		size: "md",
+		onClick: () => x(m),
+		tabIndex: -1,
+		className: "right-0"
+	}, /* @__PURE__ */ s.createElement(n, { is: l })));
+};
+h.displayName = "TabsTriggerList";
+//#endregion
+export { h as TabsTriggerList };
+
+//# sourceMappingURL=TabsTriggerList.js.map

package/dist/components/tabs/TabsTriggerList.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabsTriggerList.js","sources":["../../../src/components/tabs/TabsTriggerList.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from '@atom-learning/icons'\nimport { List } from '@radix-ui/react-tabs'\nimport React from 'react'\n\nimport {\n  ColorScheme,\n  TcolorScheme\n} from '~/experiments/color-scheme/ColorScheme'\nimport { styled } from '~/styled'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\nimport { useScrollPosition } from '~/utilities/hooks/useScrollPosition'\nimport { useSize } from '~/utilities/hooks/useSize'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\n\nconst StyledContainer = styled(ColorScheme, {\n  base: ['relative', 'border-b', 'border-b-(--base-4)', 'w-full']\n})\n\nconst StyledTriggerList = styled(List, {\n  base: [\n    'shrink-0',\n    'flex',\n    'w-full',\n    'overflow-x-auto',\n    '-webkit-scrollbar:hidden',\n    '[scrollbar-width:none]'\n  ]\n})\n\nconst StyledChevronActionIcon = styled(ActionIcon, {\n  base: [\n    'h-full!',\n    'absolute',\n    'top-1/2',\n    '-translate-y-1/2',\n    'cursor-pointer',\n    'bg-(--base-1)!',\n    'text-(--interactive-1)!',\n    'rounded-none',\n    'opacity-90'\n  ]\n})\n\nconst SCROLL_STEP = 0.8 // Used to scroll 80% of clientWidth\n\nexport const TabsTriggerList = ({\n  children,\n  colorScheme = {},\n  ...rest\n}: React.ComponentProps<typeof StyledTriggerList> & {\n  colorScheme?: TcolorScheme\n}) => {\n  const [listRef, setListRefCallback] = useCallbackRefState()\n\n  const { width } = useSize({ element: listRef, delay: 500 })\n  const { left } = useScrollPosition({\n    element: listRef,\n    delay: 100,\n    delayMethod: 'debounce'\n  })\n\n  const canScrollXAxis = React.useMemo(() => {\n    if (!listRef) return false\n    return listRef.scrollWidth > listRef.clientWidth\n  }, [width, listRef])\n\n  const canScrollLeft = React.useMemo(() => {\n    if (!canScrollXAxis) return false\n    return left > 0\n  }, [left, canScrollXAxis])\n\n  const canScrollRight = React.useMemo(() => {\n    if (!listRef || !canScrollXAxis) return false\n    return listRef.scrollWidth - left - listRef.clientWidth > 1 // 1 rather than 0 to account for sub-pixel widths and calculations\n  }, [listRef, left, canScrollXAxis])\n\n  const scrollList = React.useCallback(\n    (stepModifier) => {\n      if (!listRef) return\n      listRef.scroll({\n        left: listRef.scrollLeft + listRef.clientWidth * stepModifier,\n        behavior: 'smooth'\n      })\n    },\n    [listRef]\n  )\n\n  return (\n    <StyledContainer\n      base=\"grey1\"\n      accent=\"primary1\"\n      interactive=\"hiContrast\"\n      {...colorScheme}\n      {...rest}\n    >\n      <StyledTriggerList ref={setListRefCallback}>{children}</StyledTriggerList>\n\n      {canScrollLeft && (\n        <StyledChevronActionIcon\n          label=\"scroll left\"\n          size=\"md\"\n          onClick={() => scrollList(-SCROLL_STEP)}\n          tabIndex={-1}\n          className=\"left-0\"\n        >\n          <Icon is={ChevronLeft} />\n        </StyledChevronActionIcon>\n      )}\n\n      {canScrollRight && (\n        <StyledChevronActionIcon\n          label=\"scroll right\"\n          size=\"md\"\n          onClick={() => scrollList(SCROLL_STEP)}\n          tabIndex={-1}\n          className=\"right-0\"\n        >\n          <Icon is={ChevronRight} />\n        </StyledChevronActionIcon>\n      )}\n    </StyledContainer>\n  )\n}\n\nTabsTriggerList.displayName = 'TabsTriggerList'\n"],"names":["StyledContainer","styled","ColorScheme","StyledTriggerList","List","StyledChevronActionIcon","ActionIcon","SCROLL_STEP","TabsTriggerList","children","colorScheme","rest","listRef","setListRefCallback","useCallbackRefState","width","useSize","left","useScrollPosition","canScrollXAxis","React","canScrollLeft","canScrollRight","scrollList","stepModifier","Icon","ChevronLeft","ChevronRight"],"mappings":"ojBAgBA,MAAMA,EAAkBC,EAAOC,EAAa,CAC1C,KAAM,CAAC,WAAY,WAAY,sBAAuB,QAAQ,CAChE,CAAC,EAEKC,EAAoBF,EAAOG,EAAM,CACrC,KAAM,CACJ,WACA,OACA,SACA,kBACA,2BACA,wBACF,CACF,CAAC,EAEKC,EAA0BJ,EAAOK,EAAY,CACjD,KAAM,CACJ,UACA,WACA,UACA,mBACA,iBACA,iBACA,0BACA,eACA,YACF,CACF,CAAC,EAEKC,EAAc,GAEPC,EAAkB,CAAC,CAC9B,SAAAC,EACA,YAAAC,EAAc,CACd,EAAA,GAAGC,CACL,IAEM,CACJ,KAAM,CAACC,EAASC,CAAkB,EAAIC,EAEhC,EAAA,CAAE,MAAAC,CAAM,EAAIC,EAAQ,CAAE,QAASJ,EAAS,MAAO,GAAI,CAAC,EACpD,CAAE,KAAAK,CAAK,EAAIC,EAAkB,CACjC,QAASN,EACT,MAAO,IACP,YAAa,UACf,CAAC,EAEKO,EAAiBC,EAAM,QAAQ,IAC9BR,EACEA,EAAQ,YAAcA,EAAQ,YADhB,GAEpB,CAACG,EAAOH,CAAO,CAAC,EAEbS,EAAgBD,EAAM,QAAQ,IAC7BD,EACEF,EAAO,EADc,GAE3B,CAACA,EAAME,CAAc,CAAC,EAEnBG,EAAiBF,EAAM,QAAQ,IAC/B,CAACR,GAAW,CAACO,EAAuB,GACjCP,EAAQ,YAAcK,EAAOL,EAAQ,YAAc,EACzD,CAACA,EAASK,EAAME,CAAc,CAAC,EAE5BI,EAAaH,EAAM,YACtBI,GAAiB,CACXZ,GACLA,EAAQ,OAAO,CACb,KAAMA,EAAQ,WAAaA,EAAQ,YAAcY,EACjD,SAAU,QACZ,CAAC,CACH,EACA,CAACZ,CAAO,CACV,EAEA,OACEQ,EAAA,cAACpB,EAAA,CACC,KAAK,QACL,OAAO,WACP,YAAY,aACX,GAAGU,EACH,GAAGC,GAEJS,EAAA,cAACjB,EAAA,CAAkB,IAAKU,CAAAA,EAAqBJ,CAAS,EAErDY,GACCD,EAAA,cAACf,EAAA,CACC,MAAM,cACN,KAAK,KACL,QAAS,IAAMkB,EAAW,CAAChB,CAAW,EACtC,SAAU,GACV,UAAU,UAEVa,EAAA,cAACK,EAAA,CAAK,GAAIC,CAAAA,CAAa,CACzB,EAGDJ,GACCF,EAAA,cAACf,EAAA,CACC,MAAM,eACN,KAAK,KACL,QAAS,IAAMkB,EAAWhB,CAAW,EACrC,SAAU,GACV,UAAU,SAAA,EAEVa,EAAA,cAACK,EAAA,CAAK,GAAIE,EAAc,CAC1B,CAEJ,CAEJ,EAEAnB,EAAgB,YAAc"}
+{"version":3,"file":"TabsTriggerList.js","names":[],"sources":["../../../src/components/tabs/TabsTriggerList.tsx"],"sourcesContent":["import { ChevronLeft, ChevronRight } from '@atom-learning/icons'\nimport { List } from '@radix-ui/react-tabs'\nimport React from 'react'\n\nimport {\n  ColorScheme,\n  TcolorScheme\n} from '~/experiments/color-scheme/ColorScheme'\nimport { styled } from '~/styled'\nimport { useCallbackRefState } from '~/utilities/hooks/useCallbackRef'\nimport { useScrollPosition } from '~/utilities/hooks/useScrollPosition'\nimport { useSize } from '~/utilities/hooks/useSize'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\n\nconst StyledContainer = styled(ColorScheme, {\n  base: ['relative', 'border-b', 'border-b-(--base-4)', 'w-full']\n})\n\nconst StyledTriggerList = styled(List, {\n  base: [\n    'shrink-0',\n    'flex',\n    'w-full',\n    'overflow-x-auto',\n    '-webkit-scrollbar:hidden',\n    '[scrollbar-width:none]'\n  ]\n})\n\nconst StyledChevronActionIcon = styled(ActionIcon, {\n  base: [\n    'h-full!',\n    'absolute',\n    'top-1/2',\n    '-translate-y-1/2',\n    'cursor-pointer',\n    'bg-(--base-1)!',\n    'text-(--interactive-1)!',\n    'rounded-none',\n    'opacity-90'\n  ]\n})\n\nconst SCROLL_STEP = 0.8 // Used to scroll 80% of clientWidth\n\nexport const TabsTriggerList = ({\n  children,\n  colorScheme = {},\n  ...rest\n}: React.ComponentProps<typeof StyledTriggerList> & {\n  colorScheme?: TcolorScheme\n}) => {\n  const [listRef, setListRefCallback] = useCallbackRefState()\n\n  const { width } = useSize({ element: listRef, delay: 500 })\n  const { left } = useScrollPosition({\n    element: listRef,\n    delay: 100,\n    delayMethod: 'debounce'\n  })\n\n  const canScrollXAxis = React.useMemo(() => {\n    if (!listRef) return false\n    return listRef.scrollWidth > listRef.clientWidth\n  }, [width, listRef])\n\n  const canScrollLeft = React.useMemo(() => {\n    if (!canScrollXAxis) return false\n    return left > 0\n  }, [left, canScrollXAxis])\n\n  const canScrollRight = React.useMemo(() => {\n    if (!listRef || !canScrollXAxis) return false\n    return listRef.scrollWidth - left - listRef.clientWidth > 1 // 1 rather than 0 to account for sub-pixel widths and calculations\n  }, [listRef, left, canScrollXAxis])\n\n  const scrollList = React.useCallback(\n    (stepModifier) => {\n      if (!listRef) return\n      listRef.scroll({\n        left: listRef.scrollLeft + listRef.clientWidth * stepModifier,\n        behavior: 'smooth'\n      })\n    },\n    [listRef]\n  )\n\n  return (\n    <StyledContainer\n      base=\"grey1\"\n      accent=\"primary1\"\n      interactive=\"hiContrast\"\n      {...colorScheme}\n      {...rest}\n    >\n      <StyledTriggerList ref={setListRefCallback}>{children}</StyledTriggerList>\n\n      {canScrollLeft && (\n        <StyledChevronActionIcon\n          label=\"scroll left\"\n          size=\"md\"\n          onClick={() => scrollList(-SCROLL_STEP)}\n          tabIndex={-1}\n          className=\"left-0\"\n        >\n          <Icon is={ChevronLeft} />\n        </StyledChevronActionIcon>\n      )}\n\n      {canScrollRight && (\n        <StyledChevronActionIcon\n          label=\"scroll right\"\n          size=\"md\"\n          onClick={() => scrollList(SCROLL_STEP)}\n          tabIndex={-1}\n          className=\"right-0\"\n        >\n          <Icon is={ChevronRight} />\n        </StyledChevronActionIcon>\n      )}\n    </StyledContainer>\n  )\n}\n\nTabsTriggerList.displayName = 'TabsTriggerList'\n"],"mappings":";;;;;;;;;;;AAgBA,IAAM,IAAkB,EAAO,GAAa,EAC1C,MAAM;CAAC;CAAY;CAAY;CAAuB;CAAS,EAChE,CAAC,EAEI,IAAoB,EAAO,GAAM,EACrC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC,EAEI,IAA0B,EAAO,GAAY,EACjD,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC,EAEI,IAAc,IAEP,KAAmB,EAC9B,aACA,iBAAc,EAAE,EAChB,GAAG,QAGC;CACJ,IAAM,CAAC,GAAS,KAAsB,GAAqB,EAErD,EAAE,aAAU,EAAQ;EAAE,SAAS;EAAS,OAAO;EAAK,CAAC,EACrD,EAAE,YAAS,EAAkB;EACjC,SAAS;EACT,OAAO;EACP,aAAa;EACd,CAAC,EAEI,IAAiB,EAAM,cACtB,IACE,EAAQ,cAAc,EAAQ,cADhB,IAEpB,CAAC,GAAO,EAAQ,CAAC,EAEd,IAAgB,EAAM,cACrB,IACE,IAAO,IADc,IAE3B,CAAC,GAAM,EAAe,CAAC,EAEpB,IAAiB,EAAM,cACvB,CAAC,KAAW,CAAC,IAAuB,KACjC,EAAQ,cAAc,IAAO,EAAQ,cAAc,GACzD;EAAC;EAAS;EAAM;EAAe,CAAC,EAE7B,IAAa,EAAM,aACtB,MAAiB;AACX,OACL,EAAQ,OAAO;GACb,MAAM,EAAQ,aAAa,EAAQ,cAAc;GACjD,UAAU;GACX,CAAC;IAEJ,CAAC,EAAQ,CACV;AAED,QACE,kBAAA,cAAC,GAAD;EACE,MAAK;EACL,QAAO;EACP,aAAY;EACZ,GAAI;EACJ,GAAI;EA2BY,EAzBhB,kBAAA,cAAC,GAAD,EAAmB,KAAK,GAAkD,EAA7B,EAA6B,EAEzE,KACC,kBAAA,cAAC,GAAD;EACE,OAAM;EACN,MAAK;EACL,eAAe,EAAW,CAAC,EAAY;EACvC,UAAU;EACV,WAAU;EAGc,EADxB,kBAAA,cAAC,GAAD,EAAM,IAAI,GAAe,CAAA,CACD,EAG3B,KACC,kBAAA,cAAC,GAAD;EACE,OAAM;EACN,MAAK;EACL,eAAe,EAAW,EAAY;EACtC,UAAU;EACV,WAAU;EAGc,EADxB,kBAAA,cAAC,GAAD,EAAM,IAAI,GAAgB,CAAA,CACF,CAEZ;;AAItB,EAAgB,cAAc"}

package/dist/components/text/Text.js

@@ -1,2 +1,70 @@
-import*as e from"react";import{styled as o}from"../../styled.js";const a=o("p",{base:[],variants:{size:{xs:["text-xs","leading-[1.6]","capsize-[0.4364]"],sm:["text-sm","leading-[1.53]","capsize-[0.4056]"],md:["text-md","leading-normal","capsize-[0.3864]"],lg:["text-lg","leading-[1.52]","capsize-[0.3983]"],xl:["text-xl","leading-[1.42]","capsize-[0.3506]"],"2xl":["text-2xl","leading-[1.40]","capsize-[0.3336]"],"3xl":["text-3xl","leading-[1.28]","capsize-[0.2709]"],"4xl":["text-4xl","leading-none","capsize-[0.1309]"]},noCapsize:{true:["capsize-none"]},weight:{normal:["font-normal"],bold:["font-semibold"]},family:{body:["font-body"],display:["font-display"],mono:["font-mono"]}}},{enabledResponsiveVariants:!0}),t=e.forwardRef(({size:i="md",family:l="body",...n},s)=>e.createElement(a,{size:i,family:l,...n,ref:s}));t.displayName="Text";export{a as StyledText,t as Text};
-//# sourceMappingURL=Text.js.map
+import { styled as e } from "../../styled.js";
+import * as t from "react";
+//#region src/components/text/Text.tsx
+var n = e("p", {
+	base: [],
+	variants: {
+		size: {
+			xs: [
+				"text-xs",
+				"leading-[1.6]",
+				"capsize-[0.4364]"
+			],
+			sm: [
+				"text-sm",
+				"leading-[1.53]",
+				"capsize-[0.4056]"
+			],
+			md: [
+				"text-md",
+				"leading-normal",
+				"capsize-[0.3864]"
+			],
+			lg: [
+				"text-lg",
+				"leading-[1.52]",
+				"capsize-[0.3983]"
+			],
+			xl: [
+				"text-xl",
+				"leading-[1.42]",
+				"capsize-[0.3506]"
+			],
+			"2xl": [
+				"text-2xl",
+				"leading-[1.40]",
+				"capsize-[0.3336]"
+			],
+			"3xl": [
+				"text-3xl",
+				"leading-[1.28]",
+				"capsize-[0.2709]"
+			],
+			"4xl": [
+				"text-4xl",
+				"leading-none",
+				"capsize-[0.1309]"
+			]
+		},
+		noCapsize: { true: ["capsize-none"] },
+		weight: {
+			normal: ["font-normal"],
+			bold: ["font-semibold"]
+		},
+		family: {
+			body: ["font-body"],
+			display: ["font-display"],
+			mono: ["font-mono"]
+		}
+	}
+}, { enabledResponsiveVariants: !0 }), r = t.forwardRef(({ size: e = "md", family: r = "body", ...i }, a) => /* @__PURE__ */ t.createElement(n, {
+	size: e,
+	family: r,
+	...i,
+	ref: a
+}));
+r.displayName = "Text";
+//#endregion
+export { r as Text };
+
+//# sourceMappingURL=Text.js.map

package/dist/components/text/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sources":["../../../src/components/text/Text.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport type { Override } from '~/utilities/types'\n\nexport const StyledText = styled(\n  'p',\n  {\n    base: [],\n    variants: {\n      size: {\n        xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n        sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n        md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n        lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n        xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]'],\n        '2xl': ['text-2xl', 'leading-[1.40]', 'capsize-[0.3336]'],\n        '3xl': ['text-3xl', 'leading-[1.28]', 'capsize-[0.2709]'],\n        '4xl': ['text-4xl', 'leading-none', 'capsize-[0.1309]']\n      },\n      noCapsize: {\n        true: ['capsize-none']\n      },\n      weight: {\n        normal: ['font-normal'],\n        bold: ['font-semibold']\n      },\n      family: {\n        body: ['font-body'],\n        display: ['font-display'],\n        mono: ['font-mono']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\ntype TextProps = Override<\n  React.ComponentProps<typeof StyledText>,\n  {\n    as?:\n      | 'blockquote'\n      | 'caption'\n      | 'dd'\n      | 'dt'\n      | 'figcaption'\n      | 'li'\n      | 'p'\n      | 'span'\n      | 'legend'\n      | React.ComponentType\n      | React.ElementType\n  }\n>\n\nexport const Text = React.forwardRef<HTMLParagraphElement, TextProps>(\n  ({ size = 'md', family = 'body', ...remainingProps }, ref) => (\n    <StyledText size={size} family={family} {...remainingProps} ref={ref} />\n  )\n)\n\nText.displayName = 'Text'\n"],"names":["StyledText","styled","Text","React","size","family","remainingProps","ref"],"mappings":"iEAKa,MAAAA,EAAaC,EACxB,IACA,CACE,KAAM,CACN,EAAA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,UAAW,gBAAiB,kBAAkB,EACnD,GAAI,CAAC,UAAW,iBAAkB,kBAAkB,EACpD,GAAI,CAAC,UAAW,iBAAkB,kBAAkB,EACpD,GAAI,CAAC,UAAW,iBAAkB,kBAAkB,EACpD,GAAI,CAAC,UAAW,iBAAkB,kBAAkB,EACpD,MAAO,CAAC,WAAY,iBAAkB,kBAAkB,EACxD,MAAO,CAAC,WAAY,iBAAkB,kBAAkB,EACxD,MAAO,CAAC,WAAY,eAAgB,kBAAkB,CACxD,EACA,UAAW,CACT,KAAM,CAAC,cAAc,CACvB,EACA,OAAQ,CACN,OAAQ,CAAC,aAAa,EACtB,KAAM,CAAC,eAAe,CACxB,EACA,OAAQ,CACN,KAAM,CAAC,WAAW,EAClB,QAAS,CAAC,cAAc,EACxB,KAAM,CAAC,WAAW,CACpB,CACF,CACF,EACA,CACE,0BAA2B,EAC7B,CACF,EAoBaC,EAAOC,EAAM,WACxB,CAAC,CAAE,KAAAC,EAAO,KAAM,OAAAC,EAAS,OAAQ,GAAGC,CAAe,EAAGC,IACpDJ,EAAA,cAACH,EAAW,CAAA,KAAMI,EAAM,OAAQC,EAAS,GAAGC,EAAgB,IAAKC,CAAAA,CAAK,CAE1E,EAEAL,EAAK,YAAc"}
+{"version":3,"file":"Text.js","names":[],"sources":["../../../src/components/text/Text.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport type { Override } from '~/utilities/types'\n\nexport const StyledText = styled(\n  'p',\n  {\n    base: [],\n    variants: {\n      size: {\n        xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n        sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n        md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n        lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n        xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]'],\n        '2xl': ['text-2xl', 'leading-[1.40]', 'capsize-[0.3336]'],\n        '3xl': ['text-3xl', 'leading-[1.28]', 'capsize-[0.2709]'],\n        '4xl': ['text-4xl', 'leading-none', 'capsize-[0.1309]']\n      },\n      noCapsize: {\n        true: ['capsize-none']\n      },\n      weight: {\n        normal: ['font-normal'],\n        bold: ['font-semibold']\n      },\n      family: {\n        body: ['font-body'],\n        display: ['font-display'],\n        mono: ['font-mono']\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\ntype TextProps = Override<\n  React.ComponentProps<typeof StyledText>,\n  {\n    as?:\n      | 'blockquote'\n      | 'caption'\n      | 'dd'\n      | 'dt'\n      | 'figcaption'\n      | 'li'\n      | 'p'\n      | 'span'\n      | 'legend'\n      | React.ComponentType\n      | React.ElementType\n  }\n>\n\nexport const Text = React.forwardRef<HTMLParagraphElement, TextProps>(\n  ({ size = 'md', family = 'body', ...remainingProps }, ref) => (\n    <StyledText size={size} family={family} {...remainingProps} ref={ref} />\n  )\n)\n\nText.displayName = 'Text'\n"],"mappings":";;;AAKA,IAAa,IAAa,EACxB,KACA;CACE,MAAM,EAAE;CACR,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAiB;IAAmB;GACpD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,OAAO;IAAC;IAAY;IAAkB;IAAmB;GACzD,OAAO;IAAC;IAAY;IAAkB;IAAmB;GACzD,OAAO;IAAC;IAAY;IAAgB;IAAmB;GACxD;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACD,QAAQ;GACN,QAAQ,CAAC,cAAc;GACvB,MAAM,CAAC,gBAAgB;GACxB;EACD,QAAQ;GACN,MAAM,CAAC,YAAY;GACnB,SAAS,CAAC,eAAe;GACzB,MAAM,CAAC,YAAY;GACpB;EACF;CACF,EACD,EACE,2BAA2B,IAC5B,CACF,EAoBY,IAAO,EAAM,YACvB,EAAE,UAAO,MAAM,YAAS,QAAQ,GAAG,KAAkB,MACpD,kBAAA,cAAC,GAAD;CAAkB;CAAc;CAAQ,GAAI;CAAqB;CAAO,CAAA,CAE3E;AAED,EAAK,cAAc"}

package/dist/components/textarea/Textarea.js

@@ -1,2 +1,63 @@
-import*as e from"react";import{styled as o}from"../../styled.js";const n=o("textarea",{base:["shadow-none","appearance-none","rounded-md","text-grey-1000","font-body","font-normal","text-md","leading-[1.4]","min-h-24","px-3","py-3","w-full","disabled:bg-grey-200","disabled:cursor-not-allowed","disabled:text-grey-800","placeholder:opacity-100","placeholder:text-grey-700"],variants:{appearance:{standard:["bg-white","border","border-grey-800","focus-within:border-primary-800","focus-within:outline-none"],modern:["bg-grey-100","border-none","focus-within:outline-2","focus-within:outline-blue-800","focus-within:outline-offset-1","focus-within:outline-solid","focus-within:z-1"]},state:{error:[]}},defaultVariants:{appearance:"standard"},compoundVariants:[{state:"error",appearance:"standard",class:["border-danger"]},{state:"error",appearance:"modern",class:["bg-danger-light","focus-within:outline-danger"]}]}),r=e.forwardRef((a,t)=>e.createElement(n,{...a,ref:t}));r.displayName="Textarea";export{r as Textarea};
-//# sourceMappingURL=Textarea.js.map
+import { styled as e } from "../../styled.js";
+import * as t from "react";
+//#region src/components/textarea/Textarea.tsx
+var n = e("textarea", {
+	base: [
+		"shadow-none",
+		"appearance-none",
+		"rounded-md",
+		"text-grey-1000",
+		"font-body",
+		"font-normal",
+		"text-md",
+		"leading-[1.4]",
+		"min-h-24",
+		"px-3",
+		"py-3",
+		"w-full",
+		"disabled:bg-grey-200",
+		"disabled:cursor-not-allowed",
+		"disabled:text-grey-800",
+		"placeholder:opacity-100",
+		"placeholder:text-grey-700"
+	],
+	variants: {
+		appearance: {
+			standard: [
+				"bg-white",
+				"border",
+				"border-grey-800",
+				"focus-within:border-primary-800",
+				"focus-within:outline-none"
+			],
+			modern: [
+				"bg-grey-100",
+				"border-none",
+				"focus-within:outline-2",
+				"focus-within:outline-blue-800",
+				"focus-within:outline-offset-1",
+				"focus-within:outline-solid",
+				"focus-within:z-1"
+			]
+		},
+		state: { error: [] }
+	},
+	defaultVariants: { appearance: "standard" },
+	compoundVariants: [{
+		state: "error",
+		appearance: "standard",
+		class: ["border-danger"]
+	}, {
+		state: "error",
+		appearance: "modern",
+		class: ["bg-danger-light", "focus-within:outline-danger"]
+	}]
+}), r = t.forwardRef((e, r) => /* @__PURE__ */ t.createElement(n, {
+	...e,
+	ref: r
+}));
+r.displayName = "Textarea";
+//#endregion
+export { r as Textarea };
+
+//# sourceMappingURL=Textarea.js.map

package/dist/components/textarea/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","sources":["../../../src/components/textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledTextarea = styled('textarea', {\n  base: [\n    'shadow-none',\n    'appearance-none',\n    'rounded-md',\n    'text-grey-1000',\n    'font-body',\n    'font-normal',\n    'text-md',\n    'leading-[1.4]',\n    'min-h-24',\n    'px-3',\n    'py-3',\n    'w-full',\n    'disabled:bg-grey-200',\n    'disabled:cursor-not-allowed',\n    'disabled:text-grey-800',\n    'placeholder:opacity-100',\n    'placeholder:text-grey-700'\n  ],\n  variants: {\n    appearance: {\n      standard: [\n        'bg-white',\n        'border',\n        'border-grey-800',\n        'focus-within:border-primary-800',\n        'focus-within:outline-none'\n      ],\n      modern: [\n        'bg-grey-100',\n        'border-none',\n        'focus-within:outline-2',\n        'focus-within:outline-blue-800',\n        'focus-within:outline-offset-1',\n        'focus-within:outline-solid',\n        'focus-within:z-1'\n      ]\n    },\n    state: {\n      error: []\n    }\n  },\n  defaultVariants: {\n    appearance: 'standard'\n  },\n  compoundVariants: [\n    {\n      state: 'error',\n      appearance: 'standard',\n      class: ['border-danger']\n    },\n    {\n      state: 'error',\n      appearance: 'modern',\n      class: ['bg-danger-light', 'focus-within:outline-danger']\n    }\n  ]\n})\n\nexport type TextareaProps = React.ComponentProps<typeof StyledTextarea>\n\nexport const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n  (props, ref) => <StyledTextarea {...props} ref={ref} />\n)\n\nTextarea.displayName = 'Textarea'\n"],"names":["StyledTextarea","styled","Textarea","React","props","ref"],"mappings":"iEAIA,MAAMA,EAAiBC,EAAO,WAAY,CACxC,KAAM,CACJ,cACA,kBACA,aACA,iBACA,YACA,cACA,UACA,gBACA,WACA,OACA,OACA,SACA,uBACA,8BACA,yBACA,0BACA,2BACF,EACA,SAAU,CACR,WAAY,CACV,SAAU,CACR,WACA,SACA,kBACA,kCACA,2BACF,EACA,OAAQ,CACN,cACA,cACA,yBACA,gCACA,gCACA,6BACA,kBACF,CACF,EACA,MAAO,CACL,MAAO,CACT,CAAA,CACF,EACA,gBAAiB,CACf,WAAY,UACd,EACA,iBAAkB,CAChB,CACE,MAAO,QACP,WAAY,WACZ,MAAO,CAAC,eAAe,CACzB,EACA,CACE,MAAO,QACP,WAAY,SACZ,MAAO,CAAC,kBAAmB,6BAA6B,CAC1D,CACF,CACF,CAAC,EAIYC,EAAWC,EAAM,WAC5B,CAACC,EAAOC,IAAQF,EAAA,cAACH,EAAA,CAAgB,GAAGI,EAAO,IAAKC,CAAK,CAAA,CACvD,EAEAH,EAAS,YAAc"}
+{"version":3,"file":"Textarea.js","names":[],"sources":["../../../src/components/textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledTextarea = styled('textarea', {\n  base: [\n    'shadow-none',\n    'appearance-none',\n    'rounded-md',\n    'text-grey-1000',\n    'font-body',\n    'font-normal',\n    'text-md',\n    'leading-[1.4]',\n    'min-h-24',\n    'px-3',\n    'py-3',\n    'w-full',\n    'disabled:bg-grey-200',\n    'disabled:cursor-not-allowed',\n    'disabled:text-grey-800',\n    'placeholder:opacity-100',\n    'placeholder:text-grey-700'\n  ],\n  variants: {\n    appearance: {\n      standard: [\n        'bg-white',\n        'border',\n        'border-grey-800',\n        'focus-within:border-primary-800',\n        'focus-within:outline-none'\n      ],\n      modern: [\n        'bg-grey-100',\n        'border-none',\n        'focus-within:outline-2',\n        'focus-within:outline-blue-800',\n        'focus-within:outline-offset-1',\n        'focus-within:outline-solid',\n        'focus-within:z-1'\n      ]\n    },\n    state: {\n      error: []\n    }\n  },\n  defaultVariants: {\n    appearance: 'standard'\n  },\n  compoundVariants: [\n    {\n      state: 'error',\n      appearance: 'standard',\n      class: ['border-danger']\n    },\n    {\n      state: 'error',\n      appearance: 'modern',\n      class: ['bg-danger-light', 'focus-within:outline-danger']\n    }\n  ]\n})\n\nexport type TextareaProps = React.ComponentProps<typeof StyledTextarea>\n\nexport const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n  (props, ref) => <StyledTextarea {...props} ref={ref} />\n)\n\nTextarea.displayName = 'Textarea'\n"],"mappings":";;;AAIA,IAAM,IAAiB,EAAO,YAAY;CACxC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,OAAO,EACL,OAAO,EAAE,EACV;EACF;CACD,iBAAiB,EACf,YAAY,YACb;CACD,kBAAkB,CAChB;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,gBAAgB;EACzB,EACD;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,mBAAmB,8BAA8B;EAC1D,CACF;CACF,CAAC,EAIW,IAAW,EAAM,YAC3B,GAAO,MAAQ,kBAAA,cAAC,GAAD;CAAgB,GAAI;CAAY;CAAO,CAAA,CACxD;AAED,EAAS,cAAc"}

package/dist/components/textarea-field/TextareaField.js

@@ -1,2 +1,33 @@
-import*as p from"react";import{useFormContext as F}from"react-hook-form";import{FieldWrapper as b}from"../field-wrapper/FieldWrapper.js";import{useFieldError as C}from"../form/useFieldError.js";import{useFormCustomContext as E}from"../form/useFormCustomContext.js";import{Textarea as N}from"../textarea/Textarea.js";const m=({className:l,hideLabel:n,label:d,name:e,validation:r,prompt:s,description:c,appearance:u,...f})=>{const{register:a}=F(),o=E(),{error:t}=C(e),x=r?a(r):a,i=(o==null?void 0:o.appearance)||u;return p.createElement(b,{className:l,description:c,error:t,fieldId:e,hideLabel:n,label:d,prompt:s,required:!!(r!=null&&r.required),appearance:i},p.createElement(N,{id:e,name:e,ref:x,appearance:i,...t&&{state:"error"},...f}))};m.displayName="TextareaField";export{m as TextareaField};
-//# sourceMappingURL=TextareaField.js.map
+import { useFieldError as e } from "../form/useFieldError.js";
+import { FieldWrapper as t } from "../field-wrapper/FieldWrapper.js";
+import { useFormCustomContext as n } from "../form/useFormCustomContext.js";
+import { Textarea as r } from "../textarea/Textarea.js";
+import * as i from "react";
+import { useFormContext as a } from "react-hook-form";
+//#region src/components/textarea-field/TextareaField.tsx
+var o = ({ className: o, hideLabel: s, label: c, name: l, validation: u, prompt: d, description: f, appearance: p, ...m }) => {
+	let { register: h } = a(), g = n(), { error: _ } = e(l), v = u ? h(u) : h, y = g?.appearance || p;
+	return /* @__PURE__ */ i.createElement(t, {
+		className: o,
+		description: f,
+		error: _,
+		fieldId: l,
+		hideLabel: s,
+		label: c,
+		prompt: d,
+		required: !!u?.required,
+		appearance: y
+	}, /* @__PURE__ */ i.createElement(r, {
+		id: l,
+		name: l,
+		ref: v,
+		appearance: y,
+		..._ && { state: "error" },
+		...m
+	}));
+};
+o.displayName = "TextareaField";
+//#endregion
+export { o as TextareaField };
+
+//# sourceMappingURL=TextareaField.js.map

package/dist/components/textarea-field/TextareaField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextareaField.js","sources":["../../../src/components/textarea-field/TextareaField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper/FieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\nimport { useFormCustomContext } from '~/components/form/useFormCustomContext'\nimport { Textarea, TextareaProps } from '~/components/textarea/Textarea'\n\ntype TextareaFieldProps = TextareaProps & FieldElementWrapperProps\n\nexport const TextareaField = ({\n  className,\n  hideLabel,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  appearance,\n  ...remainingProps\n}: TextareaFieldProps) => {\n  const { register } = useFormContext()\n  const context = useFormCustomContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n  const formAppearance = context?.appearance || appearance\n\n  return (\n    <FieldWrapper\n      className={className}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      appearance={formAppearance}\n    >\n      <Textarea\n        id={name}\n        name={name}\n        ref={ref}\n        appearance={formAppearance}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nTextareaField.displayName = 'TextareaField'\n"],"names":["TextareaField","className","hideLabel","label","name","validation","prompt","description","appearance","remainingProps","register","useFormContext","context","useFormCustomContext","error","useFieldError","ref","formAppearance","React","FieldWrapper","Textarea"],"mappings":"4TAaa,MAAAA,EAAgB,CAAC,CAC5B,UAAAC,EACA,UAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,WAAAC,EACA,GAAGC,CACL,IAA0B,CACxB,KAAM,CAAE,SAAAC,CAAS,EAAIC,IACfC,EAAUC,EAAqB,EAC/B,CAAE,MAAAC,CAAM,EAAIC,EAAcX,CAAI,EAC9BY,EAAMX,EAAaK,EAASL,CAAU,EAAIK,EAC1CO,GAAiBL,GAAA,KAAAA,OAAAA,EAAS,aAAcJ,EAE9C,OACEU,EAAA,cAACC,EAAA,CACC,UAAWlB,EACX,YAAaM,EACb,MAAOO,EACP,QAASV,EACT,UAAWF,EACX,MAAOC,EACP,OAAQG,EACR,SAAU,CAAQD,EAAAA,GAAA,MAAAA,EAAY,UAC9B,WAAYY,CAEZC,EAAAA,EAAA,cAACE,EAAA,CACC,GAAIhB,EACJ,KAAMA,EACN,IAAKY,EACL,WAAYC,EACX,GAAIH,GAAS,CAAE,MAAO,OAAQ,EAC9B,GAAGL,CACN,CAAA,CACF,CAEJ,EAEAT,EAAc,YAAc"}
+{"version":3,"file":"TextareaField.js","names":[],"sources":["../../../src/components/textarea-field/TextareaField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper/FieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\nimport { useFormCustomContext } from '~/components/form/useFormCustomContext'\nimport { Textarea, TextareaProps } from '~/components/textarea/Textarea'\n\ntype TextareaFieldProps = TextareaProps & FieldElementWrapperProps\n\nexport const TextareaField = ({\n  className,\n  hideLabel,\n  label,\n  name,\n  validation,\n  prompt,\n  description,\n  appearance,\n  ...remainingProps\n}: TextareaFieldProps) => {\n  const { register } = useFormContext()\n  const context = useFormCustomContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n  const formAppearance = context?.appearance || appearance\n\n  return (\n    <FieldWrapper\n      className={className}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      appearance={formAppearance}\n    >\n      <Textarea\n        id={name}\n        name={name}\n        ref={ref}\n        appearance={formAppearance}\n        {...(error && { state: 'error' })}\n        {...remainingProps}\n      />\n    </FieldWrapper>\n  )\n}\n\nTextareaField.displayName = 'TextareaField'\n"],"mappings":";;;;;;;AAaA,IAAa,KAAiB,EAC5B,cACA,cACA,UACA,SACA,eACA,WACA,gBACA,eACA,GAAG,QACqB;CACxB,IAAM,EAAE,gBAAa,GAAgB,EAC/B,IAAU,GAAsB,EAChC,EAAE,aAAU,EAAc,EAAK,EAC/B,IAAM,IAAa,EAAS,EAAW,GAAG,GAC1C,IAAiB,GAAS,cAAc;AAE9C,QACE,kBAAA,cAAC,GAAD;EACa;EACE;EACN;EACP,SAAS;EACE;EACJ;EACC;EACR,UAAU,EAAQ,GAAY;EAC9B,YAAY;EAUC,EARb,kBAAA,cAAC,GAAD;EACE,IAAI;EACE;EACD;EACL,YAAY;EACZ,GAAK,KAAS,EAAE,OAAO,SAAS;EAChC,GAAI;EACJ,CAAA,CACW;;AAInB,EAAc,cAAc"}

package/dist/components/tile/Tile.js

@@ -1,2 +1,39 @@
-import e from"react";import{ColorScheme as i}from"../../experiments/color-scheme/ColorScheme.js";import{styled as m}from"../../styled.js";const r=m("div",{base:["flex","flex-col","relative","border","bg-(--base-1)","text-(--foreground)","border-transparent"],variants:{borderRadius:{sm:["rounded-sm"],md:["rounded-md"],lg:["rounded-xl"]},border:{true:["border-(--base-3)"]},diffused:{true:["supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]","supports-color-mix:backdrop-blur-sm"]}}},{enabledResponsiveVariants:!0}),o=e.forwardRef(({children:d,borderRadius:a="lg",colorScheme:t={},...s},l)=>e.createElement(i,{asChild:!0,base:"grey1",accent:"primary2",interactive:"loContrast",...t},e.createElement(r,{ref:l,borderRadius:a,...s},d)));o.displayName="Tile";export{r as StyledTile,o as Tile};
-//# sourceMappingURL=Tile.js.map
+import { styled as e } from "../../styled.js";
+import { ColorScheme as t } from "../../experiments/color-scheme/ColorScheme.js";
+import n from "react";
+//#region src/components/tile/Tile.tsx
+var r = e("div", {
+	base: [
+		"flex",
+		"flex-col",
+		"relative",
+		"border",
+		"bg-(--base-1)",
+		"text-(--foreground)",
+		"border-transparent"
+	],
+	variants: {
+		borderRadius: {
+			sm: ["rounded-sm"],
+			md: ["rounded-md"],
+			lg: ["rounded-xl"]
+		},
+		border: { true: ["border-(--base-3)"] },
+		diffused: { true: ["supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]", "supports-color-mix:backdrop-blur-sm"] }
+	}
+}, { enabledResponsiveVariants: !0 }), i = n.forwardRef(({ children: e, borderRadius: i = "lg", colorScheme: a = {}, ...o }, s) => /* @__PURE__ */ n.createElement(t, {
+	asChild: !0,
+	base: "grey1",
+	accent: "primary2",
+	interactive: "loContrast",
+	...a
+}, /* @__PURE__ */ n.createElement(r, {
+	ref: s,
+	borderRadius: i,
+	...o
+}, e)));
+i.displayName = "Tile";
+//#endregion
+export { i as Tile };
+
+//# sourceMappingURL=Tile.js.map

package/dist/components/tile/Tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tile.js","sources":["../../../src/components/tile/Tile.tsx"],"sourcesContent":["import React from 'react'\n\nimport {\n  ColorScheme,\n  TcolorScheme\n} from '~/experiments/color-scheme/ColorScheme'\nimport { styled } from '~/styled'\n\nexport const StyledTile = styled(\n  'div',\n  {\n    base: [\n      'flex',\n      'flex-col',\n      'relative',\n      'border',\n      'bg-(--base-1)',\n      'text-(--foreground)',\n      'border-transparent'\n    ],\n    variants: {\n      borderRadius: {\n        sm: ['rounded-sm'],\n        md: ['rounded-md'],\n        lg: ['rounded-xl']\n      },\n      border: {\n        true: ['border-(--base-3)']\n      },\n      diffused: {\n        true: [\n          'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n          'supports-color-mix:backdrop-blur-sm'\n        ]\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\ntype TTileProps = React.ComponentProps<typeof StyledTile> & {\n  colorScheme?: TcolorScheme\n}\n\nexport const Tile = React.forwardRef<HTMLDivElement, TTileProps>(\n  ({ children, borderRadius = 'lg', colorScheme = {}, ...rest }, ref) => (\n    <ColorScheme\n      asChild\n      base=\"grey1\"\n      accent=\"primary2\"\n      interactive=\"loContrast\"\n      {...colorScheme}\n    >\n      <StyledTile ref={ref} borderRadius={borderRadius} {...rest}>\n        {children}\n      </StyledTile>\n    </ColorScheme>\n  )\n)\n\nTile.displayName = 'Tile'\n"],"names":["StyledTile","styled","Tile","React","children","borderRadius","colorScheme","rest","ref","ColorScheme"],"mappings":"0IAQa,MAAAA,EAAaC,EACxB,MACA,CACE,KAAM,CACJ,OACA,WACA,WACA,SACA,gBACA,sBACA,oBACF,EACA,SAAU,CACR,aAAc,CACZ,GAAI,CAAC,YAAY,EACjB,GAAI,CAAC,YAAY,EACjB,GAAI,CAAC,YAAY,CACnB,EACA,OAAQ,CACN,KAAM,CAAC,mBAAmB,CAC5B,EACA,SAAU,CACR,KAAM,CACJ,uEACA,qCACF,CACF,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAMaC,EAAOC,EAAM,WACxB,CAAC,CAAE,SAAAC,EAAU,aAAAC,EAAe,KAAM,YAAAC,EAAc,CAAI,EAAA,GAAGC,CAAK,EAAGC,IAC7DL,EAAA,cAACM,EAAA,CACC,QAAO,GACP,KAAK,QACL,OAAO,WACP,YAAY,aACX,GAAGH,CAEJH,EAAAA,EAAA,cAACH,EAAW,CAAA,IAAKQ,EAAK,aAAcH,EAAe,GAAGE,CACnDH,EAAAA,CACH,CACF,CAEJ,EAEAF,EAAK,YAAc"}
+{"version":3,"file":"Tile.js","names":[],"sources":["../../../src/components/tile/Tile.tsx"],"sourcesContent":["import React from 'react'\n\nimport {\n  ColorScheme,\n  TcolorScheme\n} from '~/experiments/color-scheme/ColorScheme'\nimport { styled } from '~/styled'\n\nexport const StyledTile = styled(\n  'div',\n  {\n    base: [\n      'flex',\n      'flex-col',\n      'relative',\n      'border',\n      'bg-(--base-1)',\n      'text-(--foreground)',\n      'border-transparent'\n    ],\n    variants: {\n      borderRadius: {\n        sm: ['rounded-sm'],\n        md: ['rounded-md'],\n        lg: ['rounded-xl']\n      },\n      border: {\n        true: ['border-(--base-3)']\n      },\n      diffused: {\n        true: [\n          'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n          'supports-color-mix:backdrop-blur-sm'\n        ]\n      }\n    }\n  },\n  { enabledResponsiveVariants: true }\n)\n\ntype TTileProps = React.ComponentProps<typeof StyledTile> & {\n  colorScheme?: TcolorScheme\n}\n\nexport const Tile = React.forwardRef<HTMLDivElement, TTileProps>(\n  ({ children, borderRadius = 'lg', colorScheme = {}, ...rest }, ref) => (\n    <ColorScheme\n      asChild\n      base=\"grey1\"\n      accent=\"primary2\"\n      interactive=\"loContrast\"\n      {...colorScheme}\n    >\n      <StyledTile ref={ref} borderRadius={borderRadius} {...rest}>\n        {children}\n      </StyledTile>\n    </ColorScheme>\n  )\n)\n\nTile.displayName = 'Tile'\n"],"mappings":";;;;AAQA,IAAa,IAAa,EACxB,OACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,cAAc;GACZ,IAAI,CAAC,aAAa;GAClB,IAAI,CAAC,aAAa;GAClB,IAAI,CAAC,aAAa;GACnB;EACD,QAAQ,EACN,MAAM,CAAC,oBAAoB,EAC5B;EACD,UAAU,EACR,MAAM,CACJ,wEACA,sCACD,EACF;EACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAMY,IAAO,EAAM,YACvB,EAAE,aAAU,kBAAe,MAAM,iBAAc,EAAE,EAAE,GAAG,KAAQ,MAC7D,kBAAA,cAAC,GAAD;CACE,SAAA;CACA,MAAK;CACL,QAAO;CACP,aAAY;CACZ,GAAI;CAKQ,EAHZ,kBAAA,cAAC,GAAD;CAAiB;CAAmB;CAAc,GAAI;CAEzC,EADV,EACU,CACD,CAEjB;AAED,EAAK,cAAc"}

package/dist/components/tile-interactive/TileInteractive.js

@@ -1,2 +1,50 @@
-import a from"react";import{Tile as l}from"../tile/Tile.js";import{styled as r}from"../../styled.js";const b=r(l,{base:["disabled:cursor-not-allowed","disabled:opacity-30","not-disabled:active:bg-(--base-2)","not-disabled:after:absolute","not-disabled:after:duration-250","not-disabled:after:ease-out","not-disabled:after:inset-0","not-disabled:after:opacity-0","not-disabled:after:pointer-events-none","not-disabled:after:rounded-[inherit]","not-disabled:after:shadow-lg","not-disabled:after:transition-opacity","not-disabled:cursor-pointer","not-disabled:duration-250","not-disabled:ease-in","not-disabled:focus-visible:outline-none","not-disabled:focus-visible:relative","not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]","not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]","not-disabled:focus-visible:z-1","not-disabled:hover:after:opacity-100","not-disabled:hover:-translate-y-0.5","not-disabled:transition-transform","not-disabled:translate-y-0"]}),o=a.forwardRef(({onClick:i,href:e,type:d="button",as:t,...s},n)=>a.createElement(b,{...s,...e?{as:t||"a",href:e,onClick:void 0}:{as:t||"button",type:d,onClick:i},ref:n}));o.displayName="TileInteractive";export{o as TileInteractive};
-//# sourceMappingURL=TileInteractive.js.map
+import { styled as e } from "../../styled.js";
+import { Tile as t } from "../tile/Tile.js";
+import n from "react";
+//#region src/components/tile-interactive/TileInteractive.tsx
+var r = e(t, { base: [
+	"disabled:cursor-not-allowed",
+	"disabled:opacity-30",
+	"not-disabled:active:bg-(--base-2)",
+	"not-disabled:after:absolute",
+	"not-disabled:after:duration-250",
+	"not-disabled:after:ease-out",
+	"not-disabled:after:inset-0",
+	"not-disabled:after:opacity-0",
+	"not-disabled:after:pointer-events-none",
+	"not-disabled:after:rounded-[inherit]",
+	"not-disabled:after:shadow-lg",
+	"not-disabled:after:transition-opacity",
+	"not-disabled:cursor-pointer",
+	"not-disabled:duration-250",
+	"not-disabled:ease-in",
+	"not-disabled:focus-visible:outline-none",
+	"not-disabled:focus-visible:relative",
+	"not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]",
+	"not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]",
+	"not-disabled:focus-visible:z-1",
+	"not-disabled:hover:after:opacity-100",
+	"not-disabled:hover:-translate-y-0.5",
+	"not-disabled:transition-transform",
+	"not-disabled:translate-y-0"
+] }), i = n.forwardRef(({ onClick: e, href: t, type: i = "button", as: a, ...o }, s) => {
+	let c = t ? {
+		as: a || "a",
+		href: t,
+		onClick: void 0
+	} : {
+		as: a || "button",
+		type: i,
+		onClick: e
+	};
+	return /* @__PURE__ */ n.createElement(r, {
+		...o,
+		...c,
+		ref: s
+	});
+});
+i.displayName = "TileInteractive";
+//#endregion
+export { i as TileInteractive };
+
+//# sourceMappingURL=TileInteractive.js.map

package/dist/components/tile-interactive/TileInteractive.js.map

@@ -1 +1 @@
-{"version":3,"file":"TileInteractive.js","sources":["../../../src/components/tile-interactive/TileInteractive.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Tile } from '~/components/tile/Tile'\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\n\nconst StyledTileInteractive = styled(Tile, {\n  base: [\n    'disabled:cursor-not-allowed',\n    'disabled:opacity-30',\n    'not-disabled:active:bg-(--base-2)',\n    'not-disabled:after:absolute',\n    'not-disabled:after:duration-250',\n    'not-disabled:after:ease-out',\n    'not-disabled:after:inset-0',\n    'not-disabled:after:opacity-0',\n    'not-disabled:after:pointer-events-none',\n    'not-disabled:after:rounded-[inherit]',\n    'not-disabled:after:shadow-lg',\n    'not-disabled:after:transition-opacity',\n    'not-disabled:cursor-pointer',\n    'not-disabled:duration-250',\n    'not-disabled:ease-in',\n    'not-disabled:focus-visible:outline-none',\n    'not-disabled:focus-visible:relative',\n    'not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n    'not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]',\n    'not-disabled:focus-visible:z-1',\n    'not-disabled:hover:after:opacity-100',\n    'not-disabled:hover:-translate-y-0.5',\n    'not-disabled:transition-transform',\n    'not-disabled:translate-y-0'\n  ]\n})\n\ntype TTileInteractiveProps = React.ComponentProps<\n  typeof StyledTileInteractive\n> &\n  React.ButtonHTMLAttributes<HTMLButtonElement> &\n  NavigatorActions\n\nexport const TileInteractive = React.forwardRef<\n  HTMLDivElement,\n  TTileInteractiveProps\n>(({ onClick, href, type = 'button', as, ...rest }, ref) => {\n  const isLink = !!href\n  const elementSpecificProps = isLink\n    ? {\n        as: as || ('a' as React.ElementType),\n        href,\n        onClick: undefined\n      }\n    : {\n        as: as || ('button' as React.ElementType),\n        type,\n        onClick\n      }\n\n  return <StyledTileInteractive {...rest} {...elementSpecificProps} ref={ref} />\n})\n\nTileInteractive.displayName = 'TileInteractive'\n"],"names":["StyledTileInteractive","styled","Tile","TileInteractive","React","onClick","href","type","as","rest","ref"],"mappings":"qGAMA,MAAMA,EAAwBC,EAAOC,EAAM,CACzC,KAAM,CACJ,8BACA,sBACA,oCACA,8BACA,kCACA,8BACA,6BACA,+BACA,yCACA,uCACA,+BACA,wCACA,8BACA,4BACA,uBACA,0CACA,sCACA,+EACA,4DACA,iCACA,uCACA,sCACA,oCACA,4BACF,CACF,CAAC,EAQYC,EAAkBC,EAAM,WAGnC,CAAC,CAAE,QAAAC,EAAS,KAAAC,EAAM,KAAAC,EAAO,SAAU,GAAAC,EAAI,GAAGC,CAAK,EAAGC,IAc3CN,EAAA,cAACJ,EAAA,CAAuB,GAAGS,EAAO,GAbxBH,EAEb,CACE,GAAIE,GAAO,IACX,KAAAF,EACA,QAAS,MACX,EACA,CACE,GAAIE,GAAO,SACX,KAAAD,EACA,QAAAF,CACF,EAE8D,IAAKK,CAAK,CAAA,CAC7E,EAEDP,EAAgB,YAAc"}
+{"version":3,"file":"TileInteractive.js","names":[],"sources":["../../../src/components/tile-interactive/TileInteractive.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Tile } from '~/components/tile/Tile'\nimport { styled } from '~/styled'\nimport { NavigatorActions } from '~/types/navigatorActions.types'\n\nconst StyledTileInteractive = styled(Tile, {\n  base: [\n    'disabled:cursor-not-allowed',\n    'disabled:opacity-30',\n    'not-disabled:active:bg-(--base-2)',\n    'not-disabled:after:absolute',\n    'not-disabled:after:duration-250',\n    'not-disabled:after:ease-out',\n    'not-disabled:after:inset-0',\n    'not-disabled:after:opacity-0',\n    'not-disabled:after:pointer-events-none',\n    'not-disabled:after:rounded-[inherit]',\n    'not-disabled:after:shadow-lg',\n    'not-disabled:after:transition-opacity',\n    'not-disabled:cursor-pointer',\n    'not-disabled:duration-250',\n    'not-disabled:ease-in',\n    'not-disabled:focus-visible:outline-none',\n    'not-disabled:focus-visible:relative',\n    'not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n    'not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]',\n    'not-disabled:focus-visible:z-1',\n    'not-disabled:hover:after:opacity-100',\n    'not-disabled:hover:-translate-y-0.5',\n    'not-disabled:transition-transform',\n    'not-disabled:translate-y-0'\n  ]\n})\n\ntype TTileInteractiveProps = React.ComponentProps<\n  typeof StyledTileInteractive\n> &\n  React.ButtonHTMLAttributes<HTMLButtonElement> &\n  NavigatorActions\n\nexport const TileInteractive = React.forwardRef<\n  HTMLDivElement,\n  TTileInteractiveProps\n>(({ onClick, href, type = 'button', as, ...rest }, ref) => {\n  const isLink = !!href\n  const elementSpecificProps = isLink\n    ? {\n        as: as || ('a' as React.ElementType),\n        href,\n        onClick: undefined\n      }\n    : {\n        as: as || ('button' as React.ElementType),\n        type,\n        onClick\n      }\n\n  return <StyledTileInteractive {...rest} {...elementSpecificProps} ref={ref} />\n})\n\nTileInteractive.displayName = 'TileInteractive'\n"],"mappings":";;;;AAMA,IAAM,IAAwB,EAAO,GAAM,EACzC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC,EAQW,IAAkB,EAAM,YAGlC,EAAE,YAAS,SAAM,UAAO,UAAU,OAAI,GAAG,KAAQ,MAAQ;CAE1D,IAAM,IADW,IAEb;EACE,IAAI,KAAO;EACX;EACA,SAAS,KAAA;EACV,GACD;EACE,IAAI,KAAO;EACX;EACA;EACD;AAEL,QAAO,kBAAA,cAAC,GAAD;EAAuB,GAAI;EAAM,GAAI;EAA2B;EAAO,CAAA;EAC9E;AAEF,EAAgB,cAAc"}

package/dist/components/tile-toggle-group/TileToggleGroupItem.js

@@ -1,2 +1,24 @@
-import*as o from"@radix-ui/react-toggle-group";import*as t from"react";import{TileInteractive as r}from"../tile-interactive/TileInteractive.js";import{styled as n}from"../../styled.js";const i=n(r,{base:["text-left","not-disabled:data-[state=on]:active:bg-(--interactive-3)","not-disabled:data-[state=on]:hover:bg-(--interactive-2)","data-[state=on]:before:-inset-px","data-[state=on]:before:absolute","data-[state=on]:before:rounded-[inherit]","data-[state=on]:before:inset-shadow-[var(--accent-8)_0px_0px_0px_2px]","data-[state=on]:before:z-1","data-[state=on]:bg-(--interactive-1)","data-[state=on]:border-(--accent-8)"]}),s=({children:e,...a})=>t.createElement(o.Item,{...a,asChild:!0},t.createElement(i,{as:"button"},e));export{s as TileToggleGroupItem};
-//# sourceMappingURL=TileToggleGroupItem.js.map
+import { styled as e } from "../../styled.js";
+import { TileInteractive as t } from "../tile-interactive/TileInteractive.js";
+import * as n from "react";
+import * as r from "@radix-ui/react-toggle-group";
+//#region src/components/tile-toggle-group/TileToggleGroupItem.tsx
+var i = e(t, { base: [
+	"text-left",
+	"not-disabled:data-[state=on]:active:bg-(--interactive-3)",
+	"not-disabled:data-[state=on]:hover:bg-(--interactive-2)",
+	"data-[state=on]:before:-inset-px",
+	"data-[state=on]:before:absolute",
+	"data-[state=on]:before:rounded-[inherit]",
+	"data-[state=on]:before:inset-shadow-[var(--accent-8)_0px_0px_0px_2px]",
+	"data-[state=on]:before:z-1",
+	"data-[state=on]:bg-(--interactive-1)",
+	"data-[state=on]:border-(--accent-8)"
+] }), a = ({ children: e, ...t }) => /* @__PURE__ */ n.createElement(r.Item, {
+	...t,
+	asChild: !0
+}, /* @__PURE__ */ n.createElement(i, { as: "button" }, e));
+//#endregion
+export { a as TileToggleGroupItem };
+
+//# sourceMappingURL=TileToggleGroupItem.js.map

package/dist/components/tile-toggle-group/TileToggleGroupItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"TileToggleGroupItem.js","sources":["../../../src/components/tile-toggle-group/TileToggleGroupItem.tsx"],"sourcesContent":["import * as ToggleGroup from '@radix-ui/react-toggle-group'\nimport * as React from 'react'\n\nimport { TileInteractive } from '~/components/tile-interactive/TileInteractive'\nimport { styled } from '~/styled'\n\nconst StyledTileToggleGroupItem = styled(TileInteractive, {\n  base: [\n    'text-left',\n    'not-disabled:data-[state=on]:active:bg-(--interactive-3)',\n    'not-disabled:data-[state=on]:hover:bg-(--interactive-2)',\n    'data-[state=on]:before:-inset-px',\n    'data-[state=on]:before:absolute',\n    'data-[state=on]:before:rounded-[inherit]',\n    'data-[state=on]:before:inset-shadow-[var(--accent-8)_0px_0px_0px_2px]',\n    'data-[state=on]:before:z-1',\n    'data-[state=on]:bg-(--interactive-1)',\n    'data-[state=on]:border-(--accent-8)'\n  ]\n})\n\ntype TTileToggleGroupItem = React.ComponentProps<typeof ToggleGroup.Item> &\n  React.ComponentProps<typeof StyledTileToggleGroupItem>\n\nexport const TileToggleGroupItem = ({\n  children,\n  ...rest\n}: TTileToggleGroupItem) => (\n  <ToggleGroup.Item {...rest} asChild>\n    <StyledTileToggleGroupItem as=\"button\">\n      {children}\n    </StyledTileToggleGroupItem>\n  </ToggleGroup.Item>\n)\n"],"names":["StyledTileToggleGroupItem","styled","TileInteractive","TileToggleGroupItem","children","rest","React","ToggleGroup"],"mappings":"yLAMA,MAAMA,EAA4BC,EAAOC,EAAiB,CACxD,KAAM,CACJ,YACA,2DACA,0DACA,mCACA,kCACA,2CACA,wEACA,6BACA,uCACA,qCACF,CACF,CAAC,EAKYC,EAAsB,CAAC,CAClC,SAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAY,KAAZ,CAAkB,GAAGF,EAAM,QAAO,EACjCC,EAAAA,EAAA,cAACN,EAAA,CAA0B,GAAG,QAC3BI,EAAAA,CACH,CACF"}
+{"version":3,"file":"TileToggleGroupItem.js","names":[],"sources":["../../../src/components/tile-toggle-group/TileToggleGroupItem.tsx"],"sourcesContent":["import * as ToggleGroup from '@radix-ui/react-toggle-group'\nimport * as React from 'react'\n\nimport { TileInteractive } from '~/components/tile-interactive/TileInteractive'\nimport { styled } from '~/styled'\n\nconst StyledTileToggleGroupItem = styled(TileInteractive, {\n  base: [\n    'text-left',\n    'not-disabled:data-[state=on]:active:bg-(--interactive-3)',\n    'not-disabled:data-[state=on]:hover:bg-(--interactive-2)',\n    'data-[state=on]:before:-inset-px',\n    'data-[state=on]:before:absolute',\n    'data-[state=on]:before:rounded-[inherit]',\n    'data-[state=on]:before:inset-shadow-[var(--accent-8)_0px_0px_0px_2px]',\n    'data-[state=on]:before:z-1',\n    'data-[state=on]:bg-(--interactive-1)',\n    'data-[state=on]:border-(--accent-8)'\n  ]\n})\n\ntype TTileToggleGroupItem = React.ComponentProps<typeof ToggleGroup.Item> &\n  React.ComponentProps<typeof StyledTileToggleGroupItem>\n\nexport const TileToggleGroupItem = ({\n  children,\n  ...rest\n}: TTileToggleGroupItem) => (\n  <ToggleGroup.Item {...rest} asChild>\n    <StyledTileToggleGroupItem as=\"button\">\n      {children}\n    </StyledTileToggleGroupItem>\n  </ToggleGroup.Item>\n)\n"],"mappings":";;;;;AAMA,IAAM,IAA4B,EAAO,GAAiB,EACxD,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC,EAKW,KAAuB,EAClC,aACA,GAAG,QAEH,kBAAA,cAAC,EAAY,MAAb;CAAkB,GAAI;CAAM,SAAA;CAIT,EAHjB,kBAAA,cAAC,GAAD,EAA2B,IAAG,UAEF,EADzB,EACyB,CACX"}

package/dist/components/tile-toggle-group/TileToggleGroupRoot.js

@@ -1,2 +1,13 @@
-import t from"clsx";import*as e from"react";import{ToggleGroup as a}from"../../utilities/radix-overrides/toggle-group/index.js";const l=e.forwardRef((o,r)=>e.createElement(a.Root,{ref:r,...o,className:t(o.className,"flex","gap-2",o.orientation==="horizontal"&&"flex-row",o.orientation==="vertical"&&"flex-col","flex-wrap")}));export{l as TileToggleGroupRoot};
-//# sourceMappingURL=TileToggleGroupRoot.js.map
+import { ToggleGroup as e } from "../../utilities/radix-overrides/toggle-group/index.js";
+import t from "clsx";
+import * as n from "react";
+//#region src/components/tile-toggle-group/TileToggleGroupRoot.tsx
+var r = n.forwardRef((r, i) => /* @__PURE__ */ n.createElement(e.Root, {
+	ref: i,
+	...r,
+	className: t(r.className, "flex", "gap-2", r.orientation === "horizontal" && "flex-row", r.orientation === "vertical" && "flex-col", "flex-wrap")
+}));
+//#endregion
+export { r as TileToggleGroupRoot };
+
+//# sourceMappingURL=TileToggleGroupRoot.js.map

package/dist/components/tile-toggle-group/TileToggleGroupRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"TileToggleGroupRoot.js","sources":["../../../src/components/tile-toggle-group/TileToggleGroupRoot.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { ToggleGroup } from '~/utilities/radix-overrides/toggle-group'\n\ntype TTileToggleGroupRootProps = React.ComponentProps<typeof ToggleGroup.Root>\n\nexport const TileToggleGroupRoot = React.forwardRef<\n  HTMLDivElement,\n  TTileToggleGroupRootProps\n>((props, ref) => (\n  <ToggleGroup.Root\n    ref={ref}\n    {...props}\n    className={clsx(\n      props.className,\n      'flex',\n      'gap-2',\n      props.orientation === 'horizontal' && 'flex-row',\n      props.orientation === 'vertical' && 'flex-col',\n      'flex-wrap'\n    )}\n  />\n))\n"],"names":["TileToggleGroupRoot","React","props","ref","ToggleGroup","clsx"],"mappings":"gIAOa,MAAAA,EAAsBC,EAAM,WAGvC,CAACC,EAAOC,IACRF,EAAA,cAACG,EAAY,KAAZ,CACC,IAAKD,EACJ,GAAGD,EACJ,UAAWG,EACTH,EAAM,UACN,OACA,QACAA,EAAM,cAAgB,cAAgB,WACtCA,EAAM,cAAgB,YAAc,WACpC,WACF,EACF,CACD"}
+{"version":3,"file":"TileToggleGroupRoot.js","names":[],"sources":["../../../src/components/tile-toggle-group/TileToggleGroupRoot.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { ToggleGroup } from '~/utilities/radix-overrides/toggle-group'\n\ntype TTileToggleGroupRootProps = React.ComponentProps<typeof ToggleGroup.Root>\n\nexport const TileToggleGroupRoot = React.forwardRef<\n  HTMLDivElement,\n  TTileToggleGroupRootProps\n>((props, ref) => (\n  <ToggleGroup.Root\n    ref={ref}\n    {...props}\n    className={clsx(\n      props.className,\n      'flex',\n      'gap-2',\n      props.orientation === 'horizontal' && 'flex-row',\n      props.orientation === 'vertical' && 'flex-col',\n      'flex-wrap'\n    )}\n  />\n))\n"],"mappings":";;;;AAOA,IAAa,IAAsB,EAAM,YAGtC,GAAO,MACR,kBAAA,cAAC,EAAY,MAAb;CACO;CACL,GAAI;CACJ,WAAW,EACT,EAAM,WACN,QACA,SACA,EAAM,gBAAgB,gBAAgB,YACtC,EAAM,gBAAgB,cAAc,YACpC,YACD;CACD,CAAA,CACF"}

package/dist/components/tile-toggle-group/index.js

@@ -1,2 +1,9 @@
-import{TileToggleGroupItem as e}from"./TileToggleGroupItem.js";import{TileToggleGroupRoot as l}from"./TileToggleGroupRoot.js";const o=l;o.Item=e,o.displayName="TileToggleGroup";export{o as TileToggleGroup};
-//# sourceMappingURL=index.js.map
+import { TileToggleGroupItem as e } from "./TileToggleGroupItem.js";
+import { TileToggleGroupRoot as t } from "./TileToggleGroupRoot.js";
+//#region src/components/tile-toggle-group/index.ts
+var n = t;
+n.Item = e, n.displayName = "TileToggleGroup";
+//#endregion
+export { n as TileToggleGroup };
+
+//# sourceMappingURL=index.js.map

package/dist/components/tile-toggle-group/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/tile-toggle-group/index.ts"],"sourcesContent":["import { TileToggleGroupItem } from './TileToggleGroupItem'\nimport { TileToggleGroupRoot } from './TileToggleGroupRoot'\n\ntype TTileToggleGroup = typeof TileToggleGroupRoot & {\n  Item: typeof TileToggleGroupItem\n}\n\nexport const TileToggleGroup = TileToggleGroupRoot as TTileToggleGroup\nTileToggleGroup.Item = TileToggleGroupItem\nTileToggleGroup.displayName = 'TileToggleGroup'\n"],"names":["TileToggleGroup","TileToggleGroupRoot","TileToggleGroupItem"],"mappings":"8HAOa,MAAAA,EAAkBC,EAC/BD,EAAgB,KAAOE,EACvBF,EAAgB,YAAc"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/tile-toggle-group/index.ts"],"sourcesContent":["import { TileToggleGroupItem } from './TileToggleGroupItem'\nimport { TileToggleGroupRoot } from './TileToggleGroupRoot'\n\ntype TTileToggleGroup = typeof TileToggleGroupRoot & {\n  Item: typeof TileToggleGroupItem\n}\n\nexport const TileToggleGroup = TileToggleGroupRoot as TTileToggleGroup\nTileToggleGroup.Item = TileToggleGroupItem\nTileToggleGroup.displayName = 'TileToggleGroup'\n"],"mappings":";;;AAOA,IAAa,IAAkB;AAC/B,EAAgB,OAAO,GACvB,EAAgB,cAAc"}

package/dist/components/toast/Toast.js

@@ -1,2 +1,40 @@
-import*as r from"react";import{styled as n}from"../../styled.js";import{ToastCloseButton as a}from"./ToastCloseButton.js";import{useToastContext as i}from"./ToastContext.js";import{ToastIcon as m}from"./ToastIcon.js";const e=n("div",{base:["flex","items-center","pointer-events-auto","rounded-md","shadow-md","text-white","min-h-12","relative","px-4","py-1","motion-safe:duration-125","motion-safe:ease-out","motion-safe:transition-[colors,transform]"],variants:{type:{loading:["bg-info"],blank:["bg-info"],success:["bg-success"],error:["bg-danger"]}}}),t=o=>{const{type:s}=i();return r.createElement(e,{type:o.type||s,...o})};t.Icon=m,t.Close=a;export{e as StyledToast,t as Toast};
-//# sourceMappingURL=Toast.js.map
+import { styled as e } from "../../styled.js";
+import { useToastContext as t } from "./ToastContext.js";
+import { ToastCloseButton as n } from "./ToastCloseButton.js";
+import { ToastIcon as r } from "./ToastIcon.js";
+import * as i from "react";
+//#region src/components/toast/Toast.tsx
+var a = e("div", {
+	base: [
+		"flex",
+		"items-center",
+		"pointer-events-auto",
+		"rounded-md",
+		"shadow-md",
+		"text-white",
+		"min-h-12",
+		"relative",
+		"px-4",
+		"py-1",
+		"motion-safe:duration-125",
+		"motion-safe:ease-out",
+		"motion-safe:transition-[colors,transform]"
+	],
+	variants: { type: {
+		loading: ["bg-info"],
+		blank: ["bg-info"],
+		success: ["bg-success"],
+		error: ["bg-danger"]
+	} }
+}), o = (e) => {
+	let { type: n } = t();
+	return /* @__PURE__ */ i.createElement(a, {
+		type: e.type || n,
+		...e
+	});
+};
+o.Icon = r, o.Close = n;
+//#endregion
+export { o as Toast };
+
+//# sourceMappingURL=Toast.js.map