singularity-components 0.1.107 → 0.1.127

package/dist/components/primitives/button/button.js

@@ -0,0 +1,74 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { icons } from "lucide-react";
+import clsx from "clsx";
+import { cn } from "../../../utils";
+const buttonVariants = {
+  variant: {
+    default: "sg:bg-primary sg:text-primary-foreground sg:shadow-xs sg:hover:bg-primary/90",
+    destructive: "sg:bg-destructive sg:text-white sg:shadow-xs sg:hover:bg-destructive/90 sg:focus-visible:ring-destructive/20 sg:dark:focus-visible:ring-destructive/40 sg:dark:bg-destructive/60",
+    outline: "sg:border sg:border-border sg:shadow-xs sg:hover:bg-accent sg:hover:text-accent-foreground",
+    secondary: "sg:bg-secondary sg:text-secondary-foreground sg:shadow-xs sg:hover:bg-secondary/80",
+    ghost: "sg:hover:bg-accent sg:hover:text-accent-foreground sg:dark:hover:bg-accent/50",
+    link: "sg:text-primary sg:underline-offset-4 sg:hover:underline"
+  },
+  size: {
+    default: "sg:h-9 sg:px-4 sg:py-2 sg:has-[>svg]:px-3",
+    sm: "sg:h-8 sg:rounded-md sg:gap-1.5 sg:px-3 sg:has-[>svg]:px-2.5",
+    lg: "sg:h-10 sg:rounded-md sg:px-6 sg:has-[>svg]:px-4",
+    icon: "sg:size-9"
+  }
+};
+const buttonVariantsProps = cva(
+  "sg:inline-flex sg:items-center sg:justify-center sg:gap-2 sg:whitespace-nowrap sg:cursor-pointer sg:rounded-md sg:text-sm sg:font-medium sg:transition-all sg:disabled:pointer-events-none sg:disabled:opacity-50 sg:[&_svg]:pointer-events-none sg:[&_svg:not([class*=size-])]:size-4 sg:shrink-0 sg:[&_svg]:shrink-0 sg:outline-none sg:focus-visible:border-ring sg:focus-visible:ring-ring/50 sg:focus-visible:ring-[3px] sg:aria-invalid:ring-destructive/20 sg:dark:aria-invalid:ring-destructive/40 sg:aria-invalid:border-destructive",
+  {
+    variants: buttonVariants,
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button({
+  className,
+  variant,
+  size,
+  asChild = false,
+  iconStart,
+  iconStartAnimate,
+  iconEnd,
+  iconEndAnimate,
+  children,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "button";
+  const iconAnimateCss = "sg:animate-spin";
+  const LucideIconStart = iconStart && icons[iconStart];
+  const LucideIconEnd = iconEnd && icons[iconEnd];
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
+    Comp,
+    {
+      "data-slot": "button",
+      className: cn(buttonVariantsProps({ variant, size, className })),
+      ...props,
+      children: [
+        LucideIconStart && /* @__PURE__ */ jsx(
+          LucideIconStart,
+          {
+            className: clsx(iconStartAnimate && iconAnimateCss)
+          }
+        ),
+        children,
+        LucideIconEnd && /* @__PURE__ */ jsx(LucideIconEnd, { className: clsx(iconEndAnimate && iconAnimateCss) })
+      ]
+    }
+  ) });
+}
+export {
+  Button,
+  buttonVariants,
+  buttonVariantsProps
+};
+//# sourceMappingURL=button.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/primitives/button/button.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport { Slot } from \"@radix-ui/react-slot\";\r\nimport { cva, type VariantProps } from \"class-variance-authority\";\r\nimport { icons } from \"lucide-react\";\r\nimport clsx from \"clsx\";\r\nimport { cn } from \"../../../utils\";\r\n\r\nconst buttonVariants = {\r\n  variant: {\r\n    default:\r\n      \"sg:bg-primary sg:text-primary-foreground sg:shadow-xs sg:hover:bg-primary/90\",\r\n    destructive:\r\n      \"sg:bg-destructive sg:text-white sg:shadow-xs sg:hover:bg-destructive/90 sg:focus-visible:ring-destructive/20 sg:dark:focus-visible:ring-destructive/40 sg:dark:bg-destructive/60\",\r\n    outline:\r\n      \"sg:border sg:border-border sg:shadow-xs sg:hover:bg-accent sg:hover:text-accent-foreground\",\r\n    secondary:\r\n      \"sg:bg-secondary sg:text-secondary-foreground sg:shadow-xs sg:hover:bg-secondary/80\",\r\n    ghost:\r\n      \"sg:hover:bg-accent sg:hover:text-accent-foreground sg:dark:hover:bg-accent/50\",\r\n    link: \"sg:text-primary sg:underline-offset-4 sg:hover:underline\",\r\n  },\r\n  size: {\r\n    default: \"sg:h-9 sg:px-4 sg:py-2 sg:has-[>svg]:px-3\",\r\n    sm: \"sg:h-8 sg:rounded-md sg:gap-1.5 sg:px-3 sg:has-[>svg]:px-2.5\",\r\n    lg: \"sg:h-10 sg:rounded-md sg:px-6 sg:has-[>svg]:px-4\",\r\n    icon: \"sg:size-9\",\r\n  },\r\n};\r\n\r\nconst buttonVariantsProps = cva(\r\n  \"sg:inline-flex sg:items-center sg:justify-center sg:gap-2 sg:whitespace-nowrap sg:cursor-pointer sg:rounded-md sg:text-sm sg:font-medium sg:transition-all sg:disabled:pointer-events-none sg:disabled:opacity-50 sg:[&_svg]:pointer-events-none sg:[&_svg:not([class*=size-])]:size-4 sg:shrink-0 sg:[&_svg]:shrink-0 sg:outline-none sg:focus-visible:border-ring sg:focus-visible:ring-ring/50 sg:focus-visible:ring-[3px] sg:aria-invalid:ring-destructive/20 sg:dark:aria-invalid:ring-destructive/40 sg:aria-invalid:border-destructive\",\r\n  {\r\n    variants: buttonVariants,\r\n    defaultVariants: {\r\n      variant: \"default\",\r\n      size: \"default\",\r\n    },\r\n  }\r\n);\r\n\r\ntype Props = React.ComponentProps<\"button\"> &\r\n  VariantProps<typeof buttonVariantsProps> & {\r\n    asChild?: boolean;\r\n    iconStart?: keyof typeof icons;\r\n    iconStartAnimate?: boolean;\r\n    iconEnd?: keyof typeof icons;\r\n    iconEndAnimate?: boolean;\r\n  };\r\n\r\nfunction Button({\r\n  className,\r\n  variant,\r\n  size,\r\n  asChild = false,\r\n  iconStart,\r\n  iconStartAnimate,\r\n  iconEnd,\r\n  iconEndAnimate,\r\n  children,\r\n  ...props\r\n}: Props) {\r\n  const Comp = asChild ? Slot : \"button\";\r\n  const iconAnimateCss = \"sg:animate-spin\";\r\n\r\n  const LucideIconStart = iconStart && icons[iconStart];\r\n  const LucideIconEnd = iconEnd && icons[iconEnd];\r\n\r\n  return (\r\n    <>\r\n      <Comp\r\n        data-slot=\"button\"\r\n        className={cn(buttonVariantsProps({ variant, size, className }))}\r\n        {...props}\r\n      >\r\n        {LucideIconStart && (\r\n          <LucideIconStart\r\n            className={clsx(iconStartAnimate && iconAnimateCss)}\r\n          />\r\n        )}\r\n        {children}\r\n        {LucideIconEnd && (\r\n          <LucideIconEnd className={clsx(iconEndAnimate && iconAnimateCss)} />\r\n        )}\r\n      </Comp>\r\n    </>\r\n  );\r\n}\r\n\r\nexport { Button, buttonVariantsProps, buttonVariants };\r\n"],"mappings":"AAoEI,mBAOM,KANJ,YADF;AApEJ,YAAY,WAAW;AACvB,SAAS,YAAY;AACrB,SAAS,WAA8B;AACvC,SAAS,aAAa;AACtB,OAAO,UAAU;AACjB,SAAS,UAAU;AAEnB,MAAM,iBAAiB;AAAA,EACrB,SAAS;AAAA,IACP,SACE;AAAA,IACF,aACE;AAAA,IACF,SACE;AAAA,IACF,WACE;AAAA,IACF,OACE;AAAA,IACF,MAAM;AAAA,EACR;AAAA,EACA,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,MAAM;AAAA,EACR;AACF;AAEA,MAAM,sBAAsB;AAAA,EAC1B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,IACV,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AAAA,EACF;AACF;AAWA,SAAS,OAAO;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAU;AACR,QAAM,OAAO,UAAU,OAAO;AAC9B,QAAM,iBAAiB;AAEvB,QAAM,kBAAkB,aAAa,MAAM,SAAS;AACpD,QAAM,gBAAgB,WAAW,MAAM,OAAO;AAE9C,SACE,gCACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,oBAAoB,EAAE,SAAS,MAAM,UAAU,CAAC,CAAC;AAAA,MAC9D,GAAG;AAAA,MAEH;AAAA,2BACC;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,KAAK,oBAAoB,cAAc;AAAA;AAAA,QACpD;AAAA,QAED;AAAA,QACA,iBACC,oBAAC,iBAAc,WAAW,KAAK,kBAAkB,cAAc,GAAG;AAAA;AAAA;AAAA,EAEtE,GACF;AAEJ;","names":[]}

package/dist/components/primitives/button/button.stories.d.ts

@@ -0,0 +1,37 @@
+import { StoryObj } from '@storybook/react-vite';
+import { Button } from './button.js';
+import 'react/jsx-runtime';
+import 'class-variance-authority/types';
+import 'react';
+import 'class-variance-authority';
+import 'lucide-react';
+
+declare const meta: {
+    component: typeof Button;
+    title: string;
+    argTypes: {
+        variant: {
+            control: {
+                type: "select";
+            };
+            options: string[];
+        };
+        size: {
+            options: string[];
+        };
+    };
+};
+
+type Story = StoryObj<typeof meta>;
+declare const primary: Story;
+declare const secondary: Story;
+declare const destructive: Story;
+declare const outline: Story;
+declare const ghost: Story;
+declare const link: Story;
+declare const sm: Story;
+declare const lg: Story;
+declare const icon: Story;
+declare const icons: Story;
+
+export { meta as default, destructive, ghost, icon, icons, lg, link, outline, primary, secondary, sm };

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

@@ -0,0 +1,87 @@
+import { Button, buttonVariants } from "..";
+const meta = {
+  component: Button,
+  title: "Button",
+  argTypes: {
+    variant: {
+      control: { type: "select" },
+      options: Object.keys(buttonVariants.variant)
+    },
+    size: {
+      options: Object.keys(buttonVariants.size)
+    }
+  }
+};
+var button_stories_default = meta;
+const primary = {
+  args: {
+    children: "primary"
+  }
+};
+const secondary = {
+  args: {
+    children: "secondary",
+    variant: "secondary"
+  }
+};
+const destructive = {
+  args: {
+    children: "destructive",
+    variant: "destructive"
+  }
+};
+const outline = {
+  args: {
+    children: "outline",
+    variant: "outline"
+  }
+};
+const ghost = {
+  args: {
+    children: "ghost",
+    variant: "ghost"
+  }
+};
+const link = {
+  args: {
+    children: "link",
+    variant: "link"
+  }
+};
+const sm = {
+  args: {
+    children: "sm",
+    size: "sm"
+  }
+};
+const lg = {
+  args: {
+    children: "lg",
+    size: "lg"
+  }
+};
+const icon = {
+  args: { iconStart: "PcCase", size: "icon" }
+};
+const icons = {
+  args: {
+    children: "icons",
+    iconStart: "Loader",
+    iconStartAnimate: true,
+    iconEnd: "ShieldCheck"
+  }
+};
+export {
+  button_stories_default as default,
+  destructive,
+  ghost,
+  icon,
+  icons,
+  lg,
+  link,
+  outline,
+  primary,
+  secondary,
+  sm
+};
+//# sourceMappingURL=button.stories.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/primitives/button/button.stories.ts"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react-vite\";\nimport { Button, buttonVariants } from \"..\";\n\nconst meta = {\n  component: Button,\n  title: \"Button\",\n  argTypes: {\n    variant: {\n      control: { type: \"select\" },\n      options: Object.keys(buttonVariants.variant),\n    },\n    size: {\n      options: Object.keys(buttonVariants.size),\n    },\n  },\n} satisfies Meta<typeof Button>;\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const primary: Story = {\n  args: {\n    children: \"primary\",\n  },\n};\n\nexport const secondary: Story = {\n  args: {\n    children: \"secondary\",\n    variant: \"secondary\",\n  },\n};\n\nexport const destructive: Story = {\n  args: {\n    children: \"destructive\",\n    variant: \"destructive\",\n  },\n};\n\nexport const outline: Story = {\n  args: {\n    children: \"outline\",\n    variant: \"outline\",\n  },\n};\n\nexport const ghost: Story = {\n  args: {\n    children: \"ghost\",\n    variant: \"ghost\",\n  },\n};\n\nexport const link: Story = {\n  args: {\n    children: \"link\",\n    variant: \"link\",\n  },\n};\n\nexport const sm: Story = {\n  args: {\n    children: \"sm\",\n    size: \"sm\",\n  },\n};\n\nexport const lg: Story = {\n  args: {\n    children: \"lg\",\n    size: \"lg\",\n  },\n};\n\nexport const icon: Story = {\n  args: { iconStart: \"PcCase\", size: \"icon\" },\n};\n\nexport const icons: Story = {\n  args: {\n    children: \"icons\",\n    iconStart: \"Loader\",\n    iconStartAnimate: true,\n    iconEnd: \"ShieldCheck\",\n  },\n};\n"],"mappings":"AACA,SAAS,QAAQ,sBAAsB;AAEvC,MAAM,OAAO;AAAA,EACX,WAAW;AAAA,EACX,OAAO;AAAA,EACP,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS,EAAE,MAAM,SAAS;AAAA,MAC1B,SAAS,OAAO,KAAK,eAAe,OAAO;AAAA,IAC7C;AAAA,IACA,MAAM;AAAA,MACJ,SAAS,OAAO,KAAK,eAAe,IAAI;AAAA,IAC1C;AAAA,EACF;AACF;AACA,IAAO,yBAAQ;AAIR,MAAM,UAAiB;AAAA,EAC5B,MAAM;AAAA,IACJ,UAAU;AAAA,EACZ;AACF;AAEO,MAAM,YAAmB;AAAA,EAC9B,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,SAAS;AAAA,EACX;AACF;AAEO,MAAM,cAAqB;AAAA,EAChC,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,SAAS;AAAA,EACX;AACF;AAEO,MAAM,UAAiB;AAAA,EAC5B,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,SAAS;AAAA,EACX;AACF;AAEO,MAAM,QAAe;AAAA,EAC1B,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,SAAS;AAAA,EACX;AACF;AAEO,MAAM,OAAc;AAAA,EACzB,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,SAAS;AAAA,EACX;AACF;AAEO,MAAM,KAAY;AAAA,EACvB,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,EACR;AACF;AAEO,MAAM,KAAY;AAAA,EACvB,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,MAAM;AAAA,EACR;AACF;AAEO,MAAM,OAAc;AAAA,EACzB,MAAM,EAAE,WAAW,UAAU,MAAM,OAAO;AAC5C;AAEO,MAAM,QAAe;AAAA,EAC1B,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,WAAW;AAAA,IACX,kBAAkB;AAAA,IAClB,SAAS;AAAA,EACX;AACF;","names":[]}

package/dist/components/primitives/icon/icon.d.ts

@@ -0,0 +1,32 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { LucideIcon, icons } from 'lucide-react';
+
+declare const iconVariants: {
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    color: {
+        default: string;
+        black: string;
+        white: string;
+        gray: string;
+        primary: string;
+        secondary: string;
+    };
+};
+declare const iconVariantsProps: (props?: ({
+    size?: "sm" | "lg" | "md" | null | undefined;
+    color?: "default" | "secondary" | "black" | "white" | "gray" | "primary" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type Props = Omit<React.ComponentProps<LucideIcon>, "size"> & VariantProps<typeof iconVariantsProps> & {
+    icon: keyof typeof icons;
+    spin?: boolean;
+};
+declare function Icon({ className, size, color, icon, spin, ...props }: Props): react_jsx_runtime.JSX.Element;
+
+export { Icon, iconVariants, iconVariantsProps };

package/dist/components/primitives/icon/icon.js

@@ -0,0 +1,53 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { icons } from "lucide-react";
+import { cn } from "../../../utils";
+const iconVariants = {
+  size: {
+    sm: "",
+    md: "",
+    lg: ""
+  },
+  color: {
+    default: "",
+    black: "sg:text-black",
+    white: "sg:text-white",
+    gray: "sg:text-gray",
+    primary: "sg:text-primary",
+    secondary: "sg:text-secondary"
+  }
+};
+const iconVariantsProps = cva("", {
+  variants: iconVariants,
+  defaultVariants: {
+    size: "md",
+    color: "default"
+  }
+});
+function Icon({ className, size, color, icon, spin, ...props }) {
+  const LucideIcon = icons[icon];
+  let iconSize = 20;
+  if (size == "sm") {
+    iconSize = 16;
+  } else if (size == "lg") {
+    iconSize = 32;
+  }
+  return /* @__PURE__ */ jsx(
+    LucideIcon,
+    {
+      size: iconSize,
+      className: cn(
+        iconVariantsProps({ color, className }),
+        spin && "sg:animate-spin"
+      ),
+      ...props
+    }
+  );
+}
+export {
+  Icon,
+  iconVariants,
+  iconVariantsProps
+};
+//# sourceMappingURL=icon.js.map

package/dist/components/primitives/icon/icon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/primitives/icon/icon.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport { cva, type VariantProps } from \"class-variance-authority\";\r\nimport { icons, type LucideIcon } from \"lucide-react\";\r\nimport { cn } from \"../../../utils\";\r\n\r\nconst iconVariants = {\r\n  size: {\r\n    sm: \"\",\r\n    md: \"\",\r\n    lg: \"\",\r\n  },\r\n  color: {\r\n    default: \"\",\r\n    black: \"sg:text-black\",\r\n    white: \"sg:text-white\",\r\n    gray: \"sg:text-gray\",\r\n    primary: \"sg:text-primary\",\r\n    secondary: \"sg:text-secondary\",\r\n  },\r\n};\r\n\r\nconst iconVariantsProps = cva(\"\", {\r\n  variants: iconVariants,\r\n  defaultVariants: {\r\n    size: \"md\",\r\n    color: \"default\",\r\n  },\r\n});\r\n\r\ntype Props = Omit<React.ComponentProps<LucideIcon>, \"size\"> &\r\n  VariantProps<typeof iconVariantsProps> & {\r\n    icon: keyof typeof icons;\r\n    spin?: boolean;\r\n  };\r\n\r\nfunction Icon({ className, size, color, icon, spin, ...props }: Props) {\r\n  const LucideIcon = icons[icon];\r\n\r\n  let iconSize = 20;\r\n  if (size == \"sm\") {\r\n    iconSize = 16;\r\n  } else if (size == \"lg\") {\r\n    iconSize = 32;\r\n  }\r\n\r\n  return (\r\n    <LucideIcon\r\n      size={iconSize}\r\n      className={cn(\r\n        iconVariantsProps({ color, className }),\r\n        spin && \"sg:animate-spin\"\r\n      )}\r\n      {...props}\r\n    />\r\n  );\r\n}\r\n\r\nexport { Icon, iconVariantsProps, iconVariants };\r\n"],"mappings":"AA8CI;AA9CJ,YAAY,WAAW;AACvB,SAAS,WAA8B;AACvC,SAAS,aAA8B;AACvC,SAAS,UAAU;AAEnB,MAAM,eAAe;AAAA,EACnB,MAAM;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAAA,EACA,OAAO;AAAA,IACL,SAAS;AAAA,IACT,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,IACN,SAAS;AAAA,IACT,WAAW;AAAA,EACb;AACF;AAEA,MAAM,oBAAoB,IAAI,IAAI;AAAA,EAChC,UAAU;AAAA,EACV,iBAAiB;AAAA,IACf,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AACF,CAAC;AAQD,SAAS,KAAK,EAAE,WAAW,MAAM,OAAO,MAAM,MAAM,GAAG,MAAM,GAAU;AACrE,QAAM,aAAa,MAAM,IAAI;AAE7B,MAAI,WAAW;AACf,MAAI,QAAQ,MAAM;AAChB,eAAW;AAAA,EACb,WAAW,QAAQ,MAAM;AACvB,eAAW;AAAA,EACb;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,WAAW;AAAA,QACT,kBAAkB,EAAE,OAAO,UAAU,CAAC;AAAA,QACtC,QAAQ;AAAA,MACV;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/primitives/icon/icon.stories.d.ts

@@ -0,0 +1,24 @@
+import { StoryObj } from '@storybook/react-vite';
+import { Icon } from './icon.js';
+import 'react/jsx-runtime';
+import 'class-variance-authority/types';
+import 'react';
+import 'class-variance-authority';
+import 'lucide-react';
+
+declare const meta: {
+    component: typeof Icon;
+    title: string;
+    argTypes: {
+        size: {
+            options: string[];
+        };
+    };
+};
+
+type Story = StoryObj<typeof meta>;
+declare const small: Story;
+declare const medium: Story;
+declare const large_spinner: Story;
+
+export { meta as default, large_spinner, medium, small };

package/dist/components/primitives/icon/icon.stories.js

@@ -0,0 +1,27 @@
+import { Icon, iconVariants } from "..";
+const meta = {
+  component: Icon,
+  title: "Icon",
+  argTypes: {
+    size: {
+      options: Object.keys(iconVariants.size)
+    }
+  }
+};
+var icon_stories_default = meta;
+const small = {
+  args: { icon: "Loader", size: "sm" }
+};
+const medium = {
+  args: { icon: "Loader", size: "md" }
+};
+const large_spinner = {
+  args: { icon: "Loader", size: "lg", color: "primary", spin: true }
+};
+export {
+  icon_stories_default as default,
+  large_spinner,
+  medium,
+  small
+};
+//# sourceMappingURL=icon.stories.js.map

package/dist/components/primitives/icon/icon.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/primitives/icon/icon.stories.ts"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react-vite\";\nimport { Icon, iconVariants } from \"..\";\n\nconst meta = {\n  component: Icon,\n  title: \"Icon\",\n  argTypes: {\n    size: {\n      options: Object.keys(iconVariants.size),\n    },\n  },\n} satisfies Meta<typeof Icon>;\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const small: Story = {\n  args: { icon: \"Loader\", size: \"sm\" },\n};\n\nexport const medium: Story = {\n  args: { icon: \"Loader\", size: \"md\" },\n};\n\nexport const large_spinner: Story = {\n  args: { icon: \"Loader\", size: \"lg\", color: \"primary\", spin: true },\n};\n"],"mappings":"AACA,SAAS,MAAM,oBAAoB;AAEnC,MAAM,OAAO;AAAA,EACX,WAAW;AAAA,EACX,OAAO;AAAA,EACP,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS,OAAO,KAAK,aAAa,IAAI;AAAA,IACxC;AAAA,EACF;AACF;AACA,IAAO,uBAAQ;AAIR,MAAM,QAAe;AAAA,EAC1B,MAAM,EAAE,MAAM,UAAU,MAAM,KAAK;AACrC;AAEO,MAAM,SAAgB;AAAA,EAC3B,MAAM,EAAE,MAAM,UAAU,MAAM,KAAK;AACrC;AAEO,MAAM,gBAAuB;AAAA,EAClC,MAAM,EAAE,MAAM,UAAU,MAAM,MAAM,OAAO,WAAW,MAAM,KAAK;AACnE;","names":[]}

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

@@ -0,0 +1,29 @@
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from './accordion/accordion.js';
+export { Alert, AlertDescription, AlertTitle, alertVariants } from './alert/alert.js';
+export { Badge, badgeVariants } from './badge/badge.js';
+export { Badges, BadgesProps } from './badge/badges.js';
+export { Button, buttonVariants, buttonVariantsProps } from './button/button.js';
+export { Icon, iconVariants, iconVariantsProps } from './icon/icon.js';
+export { Input } from './input/input.js';
+export { Layout, LayoutProps, layoutVariants, layoutVariantsProps } from './layout/layout.js';
+export { Separator } from './separator/separator.js';
+export { Skeleton } from './skeleton/skeleton.js';
+export { Spinner, SpinnerProps } from './spinner/spinner.js';
+export { Stack, StackProps, stackVariants } from './stack/stack.js';
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from './table/table.js';
+export { TextDiv } from './text/text-div.js';
+export { TextHeading, TextHeadingProps, textHeadingVariants, textHeadingVariantsProps } from './text/text-heading.js';
+export { TextParagraph } from './text/text-paragraph.js';
+export { TextSpan } from './text/text-span.js';
+export { TextTime } from './text/text-time.js';
+export { UiImage } from './ui-image.js';
+import 'react/jsx-runtime';
+import 'react';
+import '@radix-ui/react-accordion';
+import 'class-variance-authority/types';
+import 'class-variance-authority';
+import 'lucide-react';
+import '@radix-ui/react-separator';
+import './text/internal/text-element.js';
+import '../../lib/types.js';
+import '../providers/ImageContext.js';

package/dist/components/primitives/index.js

@@ -0,0 +1,20 @@
+export * from "./accordion/accordion";
+export * from "./alert/alert";
+export * from "./badge/badge";
+export * from "./badge/badges";
+export * from "./button/button";
+export * from "./icon/icon";
+export * from "./input/input";
+export * from "./layout/layout";
+export * from "./separator/separator";
+export * from "./skeleton/skeleton";
+export * from "./spinner/spinner";
+export * from "./stack/stack";
+export * from "./table/table";
+export * from "./text/text-div";
+export * from "./text/text-heading";
+export * from "./text/text-paragraph";
+export * from "./text/text-span";
+export * from "./text/text-time";
+export * from "./ui-image";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/primitives/index.ts"],"sourcesContent":["export * from \"./accordion/accordion\";\nexport * from \"./alert/alert\";\nexport * from \"./badge/badge\";\nexport * from \"./badge/badges\";\nexport * from \"./button/button\";\nexport * from \"./icon/icon\";\nexport * from \"./input/input\";\nexport * from \"./layout/layout\";\nexport * from \"./separator/separator\";\nexport * from \"./skeleton/skeleton\";\nexport * from \"./spinner/spinner\";\nexport * from \"./stack/stack\";\nexport * from \"./table/table\";\nexport * from \"./text/text-div\";\nexport * from \"./text/text-heading\";\nexport * from \"./text/text-paragraph\";\nexport * from \"./text/text-span\";\nexport * from \"./text/text-time\";\nexport * from \"./ui-image\";\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}

package/dist/components/primitives/input/input.d.ts

@@ -0,0 +1,6 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+declare function Input({ className, type, ...props }: React.ComponentProps<"input">): react_jsx_runtime.JSX.Element;
+
+export { Input };

package/dist/components/primitives/input/input.js

@@ -0,0 +1,23 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../../utils";
+function Input({ className, type, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "input",
+    {
+      type,
+      "data-slot": "input",
+      className: cn(
+        "sg:file:text-foreground sg:placeholder:text-muted-foreground sg:selection:bg-primary sg:selection:text-primary-foreground sg:dark:bg-input/30 sg:border-input sg:flex sg:h-9 sg:w-full sg:min-w-0 sg:rounded-md sg:border sg:bg-transparent sg:px-3 sg:py-1 sg:text-base sg:shadow-xs sg:transition-[color,box-shadow] sg:outline-none sg:file:inline-flex sg:file:h-7 sg:file:border-0 sg:file:bg-transparent sg:file:text-sm sg:file:font-medium sg:disabled:pointer-events-none sg:disabled:cursor-not-allowed sg:disabled:opacity-50 sg:md:text-sm",
+        "sg:focus-visible:border-ring sg:focus-visible:ring-ring/50 sg:focus-visible:ring-[3px]",
+        "sg:aria-invalid:ring-destructive/20 sg:dark:aria-invalid:ring-destructive/40 sg:aria-invalid:border-destructive",
+        className
+      ),
+      ...props
+    }
+  );
+}
+export {
+  Input
+};
+//# sourceMappingURL=input.js.map

package/dist/components/primitives/input/input.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/primitives/input/input.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../../utils\";\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <input\n      type={type}\n      data-slot=\"input\"\n      className={cn(\n        \"sg:file:text-foreground sg:placeholder:text-muted-foreground sg:selection:bg-primary sg:selection:text-primary-foreground sg:dark:bg-input/30 sg:border-input sg:flex sg:h-9 sg:w-full sg:min-w-0 sg:rounded-md sg:border sg:bg-transparent sg:px-3 sg:py-1 sg:text-base sg:shadow-xs sg:transition-[color,box-shadow] sg:outline-none sg:file:inline-flex sg:file:h-7 sg:file:border-0 sg:file:bg-transparent sg:file:text-sm sg:file:font-medium sg:disabled:pointer-events-none sg:disabled:cursor-not-allowed sg:disabled:opacity-50 sg:md:text-sm\",\n        \"sg:focus-visible:border-ring sg:focus-visible:ring-ring/50 sg:focus-visible:ring-[3px]\",\n        \"sg:aria-invalid:ring-destructive/20 sg:dark:aria-invalid:ring-destructive/40 sg:aria-invalid:border-destructive\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Input };\n"],"mappings":"AAKI;AALJ,YAAY,WAAW;AACvB,SAAS,UAAU;AAEnB,SAAS,MAAM,EAAE,WAAW,MAAM,GAAG,MAAM,GAAkC;AAC3E,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/primitives/layout/layout.d.ts

@@ -0,0 +1,53 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+declare const layoutVariants: {
+    type: {
+        full: string;
+        wide: string;
+        col: string;
+    };
+    cols: {
+        "100": string;
+        "66-33": string;
+        "50-50": string;
+        "33-33-33": string;
+        "25-25-25-25": string;
+    };
+    bgColor: {
+        transparent: string;
+        white: string;
+        black: string;
+        orange: string;
+        pink: string;
+        gradient1: string;
+        gradient2: string;
+        "primarylight-pink-orange": string;
+    };
+};
+declare const layoutVariantsProps: (props?: ({
+    type?: "col" | "full" | "wide" | null | undefined;
+    cols?: "100" | "66-33" | "50-50" | "33-33-33" | "25-25-25-25" | null | undefined;
+    bgColor?: "black" | "white" | "transparent" | "orange" | "pink" | "gradient1" | "gradient2" | "primarylight-pink-orange" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface LayoutProps extends React.HTMLAttributes<HTMLElement>, VariantProps<typeof layoutVariantsProps> {
+    as?: "div" | "section" | "article" | "main" | "header" | "footer";
+}
+declare function Layout({ children, className, type, cols, bgColor, as: Component, ...props }: React.PropsWithChildren<LayoutProps>): react_jsx_runtime.JSX.Element;
+declare namespace Layout {
+    var Col1: typeof Col;
+    var Col2: typeof Col;
+    var Col3: typeof Col;
+    var Col4: typeof Col;
+}
+type colProp = {
+    children?: React.ReactNode;
+    hideDiv?: boolean;
+    className?: string;
+    as?: "div" | "section" | "article" | "main" | "header" | "footer";
+};
+declare function Col({ children, hideDiv, className, as: Component }: colProp): react_jsx_runtime.JSX.Element;
+
+export { Layout, type LayoutProps, layoutVariants, layoutVariantsProps };

package/dist/components/primitives/layout/layout.js

@@ -0,0 +1,93 @@
+import { Fragment, jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "../../../utils";
+const bgColors = {
+  transparent: "sg:bg-transparent",
+  white: "sg:bg-white",
+  black: "sg:bg-black",
+  orange: "sg:bg-orange",
+  pink: "sg:bg-pink",
+  gradient1: "sg:bg-[linear-gradient(135deg,hsl(var(--sg-primary-light))_0%,hsl(var(--sg-pink))_50%,hsl(var(--sg-orange))_100%)]",
+  gradient2: "sg:bg-[radial-gradient(1200px_300px_at_10%_-20%,hsl(var(--sg-gradient-1)/0.15),transparent),radial-gradient(800px_200px_at_90%_-20%,hsl(var(--sg-gradient-2)/0.15),transparent)]",
+  "primarylight-pink-orange": "sg:bg-[linear-gradient(135deg,hsl(var(--sg-primary-light)/0.1)_0%,hsl(var(--sg-pink)/0.1)_50%,hsl(var(--sg-orange)/0.1)_100%)]"
+};
+const layoutVariants = {
+  type: {
+    full: "sg:w-full",
+    wide: "sg:w-full sg:px-4",
+    col: "sg:mx-auto sg:max-w-[768px] sg:px-4 sg:md:px-0"
+  },
+  cols: {
+    "100": "",
+    "66-33": "sg:md:grid-cols-[2fr_1fr]",
+    "50-50": "sg:md:grid-cols-2",
+    "33-33-33": "sg:md:grid-cols-3",
+    "25-25-25-25": "sg:md:grid-cols-4"
+  },
+  bgColor: bgColors
+};
+const layoutVariantsProps = cva("sg:grid sg:grid-cols-1 sg:gap-4", {
+  variants: layoutVariants,
+  defaultVariants: {
+    type: "col",
+    cols: "100"
+  }
+});
+function Layout({
+  children,
+  className,
+  type,
+  cols,
+  bgColor,
+  as: Component = "div",
+  ...props
+}) {
+  const allowedInLayout = (content) => {
+    if (content.type === Layout.Col1) {
+      return true;
+    } else if (content.type === Layout.Col2 && (cols === "66-33" || cols === "50-50" || cols === "33-33-33" || cols === "25-25-25-25")) {
+      return true;
+    } else if (content.type === Layout.Col3 && (cols === "33-33-33" || cols === "25-25-25-25")) {
+      return true;
+    } else if (content.type === Layout.Col4 && cols === "25-25-25-25") {
+      return true;
+    }
+    console.error(
+      "Content not allowed in column for variant",
+      cols,
+      content.type
+    );
+    return false;
+  };
+  const renderColumn = (content) => {
+    if (!allowedInLayout(content)) {
+      return;
+    }
+    return content;
+  };
+  return /* @__PURE__ */ jsx(
+    Component,
+    {
+      ...props,
+      className: cn(bgColors[bgColor ?? "transparent"], className),
+      children: /* @__PURE__ */ jsx("div", { className: cn(layoutVariantsProps({ type, cols })), children: React.Children.map(
+        children,
+        (child) => React.isValidElement(child) ? renderColumn(child) : /* @__PURE__ */ jsx(Fragment, {})
+      ) })
+    }
+  );
+}
+function Col({ children, hideDiv, className, as: Component = "div" }) {
+  return hideDiv ? /* @__PURE__ */ jsx(Fragment, { children }) : /* @__PURE__ */ jsx(Component, { className, children });
+}
+Layout.Col1 = Col;
+Layout.Col2 = Col;
+Layout.Col3 = Col;
+Layout.Col4 = Col;
+export {
+  Layout,
+  layoutVariants,
+  layoutVariantsProps
+};
+//# sourceMappingURL=layout.js.map

package/dist/components/primitives/layout/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/primitives/layout/layout.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../../../utils\";\n\nconst bgColors = {\n  transparent: \"sg:bg-transparent\",\n  white: \"sg:bg-white\",\n  black: \"sg:bg-black\",\n  orange: \"sg:bg-orange\",\n  pink: \"sg:bg-pink\",\n  gradient1:\n    \"sg:bg-[linear-gradient(135deg,hsl(var(--sg-primary-light))_0%,hsl(var(--sg-pink))_50%,hsl(var(--sg-orange))_100%)]\",\n  gradient2:\n    \"sg:bg-[radial-gradient(1200px_300px_at_10%_-20%,hsl(var(--sg-gradient-1)/0.15),transparent),radial-gradient(800px_200px_at_90%_-20%,hsl(var(--sg-gradient-2)/0.15),transparent)]\",\n  \"primarylight-pink-orange\":\n    \"sg:bg-[linear-gradient(135deg,hsl(var(--sg-primary-light)/0.1)_0%,hsl(var(--sg-pink)/0.1)_50%,hsl(var(--sg-orange)/0.1)_100%)]\",\n};\n\nconst layoutVariants = {\n  type: {\n    full: \"sg:w-full\",\n    wide: \"sg:w-full sg:px-4\",\n    col: \"sg:mx-auto sg:max-w-[768px] sg:px-4 sg:md:px-0\",\n  },\n  cols: {\n    \"100\": \"\",\n    \"66-33\": \"sg:md:grid-cols-[2fr_1fr]\",\n    \"50-50\": \"sg:md:grid-cols-2\",\n    \"33-33-33\": \"sg:md:grid-cols-3\",\n    \"25-25-25-25\": \"sg:md:grid-cols-4\",\n  },\n  bgColor: bgColors,\n};\n\nconst layoutVariantsProps = cva(\"sg:grid sg:grid-cols-1 sg:gap-4\", {\n  variants: layoutVariants,\n  defaultVariants: {\n    type: \"col\",\n    cols: \"100\",\n  },\n});\n\nexport interface LayoutProps\n  extends React.HTMLAttributes<HTMLElement>,\n    VariantProps<typeof layoutVariantsProps> {\n  as?: \"div\" | \"section\" | \"article\" | \"main\" | \"header\" | \"footer\";\n}\n\nfunction Layout({\n  children,\n  className,\n  type,\n  cols,\n  bgColor,\n  as: Component = \"div\",\n  ...props\n}: React.PropsWithChildren<LayoutProps>) {\n  const allowedInLayout = (\n    content: React.ReactElement<any, string | React.JSXElementConstructor<any>>\n  ): boolean => {\n    if (content.type === Layout.Col1) {\n      return true;\n    } else if (\n      content.type === Layout.Col2 &&\n      (cols === \"66-33\" ||\n        cols === \"50-50\" ||\n        cols === \"33-33-33\" ||\n        cols === \"25-25-25-25\")\n    ) {\n      return true;\n    } else if (\n      content.type === Layout.Col3 &&\n      (cols === \"33-33-33\" || cols === \"25-25-25-25\")\n    ) {\n      return true;\n    } else if (content.type === Layout.Col4 && cols === \"25-25-25-25\") {\n      return true;\n    }\n\n    console.error(\n      \"Content not allowed in column for variant\",\n      cols,\n      content.type\n    );\n    return false;\n  };\n\n  const renderColumn = (\n    content: React.ReactElement<any, string | React.JSXElementConstructor<any>>\n  ) => {\n    if (!allowedInLayout(content)) {\n      return;\n    }\n    return content;\n  };\n\n  return (\n    <Component\n      {...props}\n      className={cn(bgColors[bgColor ?? \"transparent\"], className)}\n    >\n      <div className={cn(layoutVariantsProps({ type, cols }))}>\n        {React.Children.map(children, (child) =>\n          React.isValidElement(child) ? renderColumn(child) : <></>\n        )}\n      </div>\n    </Component>\n  );\n}\n\ntype colProp = {\n  children?: React.ReactNode;\n  hideDiv?: boolean;\n  className?: string;\n  as?: \"div\" | \"section\" | \"article\" | \"main\" | \"header\" | \"footer\";\n};\n\nfunction Col({ children, hideDiv, className, as: Component = \"div\" }: colProp) {\n  return hideDiv ? (\n    <>{children}</>\n  ) : (\n    <Component className={className}>{children}</Component>\n  );\n}\n\nLayout.Col1 = Col;\nLayout.Col2 = Col;\nLayout.Col3 = Col;\nLayout.Col4 = Col;\n\nexport { Layout, layoutVariantsProps, layoutVariants };\n"],"mappings":"AAuG8D;AAvG9D,YAAY,WAAW;AACvB,SAAS,WAA8B;AACvC,SAAS,UAAU;AAEnB,MAAM,WAAW;AAAA,EACf,aAAa;AAAA,EACb,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,WACE;AAAA,EACF,WACE;AAAA,EACF,4BACE;AACJ;AAEA,MAAM,iBAAiB;AAAA,EACrB,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,MAAM;AAAA,IACN,KAAK;AAAA,EACP;AAAA,EACA,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,eAAe;AAAA,EACjB;AAAA,EACA,SAAS;AACX;AAEA,MAAM,sBAAsB,IAAI,mCAAmC;AAAA,EACjE,UAAU;AAAA,EACV,iBAAiB;AAAA,IACf,MAAM;AAAA,IACN,MAAM;AAAA,EACR;AACF,CAAC;AAQD,SAAS,OAAO;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,IAAI,YAAY;AAAA,EAChB,GAAG;AACL,GAAyC;AACvC,QAAM,kBAAkB,CACtB,YACY;AACZ,QAAI,QAAQ,SAAS,OAAO,MAAM;AAChC,aAAO;AAAA,IACT,WACE,QAAQ,SAAS,OAAO,SACvB,SAAS,WACR,SAAS,WACT,SAAS,cACT,SAAS,gBACX;AACA,aAAO;AAAA,IACT,WACE,QAAQ,SAAS,OAAO,SACvB,SAAS,cAAc,SAAS,gBACjC;AACA,aAAO;AAAA,IACT,WAAW,QAAQ,SAAS,OAAO,QAAQ,SAAS,eAAe;AACjE,aAAO;AAAA,IACT;AAEA,YAAQ;AAAA,MACN;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IACV;AACA,WAAO;AAAA,EACT;AAEA,QAAM,eAAe,CACnB,YACG;AACH,QAAI,CAAC,gBAAgB,OAAO,GAAG;AAC7B;AAAA,IACF;AACA,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW,GAAG,SAAS,WAAW,aAAa,GAAG,SAAS;AAAA,MAE3D,8BAAC,SAAI,WAAW,GAAG,oBAAoB,EAAE,MAAM,KAAK,CAAC,CAAC,GACnD,gBAAM,SAAS;AAAA,QAAI;AAAA,QAAU,CAAC,UAC7B,MAAM,eAAe,KAAK,IAAI,aAAa,KAAK,IAAI,gCAAE;AAAA,MACxD,GACF;AAAA;AAAA,EACF;AAEJ;AASA,SAAS,IAAI,EAAE,UAAU,SAAS,WAAW,IAAI,YAAY,MAAM,GAAY;AAC7E,SAAO,UACL,gCAAG,UAAS,IAEZ,oBAAC,aAAU,WAAuB,UAAS;AAE/C;AAEA,OAAO,OAAO;AACd,OAAO,OAAO;AACd,OAAO,OAAO;AACd,OAAO,OAAO;","names":[]}