@forgedevstack/bear 1.0.0

package/dist/components/Checkbox/Checkbox.js

@@ -0,0 +1,139 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { forwardRef as I, useRef as L, useId as j, useEffect as E } from "react";
+import { cn as s } from "../../utils/cn.js";
+const A = {
+  xs: "ember-w-3.5 ember-h-3.5",
+  sm: "ember-w-4 ember-h-4",
+  md: "ember-w-5 ember-h-5",
+  lg: "ember-w-6 ember-h-6",
+  xl: "ember-w-7 ember-h-7"
+}, R = {
+  xs: 10,
+  sm: 12,
+  md: 14,
+  lg: 18,
+  xl: 22
+}, _ = {
+  xs: "ember-text-xs",
+  sm: "ember-text-sm",
+  md: "ember-text-base",
+  lg: "ember-text-lg",
+  xl: "ember-text-xl"
+}, B = {
+  primary: "#ec4899",
+  secondary: "#6b7280",
+  success: "#22c55e",
+  danger: "#ef4444",
+  warning: "#f59e0b",
+  info: "#3b82f6",
+  ghost: "#9ca3af",
+  outline: "#374151",
+  error: "#ef4444"
+}, O = I(({
+  label: i,
+  size: b = "md",
+  variant: h = "primary",
+  color: p,
+  checked: a,
+  defaultChecked: d,
+  indeterminate: t = !1,
+  disabled: c = !1,
+  error: o = !1,
+  helperText: x,
+  className: u,
+  testId: y,
+  onChange: g,
+  ...k
+}, w) => {
+  const S = L(null), r = w || S, v = j(), f = p ?? B[h], m = R[b];
+  E(() => {
+    typeof r == "object" && (r != null && r.current) && (r.current.indeterminate = t);
+  }, [t, r]);
+  const C = () => /* @__PURE__ */ e(
+    "svg",
+    {
+      width: m,
+      height: m,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "white",
+      strokeWidth: "3",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: /* @__PURE__ */ e("polyline", { points: "20 6 9 17 4 12" })
+    }
+  ), N = () => /* @__PURE__ */ e(
+    "svg",
+    {
+      width: m,
+      height: m,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "white",
+      strokeWidth: "3",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: /* @__PURE__ */ e("line", { x1: "5", y1: "12", x2: "19", y2: "12" })
+    }
+  ), n = a ?? d;
+  return /* @__PURE__ */ l("div", { className: s("ember-flex ember-flex-col", u), children: [
+    /* @__PURE__ */ l(
+      "label",
+      {
+        className: s(
+          "ember-inline-flex ember-items-center ember-gap-2 ember-cursor-pointer",
+          c && "ember-opacity-50 ember-cursor-not-allowed"
+        ),
+        children: [
+          /* @__PURE__ */ l("div", { className: "ember-relative ember-flex ember-items-center ember-justify-center", children: [
+            /* @__PURE__ */ e(
+              "input",
+              {
+                ref: r,
+                type: "checkbox",
+                checked: a,
+                defaultChecked: d,
+                disabled: c,
+                onChange: g,
+                className: "ember-sr-only",
+                id: v,
+                "data-testid": y,
+                ...k
+              }
+            ),
+            /* @__PURE__ */ e(
+              "div",
+              {
+                className: s(
+                  A[b],
+                  "ember-rounded ember-border-2 ember-transition-all ember-flex ember-items-center ember-justify-center",
+                  o ? "ember-border-red-500" : "ember-border-gray-300 dark:ember-border-gray-600",
+                  (n || t) && !o && "ember-border-transparent",
+                  !c && "hover:ember-border-gray-400"
+                ),
+                style: {
+                  backgroundColor: n || t ? o ? "#ef4444" : f : "transparent",
+                  borderColor: (n || t) && !o ? f : void 0
+                },
+                children: t ? /* @__PURE__ */ e(N, {}) : n ? /* @__PURE__ */ e(C, {}) : null
+              }
+            )
+          ] }),
+          i && /* @__PURE__ */ e("span", { className: s(
+            _[b],
+            "ember-text-gray-700 dark:ember-text-gray-300",
+            o && "ember-text-red-500"
+          ), children: i })
+        ]
+      }
+    ),
+    x && /* @__PURE__ */ e("span", { className: s(
+      "ember-text-xs ember-mt-1 ember-ml-7",
+      o ? "ember-text-red-500" : "ember-text-gray-500"
+    ), children: x })
+  ] });
+});
+O.displayName = "Checkbox";
+export {
+  O as Checkbox
+};

package/dist/components/Checkbox/Checkbox.types.d.ts

@@ -0,0 +1,28 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+import { BearSize, BearVariant } from '../../types';
+export interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    /** Checkbox label */
+    label?: ReactNode;
+    /** Size of the checkbox */
+    size?: BearSize;
+    /** Color variant */
+    variant?: BearVariant;
+    /** Custom color override */
+    color?: string;
+    /** Whether checkbox is checked */
+    checked?: boolean;
+    /** Default checked state for uncontrolled mode */
+    defaultChecked?: boolean;
+    /** Whether checkbox is in indeterminate state */
+    indeterminate?: boolean;
+    /** Whether checkbox is disabled */
+    disabled?: boolean;
+    /** Error state */
+    error?: boolean;
+    /** Helper text shown below */
+    helperText?: string;
+    /** Callback when checkbox changes */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /** Test ID */
+    testId?: string;
+}

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

@@ -0,0 +1,2 @@
+export { Checkbox, default } from './Checkbox';
+export type { CheckboxProps } from './Checkbox.types';

package/dist/components/Chip/Chip.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../utils/cn.cjs"),m=({children:l,variant:i="filled",color:c="default",size:b="md",icon:t,avatar:o,onDelete:n,onClick:a,disabled:r=!1,className:d})=>{const p={filled:{default:"bear-bg-zinc-600 bear-text-white",primary:"bear-bg-pink-500 bear-text-white",secondary:"bear-bg-purple-500 bear-text-white",success:"bear-bg-green-500 bear-text-white",warning:"bear-bg-yellow-500 bear-text-black",error:"bear-bg-red-500 bear-text-white",info:"bear-bg-blue-500 bear-text-white"},outlined:{default:"bear-border bear-border-zinc-500 bear-text-zinc-300",primary:"bear-border bear-border-pink-500 bear-text-pink-400",secondary:"bear-border bear-border-purple-500 bear-text-purple-400",success:"bear-border bear-border-green-500 bear-text-green-400",warning:"bear-border bear-border-yellow-500 bear-text-yellow-400",error:"bear-border bear-border-red-500 bear-text-red-400",info:"bear-border bear-border-blue-500 bear-text-blue-400"},soft:{default:"bear-bg-zinc-500/20 bear-text-zinc-300",primary:"bear-bg-pink-500/20 bear-text-pink-400",secondary:"bear-bg-purple-500/20 bear-text-purple-400",success:"bear-bg-green-500/20 bear-text-green-400",warning:"bear-bg-yellow-500/20 bear-text-yellow-400",error:"bear-bg-red-500/20 bear-text-red-400",info:"bear-bg-blue-500/20 bear-text-blue-400"}},u={sm:"bear-h-6 bear-text-xs bear-px-2 bear-gap-1",md:"bear-h-8 bear-text-sm bear-px-3 bear-gap-1.5",lg:"bear-h-10 bear-text-base bear-px-4 bear-gap-2"},x={sm:"bear-w-3 bear-h-3",md:"bear-w-4 bear-h-4",lg:"bear-w-5 bear-h-5"},g=a?"button":"span";return e.jsxs(g,{onClick:a,disabled:r,className:s.cn("bear-inline-flex bear-items-center bear-rounded-full bear-font-medium bear-transition-all",u[b],p[i][c],a&&!r&&"bear-cursor-pointer hover:bear-opacity-80",r&&"bear-opacity-50 bear-cursor-not-allowed",d),children:[o&&e.jsx("span",{className:"bear--ml-1",children:o}),t&&e.jsx("span",{children:t}),e.jsx("span",{children:l}),n&&e.jsx("button",{onClick:h=>{h.stopPropagation(),n()},disabled:r,className:s.cn("bear-ml-1 bear-rounded-full bear-p-0.5 hover:bear-bg-black/20 bear-transition-colors",r&&"bear-cursor-not-allowed"),children:e.jsx("svg",{className:x[b],fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]})};exports.Chip=m;

package/dist/components/Chip/Chip.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { ChipProps } from './Chip.types';
+export declare const Chip: FC<ChipProps>;

package/dist/components/Chip/Chip.js

@@ -0,0 +1,85 @@
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { cn as l } from "../../utils/cn.js";
+const y = ({
+  children: s,
+  variant: i = "filled",
+  color: p = "default",
+  size: b = "md",
+  icon: t,
+  avatar: o,
+  onDelete: n,
+  onClick: a,
+  disabled: r = !1,
+  className: d
+}) => {
+  const c = {
+    filled: {
+      default: "bear-bg-zinc-600 bear-text-white",
+      primary: "bear-bg-pink-500 bear-text-white",
+      secondary: "bear-bg-purple-500 bear-text-white",
+      success: "bear-bg-green-500 bear-text-white",
+      warning: "bear-bg-yellow-500 bear-text-black",
+      error: "bear-bg-red-500 bear-text-white",
+      info: "bear-bg-blue-500 bear-text-white"
+    },
+    outlined: {
+      default: "bear-border bear-border-zinc-500 bear-text-zinc-300",
+      primary: "bear-border bear-border-pink-500 bear-text-pink-400",
+      secondary: "bear-border bear-border-purple-500 bear-text-purple-400",
+      success: "bear-border bear-border-green-500 bear-text-green-400",
+      warning: "bear-border bear-border-yellow-500 bear-text-yellow-400",
+      error: "bear-border bear-border-red-500 bear-text-red-400",
+      info: "bear-border bear-border-blue-500 bear-text-blue-400"
+    },
+    soft: {
+      default: "bear-bg-zinc-500/20 bear-text-zinc-300",
+      primary: "bear-bg-pink-500/20 bear-text-pink-400",
+      secondary: "bear-bg-purple-500/20 bear-text-purple-400",
+      success: "bear-bg-green-500/20 bear-text-green-400",
+      warning: "bear-bg-yellow-500/20 bear-text-yellow-400",
+      error: "bear-bg-red-500/20 bear-text-red-400",
+      info: "bear-bg-blue-500/20 bear-text-blue-400"
+    }
+  }, x = {
+    sm: "bear-h-6 bear-text-xs bear-px-2 bear-gap-1",
+    md: "bear-h-8 bear-text-sm bear-px-3 bear-gap-1.5",
+    lg: "bear-h-10 bear-text-base bear-px-4 bear-gap-2"
+  }, u = { sm: "bear-w-3 bear-h-3", md: "bear-w-4 bear-h-4", lg: "bear-w-5 bear-h-5" };
+  return /* @__PURE__ */ m(
+    a ? "button" : "span",
+    {
+      onClick: a,
+      disabled: r,
+      className: l(
+        "bear-inline-flex bear-items-center bear-rounded-full bear-font-medium bear-transition-all",
+        x[b],
+        c[i][p],
+        a && !r && "bear-cursor-pointer hover:bear-opacity-80",
+        r && "bear-opacity-50 bear-cursor-not-allowed",
+        d
+      ),
+      children: [
+        o && /* @__PURE__ */ e("span", { className: "bear--ml-1", children: o }),
+        t && /* @__PURE__ */ e("span", { children: t }),
+        /* @__PURE__ */ e("span", { children: s }),
+        n && /* @__PURE__ */ e(
+          "button",
+          {
+            onClick: (g) => {
+              g.stopPropagation(), n();
+            },
+            disabled: r,
+            className: l(
+              "bear-ml-1 bear-rounded-full bear-p-0.5 hover:bear-bg-black/20 bear-transition-colors",
+              r && "bear-cursor-not-allowed"
+            ),
+            children: /* @__PURE__ */ e("svg", { className: u[b], fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  y as Chip
+};

package/dist/components/Chip/Chip.types.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+export interface ChipProps {
+    children: ReactNode;
+    variant?: 'filled' | 'outlined' | 'soft';
+    color?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
+    size?: 'sm' | 'md' | 'lg';
+    icon?: ReactNode;
+    avatar?: ReactNode;
+    onDelete?: () => void;
+    onClick?: () => void;
+    disabled?: boolean;
+    className?: string;
+}

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

@@ -0,0 +1,2 @@
+export { Chip } from './Chip';
+export type { ChipProps } from './Chip.types';

package/dist/components/Collapsible/Collapsible.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),s=require("react"),v=require("../../utils/cn.cjs"),R=({children:b,trigger:h,open:l,defaultOpen:u=!1,onOpenChange:r,disabled:a=!1,className:m,triggerClassName:g,contentClassName:j,animationDuration:i=200})=>{const[p,q]=s.useState(u),[d,t]=s.useState(u?void 0:0),o=s.useRef(null),c=l!==void 0?l:p;s.useEffect(()=>{var e,f;if(c){const y=(e=o.current)==null?void 0:e.scrollHeight;t(y);const H=setTimeout(()=>t(void 0),i);return()=>clearTimeout(H)}else t((f=o.current)==null?void 0:f.scrollHeight),requestAnimationFrame(()=>t(0))},[c,i]);const x=()=>{if(a)return;const e=!c;q(e),r==null||r(e)};return n.jsxs("div",{className:m,children:[n.jsx("div",{onClick:x,className:v.cn("bear-cursor-pointer",a&&"bear-opacity-50 bear-cursor-not-allowed",g),children:h}),n.jsx("div",{ref:o,className:v.cn("bear-overflow-hidden bear-transition-all",j),style:{height:d!==void 0?d:"auto",transitionDuration:`${i}ms`},children:b})]})};exports.Collapsible=R;

package/dist/components/Collapsible/Collapsible.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { CollapsibleProps } from './Collapsible.types';
+export declare const Collapsible: FC<CollapsibleProps>;

package/dist/components/Collapsible/Collapsible.js

@@ -0,0 +1,59 @@
+import { jsxs as j, jsx as f } from "react/jsx-runtime";
+import { useState as m, useRef as y, useEffect as N } from "react";
+import { cn as d } from "../../utils/cn.js";
+const E = ({
+  children: h,
+  trigger: v,
+  open: l,
+  defaultOpen: c = !1,
+  onOpenChange: r,
+  disabled: n = !1,
+  className: g,
+  triggerClassName: p,
+  contentClassName: b,
+  animationDuration: s = 200
+}) => {
+  const [H, T] = m(c), [a, t] = m(c ? void 0 : 0), o = y(null), i = l !== void 0 ? l : H;
+  return N(() => {
+    var e, u;
+    if (i) {
+      const w = (e = o.current) == null ? void 0 : e.scrollHeight;
+      t(w);
+      const x = setTimeout(() => t(void 0), s);
+      return () => clearTimeout(x);
+    } else
+      t((u = o.current) == null ? void 0 : u.scrollHeight), requestAnimationFrame(() => t(0));
+  }, [i, s]), /* @__PURE__ */ j("div", { className: g, children: [
+    /* @__PURE__ */ f(
+      "div",
+      {
+        onClick: () => {
+          if (n) return;
+          const e = !i;
+          T(e), r == null || r(e);
+        },
+        className: d(
+          "bear-cursor-pointer",
+          n && "bear-opacity-50 bear-cursor-not-allowed",
+          p
+        ),
+        children: v
+      }
+    ),
+    /* @__PURE__ */ f(
+      "div",
+      {
+        ref: o,
+        className: d("bear-overflow-hidden bear-transition-all", b),
+        style: {
+          height: a !== void 0 ? a : "auto",
+          transitionDuration: `${s}ms`
+        },
+        children: h
+      }
+    )
+  ] });
+};
+export {
+  E as Collapsible
+};

package/dist/components/Collapsible/Collapsible.types.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+export interface CollapsibleProps {
+    children: ReactNode;
+    trigger: ReactNode;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    disabled?: boolean;
+    className?: string;
+    triggerClassName?: string;
+    contentClassName?: string;
+    animationDuration?: number;
+}

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

@@ -0,0 +1,2 @@
+export { Collapsible } from './Collapsible';
+export type { CollapsibleProps } from './Collapsible.types';

package/dist/components/ColorPicker/ColorPicker.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),c=require("react"),o=require("../../utils/cn.cjs"),S=["#ef4444","#f97316","#eab308","#22c55e","#14b8a6","#06b6d4","#3b82f6","#6366f1","#8b5cf6","#a855f7","#d946ef","#ec4899","#f43f5e","#64748b","#1e293b","#000000","#ffffff"],g=({value:t="#ec4899",onChange:r,presets:p=S,showInput:w=!0,showPresets:h=!0,disabled:b=!1,label:l,size:u="md",className:x})=>{const[d,f]=c.useState(!1),[j,n]=c.useState(t),i=c.useRef(null);c.useEffect(()=>{n(t)},[t]),c.useEffect(()=>{const e=s=>{i.current&&!i.current.contains(s.target)&&f(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[]);const k=e=>{const s=e.target.value;n(s),/^#[0-9A-Fa-f]{6}$/.test(s)&&(r==null||r(s))},v=e=>{n(e),r==null||r(e)},m={sm:{swatch:"bear-w-6 bear-h-6",presetSwatch:"bear-w-5 bear-h-5"},md:{swatch:"bear-w-8 bear-h-8",presetSwatch:"bear-w-6 bear-h-6"},lg:{swatch:"bear-w-10 bear-h-10",presetSwatch:"bear-w-7 bear-h-7"}};return a.jsxs("div",{ref:i,className:o.cn("bear-relative",x),children:[l&&a.jsx("label",{className:"bear-block bear-text-sm bear-font-medium bear-text-zinc-300 bear-mb-1.5",children:l}),a.jsxs("div",{className:"bear-flex bear-items-center bear-gap-2",children:[a.jsx("button",{onClick:()=>!b&&f(!d),disabled:b,className:o.cn("bear-rounded-lg bear-border bear-border-zinc-600 bear-transition-all hover:bear-scale-105",m[u].swatch,b&&"bear-opacity-50 bear-cursor-not-allowed"),style:{backgroundColor:t}}),w&&a.jsx("input",{type:"text",value:j,onChange:k,disabled:b,placeholder:"#000000",className:o.cn("bear-px-3 bear-py-1.5 bear-rounded-lg bear-border bear-border-zinc-600 bear-bg-zinc-800 bear-text-white bear-text-sm bear-font-mono bear-w-24 bear-outline-none focus:bear-border-pink-500",b&&"bear-opacity-50 bear-cursor-not-allowed")})]}),d&&a.jsxs("div",{className:"bear-absolute bear-z-50 bear-mt-2 bear-bg-zinc-800 bear-border bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-p-3",children:[a.jsx("input",{type:"color",value:t,onChange:e=>{r==null||r(e.target.value),n(e.target.value)},className:"bear-w-full bear-h-32 bear-rounded bear-cursor-pointer bear-mb-3"}),h&&a.jsx("div",{className:"bear-grid bear-grid-cols-6 bear-gap-1.5",children:p.map(e=>a.jsx("button",{onClick:()=>v(e),className:o.cn("bear-rounded bear-border bear-transition-transform hover:bear-scale-110",m[u].presetSwatch,t===e?"bear-border-white bear-ring-2 bear-ring-pink-500":"bear-border-zinc-600"),style:{backgroundColor:e}},e))})]})]})};exports.ColorPicker=g;

package/dist/components/ColorPicker/ColorPicker.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { ColorPickerProps } from './ColorPicker.types';
+export declare const ColorPicker: FC<ColorPickerProps>;

package/dist/components/ColorPicker/ColorPicker.js

@@ -0,0 +1,113 @@
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
+import { useState as p, useRef as y, useEffect as w } from "react";
+import { cn as o } from "../../utils/cn.js";
+const S = [
+  "#ef4444",
+  "#f97316",
+  "#eab308",
+  "#22c55e",
+  "#14b8a6",
+  "#06b6d4",
+  "#3b82f6",
+  "#6366f1",
+  "#8b5cf6",
+  "#a855f7",
+  "#d946ef",
+  "#ec4899",
+  "#f43f5e",
+  "#64748b",
+  "#1e293b",
+  "#000000",
+  "#ffffff"
+], O = ({
+  value: a = "#ec4899",
+  onChange: r,
+  presets: h = S,
+  showInput: x = !0,
+  showPresets: k = !0,
+  disabled: b = !1,
+  label: l,
+  size: d = "md",
+  className: v
+}) => {
+  const [u, f] = p(!1), [N, c] = p(a), n = y(null);
+  w(() => {
+    c(a);
+  }, [a]), w(() => {
+    const e = (s) => {
+      n.current && !n.current.contains(s.target) && f(!1);
+    };
+    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, []);
+  const z = (e) => {
+    const s = e.target.value;
+    c(s), /^#[0-9A-Fa-f]{6}$/.test(s) && (r == null || r(s));
+  }, g = (e) => {
+    c(e), r == null || r(e);
+  }, m = {
+    sm: { swatch: "bear-w-6 bear-h-6", presetSwatch: "bear-w-5 bear-h-5" },
+    md: { swatch: "bear-w-8 bear-h-8", presetSwatch: "bear-w-6 bear-h-6" },
+    lg: { swatch: "bear-w-10 bear-h-10", presetSwatch: "bear-w-7 bear-h-7" }
+  };
+  return /* @__PURE__ */ i("div", { ref: n, className: o("bear-relative", v), children: [
+    l && /* @__PURE__ */ t("label", { className: "bear-block bear-text-sm bear-font-medium bear-text-zinc-300 bear-mb-1.5", children: l }),
+    /* @__PURE__ */ i("div", { className: "bear-flex bear-items-center bear-gap-2", children: [
+      /* @__PURE__ */ t(
+        "button",
+        {
+          onClick: () => !b && f(!u),
+          disabled: b,
+          className: o(
+            "bear-rounded-lg bear-border bear-border-zinc-600 bear-transition-all hover:bear-scale-105",
+            m[d].swatch,
+            b && "bear-opacity-50 bear-cursor-not-allowed"
+          ),
+          style: { backgroundColor: a }
+        }
+      ),
+      x && /* @__PURE__ */ t(
+        "input",
+        {
+          type: "text",
+          value: N,
+          onChange: z,
+          disabled: b,
+          placeholder: "#000000",
+          className: o(
+            "bear-px-3 bear-py-1.5 bear-rounded-lg bear-border bear-border-zinc-600 bear-bg-zinc-800 bear-text-white bear-text-sm bear-font-mono bear-w-24 bear-outline-none focus:bear-border-pink-500",
+            b && "bear-opacity-50 bear-cursor-not-allowed"
+          )
+        }
+      )
+    ] }),
+    u && /* @__PURE__ */ i("div", { className: "bear-absolute bear-z-50 bear-mt-2 bear-bg-zinc-800 bear-border bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-p-3", children: [
+      /* @__PURE__ */ t(
+        "input",
+        {
+          type: "color",
+          value: a,
+          onChange: (e) => {
+            r == null || r(e.target.value), c(e.target.value);
+          },
+          className: "bear-w-full bear-h-32 bear-rounded bear-cursor-pointer bear-mb-3"
+        }
+      ),
+      k && /* @__PURE__ */ t("div", { className: "bear-grid bear-grid-cols-6 bear-gap-1.5", children: h.map((e) => /* @__PURE__ */ t(
+        "button",
+        {
+          onClick: () => g(e),
+          className: o(
+            "bear-rounded bear-border bear-transition-transform hover:bear-scale-110",
+            m[d].presetSwatch,
+            a === e ? "bear-border-white bear-ring-2 bear-ring-pink-500" : "bear-border-zinc-600"
+          ),
+          style: { backgroundColor: e }
+        },
+        e
+      )) })
+    ] })
+  ] });
+};
+export {
+  O as ColorPicker
+};

package/dist/components/ColorPicker/ColorPicker.types.d.ts

@@ -0,0 +1,11 @@
+export interface ColorPickerProps {
+    value?: string;
+    onChange?: (color: string) => void;
+    presets?: string[];
+    showInput?: boolean;
+    showPresets?: boolean;
+    disabled?: boolean;
+    label?: string;
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}

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

@@ -0,0 +1,2 @@
+export { ColorPicker } from './ColorPicker';
+export type { ColorPickerProps } from './ColorPicker.types';

package/dist/components/Container/Container.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),i=require("react"),o=require("../../utils/cn.cjs"),u={sm:"ember-max-w-screen-sm",md:"ember-max-w-screen-md",lg:"ember-max-w-screen-lg",xl:"ember-max-w-screen-xl","2xl":"ember-max-w-screen-2xl",full:"ember-max-w-full"},e=i.forwardRef(({size:r="xl",centered:m=!0,padding:s=!0,className:t,children:n,testId:a,...l},x)=>c.jsx("div",{ref:x,className:o.cn("ember-w-full",u[r],m&&"ember-mx-auto",s&&"ember-px-4 sm:ember-px-6 lg:ember-px-8",t),"data-testid":a,...l,children:n}));e.displayName="Container";exports.Container=e;

package/dist/components/Container/Container.d.ts

@@ -0,0 +1,12 @@
+import { ContainerProps } from './Container.types';
+/**
+ * Container component for constraining content width
+ *
+ * @example
+ * ```tsx
+ * <Container size="lg" centered>
+ *   <Content />
+ * </Container>
+ * ```
+ */
+export declare const Container: import('react').ForwardRefExoticComponent<ContainerProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/Container/Container.js

@@ -0,0 +1,40 @@
+import { jsx as n } from "react/jsx-runtime";
+import { forwardRef as o } from "react";
+import { cn as b } from "../../utils/cn.js";
+const c = {
+  sm: "ember-max-w-screen-sm",
+  md: "ember-max-w-screen-md",
+  lg: "ember-max-w-screen-lg",
+  xl: "ember-max-w-screen-xl",
+  "2xl": "ember-max-w-screen-2xl",
+  full: "ember-max-w-full"
+}, i = o(
+  ({
+    size: e = "xl",
+    centered: m = !0,
+    padding: r = !0,
+    className: s,
+    children: a,
+    testId: l,
+    ...x
+  }, t) => /* @__PURE__ */ n(
+    "div",
+    {
+      ref: t,
+      className: b(
+        "ember-w-full",
+        c[e],
+        m && "ember-mx-auto",
+        r && "ember-px-4 sm:ember-px-6 lg:ember-px-8",
+        s
+      ),
+      "data-testid": l,
+      ...x,
+      children: a
+    }
+  )
+);
+i.displayName = "Container";
+export {
+  i as Container
+};

package/dist/components/Container/Container.types.d.ts

@@ -0,0 +1,12 @@
+import { HTMLAttributes } from 'react';
+export type ContainerSize = 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full';
+export interface ContainerProps extends HTMLAttributes<HTMLDivElement> {
+    /** Maximum width of the container */
+    size?: ContainerSize;
+    /** Whether to center the container */
+    centered?: boolean;
+    /** Horizontal padding */
+    padding?: boolean;
+    /** Test ID */
+    testId?: string;
+}

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

@@ -0,0 +1,2 @@
+export { Container } from './Container';
+export type { ContainerProps, ContainerSize } from './Container.types';

package/dist/components/CopyButton/CopyButton.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("react"),v=require("../../utils/cn.cjs"),k=({className:t})=>e.jsx("svg",{className:t,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"})}),m=({className:t})=>e.jsx("svg",{className:t,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"})}),f=({value:t,children:s,onCopy:r,timeout:i=2e3,size:a="md",variant:h="default",className:c,copiedText:b="Copied!",copyText:l="Copy",showText:g=!1})=>{const[n,u]=x.useState(!1),d=x.useCallback(async()=>{try{await navigator.clipboard.writeText(t),u(!0),r==null||r(t),setTimeout(()=>u(!1),i)}catch(j){console.error("Failed to copy:",j)}},[t,r,i]),o={sm:{button:"bear-p-1",icon:"bear-w-3.5 bear-h-3.5",text:"bear-text-xs"},md:{button:"bear-p-1.5",icon:"bear-w-4 bear-h-4",text:"bear-text-sm"},lg:{button:"bear-p-2",icon:"bear-w-5 bear-h-5",text:"bear-text-base"}},p={default:"bear-bg-zinc-700 hover:bear-bg-zinc-600 bear-text-zinc-300",ghost:"bear-bg-transparent hover:bear-bg-zinc-700 bear-text-zinc-400 hover:bear-text-zinc-300",outline:"bear-bg-transparent bear-border bear-border-zinc-600 hover:bear-bg-zinc-700 bear-text-zinc-400 hover:bear-text-zinc-300"};return s?e.jsx("button",{onClick:d,className:c,children:s}):e.jsxs("button",{onClick:d,className:v.cn("bear-inline-flex bear-items-center bear-gap-1.5 bear-rounded bear-transition-all",o[a].button,p[h],n&&"bear-text-green-400",c),title:n?b:l,children:[n?e.jsx(m,{className:o[a].icon}):e.jsx(k,{className:o[a].icon}),g&&e.jsx("span",{className:o[a].text,children:n?b:l})]})};exports.CopyButton=f;

package/dist/components/CopyButton/CopyButton.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { CopyButtonProps } from './CopyButton.types';
+export declare const CopyButton: FC<CopyButtonProps>;

package/dist/components/CopyButton/CopyButton.js

@@ -0,0 +1,52 @@
+import { jsx as e, jsxs as g } from "react/jsx-runtime";
+import { useState as f, useCallback as k } from "react";
+import { cn as v } from "../../utils/cn.js";
+const z = ({ className: r }) => /* @__PURE__ */ e("svg", { className: r, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" }) }), C = ({ className: r }) => /* @__PURE__ */ e("svg", { className: r, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) }), B = ({
+  value: r,
+  children: i,
+  onCopy: t,
+  timeout: s = 2e3,
+  size: a = "md",
+  variant: u = "default",
+  className: b,
+  copiedText: c = "Copied!",
+  copyText: l = "Copy",
+  showText: x = !1
+}) => {
+  const [n, d] = f(!1), h = k(async () => {
+    try {
+      await navigator.clipboard.writeText(r), d(!0), t == null || t(r), setTimeout(() => d(!1), s);
+    } catch (m) {
+      console.error("Failed to copy:", m);
+    }
+  }, [r, t, s]), o = {
+    sm: { button: "bear-p-1", icon: "bear-w-3.5 bear-h-3.5", text: "bear-text-xs" },
+    md: { button: "bear-p-1.5", icon: "bear-w-4 bear-h-4", text: "bear-text-sm" },
+    lg: { button: "bear-p-2", icon: "bear-w-5 bear-h-5", text: "bear-text-base" }
+  }, p = {
+    default: "bear-bg-zinc-700 hover:bear-bg-zinc-600 bear-text-zinc-300",
+    ghost: "bear-bg-transparent hover:bear-bg-zinc-700 bear-text-zinc-400 hover:bear-text-zinc-300",
+    outline: "bear-bg-transparent bear-border bear-border-zinc-600 hover:bear-bg-zinc-700 bear-text-zinc-400 hover:bear-text-zinc-300"
+  };
+  return i ? /* @__PURE__ */ e("button", { onClick: h, className: b, children: i }) : /* @__PURE__ */ g(
+    "button",
+    {
+      onClick: h,
+      className: v(
+        "bear-inline-flex bear-items-center bear-gap-1.5 bear-rounded bear-transition-all",
+        o[a].button,
+        p[u],
+        n && "bear-text-green-400",
+        b
+      ),
+      title: n ? c : l,
+      children: [
+        n ? /* @__PURE__ */ e(C, { className: o[a].icon }) : /* @__PURE__ */ e(z, { className: o[a].icon }),
+        x && /* @__PURE__ */ e("span", { className: o[a].text, children: n ? c : l })
+      ]
+    }
+  );
+};
+export {
+  B as CopyButton
+};