shad-m 1.0.0

package/dist/components/chart.mjs

@@ -0,0 +1,224 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import * as React from 'react';
+import * as RechartsPrimitive from 'recharts';
+import { cn } from '@/lib/utils';
+
+const THEMES = { light: "", dark: ".dark" };
+const ChartContext = React.createContext(null);
+function useChart() {
+  const context = React.useContext(ChartContext);
+  if (!context) {
+    throw new Error("useChart must be used within a <ChartContainer />");
+  }
+  return context;
+}
+const ChartContainer = React.forwardRef(({ id, className, children, config, ...props }, ref) => {
+  const uniqueId = React.useId();
+  const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
+  return /* @__PURE__ */ jsx(ChartContext.Provider, { value: { config }, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-chart": chartId,
+      ref,
+      className: cn(
+        "[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-none [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-sector]:outline-none [&_.recharts-surface]:outline-none",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(ChartStyle, { id: chartId, config }),
+        /* @__PURE__ */ jsx(RechartsPrimitive.ResponsiveContainer, { children })
+      ]
+    }
+  ) });
+});
+ChartContainer.displayName = "Chart";
+const ChartStyle = ({ id, config }) => {
+  const colorConfig = Object.entries(config).filter(([_, config2]) => config2.theme || config2.color);
+  if (!colorConfig.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    "style",
+    {
+      dangerouslySetInnerHTML: {
+        __html: Object.entries(THEMES).map(
+          ([theme, prefix]) => `
+${prefix} [data-chart=${id}] {
+${colorConfig.map(([key, itemConfig]) => {
+            const color = itemConfig.theme?.[theme] || itemConfig.color;
+            return color ? `  --color-${key}: ${color};` : null;
+          }).join("\n")}
+}
+`
+        ).join("\n")
+      }
+    }
+  );
+};
+const ChartTooltip = RechartsPrimitive.Tooltip;
+const ChartTooltipContent = React.forwardRef(
+  ({
+    active,
+    payload,
+    className,
+    indicator = "dot",
+    hideLabel = false,
+    hideIndicator = false,
+    label,
+    labelFormatter,
+    labelClassName,
+    formatter,
+    color,
+    nameKey,
+    labelKey
+  }, ref) => {
+    const { config } = useChart();
+    const tooltipLabel = React.useMemo(() => {
+      if (hideLabel || !payload?.length) {
+        return null;
+      }
+      const [item] = payload;
+      const key = `${labelKey || item?.dataKey || item?.name || "value"}`;
+      const itemConfig = getPayloadConfigFromPayload(config, item, key);
+      const value = !labelKey && typeof label === "string" ? config[label]?.label || label : itemConfig?.label;
+      if (labelFormatter) {
+        return /* @__PURE__ */ jsx("div", { className: cn("font-medium", labelClassName), children: labelFormatter(value, payload) });
+      }
+      if (!value) {
+        return null;
+      }
+      return /* @__PURE__ */ jsx("div", { className: cn("font-medium", labelClassName), children: value });
+    }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey]);
+    if (!active || !payload?.length) {
+      return null;
+    }
+    const nestLabel = payload.length === 1 && indicator !== "dot";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl",
+          className
+        ),
+        children: [
+          !nestLabel ? tooltipLabel : null,
+          /* @__PURE__ */ jsx("div", { className: "grid gap-1.5", children: payload.map((item, index) => {
+            const key = `${nameKey || item.name || item.dataKey || "value"}`;
+            const itemConfig = getPayloadConfigFromPayload(config, item, key);
+            const indicatorColor = color || item.payload.fill || item.color;
+            return /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn(
+                  "[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5",
+                  indicator === "dot" && "items-center"
+                ),
+                children: formatter && item?.value !== void 0 && item.name ? formatter(item.value, item.name, item, index, item.payload) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  itemConfig?.icon ? /* @__PURE__ */ jsx(itemConfig.icon, {}) : !hideIndicator && /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: cn(
+                        "shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]",
+                        {
+                          "h-2.5 w-2.5": indicator === "dot",
+                          "w-1": indicator === "line",
+                          "w-0 border-[1.5px] border-dashed bg-transparent": indicator === "dashed",
+                          "my-0.5": nestLabel && indicator === "dashed"
+                        }
+                      ),
+                      style: {
+                        "--color-bg": indicatorColor,
+                        "--color-border": indicatorColor
+                      }
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      className: cn(
+                        "flex flex-1 justify-between leading-none",
+                        nestLabel ? "items-end" : "items-center"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsxs("div", { className: "grid gap-1.5", children: [
+                          nestLabel ? tooltipLabel : null,
+                          /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: itemConfig?.label || item.name })
+                        ] }),
+                        item.value && /* @__PURE__ */ jsx("span", { className: "text-foreground font-mono font-medium tabular-nums", children: item.value.toLocaleString() })
+                      ]
+                    }
+                  )
+                ] })
+              },
+              item.dataKey
+            );
+          }) })
+        ]
+      }
+    );
+  }
+);
+ChartTooltipContent.displayName = "ChartTooltip";
+const ChartLegend = RechartsPrimitive.Legend;
+const ChartLegendContent = React.forwardRef(({ className, hideIcon = false, payload, verticalAlign = "bottom", nameKey }, ref) => {
+  const { config } = useChart();
+  if (!payload?.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex items-center justify-center gap-4",
+        verticalAlign === "top" ? "pb-3" : "pt-3",
+        className
+      ),
+      children: payload.map((item) => {
+        const key = `${nameKey || item.dataKey || "value"}`;
+        const itemConfig = getPayloadConfigFromPayload(config, item, key);
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"
+            ),
+            children: [
+              itemConfig?.icon && !hideIcon ? /* @__PURE__ */ jsx(itemConfig.icon, {}) : /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "h-2 w-2 shrink-0 rounded-[2px]",
+                  style: {
+                    backgroundColor: item.color
+                  }
+                }
+              ),
+              itemConfig?.label
+            ]
+          },
+          item.value
+        );
+      })
+    }
+  );
+});
+ChartLegendContent.displayName = "ChartLegend";
+function getPayloadConfigFromPayload(config, payload, key) {
+  if (typeof payload !== "object" || payload === null) {
+    return void 0;
+  }
+  const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null ? payload.payload : void 0;
+  let configLabelKey = key;
+  if (key in payload && typeof payload[key] === "string") {
+    configLabelKey = payload[key];
+  } else if (payloadPayload && key in payloadPayload && typeof payloadPayload[key] === "string") {
+    configLabelKey = payloadPayload[key];
+  }
+  return configLabelKey in config ? config[configLabelKey] : config[key];
+}
+
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent };
+//# sourceMappingURL=chart.mjs.map
+//# sourceMappingURL=chart.mjs.map

package/dist/components/chart.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/chart.tsx"],"names":["config"],"mappings":"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","file":"chart.mjs","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as RechartsPrimitive from 'recharts';\n\nimport { cn } from '@/lib/utils';\n\n// Format: { THEME_NAME: CSS_SELECTOR }\nconst THEMES = { light: '', dark: '.dark' } as const;\n\nexport type ChartConfig = {\n  // eslint-disable-next-line no-unused-vars\n  [_ in string]: {\n    label?: React.ReactNode;\n    icon?: React.ComponentType;\n  } & (\n    | { color?: string; theme?: never }\n    | { color?: never; theme: Record<keyof typeof THEMES, string> }\n  );\n};\n\ntype ChartContextProps = {\n  config: ChartConfig;\n};\n\nconst ChartContext = React.createContext<ChartContextProps | null>(null);\n\nfunction useChart() {\n  const context = React.useContext(ChartContext);\n\n  if (!context) {\n    throw new Error('useChart must be used within a <ChartContainer />');\n  }\n\n  return context;\n}\n\nconst ChartContainer = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentProps<'div'> & {\n    config: ChartConfig;\n    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>['children'];\n  }\n>(({ id, className, children, config, ...props }, ref) => {\n  const uniqueId = React.useId();\n  const chartId = `chart-${id || uniqueId.replace(/:/g, '')}`;\n\n  return (\n    <ChartContext.Provider value={{ config }}>\n      <div\n        data-chart={chartId}\n        ref={ref}\n        className={cn(\n          \"[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-none [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-sector]:outline-none [&_.recharts-surface]:outline-none\",\n          className,\n        )}\n        {...props}\n      >\n        <ChartStyle id={chartId} config={config} />\n        <RechartsPrimitive.ResponsiveContainer>{children}</RechartsPrimitive.ResponsiveContainer>\n      </div>\n    </ChartContext.Provider>\n  );\n});\nChartContainer.displayName = 'Chart';\n\nconst ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {\n  const colorConfig = Object.entries(config).filter(([_, config]) => config.theme || config.color);\n\n  if (!colorConfig.length) {\n    return null;\n  }\n\n  return (\n    <style\n      dangerouslySetInnerHTML={{\n        __html: Object.entries(THEMES)\n          .map(\n            ([theme, prefix]) => `\n${prefix} [data-chart=${id}] {\n${colorConfig\n  .map(([key, itemConfig]) => {\n    const color = itemConfig.theme?.[theme as keyof typeof itemConfig.theme] || itemConfig.color;\n    return color ? `  --color-${key}: ${color};` : null;\n  })\n  .join('\\n')}\n}\n`,\n          )\n          .join('\\n'),\n      }}\n    />\n  );\n};\n\nconst ChartTooltip = RechartsPrimitive.Tooltip;\n\nconst ChartTooltipContent = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentProps<typeof RechartsPrimitive.Tooltip> &\n    React.ComponentProps<'div'> & {\n      hideLabel?: boolean;\n      hideIndicator?: boolean;\n      indicator?: 'line' | 'dot' | 'dashed';\n      nameKey?: string;\n      labelKey?: string;\n    }\n>(\n  (\n    {\n      active,\n      payload,\n      className,\n      indicator = 'dot',\n      hideLabel = false,\n      hideIndicator = false,\n      label,\n      labelFormatter,\n      labelClassName,\n      formatter,\n      color,\n      nameKey,\n      labelKey,\n    },\n    ref,\n  ) => {\n    const { config } = useChart();\n\n    const tooltipLabel = React.useMemo(() => {\n      if (hideLabel || !payload?.length) {\n        return null;\n      }\n\n      const [item] = payload;\n      const key = `${labelKey || item?.dataKey || item?.name || 'value'}`;\n      const itemConfig = getPayloadConfigFromPayload(config, item, key);\n      const value =\n        !labelKey && typeof label === 'string'\n          ? config[label as keyof typeof config]?.label || label\n          : itemConfig?.label;\n\n      if (labelFormatter) {\n        return (\n          <div className={cn('font-medium', labelClassName)}>{labelFormatter(value, payload)}</div>\n        );\n      }\n\n      if (!value) {\n        return null;\n      }\n\n      return <div className={cn('font-medium', labelClassName)}>{value}</div>;\n    }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey]);\n\n    if (!active || !payload?.length) {\n      return null;\n    }\n\n    const nestLabel = payload.length === 1 && indicator !== 'dot';\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl',\n          className,\n        )}\n      >\n        {!nestLabel ? tooltipLabel : null}\n        <div className=\"grid gap-1.5\">\n          {payload.map((item, index) => {\n            const key = `${nameKey || item.name || item.dataKey || 'value'}`;\n            const itemConfig = getPayloadConfigFromPayload(config, item, key);\n            const indicatorColor = color || item.payload.fill || item.color;\n\n            return (\n              <div\n                key={item.dataKey}\n                className={cn(\n                  '[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5',\n                  indicator === 'dot' && 'items-center',\n                )}\n              >\n                {formatter && item?.value !== undefined && item.name ? (\n                  formatter(item.value, item.name, item, index, item.payload)\n                ) : (\n                  <>\n                    {itemConfig?.icon ? (\n                      <itemConfig.icon />\n                    ) : (\n                      !hideIndicator && (\n                        <div\n                          className={cn(\n                            'shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]',\n                            {\n                              'h-2.5 w-2.5': indicator === 'dot',\n                              'w-1': indicator === 'line',\n                              'w-0 border-[1.5px] border-dashed bg-transparent':\n                                indicator === 'dashed',\n                              'my-0.5': nestLabel && indicator === 'dashed',\n                            },\n                          )}\n                          style={\n                            {\n                              '--color-bg': indicatorColor,\n                              '--color-border': indicatorColor,\n                            } as React.CSSProperties\n                          }\n                        />\n                      )\n                    )}\n                    <div\n                      className={cn(\n                        'flex flex-1 justify-between leading-none',\n                        nestLabel ? 'items-end' : 'items-center',\n                      )}\n                    >\n                      <div className=\"grid gap-1.5\">\n                        {nestLabel ? tooltipLabel : null}\n                        <span className=\"text-muted-foreground\">\n                          {itemConfig?.label || item.name}\n                        </span>\n                      </div>\n                      {item.value && (\n                        <span className=\"text-foreground font-mono font-medium tabular-nums\">\n                          {item.value.toLocaleString()}\n                        </span>\n                      )}\n                    </div>\n                  </>\n                )}\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    );\n  },\n);\nChartTooltipContent.displayName = 'ChartTooltip';\n\nconst ChartLegend = RechartsPrimitive.Legend;\n\nconst ChartLegendContent = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentProps<'div'> &\n    Pick<RechartsPrimitive.LegendProps, 'payload' | 'verticalAlign'> & {\n      hideIcon?: boolean;\n      nameKey?: string;\n    }\n>(({ className, hideIcon = false, payload, verticalAlign = 'bottom', nameKey }, ref) => {\n  const { config } = useChart();\n\n  if (!payload?.length) {\n    return null;\n  }\n\n  return (\n    <div\n      ref={ref}\n      className={cn(\n        'flex items-center justify-center gap-4',\n        verticalAlign === 'top' ? 'pb-3' : 'pt-3',\n        className,\n      )}\n    >\n      {payload.map((item) => {\n        const key = `${nameKey || item.dataKey || 'value'}`;\n        const itemConfig = getPayloadConfigFromPayload(config, item, key);\n\n        return (\n          <div\n            key={item.value}\n            className={cn(\n              '[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3',\n            )}\n          >\n            {itemConfig?.icon && !hideIcon ? (\n              <itemConfig.icon />\n            ) : (\n              <div\n                className=\"h-2 w-2 shrink-0 rounded-[2px]\"\n                style={{\n                  backgroundColor: item.color,\n                }}\n              />\n            )}\n            {itemConfig?.label}\n          </div>\n        );\n      })}\n    </div>\n  );\n});\nChartLegendContent.displayName = 'ChartLegend';\n\n// Helper to extract item config from a payload.\nfunction getPayloadConfigFromPayload(config: ChartConfig, payload: unknown, key: string) {\n  if (typeof payload !== 'object' || payload === null) {\n    return undefined;\n  }\n\n  const payloadPayload =\n    'payload' in payload && typeof payload.payload === 'object' && payload.payload !== null\n      ? payload.payload\n      : undefined;\n\n  let configLabelKey: string = key;\n\n  if (key in payload && typeof payload[key as keyof typeof payload] === 'string') {\n    configLabelKey = payload[key as keyof typeof payload] as string;\n  } else if (\n    payloadPayload &&\n    key in payloadPayload &&\n    typeof payloadPayload[key as keyof typeof payloadPayload] === 'string'\n  ) {\n    configLabelKey = payloadPayload[key as keyof typeof payloadPayload] as string;\n  }\n\n  return configLabelKey in config ? config[configLabelKey] : config[key as keyof typeof config];\n}\n\nexport {\n  ChartContainer,\n  ChartTooltip,\n  ChartTooltipContent,\n  ChartLegend,\n  ChartLegendContent,\n  ChartStyle,\n};\n"]}

package/dist/components/checkbox.d.ts

@@ -0,0 +1,18 @@
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import * as React from 'react';
+import { TrackingPropsType } from '@/lib/types';
+interface TrackingData {
+    [key: string]: any;
+    identity?: string;
+    object_type?: 'checkbox';
+    object_name?: string;
+    status?: 'selected' | 'unselected';
+    value?: string;
+}
+interface Props extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>, TrackingPropsType {
+    indicator?: React.ReactNode;
+    trackingData?: TrackingData;
+}
+declare const Checkbox: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
+export { Checkbox };
+//# sourceMappingURL=checkbox.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/components/checkbox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAC9D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAiB,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAE/D,UAAU,YAAY;IACpB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,UAAU,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,KACR,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,EAAE,iBAAiB;IACxF,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAID,QAAA,MAAM,QAAQ,iFAmEb,CAAC;AAGF,OAAO,EAAE,QAAQ,EAAE,CAAC"}

package/dist/components/checkbox.js

@@ -0,0 +1,97 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var icons = require('@/icons');
+var utils = require('@/lib/utils');
+var CheckboxPrimitive = require('@radix-ui/react-checkbox');
+var React = require('react');
+var UISystemProvider = require('@/providers/UISystemProvider');
+var types = require('@/lib/types');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+const defaultIndicator = /* @__PURE__ */ jsxRuntime.jsx(icons.CheckOutlinedIcon16, { className: "ic-white h-4 w-4" });
+const Checkbox = React__namespace.forwardRef(
+  ({
+    className,
+    indicator = defaultIndicator,
+    trackingName,
+    trackingData,
+    trackingIndex,
+    blockSendTracking,
+    onCheckedChange,
+    ...props
+  }, ref) => {
+    const { sendTrack } = UISystemProvider.useUISystemContext();
+    const handleCheckedChange = React__namespace.useCallback(
+      (checked) => {
+        onCheckedChange?.(checked);
+        if (sendTrack && !blockSendTracking && (trackingName || trackingData?.identity)) {
+          const mergedTrackingData = {
+            ...trackingData,
+            object_type: "checkbox",
+            status: checked === true ? "selected" : "unselected",
+            value: props.value
+          };
+          const otherData = { ...mergedTrackingData };
+          if (trackingIndex !== void 0 && trackingIndex !== null) {
+            otherData.index = trackingIndex;
+          }
+          sendTrack(trackingName || `input_${trackingData?.identity}`, types.TRACKING_TYPE.click, otherData);
+        }
+      },
+      [
+        onCheckedChange,
+        sendTrack,
+        blockSendTracking,
+        trackingName,
+        trackingData,
+        trackingIndex,
+        props.value
+      ]
+    );
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      CheckboxPrimitive__namespace.Root,
+      {
+        ref,
+        className: utils.cn(
+          "border-input data-[state=checked]:text-primary-foreground disabled:bg-muted disabled:data-[state=checked]:bg-muted data-[state=checked]:border-primary data-[state=checked]:bg-primary peer h-5 w-5 shrink-0 rounded-[2px] border-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:border-none",
+          className
+        ),
+        onCheckedChange: handleCheckedChange,
+        ...props,
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          CheckboxPrimitive__namespace.Indicator,
+          {
+            className: utils.cn("flex items-center justify-center text-current"),
+            children: indicator
+          }
+        )
+      }
+    );
+  }
+);
+Checkbox.displayName = CheckboxPrimitive__namespace.Root.displayName;
+
+exports.Checkbox = Checkbox;
+//# sourceMappingURL=checkbox.js.map
+//# sourceMappingURL=checkbox.js.map

package/dist/components/checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/checkbox.tsx"],"names":["jsx","CheckOutlinedIcon16","React","useUISystemContext","TRACKING_TYPE","CheckboxPrimitive","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBA,MAAM,gBAAA,mBAAmBA,cAAA,CAACC,yBAAA,EAAA,EAAoB,SAAA,EAAU,kBAAA,EAAmB,CAAA;AAE3E,MAAM,WAAWC,gBAAA,CAAM,UAAA;AAAA,EACrB,CACE;AAAA,IACE,SAAA;AAAA,IACA,SAAA,GAAY,gBAAA;AAAA,IACZ,YAAA;AAAA,IACA,YAAA;AAAA,IACA,aAAA;AAAA,IACA,iBAAA;AAAA,IACA,eAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,MAAM,EAAE,SAAA,EAAU,GAAIC,mCAAA,EAAmB;AAEzC,IAAA,MAAM,sBAAsBD,gBAAA,CAAM,WAAA;AAAA,MAChC,CAAC,OAAA,KAAuC;AAEtC,QAAA,eAAA,GAAkB,OAAO,CAAA;AAGzB,QAAA,IAAI,SAAA,IAAa,CAAC,iBAAA,KAAsB,YAAA,IAAgB,cAAc,QAAA,CAAA,EAAW;AAC/E,UAAA,MAAM,kBAAA,GAAqB;AAAA,YACzB,GAAG,YAAA;AAAA,YACH,WAAA,EAAa,UAAA;AAAA,YACb,MAAA,EAAQ,OAAA,KAAY,IAAA,GAAO,UAAA,GAAa,YAAA;AAAA,YACxC,OAAO,KAAA,CAAM;AAAA,WACf;AAEA,UAAA,MAAM,SAAA,GAAiC,EAAE,GAAG,kBAAA,EAAmB;AAC/D,UAAA,IAAI,aAAA,KAAkB,MAAA,IAAa,aAAA,KAAkB,IAAA,EAAM;AACzD,YAAA,SAAA,CAAU,KAAA,GAAQ,aAAA;AAAA,UACpB;AAEA,UAAA,SAAA,CAAU,gBAAgB,CAAA,MAAA,EAAS,YAAA,EAAc,QAAQ,CAAA,CAAA,EAAIE,mBAAA,CAAc,OAAO,SAAS,CAAA;AAAA,QAC7F;AAAA,MACF,CAAA;AAAA,MACA;AAAA,QACE,eAAA;AAAA,QACA,SAAA;AAAA,QACA,iBAAA;AAAA,QACA,YAAA;AAAA,QACA,YAAA;AAAA,QACA,aAAA;AAAA,QACA,KAAA,CAAM;AAAA;AACR,KACF;AAEA,IAAA,uBACEJ,cAAA;AAAA,MAACK,4BAAA,CAAkB,IAAA;AAAA,MAAlB;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAWC,QAAA;AAAA,UACT,iTAAA;AAAA,UACA;AAAA,SACF;AAAA,QACA,eAAA,EAAiB,mBAAA;AAAA,QAChB,GAAG,KAAA;AAAA,QAEJ,QAAA,kBAAAN,cAAA;AAAA,UAACK,4BAAA,CAAkB,SAAA;AAAA,UAAlB;AAAA,YACC,SAAA,EAAWC,SAAG,+CAA+C,CAAA;AAAA,YAE5D,QAAA,EAAA;AAAA;AAAA;AACH;AAAA,KACF;AAAA,EAEJ;AACF;AACA,QAAA,CAAS,WAAA,GAAcD,6BAAkB,IAAA,CAAK,WAAA","file":"checkbox.js","sourcesContent":["'use client';\nimport { CheckOutlinedIcon16 } from '@/icons';\nimport { cn } from '@/lib/utils';\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox';\nimport * as React from 'react';\nimport { useUISystemContext } from '@/providers/UISystemProvider';\nimport { TRACKING_TYPE, TrackingPropsType } from '@/lib/types';\n\ninterface TrackingData {\n  [key: string]: any;\n  identity?: string;\n  object_type?: 'checkbox';\n  object_name?: string; // Tên label hiển thị trên UI của Selection\n  status?: 'selected' | 'unselected'; // Nếu user chọn --> value là \"selected\" - Nếu user bỏ chọn --> value là \"unselected\"\n  value?: string; // Tên value hiển thị trên UI mà user chọn\n}\n\ninterface Props\n  extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>, TrackingPropsType {\n  indicator?: React.ReactNode;\n  trackingData?: TrackingData;\n}\n\nconst defaultIndicator = <CheckOutlinedIcon16 className=\"ic-white h-4 w-4\" />;\n\nconst Checkbox = React.forwardRef<React.ElementRef<typeof CheckboxPrimitive.Root>, Props>(\n  (\n    {\n      className,\n      indicator = defaultIndicator,\n      trackingName,\n      trackingData,\n      trackingIndex,\n      blockSendTracking,\n      onCheckedChange,\n      ...props\n    },\n    ref,\n  ) => {\n    const { sendTrack } = useUISystemContext();\n\n    const handleCheckedChange = React.useCallback(\n      (checked: boolean | 'indeterminate') => {\n        // Call original handler\n        onCheckedChange?.(checked);\n\n        // Send tracking\n        if (sendTrack && !blockSendTracking && (trackingName || trackingData?.identity)) {\n          const mergedTrackingData = {\n            ...trackingData,\n            object_type: \"checkbox\",\n            status: checked === true ? 'selected' : 'unselected',\n            value: props.value,\n          };\n\n          const otherData: Record<string, any> = { ...mergedTrackingData };\n          if (trackingIndex !== undefined && trackingIndex !== null) {\n            otherData.index = trackingIndex;\n          }\n\n          sendTrack(trackingName || `input_${trackingData?.identity}`, TRACKING_TYPE.click, otherData);\n        }\n      },\n      [\n        onCheckedChange,\n        sendTrack,\n        blockSendTracking,\n        trackingName,\n        trackingData,\n        trackingIndex,\n        props.value,\n      ],\n    );\n\n    return (\n      <CheckboxPrimitive.Root\n        ref={ref}\n        className={cn(\n          'border-input data-[state=checked]:text-primary-foreground disabled:bg-muted disabled:data-[state=checked]:bg-muted data-[state=checked]:border-primary data-[state=checked]:bg-primary peer h-5 w-5 shrink-0 rounded-[2px] border-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:border-none',\n          className,\n        )}\n        onCheckedChange={handleCheckedChange}\n        {...props}\n      >\n        <CheckboxPrimitive.Indicator\n          className={cn('flex items-center justify-center text-current')}\n        >\n          {indicator}\n        </CheckboxPrimitive.Indicator>\n      </CheckboxPrimitive.Root>\n    );\n  },\n);\nCheckbox.displayName = CheckboxPrimitive.Root.displayName;\n\nexport { Checkbox };\n"]}

package/dist/components/checkbox.mjs

@@ -0,0 +1,74 @@
+import { jsx } from 'react/jsx-runtime';
+import { CheckOutlinedIcon16 } from '@/icons';
+import { cn } from '@/lib/utils';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import * as React from 'react';
+import { useUISystemContext } from '@/providers/UISystemProvider';
+import { TRACKING_TYPE } from '@/lib/types';
+
+const defaultIndicator = /* @__PURE__ */ jsx(CheckOutlinedIcon16, { className: "ic-white h-4 w-4" });
+const Checkbox = React.forwardRef(
+  ({
+    className,
+    indicator = defaultIndicator,
+    trackingName,
+    trackingData,
+    trackingIndex,
+    blockSendTracking,
+    onCheckedChange,
+    ...props
+  }, ref) => {
+    const { sendTrack } = useUISystemContext();
+    const handleCheckedChange = React.useCallback(
+      (checked) => {
+        onCheckedChange?.(checked);
+        if (sendTrack && !blockSendTracking && (trackingName || trackingData?.identity)) {
+          const mergedTrackingData = {
+            ...trackingData,
+            object_type: "checkbox",
+            status: checked === true ? "selected" : "unselected",
+            value: props.value
+          };
+          const otherData = { ...mergedTrackingData };
+          if (trackingIndex !== void 0 && trackingIndex !== null) {
+            otherData.index = trackingIndex;
+          }
+          sendTrack(trackingName || `input_${trackingData?.identity}`, TRACKING_TYPE.click, otherData);
+        }
+      },
+      [
+        onCheckedChange,
+        sendTrack,
+        blockSendTracking,
+        trackingName,
+        trackingData,
+        trackingIndex,
+        props.value
+      ]
+    );
+    return /* @__PURE__ */ jsx(
+      CheckboxPrimitive.Root,
+      {
+        ref,
+        className: cn(
+          "border-input data-[state=checked]:text-primary-foreground disabled:bg-muted disabled:data-[state=checked]:bg-muted data-[state=checked]:border-primary data-[state=checked]:bg-primary peer h-5 w-5 shrink-0 rounded-[2px] border-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:border-none",
+          className
+        ),
+        onCheckedChange: handleCheckedChange,
+        ...props,
+        children: /* @__PURE__ */ jsx(
+          CheckboxPrimitive.Indicator,
+          {
+            className: cn("flex items-center justify-center text-current"),
+            children: indicator
+          }
+        )
+      }
+    );
+  }
+);
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+
+export { Checkbox };
+//# sourceMappingURL=checkbox.mjs.map
+//# sourceMappingURL=checkbox.mjs.map

package/dist/components/checkbox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/checkbox.tsx"],"names":[],"mappings":";;;;;;;;AAuBA,MAAM,gBAAA,mBAAmB,GAAA,CAAC,mBAAA,EAAA,EAAoB,SAAA,EAAU,kBAAA,EAAmB,CAAA;AAE3E,MAAM,WAAW,KAAA,CAAM,UAAA;AAAA,EACrB,CACE;AAAA,IACE,SAAA;AAAA,IACA,SAAA,GAAY,gBAAA;AAAA,IACZ,YAAA;AAAA,IACA,YAAA;AAAA,IACA,aAAA;AAAA,IACA,iBAAA;AAAA,IACA,eAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,MAAM,EAAE,SAAA,EAAU,GAAI,kBAAA,EAAmB;AAEzC,IAAA,MAAM,sBAAsB,KAAA,CAAM,WAAA;AAAA,MAChC,CAAC,OAAA,KAAuC;AAEtC,QAAA,eAAA,GAAkB,OAAO,CAAA;AAGzB,QAAA,IAAI,SAAA,IAAa,CAAC,iBAAA,KAAsB,YAAA,IAAgB,cAAc,QAAA,CAAA,EAAW;AAC/E,UAAA,MAAM,kBAAA,GAAqB;AAAA,YACzB,GAAG,YAAA;AAAA,YACH,WAAA,EAAa,UAAA;AAAA,YACb,MAAA,EAAQ,OAAA,KAAY,IAAA,GAAO,UAAA,GAAa,YAAA;AAAA,YACxC,OAAO,KAAA,CAAM;AAAA,WACf;AAEA,UAAA,MAAM,SAAA,GAAiC,EAAE,GAAG,kBAAA,EAAmB;AAC/D,UAAA,IAAI,aAAA,KAAkB,MAAA,IAAa,aAAA,KAAkB,IAAA,EAAM;AACzD,YAAA,SAAA,CAAU,KAAA,GAAQ,aAAA;AAAA,UACpB;AAEA,UAAA,SAAA,CAAU,gBAAgB,CAAA,MAAA,EAAS,YAAA,EAAc,QAAQ,CAAA,CAAA,EAAI,aAAA,CAAc,OAAO,SAAS,CAAA;AAAA,QAC7F;AAAA,MACF,CAAA;AAAA,MACA;AAAA,QACE,eAAA;AAAA,QACA,SAAA;AAAA,QACA,iBAAA;AAAA,QACA,YAAA;AAAA,QACA,YAAA;AAAA,QACA,aAAA;AAAA,QACA,KAAA,CAAM;AAAA;AACR,KACF;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,iBAAA,CAAkB,IAAA;AAAA,MAAlB;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,iTAAA;AAAA,UACA;AAAA,SACF;AAAA,QACA,eAAA,EAAiB,mBAAA;AAAA,QAChB,GAAG,KAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA;AAAA,UAAC,iBAAA,CAAkB,SAAA;AAAA,UAAlB;AAAA,YACC,SAAA,EAAW,GAAG,+CAA+C,CAAA;AAAA,YAE5D,QAAA,EAAA;AAAA;AAAA;AACH;AAAA,KACF;AAAA,EAEJ;AACF;AACA,QAAA,CAAS,WAAA,GAAc,kBAAkB,IAAA,CAAK,WAAA","file":"checkbox.mjs","sourcesContent":["'use client';\nimport { CheckOutlinedIcon16 } from '@/icons';\nimport { cn } from '@/lib/utils';\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox';\nimport * as React from 'react';\nimport { useUISystemContext } from '@/providers/UISystemProvider';\nimport { TRACKING_TYPE, TrackingPropsType } from '@/lib/types';\n\ninterface TrackingData {\n  [key: string]: any;\n  identity?: string;\n  object_type?: 'checkbox';\n  object_name?: string; // Tên label hiển thị trên UI của Selection\n  status?: 'selected' | 'unselected'; // Nếu user chọn --> value là \"selected\" - Nếu user bỏ chọn --> value là \"unselected\"\n  value?: string; // Tên value hiển thị trên UI mà user chọn\n}\n\ninterface Props\n  extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>, TrackingPropsType {\n  indicator?: React.ReactNode;\n  trackingData?: TrackingData;\n}\n\nconst defaultIndicator = <CheckOutlinedIcon16 className=\"ic-white h-4 w-4\" />;\n\nconst Checkbox = React.forwardRef<React.ElementRef<typeof CheckboxPrimitive.Root>, Props>(\n  (\n    {\n      className,\n      indicator = defaultIndicator,\n      trackingName,\n      trackingData,\n      trackingIndex,\n      blockSendTracking,\n      onCheckedChange,\n      ...props\n    },\n    ref,\n  ) => {\n    const { sendTrack } = useUISystemContext();\n\n    const handleCheckedChange = React.useCallback(\n      (checked: boolean | 'indeterminate') => {\n        // Call original handler\n        onCheckedChange?.(checked);\n\n        // Send tracking\n        if (sendTrack && !blockSendTracking && (trackingName || trackingData?.identity)) {\n          const mergedTrackingData = {\n            ...trackingData,\n            object_type: \"checkbox\",\n            status: checked === true ? 'selected' : 'unselected',\n            value: props.value,\n          };\n\n          const otherData: Record<string, any> = { ...mergedTrackingData };\n          if (trackingIndex !== undefined && trackingIndex !== null) {\n            otherData.index = trackingIndex;\n          }\n\n          sendTrack(trackingName || `input_${trackingData?.identity}`, TRACKING_TYPE.click, otherData);\n        }\n      },\n      [\n        onCheckedChange,\n        sendTrack,\n        blockSendTracking,\n        trackingName,\n        trackingData,\n        trackingIndex,\n        props.value,\n      ],\n    );\n\n    return (\n      <CheckboxPrimitive.Root\n        ref={ref}\n        className={cn(\n          'border-input data-[state=checked]:text-primary-foreground disabled:bg-muted disabled:data-[state=checked]:bg-muted data-[state=checked]:border-primary data-[state=checked]:bg-primary peer h-5 w-5 shrink-0 rounded-[2px] border-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:border-none',\n          className,\n        )}\n        onCheckedChange={handleCheckedChange}\n        {...props}\n      >\n        <CheckboxPrimitive.Indicator\n          className={cn('flex items-center justify-center text-current')}\n        >\n          {indicator}\n        </CheckboxPrimitive.Indicator>\n      </CheckboxPrimitive.Root>\n    );\n  },\n);\nCheckbox.displayName = CheckboxPrimitive.Root.displayName;\n\nexport { Checkbox };\n"]}

package/dist/components/chip.d.ts

@@ -0,0 +1,30 @@
+import { TrackingPropsType } from '@/lib/types';
+import { type VariantProps } from 'class-variance-authority';
+import React from 'react';
+declare const chipVariants: (props?: ({
+    size?: "sm" | "lg" | "default" | "circle" | null | undefined;
+    status?: "active" | "default" | "destructive" | "disable" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface TrackingData {
+    [key: string]: any;
+    identity?: string;
+    object_type?: 'chip';
+    object_name?: string;
+    status?: 'selected' | 'unselected';
+    value?: string;
+}
+export type Props = JSX.IntrinsicElements['button'] & VariantProps<typeof chipVariants> & TrackingPropsType & {
+    className?: string;
+    tag: React.ReactNode;
+    leftIcon?: React.ReactNode;
+    rightIcon?: React.ReactNode;
+    badgeComponent?: React.ReactNode;
+    as?: string;
+    trackingData?: TrackingData;
+};
+declare const Chip: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export type ChipVariants = VariantProps<typeof chipVariants>;
+export type ChipSize = NonNullable<ChipVariants['size']>;
+export type ChipStatus = NonNullable<ChipVariants['status']>;
+export { Chip };
+//# sourceMappingURL=chip.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../src/components/chip.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAEhD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,QAAA,MAAM,YAAY;;;8EAwBjB,CAAC;AAEF,UAAU,YAAY;IACpB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,MAAM,KAAK,GAAG,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,GACjD,YAAY,CAAC,OAAO,YAAY,CAAC,GACjC,iBAAiB,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B,CAAC;AAEJ,QAAA,MAAM,IAAI,2FAmDR,CAAC;AAKH,MAAM,MAAM,YAAY,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AAC7D,MAAM,MAAM,QAAQ,GAAG,WAAW,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC;AACzD,MAAM,MAAM,UAAU,GAAG,WAAW,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC;AAE7D,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/components/chip.js

@@ -0,0 +1,88 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var interactive = require('@/common/interactive');
+var utils = require('@/lib/utils');
+var classVarianceAuthority = require('class-variance-authority');
+var React = require('react');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const chipVariants = classVarianceAuthority.cva(
+  "width-max flex font-medium transition-all duration-300 ease-in-out focus-within:outline-none cursor-pointer items-center border",
+  {
+    variants: {
+      size: {
+        sm: "py-1.5 px-3 h-10 text-t16 rounded-full gap-1.5",
+        default: "py-2 px-4 h-12 text-t16 rounded-full gap-2",
+        lg: "py-3 px-4 h-14 text-t16 rounded-full gap-2",
+        circle: "w-12 h-12 text-t16 rounded-full justify-center"
+      },
+      status: {
+        default: "border-border bg-background text-foreground hover:bg-accent hover:text-accent-foreground",
+        active: "border-primary bg-primary/10 text-primary hover:bg-primary/20",
+        destructive: "border-destructive bg-destructive/10 text-destructive hover:bg-destructive/20",
+        disable: "border-border bg-muted text-muted-foreground cursor-not-allowed opacity-60"
+      }
+    },
+    defaultVariants: {
+      size: "default",
+      status: "default"
+    }
+  }
+);
+const Chip = React__default.default.forwardRef((inProps, ref) => {
+  const {
+    tag,
+    size,
+    status,
+    className,
+    leftIcon,
+    rightIcon,
+    badgeComponent,
+    trackingName,
+    trackingData,
+    trackingIndex,
+    blockSendTracking,
+    as = "button",
+    ...rest
+  } = inProps;
+  const enhancedTrackingData = React__default.default.useMemo(() => {
+    const data = { ...trackingData };
+    if (!data.object_name && typeof tag === "string") {
+      data.object_name = tag;
+    }
+    return data;
+  }, [trackingData, tag]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    interactive.Pressable,
+    {
+      as,
+      trackingName: trackingName || `input_${trackingData?.identity}`,
+      trackingData: enhancedTrackingData,
+      trackingIndex,
+      blockSendTracking,
+      "data-status-buttonchip": status,
+      className: utils.cn(chipVariants({ size, status }), className),
+      ref,
+      "aria-labelledby": "chip",
+      "data-status": status,
+      "data-disabled": status === "disable" ? "true" : void 0,
+      disabled: status === "disable",
+      ...rest,
+      children: [
+        leftIcon,
+        tag,
+        rightIcon,
+        badgeComponent
+      ]
+    }
+  );
+});
+Chip.displayName = "Chip";
+
+exports.Chip = Chip;
+//# sourceMappingURL=chip.js.map
+//# sourceMappingURL=chip.js.map

package/dist/components/chip.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/chip.tsx"],"names":["cva","React","jsxs","Pressable","cn"],"mappings":";;;;;;;;;;;;AAMA,MAAM,YAAA,GAAeA,0BAAA;AAAA,EACnB,iIAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,gDAAA;AAAA,QACJ,OAAA,EAAS,4CAAA;AAAA,QACT,EAAA,EAAI,4CAAA;AAAA,QACJ,MAAA,EAAQ;AAAA,OACV;AAAA,MACA,MAAA,EAAQ;AAAA,QACN,OAAA,EACE,0FAAA;AAAA,QACF,MAAA,EAAQ,+DAAA;AAAA,QACR,WAAA,EACE,+EAAA;AAAA,QACF,OAAA,EAAS;AAAA;AACX,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM,SAAA;AAAA,MACN,MAAA,EAAQ;AAAA;AACV;AAEJ,CAAA;AAuBA,MAAM,IAAA,GAAOC,sBAAA,CAAM,UAAA,CAAkC,CAAC,SAAS,GAAA,KAAQ;AACrE,EAAA,MAAM;AAAA,IACJ,GAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,cAAA;AAAA,IACA,YAAA;AAAA,IACA,YAAA;AAAA,IACA,aAAA;AAAA,IACA,iBAAA;AAAA,IACA,EAAA,GAAK,QAAA;AAAA,IACL,GAAG;AAAA,GACL,GAAI,OAAA;AAGJ,EAAA,MAAM,oBAAA,GAAuBA,sBAAA,CAAM,OAAA,CAAQ,MAAM;AAC/C,IAAA,MAAM,IAAA,GAAO,EAAE,GAAG,YAAA,EAAa;AAG/B,IAAA,IAAI,CAAC,IAAA,CAAK,WAAA,IAAe,OAAO,QAAQ,QAAA,EAAU;AAChD,MAAA,IAAA,CAAK,WAAA,GAAc,GAAA;AAAA,IACrB;AAEA,IAAA,OAAO,IAAA;AAAA,EACT,CAAA,EAAG,CAAC,YAAA,EAAc,GAAG,CAAC,CAAA;AAEtB,EAAA,uBACEC,eAAA;AAAA,IAACC,qBAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,YAAA,EAAc,YAAA,IAAgB,CAAA,MAAA,EAAS,YAAA,EAAc,QAAQ,CAAA,CAAA;AAAA,MAC7D,YAAA,EAAc,oBAAA;AAAA,MACd,aAAA;AAAA,MACA,iBAAA;AAAA,MACA,wBAAA,EAAwB,MAAA;AAAA,MACxB,SAAA,EAAWC,SAAG,YAAA,CAAa,EAAE,MAAM,MAAA,EAAQ,GAAG,SAAS,CAAA;AAAA,MACvD,GAAA;AAAA,MACA,iBAAA,EAAgB,MAAA;AAAA,MAChB,aAAA,EAAa,MAAA;AAAA,MACb,eAAA,EAAe,MAAA,KAAW,SAAA,GAAY,MAAA,GAAS,MAAA;AAAA,MAC/C,UAAU,MAAA,KAAW,SAAA;AAAA,MACpB,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,GAAA;AAAA,QACA,SAAA;AAAA,QACA;AAAA;AAAA;AAAA,GACH;AAEJ,CAAC;AAED,IAAA,CAAK,WAAA,GAAc,MAAA","file":"chip.js","sourcesContent":["import { Pressable } from '@/common/interactive';\nimport { TrackingPropsType } from '@/lib/types';\nimport { cn } from '@/lib/utils';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport React from 'react';\n\nconst chipVariants = cva(\n  'width-max flex font-medium transition-all duration-300 ease-in-out focus-within:outline-none cursor-pointer items-center border',\n  {\n    variants: {\n      size: {\n        sm: 'py-1.5 px-3 h-10 text-t16 rounded-full gap-1.5',\n        default: 'py-2 px-4 h-12 text-t16 rounded-full gap-2',\n        lg: 'py-3 px-4 h-14 text-t16 rounded-full gap-2',\n        circle: 'w-12 h-12 text-t16 rounded-full justify-center',\n      },\n      status: {\n        default:\n          'border-border bg-background text-foreground hover:bg-accent hover:text-accent-foreground',\n        active: 'border-primary bg-primary/10 text-primary hover:bg-primary/20',\n        destructive:\n          'border-destructive bg-destructive/10 text-destructive hover:bg-destructive/20',\n        disable: 'border-border bg-muted text-muted-foreground cursor-not-allowed opacity-60',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n      status: 'default',\n    },\n  },\n);\n\ninterface TrackingData {\n  [key: string]: any;\n  identity?: string;\n  object_type?: 'chip';\n  object_name?: string; // Tên label hiển thị trên UI của Selection\n  status?: 'selected' | 'unselected'; //  Nếu user chọn --> value là \"selected\" - Nếu user bỏ chọn --> value là \"unselected\"\n  value?: string; // Tên value hiển thị trên UI mà user chọn\n}\n\nexport type Props = JSX.IntrinsicElements['button'] &\n  VariantProps<typeof chipVariants> &\n  TrackingPropsType & {\n    className?: string;\n    tag: React.ReactNode;\n    leftIcon?: React.ReactNode;\n    rightIcon?: React.ReactNode;\n    badgeComponent?: React.ReactNode;\n    as?: string;\n    trackingData?: TrackingData;\n  };\n\nconst Chip = React.forwardRef<HTMLDivElement, Props>((inProps, ref) => {\n  const {\n    tag,\n    size,\n    status,\n    className,\n    leftIcon,\n    rightIcon,\n    badgeComponent,\n    trackingName,\n    trackingData,\n    trackingIndex,\n    blockSendTracking,\n    as = 'button',\n    ...rest\n  } = inProps;\n\n  // Auto-enhance tracking data with object_name from tag\n  const enhancedTrackingData = React.useMemo(() => {\n    const data = { ...trackingData };\n\n    // Auto-extract object_name from tag if not provided\n    if (!data.object_name && typeof tag === 'string') {\n      data.object_name = tag;\n    }\n\n    return data;\n  }, [trackingData, tag]);\n\n  return (\n    <Pressable\n      as={as}\n      trackingName={trackingName || `input_${trackingData?.identity}`}\n      trackingData={enhancedTrackingData}\n      trackingIndex={trackingIndex}\n      blockSendTracking={blockSendTracking}\n      data-status-buttonchip={status}\n      className={cn(chipVariants({ size, status }), className)}\n      ref={ref as any}\n      aria-labelledby=\"chip\"\n      data-status={status}\n      data-disabled={status === 'disable' ? 'true' : undefined}\n      disabled={status === 'disable'}\n      {...rest}\n    >\n      {leftIcon}\n      {tag}\n      {rightIcon}\n      {badgeComponent}\n    </Pressable>\n  );\n});\n\nChip.displayName = 'Chip';\n\n// Export types for external use\nexport type ChipVariants = VariantProps<typeof chipVariants>;\nexport type ChipSize = NonNullable<ChipVariants['size']>;\nexport type ChipStatus = NonNullable<ChipVariants['status']>;\n\nexport { Chip };\n"]}