@shipfox/react-ui 0.3.0 → 0.5.0

package/dist/components/badge/badge.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/badge/badge.stories.tsx"],"sourcesContent":["import type {Meta, StoryObj} from '@storybook/react';\nimport {Code} from 'components/typography';\nimport React from 'react';\nimport {Badge, IconBadge, StatusBadge, UserBadge} from '.';\n\nconst meta = {\n  title: 'Components/Badge',\n  component: Badge,\n  parameters: {\n    layout: 'centered',\n  },\n  tags: ['autodocs'],\n} satisfies Meta<typeof Badge>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const AllVariants: Story = {\n  render: () => (\n    <div className=\"flex flex-col gap-32\">\n      {/* STATUS BADGE */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          Status Badge\n        </Code>\n        <div className=\"flex gap-16\">\n          <StatusBadge variant=\"neutral\">Badge</StatusBadge>\n          <StatusBadge variant=\"info\">Badge</StatusBadge>\n          <StatusBadge variant=\"feature\">Badge</StatusBadge>\n          <StatusBadge variant=\"success\" dotClassName=\"size-5 rounded-full\">\n            Badge\n          </StatusBadge>\n          <StatusBadge variant=\"warning\">Badge</StatusBadge>\n          <StatusBadge variant=\"error\">Badge</StatusBadge>\n        </div>\n      </div>\n\n      {/* USER BADGE */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          User Badge\n        </Code>\n        <div className=\"flex gap-16\">\n          <UserBadge\n            name=\"Thierry Abalea\"\n            avatarSrc=\"https://avatars.githubusercontent.com/u/1290899?v=4\"\n          />\n          <UserBadge\n            name=\"Kyle Nguyen\"\n            avatarSrc=\"https://avatars.githubusercontent.com/u/89263955?v=4\"\n          />\n          <UserBadge\n            name=\"Noe Charmet\"\n            avatarSrc=\"https://avatars.githubusercontent.com/u/59678972?v=4\"\n          />\n        </div>\n      </div>\n\n      {/* ICON BADGE */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          Icon Badge\n        </Code>\n        <div className=\"flex gap-16\">\n          <IconBadge variant=\"neutral\" name=\"homeSmile\" />\n          <IconBadge variant=\"info\" name=\"homeSmile\" />\n          <IconBadge variant=\"feature\" name=\"homeSmile\" />\n          <IconBadge variant=\"success\" name=\"homeSmile\" />\n          <IconBadge variant=\"primary\" name=\"homeSmile\" />\n          <IconBadge variant=\"error\" name=\"homeSmile\" />\n        </div>\n      </div>\n\n      {/* BADGE - 2XS SIZE */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          Badge - 2XS Size\n        </Code>\n        <div className=\"flex flex-col gap-16\">\n          {/* Base */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"2xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"2xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"2xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"2xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"2xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"2xs\">\n              Badge\n            </Badge>\n          </div>\n\n          {/* With Right Icon */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"2xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"2xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"2xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"2xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"2xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"2xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n          </div>\n\n          {/* With Left Icon */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"2xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"2xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"2xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"2xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"2xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"2xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n          </div>\n        </div>\n      </div>\n\n      {/* BADGE - XS SIZE */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          Badge - XS Size\n        </Code>\n        <div className=\"flex flex-col gap-16\">\n          {/* Base */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"xs\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"xs\">\n              Badge\n            </Badge>\n          </div>\n\n          {/* With Right Icon */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"xs\" iconRight=\"close\">\n              Badge\n            </Badge>\n          </div>\n\n          {/* With Left Icon */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"xs\" iconLeft=\"close\">\n              Badge\n            </Badge>\n          </div>\n        </div>\n      </div>\n\n      {/* BADGE - ROUNDED */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          Badge - Rounded\n        </Code>\n        <div className=\"flex flex-col gap-16\">\n          {/* Base - 2XS */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"2xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"2xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"2xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"2xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"2xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"2xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n          </div>\n\n          {/* Base - XS */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"xs\" radius=\"rounded\">\n              Badge\n            </Badge>\n          </div>\n\n          {/* With Right Icon - 2XS */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"2xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"2xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"2xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"2xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"2xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"2xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n          </div>\n\n          {/* With Right Icon - XS */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"xs\" radius=\"rounded\" iconRight=\"close\">\n              Badge\n            </Badge>\n          </div>\n\n          {/* With Left Icon - 2XS */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"2xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"2xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"2xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"2xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"2xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"2xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n          </div>\n\n          {/* With Left Icon - XS */}\n          <div className=\"flex gap-16\">\n            <Badge variant=\"neutral\" size=\"xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"info\" size=\"xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"feature\" size=\"xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"success\" size=\"xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"warning\" size=\"xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n            <Badge variant=\"error\" size=\"xs\" radius=\"rounded\" iconLeft=\"close\">\n              Badge\n            </Badge>\n          </div>\n        </div>\n      </div>\n\n      {/* BETA BADGE */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          Beta Badge\n        </Code>\n        <div className=\"flex gap-16\">\n          <Badge variant=\"info\" size=\"2xs\" radius=\"rounded\">\n            Beta\n          </Badge>\n        </div>\n      </div>\n    </div>\n  ),\n};\n\n// Interactive badges with click handlers\nfunction InteractiveBadgesComponent() {\n  const [tags, setTags] = React.useState(['React', 'TypeScript', 'Next.js', 'Tailwind']);\n\n  const removeTag = (tagToRemove: string) => {\n    setTags(tags.filter((tag) => tag !== tagToRemove));\n  };\n\n  return (\n    <div className=\"flex flex-col gap-32\">\n      {/* Removable tags */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          Interactive Badges - Removable Tags\n        </Code>\n        <div className=\"flex flex-wrap gap-8\">\n          {tags.map((tag) => (\n            <Badge\n              key={tag}\n              variant=\"neutral\"\n              size=\"xs\"\n              radius=\"rounded\"\n              iconRight=\"close\"\n              onIconRightClick={() => removeTag(tag)}\n              iconRightAriaLabel={`Remove ${tag} tag`}\n            >\n              {tag}\n            </Badge>\n          ))}\n        </div>\n      </div>\n\n      {/* Different variants with interactive icons */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          Interactive Badges - Different Variants\n        </Code>\n        <div className=\"flex flex-wrap gap-8\">\n          <Badge\n            variant=\"success\"\n            size=\"xs\"\n            iconRight=\"close\"\n            onIconRightClick={() => alert('Success badge clicked!')}\n            iconRightAriaLabel=\"Remove success badge\"\n          >\n            Completed\n          </Badge>\n          <Badge\n            variant=\"warning\"\n            size=\"xs\"\n            iconRight=\"close\"\n            onIconRightClick={() => alert('Warning badge clicked!')}\n            iconRightAriaLabel=\"Remove warning badge\"\n          >\n            Pending\n          </Badge>\n          <Badge\n            variant=\"error\"\n            size=\"xs\"\n            iconRight=\"close\"\n            onIconRightClick={() => alert('Error badge clicked!')}\n            iconRightAriaLabel=\"Remove error badge\"\n          >\n            Failed\n          </Badge>\n        </div>\n      </div>\n\n      {/* Non-interactive icons (static) */}\n      <div>\n        <Code variant=\"label\" className=\"mb-16\">\n          Static Icons (Non-interactive)\n        </Code>\n        <div className=\"flex flex-wrap gap-8\">\n          <Badge variant=\"info\" size=\"xs\" iconLeft=\"info\">\n            Information\n          </Badge>\n          <Badge variant=\"success\" size=\"xs\" iconLeft=\"check\">\n            Verified\n          </Badge>\n          <Badge variant=\"feature\" size=\"xs\" iconLeft=\"money\">\n            Premium\n          </Badge>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport const InteractiveBadges: Story = {\n  render: () => <InteractiveBadgesComponent />,\n};\n"],"names":["Code","React","Badge","IconBadge","StatusBadge","UserBadge","meta","title","component","parameters","layout","tags","AllVariants","render","div","className","variant","dotClassName","name","avatarSrc","size","iconRight","iconLeft","radius","InteractiveBadgesComponent","setTags","useState","removeTag","tagToRemove","filter","tag","map","onIconRightClick","iconRightAriaLabel","alert","InteractiveBadges"],"mappings":"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"}

package/dist/components/badge/icon-badge.d.ts

@@ -0,0 +1,9 @@
+import { type IconName } from '../../components/icon';
+import type { ComponentProps } from 'react';
+export type IconBadgeVariant = 'neutral' | 'info' | 'feature' | 'success' | 'primary' | 'error';
+export type IconBadgeProps = ComponentProps<'span'> & {
+    variant?: IconBadgeVariant;
+    name?: IconName;
+};
+export declare function IconBadge({ className, variant, name, ...props }: IconBadgeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=icon-badge.d.ts.map

package/dist/components/badge/icon-badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/icon-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,QAAQ,EAAC,MAAM,iBAAiB,CAAC;AACpD,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AAG1C,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAEhG,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,MAAM,CAAC,GAAG;IACpD,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB,CAAC;AAoBF,wBAAgB,SAAS,CAAC,EAAC,SAAS,EAAE,OAAmB,EAAE,IAAI,EAAE,GAAG,KAAK,EAAC,EAAE,cAAc,2CAazF"}

package/dist/components/badge/icon-badge.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon } from '../../components/icon/index.js';
+import { cn } from '../../utils/cn.js';
+const variantStyles = {
+    neutral: 'bg-tag-neutral-bg border-tag-neutral-border',
+    info: 'bg-tag-blue-bg border-tag-blue-border',
+    feature: 'bg-tag-purple-bg border-tag-purple-border',
+    success: 'bg-tag-success-bg border-tag-success-border',
+    primary: 'bg-tag-warning-bg border-tag-warning-border',
+    error: 'bg-tag-error-bg border-tag-error-border'
+};
+const iconColorStyles = {
+    neutral: 'text-tag-neutral-icon',
+    info: 'text-tag-blue-icon',
+    feature: 'text-tag-purple-icon',
+    success: 'text-tag-success-icon',
+    primary: 'text-tag-warning-icon',
+    error: 'text-tag-error-icon'
+};
+export function IconBadge({ className, variant = 'neutral', name, ...props }) {
+    return /*#__PURE__*/ _jsx("span", {
+        className: cn('inline-flex size-20 items-center justify-center rounded-6 border', variantStyles[variant], className),
+        ...props,
+        children: name && /*#__PURE__*/ _jsx(Icon, {
+            name: name,
+            className: cn('shrink-0', iconColorStyles[variant]),
+            size: 12
+        })
+    });
+}
+
+//# sourceMappingURL=icon-badge.js.map

package/dist/components/badge/icon-badge.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/badge/icon-badge.tsx"],"sourcesContent":["import {Icon, type IconName} from 'components/icon';\nimport type {ComponentProps} from 'react';\nimport {cn} from 'utils/cn';\n\nexport type IconBadgeVariant = 'neutral' | 'info' | 'feature' | 'success' | 'primary' | 'error';\n\nexport type IconBadgeProps = ComponentProps<'span'> & {\n  variant?: IconBadgeVariant;\n  name?: IconName;\n};\n\nconst variantStyles: Record<IconBadgeVariant, string> = {\n  neutral: 'bg-tag-neutral-bg border-tag-neutral-border',\n  info: 'bg-tag-blue-bg border-tag-blue-border',\n  feature: 'bg-tag-purple-bg border-tag-purple-border',\n  success: 'bg-tag-success-bg border-tag-success-border',\n  primary: 'bg-tag-warning-bg border-tag-warning-border',\n  error: 'bg-tag-error-bg border-tag-error-border',\n};\n\nconst iconColorStyles: Record<IconBadgeVariant, string> = {\n  neutral: 'text-tag-neutral-icon',\n  info: 'text-tag-blue-icon',\n  feature: 'text-tag-purple-icon',\n  success: 'text-tag-success-icon',\n  primary: 'text-tag-warning-icon',\n  error: 'text-tag-error-icon',\n};\n\nexport function IconBadge({className, variant = 'neutral', name, ...props}: IconBadgeProps) {\n  return (\n    <span\n      className={cn(\n        'inline-flex size-20 items-center justify-center rounded-6 border',\n        variantStyles[variant],\n        className,\n      )}\n      {...props}\n    >\n      {name && <Icon name={name} className={cn('shrink-0', iconColorStyles[variant])} size={12} />}\n    </span>\n  );\n}\n"],"names":["Icon","cn","variantStyles","neutral","info","feature","success","primary","error","iconColorStyles","IconBadge","className","variant","name","props","span","size"],"mappings":";AAAA,SAAQA,IAAI,QAAsB,kBAAkB;AAEpD,SAAQC,EAAE,QAAO,WAAW;AAS5B,MAAMC,gBAAkD;IACtDC,SAAS;IACTC,MAAM;IACNC,SAAS;IACTC,SAAS;IACTC,SAAS;IACTC,OAAO;AACT;AAEA,MAAMC,kBAAoD;IACxDN,SAAS;IACTC,MAAM;IACNC,SAAS;IACTC,SAAS;IACTC,SAAS;IACTC,OAAO;AACT;AAEA,OAAO,SAASE,UAAU,EAACC,SAAS,EAAEC,UAAU,SAAS,EAAEC,IAAI,EAAE,GAAGC,OAAsB;IACxF,qBACE,KAACC;QACCJ,WAAWV,GACT,oEACAC,aAAa,CAACU,QAAQ,EACtBD;QAED,GAAGG,KAAK;kBAERD,sBAAQ,KAACb;YAAKa,MAAMA;YAAMF,WAAWV,GAAG,YAAYQ,eAAe,CAACG,QAAQ;YAAGI,MAAM;;;AAG5F"}

package/dist/components/badge/index.d.ts

@@ -0,0 +1,5 @@
+export { Badge, type BadgeProps, type BadgeVariant, badgeVariants } from './badge';
+export { IconBadge, type IconBadgeProps, type IconBadgeVariant } from './icon-badge';
+export { StatusBadge, type StatusBadgeProps } from './status-badge';
+export { UserBadge, type UserBadgeProps } from './user-badge';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/badge/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/badge/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,EAAE,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AACjF,OAAO,EAAC,SAAS,EAAE,KAAK,cAAc,EAAE,KAAK,gBAAgB,EAAC,MAAM,cAAc,CAAC;AACnF,OAAO,EAAC,WAAW,EAAE,KAAK,gBAAgB,EAAC,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAC,SAAS,EAAE,KAAK,cAAc,EAAC,MAAM,cAAc,CAAC"}

package/dist/components/badge/index.js

@@ -0,0 +1,6 @@
+export { Badge, badgeVariants } from './badge.js';
+export { IconBadge } from './icon-badge.js';
+export { StatusBadge } from './status-badge.js';
+export { UserBadge } from './user-badge.js';
+
+//# sourceMappingURL=index.js.map

package/dist/components/badge/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/badge/index.ts"],"sourcesContent":["export {Badge, type BadgeProps, type BadgeVariant, badgeVariants} from './badge';\nexport {IconBadge, type IconBadgeProps, type IconBadgeVariant} from './icon-badge';\nexport {StatusBadge, type StatusBadgeProps} from './status-badge';\nexport {UserBadge, type UserBadgeProps} from './user-badge';\n"],"names":["Badge","badgeVariants","IconBadge","StatusBadge","UserBadge"],"mappings":"AAAA,SAAQA,KAAK,EAAsCC,aAAa,QAAO,UAAU;AACjF,SAAQC,SAAS,QAAmD,eAAe;AACnF,SAAQC,WAAW,QAA8B,iBAAiB;AAClE,SAAQC,SAAS,QAA4B,eAAe"}

package/dist/components/badge/status-badge.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentProps } from 'react';
+export type StatusBadgeProps = ComponentProps<'span'> & {
+    variant?: StatusVariant;
+    dotClassName?: string;
+};
+type StatusVariant = 'neutral' | 'info' | 'feature' | 'success' | 'warning' | 'error';
+export declare function StatusBadge({ className, variant, children, dotClassName, ...props }: StatusBadgeProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=status-badge.d.ts.map

package/dist/components/badge/status-badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/status-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AAI1C,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,MAAM,CAAC,GAAG;IACtD,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,KAAK,aAAa,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAWtF,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,OAAmB,EACnB,QAAQ,EACR,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,gBAAgB,2CAgBlB"}

package/dist/components/badge/status-badge.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../../utils/cn.js';
+import { badgeVariants } from './badge.js';
+const dotVariantStyles = {
+    neutral: 'bg-tag-neutral-icon',
+    info: 'bg-tag-blue-icon',
+    feature: 'bg-tag-purple-icon',
+    success: 'bg-tag-success-icon',
+    warning: 'bg-tag-warning-icon',
+    error: 'bg-tag-error-icon'
+};
+export function StatusBadge({ className, variant = 'neutral', children, dotClassName, ...props }) {
+    return /*#__PURE__*/ _jsxs("span", {
+        className: cn(badgeVariants({
+            variant,
+            size: '2xs',
+            radius: 'default'
+        }), 'gap-6', className),
+        ...props,
+        children: [
+            /*#__PURE__*/ _jsx("span", {
+                className: cn('size-8.5 rounded-2 shrink-0', dotVariantStyles[variant], dotClassName)
+            }),
+            children
+        ]
+    });
+}
+
+//# sourceMappingURL=status-badge.js.map

package/dist/components/badge/status-badge.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/badge/status-badge.tsx"],"sourcesContent":["import type {ComponentProps} from 'react';\nimport {cn} from 'utils/cn';\nimport {badgeVariants} from './badge';\n\nexport type StatusBadgeProps = ComponentProps<'span'> & {\n  variant?: StatusVariant;\n  dotClassName?: string;\n};\n\ntype StatusVariant = 'neutral' | 'info' | 'feature' | 'success' | 'warning' | 'error';\n\nconst dotVariantStyles: Record<StatusVariant, string> = {\n  neutral: 'bg-tag-neutral-icon',\n  info: 'bg-tag-blue-icon',\n  feature: 'bg-tag-purple-icon',\n  success: 'bg-tag-success-icon',\n  warning: 'bg-tag-warning-icon',\n  error: 'bg-tag-error-icon',\n};\n\nexport function StatusBadge({\n  className,\n  variant = 'neutral',\n  children,\n  dotClassName,\n  ...props\n}: StatusBadgeProps) {\n  return (\n    <span\n      className={cn(badgeVariants({variant, size: '2xs', radius: 'default'}), 'gap-6', className)}\n      {...props}\n    >\n      <span\n        className={cn(\n          'size-8.5 rounded-2 shrink-0',\n          dotVariantStyles[variant as StatusVariant],\n          dotClassName,\n        )}\n      />\n      {children}\n    </span>\n  );\n}\n"],"names":["cn","badgeVariants","dotVariantStyles","neutral","info","feature","success","warning","error","StatusBadge","className","variant","children","dotClassName","props","span","size","radius"],"mappings":";AACA,SAAQA,EAAE,QAAO,WAAW;AAC5B,SAAQC,aAAa,QAAO,UAAU;AAStC,MAAMC,mBAAkD;IACtDC,SAAS;IACTC,MAAM;IACNC,SAAS;IACTC,SAAS;IACTC,SAAS;IACTC,OAAO;AACT;AAEA,OAAO,SAASC,YAAY,EAC1BC,SAAS,EACTC,UAAU,SAAS,EACnBC,QAAQ,EACRC,YAAY,EACZ,GAAGC,OACc;IACjB,qBACE,MAACC;QACCL,WAAWV,GAAGC,cAAc;YAACU;YAASK,MAAM;YAAOC,QAAQ;QAAS,IAAI,SAASP;QAChF,GAAGI,KAAK;;0BAET,KAACC;gBACCL,WAAWV,GACT,+BACAE,gBAAgB,CAACS,QAAyB,EAC1CE;;YAGHD;;;AAGP"}

package/dist/components/badge/user-badge.d.ts

@@ -0,0 +1,8 @@
+import type { ComponentProps } from 'react';
+export type UserBadgeProps = ComponentProps<'button'> & {
+    name: string;
+    avatarSrc?: string;
+    avatarFallback?: string;
+};
+export declare function UserBadge({ className, name, avatarSrc, avatarFallback, ...props }: UserBadgeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=user-badge.d.ts.map

package/dist/components/badge/user-badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/user-badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AAG1C,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACtD,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,wBAAgB,SAAS,CAAC,EAAC,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,cAAc,EAAE,GAAG,KAAK,EAAC,EAAE,cAAc,2CAuB/F"}

package/dist/components/badge/user-badge.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Avatar } from '../../components/avatar/index.js';
+import { cn } from '../../utils/cn.js';
+export function UserBadge({ className, name, avatarSrc, avatarFallback, ...props }) {
+    return /*#__PURE__*/ _jsxs("button", {
+        type: "button",
+        className: cn('inline-flex items-center gap-6 rounded-full px-6 py-2 text-xs font-medium leading-20', 'bg-background-components-base hover:bg-background-components-hover active:bg-background-components-pressed', 'text-foreground-neutral-base transition-colors', 'border border-border-neutral-base-component', 'h-28', className),
+        ...props,
+        children: [
+            /*#__PURE__*/ _jsx(Avatar, {
+                className: "size-16 shrink-0",
+                content: "image",
+                src: avatarSrc,
+                fallback: avatarFallback
+            }),
+            /*#__PURE__*/ _jsx("span", {
+                className: "whitespace-nowrap",
+                children: name
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=user-badge.js.map

package/dist/components/badge/user-badge.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/badge/user-badge.tsx"],"sourcesContent":["import {Avatar} from 'components/avatar';\nimport type {ComponentProps} from 'react';\nimport {cn} from 'utils/cn';\n\nexport type UserBadgeProps = ComponentProps<'button'> & {\n  name: string;\n  avatarSrc?: string;\n  avatarFallback?: string;\n};\n\nexport function UserBadge({className, name, avatarSrc, avatarFallback, ...props}: UserBadgeProps) {\n  return (\n    <button\n      type=\"button\"\n      className={cn(\n        'inline-flex items-center gap-6 rounded-full px-6 py-2 text-xs font-medium leading-20',\n        'bg-background-components-base hover:bg-background-components-hover active:bg-background-components-pressed',\n        'text-foreground-neutral-base transition-colors',\n        'border border-border-neutral-base-component',\n        'h-28',\n        className,\n      )}\n      {...props}\n    >\n      <Avatar\n        className=\"size-16 shrink-0\"\n        content=\"image\"\n        src={avatarSrc}\n        fallback={avatarFallback}\n      />\n      <span className=\"whitespace-nowrap\">{name}</span>\n    </button>\n  );\n}\n"],"names":["Avatar","cn","UserBadge","className","name","avatarSrc","avatarFallback","props","button","type","content","src","fallback","span"],"mappings":";AAAA,SAAQA,MAAM,QAAO,oBAAoB;AAEzC,SAAQC,EAAE,QAAO,WAAW;AAQ5B,OAAO,SAASC,UAAU,EAACC,SAAS,EAAEC,IAAI,EAAEC,SAAS,EAAEC,cAAc,EAAE,GAAGC,OAAsB;IAC9F,qBACE,MAACC;QACCC,MAAK;QACLN,WAAWF,GACT,wFACA,8GACA,kDACA,+CACA,QACAE;QAED,GAAGI,KAAK;;0BAET,KAACP;gBACCG,WAAU;gBACVO,SAAQ;gBACRC,KAAKN;gBACLO,UAAUN;;0BAEZ,KAACO;gBAAKV,WAAU;0BAAqBC;;;;AAG3C"}

package/dist/components/button/button-link.d.ts

@@ -0,0 +1,14 @@
+import { type VariantProps } from 'class-variance-authority';
+import { type IconName } from '../../components/icon';
+import type { ComponentProps } from 'react';
+export declare const buttonLinkVariants: (props?: ({
+    variant?: "base" | "muted" | "interactive" | "subtle" | null | undefined;
+    size?: "xs" | "sm" | "md" | "xl" | null | undefined;
+    underline?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare function ButtonLink({ className, variant, size, underline, asChild, children, iconLeft, iconRight, ...props }: ComponentProps<'a'> & VariantProps<typeof buttonLinkVariants> & {
+    asChild?: boolean;
+    iconLeft?: IconName;
+    iconRight?: IconName;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=button-link.d.ts.map

package/dist/components/button/button-link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-link.d.ts","sourceRoot":"","sources":["../../../src/components/button/button-link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAM,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAO,KAAK,QAAQ,EAAC,MAAM,iBAAiB,CAAC;AACpD,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AAG1C,eAAO,MAAM,kBAAkB;;;;8EA8B9B,CAAC;AASF,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,OAAO,EACP,IAAW,EACX,SAAS,EACT,OAAe,EACf,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,GAAG,CAAC,GACpB,YAAY,CAAC,OAAO,kBAAkB,CAAC,GAAG;IACxC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,SAAS,CAAC,EAAE,QAAQ,CAAC;CACtB,2CAeF"}

package/dist/components/button/button-link.js

@@ -0,0 +1,63 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Slot } from '@radix-ui/react-slot';
+import { cva } from 'class-variance-authority';
+import { Icon } from '../../components/icon/index.js';
+import { cn } from '../../utils/cn.js';
+export const buttonLinkVariants = cva('inline-flex items-center justify-center gap-4 whitespace-nowrap transition-colors disabled:pointer-events-none outline-none font-medium', {
+    variants: {
+        variant: {
+            base: 'text-foreground-neutral-base hover:text-foreground-neutral-base focus-visible:text-foreground-neutral-base disabled:text-foreground-neutral-disabled',
+            interactive: 'text-foreground-highlight-interactive hover:text-foreground-highlight-interactive-hover focus-visible:text-foreground-highlight-interactive disabled:text-foreground-neutral-disabled',
+            muted: 'text-foreground-neutral-muted hover:text-foreground-neutral-base focus-visible:text-foreground-neutral-base disabled:text-foreground-neutral-disabled',
+            subtle: 'text-foreground-neutral-subtle hover:text-foreground-neutral-base focus-visible:text-foreground-neutral-base disabled:text-foreground-neutral-disabled'
+        },
+        size: {
+            xs: 'text-xs',
+            sm: 'text-sm',
+            md: 'text-md',
+            xl: 'text-xl'
+        },
+        underline: {
+            true: 'underline decoration-solid [text-underline-position:from-font]',
+            false: ''
+        }
+    },
+    defaultVariants: {
+        variant: 'base',
+        size: 'sm',
+        underline: false
+    }
+});
+const iconSizeMap = {
+    xs: 14,
+    sm: 14,
+    md: 16,
+    xl: 20
+};
+export function ButtonLink({ className, variant, size = 'sm', underline, asChild = false, children, iconLeft, iconRight, ...props }) {
+    const Comp = asChild ? Slot : 'a';
+    const iconSize = iconSizeMap[size];
+    return /*#__PURE__*/ _jsxs(Comp, {
+        "data-slot": "button-link",
+        className: cn(buttonLinkVariants({
+            variant,
+            size,
+            underline,
+            className
+        })),
+        ...props,
+        children: [
+            iconLeft && /*#__PURE__*/ _jsx(Icon, {
+                name: iconLeft,
+                size: iconSize
+            }),
+            children,
+            iconRight && /*#__PURE__*/ _jsx(Icon, {
+                name: iconRight,
+                size: iconSize
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=button-link.js.map

package/dist/components/button/button-link.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/button/button-link.tsx"],"sourcesContent":["import {Slot} from '@radix-ui/react-slot';\nimport {cva, type VariantProps} from 'class-variance-authority';\nimport {Icon, type IconName} from 'components/icon';\nimport type {ComponentProps} from 'react';\nimport {cn} from 'utils/cn';\n\nexport const buttonLinkVariants = cva(\n  'inline-flex items-center justify-center gap-4 whitespace-nowrap transition-colors disabled:pointer-events-none outline-none font-medium',\n  {\n    variants: {\n      variant: {\n        base: 'text-foreground-neutral-base hover:text-foreground-neutral-base focus-visible:text-foreground-neutral-base disabled:text-foreground-neutral-disabled',\n        interactive:\n          'text-foreground-highlight-interactive hover:text-foreground-highlight-interactive-hover focus-visible:text-foreground-highlight-interactive disabled:text-foreground-neutral-disabled',\n        muted:\n          'text-foreground-neutral-muted hover:text-foreground-neutral-base focus-visible:text-foreground-neutral-base disabled:text-foreground-neutral-disabled',\n        subtle:\n          'text-foreground-neutral-subtle hover:text-foreground-neutral-base focus-visible:text-foreground-neutral-base disabled:text-foreground-neutral-disabled',\n      },\n      size: {\n        xs: 'text-xs',\n        sm: 'text-sm',\n        md: 'text-md',\n        xl: 'text-xl',\n      },\n      underline: {\n        true: 'underline decoration-solid [text-underline-position:from-font]',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'base',\n      size: 'sm',\n      underline: false,\n    },\n  },\n);\n\nconst iconSizeMap = {\n  xs: 14,\n  sm: 14,\n  md: 16,\n  xl: 20,\n} as const;\n\nexport function ButtonLink({\n  className,\n  variant,\n  size = 'sm',\n  underline,\n  asChild = false,\n  children,\n  iconLeft,\n  iconRight,\n  ...props\n}: ComponentProps<'a'> &\n  VariantProps<typeof buttonLinkVariants> & {\n    asChild?: boolean;\n    iconLeft?: IconName;\n    iconRight?: IconName;\n  }) {\n  const Comp = asChild ? Slot : 'a';\n  const iconSize = iconSizeMap[size as keyof typeof iconSizeMap];\n\n  return (\n    <Comp\n      data-slot=\"button-link\"\n      className={cn(buttonLinkVariants({variant, size, underline, className}))}\n      {...props}\n    >\n      {iconLeft && <Icon name={iconLeft} size={iconSize} />}\n      {children}\n      {iconRight && <Icon name={iconRight} size={iconSize} />}\n    </Comp>\n  );\n}\n"],"names":["Slot","cva","Icon","cn","buttonLinkVariants","variants","variant","base","interactive","muted","subtle","size","xs","sm","md","xl","underline","true","false","defaultVariants","iconSizeMap","ButtonLink","className","asChild","children","iconLeft","iconRight","props","Comp","iconSize","data-slot","name"],"mappings":";AAAA,SAAQA,IAAI,QAAO,uBAAuB;AAC1C,SAAQC,GAAG,QAA0B,2BAA2B;AAChE,SAAQC,IAAI,QAAsB,kBAAkB;AAEpD,SAAQC,EAAE,QAAO,WAAW;AAE5B,OAAO,MAAMC,qBAAqBH,IAChC,2IACA;IACEI,UAAU;QACRC,SAAS;YACPC,MAAM;YACNC,aACE;YACFC,OACE;YACFC,QACE;QACJ;QACAC,MAAM;YACJC,IAAI;YACJC,IAAI;YACJC,IAAI;YACJC,IAAI;QACN;QACAC,WAAW;YACTC,MAAM;YACNC,OAAO;QACT;IACF;IACAC,iBAAiB;QACfb,SAAS;QACTK,MAAM;QACNK,WAAW;IACb;AACF,GACA;AAEF,MAAMI,cAAc;IAClBR,IAAI;IACJC,IAAI;IACJC,IAAI;IACJC,IAAI;AACN;AAEA,OAAO,SAASM,WAAW,EACzBC,SAAS,EACThB,OAAO,EACPK,OAAO,IAAI,EACXK,SAAS,EACTO,UAAU,KAAK,EACfC,QAAQ,EACRC,QAAQ,EACRC,SAAS,EACT,GAAGC,OAMF;IACD,MAAMC,OAAOL,UAAUvB,OAAO;IAC9B,MAAM6B,WAAWT,WAAW,CAACT,KAAiC;IAE9D,qBACE,MAACiB;QACCE,aAAU;QACVR,WAAWnB,GAAGC,mBAAmB;YAACE;YAASK;YAAMK;YAAWM;QAAS;QACpE,GAAGK,KAAK;;YAERF,0BAAY,KAACvB;gBAAK6B,MAAMN;gBAAUd,MAAMkB;;YACxCL;YACAE,2BAAa,KAACxB;gBAAK6B,MAAML;gBAAWf,MAAMkB;;;;AAGjD"}

package/dist/components/button/button-link.stories.js

@@ -0,0 +1,127 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ButtonLink } from './button-link.js';
+const meta = {
+    title: 'Components/Button/ButtonLink',
+    component: ButtonLink,
+    tags: [
+        'autodocs'
+    ],
+    argTypes: {
+        variant: {
+            control: 'select',
+            options: [
+                'base',
+                'interactive',
+                'muted',
+                'subtle'
+            ]
+        },
+        size: {
+            control: 'select',
+            options: [
+                'xs',
+                'sm',
+                'md',
+                'xl'
+            ]
+        },
+        underline: {
+            control: 'boolean'
+        },
+        asChild: {
+            control: 'boolean'
+        }
+    },
+    args: {
+        children: 'Label',
+        variant: 'base',
+        size: 'sm',
+        underline: false,
+        href: '#'
+    }
+};
+export default meta;
+export const Default = {};
+export const Variants = {
+    render: (args)=>/*#__PURE__*/ _jsxs("div", {
+            className: "flex gap-16 items-center",
+            children: [
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    variant: "base",
+                    children: "Base"
+                }),
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    variant: "interactive",
+                    children: "Interactive"
+                }),
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    variant: "muted",
+                    children: "Muted"
+                }),
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    variant: "subtle",
+                    children: "Subtle"
+                })
+            ]
+        })
+};
+export const WithUnderline = {
+    render: (args)=>/*#__PURE__*/ _jsxs("div", {
+            className: "flex gap-16 items-center",
+            children: [
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    variant: "base",
+                    underline: true,
+                    children: "Base"
+                }),
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    variant: "interactive",
+                    underline: true,
+                    children: "Interactive"
+                }),
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    variant: "muted",
+                    underline: true,
+                    children: "Muted"
+                }),
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    variant: "subtle",
+                    underline: true,
+                    children: "Subtle"
+                })
+            ]
+        })
+};
+export const WithIcons = {
+    render: (args)=>/*#__PURE__*/ _jsxs("div", {
+            className: "flex gap-16 items-center",
+            children: [
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    iconLeft: "addLine",
+                    children: "Icon Left"
+                }),
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    iconRight: "chevronRight",
+                    children: "Icon Right"
+                }),
+                /*#__PURE__*/ _jsx(ButtonLink, {
+                    ...args,
+                    iconLeft: "addLine",
+                    iconRight: "chevronRight",
+                    children: "Both Icons"
+                })
+            ]
+        })
+};
+
+//# sourceMappingURL=button-link.stories.js.map

package/dist/components/button/button-link.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/button/button-link.stories.tsx"],"sourcesContent":["import type {Meta, StoryObj} from '@storybook/react';\nimport {ButtonLink} from './button-link';\n\nconst meta = {\n  title: 'Components/Button/ButtonLink',\n  component: ButtonLink,\n  tags: ['autodocs'],\n  argTypes: {\n    variant: {\n      control: 'select',\n      options: ['base', 'interactive', 'muted', 'subtle'],\n    },\n    size: {\n      control: 'select',\n      options: ['xs', 'sm', 'md', 'xl'],\n    },\n    underline: {control: 'boolean'},\n    asChild: {control: 'boolean'},\n  },\n  args: {\n    children: 'Label',\n    variant: 'base',\n    size: 'sm',\n    underline: false,\n    href: '#',\n  },\n} satisfies Meta<typeof ButtonLink>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {};\n\nexport const Variants: Story = {\n  render: (args) => (\n    <div className=\"flex gap-16 items-center\">\n      <ButtonLink {...args} variant=\"base\">\n        Base\n      </ButtonLink>\n      <ButtonLink {...args} variant=\"interactive\">\n        Interactive\n      </ButtonLink>\n      <ButtonLink {...args} variant=\"muted\">\n        Muted\n      </ButtonLink>\n      <ButtonLink {...args} variant=\"subtle\">\n        Subtle\n      </ButtonLink>\n    </div>\n  ),\n};\n\nexport const WithUnderline: Story = {\n  render: (args) => (\n    <div className=\"flex gap-16 items-center\">\n      <ButtonLink {...args} variant=\"base\" underline>\n        Base\n      </ButtonLink>\n      <ButtonLink {...args} variant=\"interactive\" underline>\n        Interactive\n      </ButtonLink>\n      <ButtonLink {...args} variant=\"muted\" underline>\n        Muted\n      </ButtonLink>\n      <ButtonLink {...args} variant=\"subtle\" underline>\n        Subtle\n      </ButtonLink>\n    </div>\n  ),\n};\n\nexport const WithIcons: Story = {\n  render: (args) => (\n    <div className=\"flex gap-16 items-center\">\n      <ButtonLink {...args} iconLeft=\"addLine\">\n        Icon Left\n      </ButtonLink>\n      <ButtonLink {...args} iconRight=\"chevronRight\">\n        Icon Right\n      </ButtonLink>\n      <ButtonLink {...args} iconLeft=\"addLine\" iconRight=\"chevronRight\">\n        Both Icons\n      </ButtonLink>\n    </div>\n  ),\n};\n"],"names":["ButtonLink","meta","title","component","tags","argTypes","variant","control","options","size","underline","asChild","args","children","href","Default","Variants","render","div","className","WithUnderline","WithIcons","iconLeft","iconRight"],"mappings":";AACA,SAAQA,UAAU,QAAO,gBAAgB;AAEzC,MAAMC,OAAO;IACXC,OAAO;IACPC,WAAWH;IACXI,MAAM;QAAC;KAAW;IAClBC,UAAU;QACRC,SAAS;YACPC,SAAS;YACTC,SAAS;gBAAC;gBAAQ;gBAAe;gBAAS;aAAS;QACrD;QACAC,MAAM;YACJF,SAAS;YACTC,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;aAAK;QACnC;QACAE,WAAW;YAACH,SAAS;QAAS;QAC9BI,SAAS;YAACJ,SAAS;QAAS;IAC9B;IACAK,MAAM;QACJC,UAAU;QACVP,SAAS;QACTG,MAAM;QACNC,WAAW;QACXI,MAAM;IACR;AACF;AAEA,eAAeb,KAAK;AAGpB,OAAO,MAAMc,UAAiB,CAAC,EAAE;AAEjC,OAAO,MAAMC,WAAkB;IAC7BC,QAAQ,CAACL,qBACP,MAACM;YAAIC,WAAU;;8BACb,KAACnB;oBAAY,GAAGY,IAAI;oBAAEN,SAAQ;8BAAO;;8BAGrC,KAACN;oBAAY,GAAGY,IAAI;oBAAEN,SAAQ;8BAAc;;8BAG5C,KAACN;oBAAY,GAAGY,IAAI;oBAAEN,SAAQ;8BAAQ;;8BAGtC,KAACN;oBAAY,GAAGY,IAAI;oBAAEN,SAAQ;8BAAS;;;;AAK7C,EAAE;AAEF,OAAO,MAAMc,gBAAuB;IAClCH,QAAQ,CAACL,qBACP,MAACM;YAAIC,WAAU;;8BACb,KAACnB;oBAAY,GAAGY,IAAI;oBAAEN,SAAQ;oBAAOI,SAAS;8BAAC;;8BAG/C,KAACV;oBAAY,GAAGY,IAAI;oBAAEN,SAAQ;oBAAcI,SAAS;8BAAC;;8BAGtD,KAACV;oBAAY,GAAGY,IAAI;oBAAEN,SAAQ;oBAAQI,SAAS;8BAAC;;8BAGhD,KAACV;oBAAY,GAAGY,IAAI;oBAAEN,SAAQ;oBAASI,SAAS;8BAAC;;;;AAKvD,EAAE;AAEF,OAAO,MAAMW,YAAmB;IAC9BJ,QAAQ,CAACL,qBACP,MAACM;YAAIC,WAAU;;8BACb,KAACnB;oBAAY,GAAGY,IAAI;oBAAEU,UAAS;8BAAU;;8BAGzC,KAACtB;oBAAY,GAAGY,IAAI;oBAAEW,WAAU;8BAAe;;8BAG/C,KAACvB;oBAAY,GAAGY,IAAI;oBAAEU,UAAS;oBAAUC,WAAU;8BAAe;;;;AAKxE,EAAE"}

package/dist/components/{button.d.ts → button/button.d.ts}

@@ -1,8 +1,8 @@
 import { type VariantProps } from 'class-variance-authority';
+import { type IconName } from '../../components/icon';
 import type { ComponentProps } from 'react';
-import { type IconName } from './icon/icon';
 export declare const buttonVariants: (props?: ({
-    variant?: "transparent" | "primary" | "secondary" | "danger" | "transparentMuted" | null | undefined;
+    variant?: "transparent" | "success" | "primary" | "secondary" | "danger" | "transparentMuted" | null | undefined;
     size?: "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export declare function Button({ className, variant, size, asChild, children, iconLeft, iconRight, ...props }: ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {

package/dist/components/button/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button/button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAM,KAAK,YAAY,EAAC,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAO,KAAK,QAAQ,EAAC,MAAM,iBAAiB,CAAC;AACpD,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAC;AAG1C,eAAO,MAAM,cAAc;;;8EAgC1B,CAAC;AAEF,wBAAgB,MAAM,CAAC,EACrB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAe,EACf,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,QAAQ,CAAC,GACzB,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,SAAS,CAAC,EAAE,QAAQ,CAAC;CACtB,2CAUF"}

package/dist/components/{button.js → button/button.js}

@@ -1,24 +1,25 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
-import { cn } from '../utils/cn.js';
-import { Icon } from './icon/icon.js';
+import { Icon } from '../../components/icon/index.js';
+import { cn } from '../../utils/cn.js';
 export const buttonVariants = cva('rounded-6 inline-flex items-center justify-center whitespace-nowrap transition-colors disabled:pointer-events-none shrink-0 outline-none', {
     variants: {
         variant: {
             primary: 'bg-background-button-inverted-default text-foreground-contrast-primary shadow-button-inverted hover:bg-background-button-inverted-hover active:bg-background-button-inverted-pressed focus-visible:shadow-button-inverted-focus disabled:bg-background-neutral-disabled disabled:text-foreground-neutral-disabled disabled:shadow-none',
             secondary: 'bg-background-button-neutral-default text-foreground-neutral-base shadow-button-neutral hover:bg-background-button-neutral-hover active:bg-background-button-neutral-pressed disabled:bg-background-neutral-disabled focus-visible:shadow-button-neutral-focus disabled:text-foreground-neutral-disabled disabled:shadow-none',
             danger: 'bg-background-button-danger-default text-foreground-neutral-on-color shadow-button-danger hover:bg-background-button-danger-hover active:bg-background-button-danger-pressed focus-visible:shadow-button-danger-focus disabled:bg-background-neutral-disabled disabled:text-foreground-neutral-disabled disabled:shadow-none',
+            success: 'bg-background-button-success-default text-foreground-neutral-on-color shadow-button-success hover:bg-background-button-success-hover active:bg-background-button-success-pressed focus-visible:shadow-button-success-focus disabled:bg-background-neutral-disabled disabled:text-foreground-neutral-disabled disabled:shadow-none',
             transparent: 'bg-background-button-transparent-default text-foreground-neutral-base hover:bg-background-button-transparent-hover active:bg-background-button-transparent-pressed focus-visible:shadow-button-neutral-focus disabled:text-foreground-neutral-disabled',
             transparentMuted: 'bg-background-button-transparent-default text-foreground-neutral-muted hover:bg-background-button-transparent-hover active:bg-background-button-transparent-pressed focus-visible:shadow-button-neutral-focus disabled:text-foreground-neutral-disabled'
         },
         size: {
-            '2xs': 'px-6 text-xs gap-4',
-            xs: 'px-6 py-2 text-xs gap-4',
-            sm: 'px-8 py-4 text-sm gap-6',
-            md: 'px-10 py-6 text-md gap-8',
-            lg: 'px-12 py-8 text-lg gap-8',
-            xl: 'px-12 py-10 text-xl gap-10'
+            '2xs': 'h-20 px-6 text-xs gap-4',
+            xs: 'h-24 px-6 text-xs gap-4',
+            sm: 'h-28 px-8 text-sm gap-6',
+            md: 'h-32 px-10 text-md gap-8',
+            lg: 'h-36 px-12 text-lg gap-8',
+            xl: 'h-40 px-12 text-xl gap-10'
         }
     },
     defaultVariants: {

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/button/button.tsx"],"sourcesContent":["import {Slot} from '@radix-ui/react-slot';\nimport {cva, type VariantProps} from 'class-variance-authority';\nimport {Icon, type IconName} from 'components/icon';\nimport type {ComponentProps} from 'react';\nimport {cn} from 'utils/cn';\n\nexport const buttonVariants = cva(\n  'rounded-6 inline-flex items-center justify-center whitespace-nowrap transition-colors disabled:pointer-events-none shrink-0 outline-none',\n  {\n    variants: {\n      variant: {\n        primary:\n          'bg-background-button-inverted-default text-foreground-contrast-primary shadow-button-inverted hover:bg-background-button-inverted-hover active:bg-background-button-inverted-pressed focus-visible:shadow-button-inverted-focus disabled:bg-background-neutral-disabled disabled:text-foreground-neutral-disabled disabled:shadow-none',\n        secondary:\n          'bg-background-button-neutral-default text-foreground-neutral-base shadow-button-neutral hover:bg-background-button-neutral-hover active:bg-background-button-neutral-pressed disabled:bg-background-neutral-disabled focus-visible:shadow-button-neutral-focus disabled:text-foreground-neutral-disabled disabled:shadow-none',\n        danger:\n          'bg-background-button-danger-default text-foreground-neutral-on-color shadow-button-danger hover:bg-background-button-danger-hover active:bg-background-button-danger-pressed focus-visible:shadow-button-danger-focus disabled:bg-background-neutral-disabled disabled:text-foreground-neutral-disabled disabled:shadow-none',\n        success:\n          'bg-background-button-success-default text-foreground-neutral-on-color shadow-button-success hover:bg-background-button-success-hover active:bg-background-button-success-pressed focus-visible:shadow-button-success-focus disabled:bg-background-neutral-disabled disabled:text-foreground-neutral-disabled disabled:shadow-none',\n        transparent:\n          'bg-background-button-transparent-default text-foreground-neutral-base hover:bg-background-button-transparent-hover active:bg-background-button-transparent-pressed focus-visible:shadow-button-neutral-focus disabled:text-foreground-neutral-disabled',\n        transparentMuted:\n          'bg-background-button-transparent-default text-foreground-neutral-muted hover:bg-background-button-transparent-hover active:bg-background-button-transparent-pressed focus-visible:shadow-button-neutral-focus disabled:text-foreground-neutral-disabled',\n      },\n      size: {\n        '2xs': 'h-20 px-6 text-xs gap-4',\n        xs: 'h-24 px-6 text-xs gap-4',\n        sm: 'h-28 px-8 text-sm gap-6',\n        md: 'h-32 px-10 text-md gap-8',\n        lg: 'h-36 px-12 text-lg gap-8',\n        xl: 'h-40 px-12 text-xl gap-10',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n      size: 'md',\n    },\n  },\n);\n\nexport function Button({\n  className,\n  variant,\n  size,\n  asChild = false,\n  children,\n  iconLeft,\n  iconRight,\n  ...props\n}: ComponentProps<'button'> &\n  VariantProps<typeof buttonVariants> & {\n    asChild?: boolean;\n    iconLeft?: IconName;\n    iconRight?: IconName;\n  }) {\n  const Comp = asChild ? Slot : 'button';\n\n  return (\n    <Comp data-slot=\"button\" className={cn(buttonVariants({variant, size, className}))} {...props}>\n      {iconLeft && <Icon name={iconLeft} />}\n      {children}\n      {iconRight && <Icon name={iconRight} />}\n    </Comp>\n  );\n}\n"],"names":["Slot","cva","Icon","cn","buttonVariants","variants","variant","primary","secondary","danger","success","transparent","transparentMuted","size","xs","sm","md","lg","xl","defaultVariants","Button","className","asChild","children","iconLeft","iconRight","props","Comp","data-slot","name"],"mappings":";AAAA,SAAQA,IAAI,QAAO,uBAAuB;AAC1C,SAAQC,GAAG,QAA0B,2BAA2B;AAChE,SAAQC,IAAI,QAAsB,kBAAkB;AAEpD,SAAQC,EAAE,QAAO,WAAW;AAE5B,OAAO,MAAMC,iBAAiBH,IAC5B,4IACA;IACEI,UAAU;QACRC,SAAS;YACPC,SACE;YACFC,WACE;YACFC,QACE;YACFC,SACE;YACFC,aACE;YACFC,kBACE;QACJ;QACAC,MAAM;YACJ,OAAO;YACPC,IAAI;YACJC,IAAI;YACJC,IAAI;YACJC,IAAI;YACJC,IAAI;QACN;IACF;IACAC,iBAAiB;QACfb,SAAS;QACTO,MAAM;IACR;AACF,GACA;AAEF,OAAO,SAASO,OAAO,EACrBC,SAAS,EACTf,OAAO,EACPO,IAAI,EACJS,UAAU,KAAK,EACfC,QAAQ,EACRC,QAAQ,EACRC,SAAS,EACT,GAAGC,OAMF;IACD,MAAMC,OAAOL,UAAUtB,OAAO;IAE9B,qBACE,MAAC2B;QAAKC,aAAU;QAASP,WAAWlB,GAAGC,eAAe;YAACE;YAASO;YAAMQ;QAAS;QAAM,GAAGK,KAAK;;YAC1FF,0BAAY,KAACtB;gBAAK2B,MAAML;;YACxBD;YACAE,2BAAa,KAACvB;gBAAK2B,MAAMJ;;;;AAGhC"}

package/dist/components/{button.stories.js → button/button.stories.js}

@@ -1,10 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Code } from '../components/typography/index.js';
+import { Code } from '../../components/typography/index.js';
 import { Button } from './button.js';
 const variantOptions = [
     'primary',
     'secondary',
     'danger',
+    'success',
     'transparent',
     'transparentMuted'
 ];
@@ -61,9 +62,6 @@ export const Variants = {
                                     /*#__PURE__*/ _jsx("th", {
                                         children: "Hover"
                                     }),
-                                    /*#__PURE__*/ _jsx("th", {
-                                        children: "Active"
-                                    }),
                                     /*#__PURE__*/ _jsx("th", {
                                         children: "Focus"
                                     }),
@@ -100,15 +98,6 @@ export const Variants = {
                                                 children: "Click me"
                                             })
                                         }),
-                                        /*#__PURE__*/ _jsx("td", {
-                                            children: /*#__PURE__*/ _jsx(Button, {
-                                                ...args,
-                                                variant: variant,
-                                                className: "active",
-                                                size: size,
-                                                children: "Click me"
-                                            })
-                                        }),
                                         /*#__PURE__*/ _jsx("td", {
                                             children: /*#__PURE__*/ _jsx(Button, {
                                                 ...args,
@@ -137,7 +126,6 @@ export const Variants = {
 Variants.parameters = {
     pseudo: {
         hover: '.hover',
-        active: '.active',
         focusVisible: '.focus'
     }
 };

package/dist/components/button/button.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/button/button.stories.tsx"],"sourcesContent":["import type {Meta, StoryObj} from '@storybook/react';\nimport {Code} from 'components/typography';\nimport {Button} from './button';\n\nconst variantOptions = [\n  'primary',\n  'secondary',\n  'danger',\n  'success',\n  'transparent',\n  'transparentMuted',\n] as const;\nconst sizeOptions = ['2xs', 'xs', 'sm', 'md', 'lg', 'xl'] as const;\n\nconst meta = {\n  title: 'Components/Button',\n  component: Button,\n  tags: ['autodocs'],\n  argTypes: {\n    variant: {\n      control: 'select',\n      options: variantOptions,\n    },\n    size: {\n      control: 'select',\n      options: sizeOptions,\n    },\n    asChild: {control: 'boolean'},\n  },\n  args: {\n    children: 'Click me',\n    variant: 'primary',\n    size: 'md',\n  },\n} satisfies Meta<typeof Button>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {};\n\nexport const Variants: Story = {\n  render: (args) => (\n    <div className=\"flex flex-col gap-32\">\n      {sizeOptions.map((size) => (\n        <table key={size} className=\"w-fit border-separate border-spacing-x-32 border-spacing-y-16\">\n          <thead>\n            <tr>\n              <th>{size}</th>\n              <th>Default</th>\n              <th>Hover</th>\n              <th>Focus</th>\n              <th>Disabled</th>\n            </tr>\n          </thead>\n          <tbody>\n            {variantOptions.map((variant) => (\n              <tr key={variant}>\n                <td>\n                  <Code variant=\"label\" className=\"text-foreground-neutral-subtle\">\n                    {variant}\n                  </Code>\n                </td>\n                <td>\n                  <Button {...args} variant={variant} size={size}>\n                    Click me\n                  </Button>\n                </td>\n                <td>\n                  <Button {...args} variant={variant} className=\"hover\" size={size}>\n                    Click me\n                  </Button>\n                </td>\n                <td>\n                  <Button {...args} variant={variant} className=\"focus\" size={size}>\n                    Click me\n                  </Button>\n                </td>\n                <td>\n                  <Button {...args} variant={variant} disabled size={size}>\n                    Click me\n                  </Button>\n                </td>\n              </tr>\n            ))}\n          </tbody>\n        </table>\n      ))}\n    </div>\n  ),\n};\n\nVariants.parameters = {\n  pseudo: {\n    hover: '.hover',\n    focusVisible: '.focus',\n  },\n};\n\nexport const Icons: Story = {\n  render: (args) => (\n    <div className=\"flex flex-col gap-16\">\n      <div>\n        <Button {...args} iconLeft=\"google\">\n          Click me\n        </Button>\n      </div>\n      <div>\n        <Button {...args} iconRight=\"microsoft\">\n          Click me\n        </Button>\n      </div>\n      <div>\n        <Button {...args} iconLeft=\"google\" iconRight=\"microsoft\">\n          Click me\n        </Button>\n      </div>\n    </div>\n  ),\n};\n"],"names":["Code","Button","variantOptions","sizeOptions","meta","title","component","tags","argTypes","variant","control","options","size","asChild","args","children","Default","Variants","render","div","className","map","table","thead","tr","th","tbody","td","disabled","parameters","pseudo","hover","focusVisible","Icons","iconLeft","iconRight"],"mappings":";AACA,SAAQA,IAAI,QAAO,wBAAwB;AAC3C,SAAQC,MAAM,QAAO,WAAW;AAEhC,MAAMC,iBAAiB;IACrB;IACA;IACA;IACA;IACA;IACA;CACD;AACD,MAAMC,cAAc;IAAC;IAAO;IAAM;IAAM;IAAM;IAAM;CAAK;AAEzD,MAAMC,OAAO;IACXC,OAAO;IACPC,WAAWL;IACXM,MAAM;QAAC;KAAW;IAClBC,UAAU;QACRC,SAAS;YACPC,SAAS;YACTC,SAAST;QACX;QACAU,MAAM;YACJF,SAAS;YACTC,SAASR;QACX;QACAU,SAAS;YAACH,SAAS;QAAS;IAC9B;IACAI,MAAM;QACJC,UAAU;QACVN,SAAS;QACTG,MAAM;IACR;AACF;AAEA,eAAeR,KAAK;AAGpB,OAAO,MAAMY,UAAiB,CAAC,EAAE;AAEjC,OAAO,MAAMC,WAAkB;IAC7BC,QAAQ,CAACJ,qBACP,KAACK;YAAIC,WAAU;sBACZjB,YAAYkB,GAAG,CAAC,CAACT,qBAChB,MAACU;oBAAiBF,WAAU;;sCAC1B,KAACG;sCACC,cAAA,MAACC;;kDACC,KAACC;kDAAIb;;kDACL,KAACa;kDAAG;;kDACJ,KAACA;kDAAG;;kDACJ,KAACA;kDAAG;;kDACJ,KAACA;kDAAG;;;;;sCAGR,KAACC;sCACExB,eAAemB,GAAG,CAAC,CAACZ,wBACnB,MAACe;;sDACC,KAACG;sDACC,cAAA,KAAC3B;gDAAKS,SAAQ;gDAAQW,WAAU;0DAC7BX;;;sDAGL,KAACkB;sDACC,cAAA,KAAC1B;gDAAQ,GAAGa,IAAI;gDAAEL,SAASA;gDAASG,MAAMA;0DAAM;;;sDAIlD,KAACe;sDACC,cAAA,KAAC1B;gDAAQ,GAAGa,IAAI;gDAAEL,SAASA;gDAASW,WAAU;gDAAQR,MAAMA;0DAAM;;;sDAIpE,KAACe;sDACC,cAAA,KAAC1B;gDAAQ,GAAGa,IAAI;gDAAEL,SAASA;gDAASW,WAAU;gDAAQR,MAAMA;0DAAM;;;sDAIpE,KAACe;sDACC,cAAA,KAAC1B;gDAAQ,GAAGa,IAAI;gDAAEL,SAASA;gDAASmB,QAAQ;gDAAChB,MAAMA;0DAAM;;;;mCAtBpDH;;;mBAZHG;;AA6CpB,EAAE;AAEFK,SAASY,UAAU,GAAG;IACpBC,QAAQ;QACNC,OAAO;QACPC,cAAc;IAChB;AACF;AAEA,OAAO,MAAMC,QAAe;IAC1Bf,QAAQ,CAACJ,qBACP,MAACK;YAAIC,WAAU;;8BACb,KAACD;8BACC,cAAA,KAAClB;wBAAQ,GAAGa,IAAI;wBAAEoB,UAAS;kCAAS;;;8BAItC,KAACf;8BACC,cAAA,KAAClB;wBAAQ,GAAGa,IAAI;wBAAEqB,WAAU;kCAAY;;;8BAI1C,KAAChB;8BACC,cAAA,KAAClB;wBAAQ,GAAGa,IAAI;wBAAEoB,UAAS;wBAASC,WAAU;kCAAY;;;;;AAMlE,EAAE"}