@gcsa/console-react 0.1.0

package/dist/GcsaSelect.js

@@ -0,0 +1,117 @@
+import { jsxs as o, jsx as e, Fragment as k } from "react/jsx-runtime";
+import { useRef as w, useMemo as z } from "react";
+import { createListCollection as R } from "@ark-ui/react/collection";
+import { Select as t } from "@ark-ui/react/select";
+import { Portal as j } from "@ark-ui/react/portal";
+import { formatGcsaLocaleMessage as E, createGcsaPopupPositioning as F, gcsaControlSizeClass as O } from "@gcsa/console-core";
+import { GcsaIcon as P } from "./GcsaIcon.js";
+import { useGcsaLocaleMessages as $ } from "./hooks/useGcsaLocale.js";
+import { useGcsaPopupZIndex as B } from "./hooks/useGcsaPopupZIndex.js";
+import { useGcsaComponentSize as Z } from "./hooks/useGcsaComponentSize.js";
+import { preserveDrawerScrollFrom as q } from "./utils/preserveDrawerScroll.js";
+function C({
+  collection: r,
+  contentStyle: c,
+  showListHint: u,
+  listHintText: g,
+  empty: n,
+  emptyText: d
+}) {
+  return /* @__PURE__ */ e(t.Content, { className: "gcsa-select-content gcsa-ui-surface", style: c, children: n ? /* @__PURE__ */ e("div", { className: "gcsa-select-empty", role: "status", children: /* @__PURE__ */ e("span", { className: "gcsa-select-empty__text", children: d }) }) : /* @__PURE__ */ o(k, { children: [
+    /* @__PURE__ */ e(t.List, { className: "gcsa-select-list", children: r.group().map(([l, i]) => /* @__PURE__ */ o(t.ItemGroup, { className: "gcsa-select-group", children: [
+      l ? /* @__PURE__ */ e(t.ItemGroupLabel, { className: "gcsa-select-group__label", children: l }) : null,
+      i.map((a) => /* @__PURE__ */ o(t.Item, { item: a, className: "gcsa-select-item", children: [
+        /* @__PURE__ */ e(t.ItemText, { className: "gcsa-select-item__text", children: a.label }),
+        /* @__PURE__ */ e(t.ItemIndicator, { className: "gcsa-select-item__check", children: /* @__PURE__ */ e(P, { name: "check", size: "sm", className: "gcsa-select-item__check-icon" }) })
+      ] }, a.value))
+    ] }, l || "default")) }),
+    u ? /* @__PURE__ */ e("div", { className: "gcsa-select-hint", children: g }) : null
+  ] }) });
+}
+function se({
+  value: r,
+  options: c,
+  placeholder: u,
+  invalid: g,
+  placement: n = "bottom-start",
+  listMaxHeight: d = 280,
+  listHintThreshold: l = 16,
+  groupOrder: i,
+  portalled: a = !0,
+  sameWidth: f = !0,
+  size: b,
+  onValueChange: p
+}) {
+  const N = w(null), L = Z(b), x = $(), { zIndex: m, onOpenChange: D } = B(), y = c.some((s) => s.group), h = z(
+    () => R({
+      items: c,
+      itemToValue: (s) => s.value,
+      itemToString: (s) => s.label,
+      isItemDisabled: (s) => s.disabled ?? !1,
+      ...y ? {
+        groupBy: (s) => s.group ?? "",
+        groupSort: i ?? "asc"
+      } : {}
+    }),
+    [c, y, i]
+  ), H = r == null ? [] : [r], v = c.length >= l, S = E(x.selectListHint, { count: c.length }), _ = x.emptyDefault, I = c.length === 0, G = {
+    "--gcsa-select-list-max-height": `${d}px`,
+    ...m == null ? {} : { zIndex: m }
+  }, T = m == null ? void 0 : { zIndex: m }, M = z(
+    () => F({ placement: n, sameWidth: f, gutter: 4 }),
+    [n, f]
+  );
+  return /* @__PURE__ */ o(
+    t.Root,
+    {
+      collection: h,
+      value: H,
+      positioning: M,
+      lazyMount: !0,
+      unmountOnExit: !0,
+      onOpenChange: (s) => {
+        D(s.open), q(N.current);
+      },
+      onValueChange: (s) => p == null ? void 0 : p(s.value[0] ?? ""),
+      children: [
+        /* @__PURE__ */ e(t.Control, { ref: N, className: "gcsa-select-control", children: /* @__PURE__ */ o(
+          t.Trigger,
+          {
+            className: `gcsa-select-trigger gcsa-focus-ring ${O("gcsa-select-trigger", L)}`,
+            "data-invalid": g || void 0,
+            children: [
+              /* @__PURE__ */ e(t.ValueText, { className: "gcsa-select-value", placeholder: u }),
+              /* @__PURE__ */ e(t.Indicator, { className: "gcsa-select-indicator", "aria-hidden": "true", children: /* @__PURE__ */ e(P, { name: "chevronDown", className: "gcsa-select-indicator__icon" }) })
+            ]
+          }
+        ) }),
+        a ? /* @__PURE__ */ e(j, { children: /* @__PURE__ */ e(t.Positioner, { style: T, children: /* @__PURE__ */ e(
+          C,
+          {
+            collection: h,
+            contentStyle: G,
+            showListHint: v,
+            listHintText: S,
+            empty: I,
+            emptyText: _
+          }
+        ) }) }) : /* @__PURE__ */ e(t.Positioner, { style: T, children: /* @__PURE__ */ e(
+          C,
+          {
+            collection: h,
+            contentStyle: G,
+            showListHint: v,
+            listHintText: S,
+            empty: I,
+            emptyText: _
+          }
+        ) }),
+        /* @__PURE__ */ e(t.HiddenSelect, {})
+      ]
+    }
+  );
+}
+export {
+  se as GcsaSelect
+};
+//# sourceMappingURL=GcsaSelect.js.map

package/dist/GcsaSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaSelect.js","sources":["../src/GcsaSelect.tsx"],"sourcesContent":["import { useMemo, useRef, type CSSProperties } from 'react';\nimport { createListCollection } from '@ark-ui/react/collection';\nimport { Select } from '@ark-ui/react/select';\nimport { Portal } from '@ark-ui/react/portal';\nimport type { GcsaPopupPlacement, GcsaSelectOption, GcsaSelectSize } from '@gcsa/console-core';\nimport { createGcsaPopupPositioning, formatGcsaLocaleMessage, gcsaControlSizeClass } from '@gcsa/console-core';\nimport { GcsaIcon } from './GcsaIcon';\nimport { useGcsaLocaleMessages } from './hooks/useGcsaLocale';\nimport { useGcsaPopupZIndex } from './hooks/useGcsaPopupZIndex';\nimport { useGcsaComponentSize } from './hooks/useGcsaComponentSize';\nimport { preserveDrawerScrollFrom } from './utils/preserveDrawerScroll';\n\nexport type GcsaSelectPlacement = GcsaPopupPlacement;\n\nexport type GcsaSelectProps = {\n  value: string;\n  options: GcsaSelectOption[];\n  placeholder?: string;\n  invalid?: boolean;\n  /** 下拉相对触发器的初始方位 */\n  placement?: GcsaSelectPlacement;\n  listMaxHeight?: number;\n  listHintThreshold?: number;\n  groupOrder?: string[];\n  /** 是否挂载到 body；嵌套浮层（如 DatePicker 内）应设为 false */\n  portalled?: boolean;\n  /** 下拉面板是否与触发器同宽 */\n  sameWidth?: boolean;\n  size?: GcsaSelectSize;\n  onValueChange?: (value: string) => void;\n};\n\nfunction SelectContent({\n  collection,\n  contentStyle,\n  showListHint,\n  listHintText,\n  empty,\n  emptyText\n}: {\n  collection: ReturnType<typeof createListCollection<GcsaSelectOption>>;\n  contentStyle: CSSProperties;\n  showListHint: boolean;\n  listHintText: string;\n  empty: boolean;\n  emptyText: string;\n}) {\n  return (\n    <Select.Content className=\"gcsa-select-content gcsa-ui-surface\" style={contentStyle}>\n      {empty ? (\n        <div className=\"gcsa-select-empty\" role=\"status\">\n          <span className=\"gcsa-select-empty__text\">{emptyText}</span>\n        </div>\n      ) : (\n        <>\n          <Select.List className=\"gcsa-select-list\">\n            {collection.group().map(([groupLabel, groupItems]) => (\n              <Select.ItemGroup key={groupLabel || 'default'} className=\"gcsa-select-group\">\n                {groupLabel ? (\n                  <Select.ItemGroupLabel className=\"gcsa-select-group__label\">\n                    {groupLabel}\n                  </Select.ItemGroupLabel>\n                ) : null}\n                {groupItems.map(opt => (\n                  <Select.Item key={opt.value} item={opt} className=\"gcsa-select-item\">\n                    <Select.ItemText className=\"gcsa-select-item__text\">{opt.label}</Select.ItemText>\n                    <Select.ItemIndicator className=\"gcsa-select-item__check\">\n                      <GcsaIcon name=\"check\" size=\"sm\" className=\"gcsa-select-item__check-icon\" />\n                    </Select.ItemIndicator>\n                  </Select.Item>\n                ))}\n              </Select.ItemGroup>\n            ))}\n          </Select.List>\n          {showListHint ? <div className=\"gcsa-select-hint\">{listHintText}</div> : null}\n        </>\n      )}\n    </Select.Content>\n  );\n}\n\nexport function GcsaSelect({\n  value,\n  options,\n  placeholder,\n  invalid,\n  placement = 'bottom-start',\n  listMaxHeight = 280,\n  listHintThreshold = 16,\n  groupOrder,\n  portalled = true,\n  sameWidth = true,\n  size,\n  onValueChange\n}: GcsaSelectProps) {\n  const controlRef = useRef<HTMLDivElement>(null);\n  const resolvedSize = useGcsaComponentSize(size);\n  const messages = useGcsaLocaleMessages();\n  const { zIndex, onOpenChange } = useGcsaPopupZIndex();\n  const hasGroups = options.some(item => item.group);\n\n  const collection = useMemo(\n    () =>\n      createListCollection({\n        items: options,\n        itemToValue: item => item.value,\n        itemToString: item => item.label,\n        isItemDisabled: item => item.disabled ?? false,\n        ...(hasGroups\n          ? {\n              groupBy: (item: GcsaSelectOption) => item.group ?? '',\n              groupSort: groupOrder ?? ('asc' as const)\n            }\n          : {})\n      }),\n    [options, hasGroups, groupOrder]\n  );\n\n  const selectedValue = value == null ? [] : [value];\n  const showListHint = options.length >= listHintThreshold;\n  const listHintText = formatGcsaLocaleMessage(messages.selectListHint, { count: options.length });\n  const emptyText = messages.emptyDefault;\n  const isEmpty = options.length === 0;\n  const contentStyle = {\n    '--gcsa-select-list-max-height': `${listMaxHeight}px`,\n    ...(zIndex == null ? {} : { zIndex })\n  } as CSSProperties;\n  const positionerStyle = zIndex == null ? undefined : ({ zIndex } as CSSProperties);\n  const positioning = useMemo(\n    () => createGcsaPopupPositioning({ placement, sameWidth, gutter: 4 }),\n    [placement, sameWidth]\n  );\n\n  return (\n    <Select.Root\n      collection={collection}\n      value={selectedValue}\n      positioning={positioning}\n      lazyMount\n      unmountOnExit\n      onOpenChange={details => {\n        onOpenChange(details.open);\n        preserveDrawerScrollFrom(controlRef.current);\n      }}\n      onValueChange={details => onValueChange?.(details.value[0] ?? '')}\n    >\n      <Select.Control ref={controlRef} className=\"gcsa-select-control\">\n        <Select.Trigger\n          className={`gcsa-select-trigger gcsa-focus-ring ${gcsaControlSizeClass('gcsa-select-trigger', resolvedSize)}`}\n          data-invalid={invalid || undefined}\n        >\n          <Select.ValueText className=\"gcsa-select-value\" placeholder={placeholder} />\n          <Select.Indicator className=\"gcsa-select-indicator\" aria-hidden=\"true\">\n            <GcsaIcon name=\"chevronDown\" className=\"gcsa-select-indicator__icon\" />\n          </Select.Indicator>\n        </Select.Trigger>\n      </Select.Control>\n      {portalled ? (\n        <Portal>\n          <Select.Positioner style={positionerStyle}>\n            <SelectContent\n              collection={collection}\n              contentStyle={contentStyle}\n              showListHint={showListHint}\n              listHintText={listHintText}\n              empty={isEmpty}\n              emptyText={emptyText}\n            />\n          </Select.Positioner>\n        </Portal>\n      ) : (\n        <Select.Positioner style={positionerStyle}>\n          <SelectContent\n            collection={collection}\n            contentStyle={contentStyle}\n            showListHint={showListHint}\n            listHintText={listHintText}\n            empty={isEmpty}\n            emptyText={emptyText}\n          />\n        </Select.Positioner>\n      )}\n      <Select.HiddenSelect />\n    </Select.Root>\n  );\n}\n"],"names":["SelectContent","collection","contentStyle","showListHint","listHintText","empty","emptyText","jsx","Select","jsxs","Fragment","groupLabel","groupItems","opt","GcsaIcon","GcsaSelect","value","options","placeholder","invalid","placement","listMaxHeight","listHintThreshold","groupOrder","portalled","sameWidth","size","onValueChange","controlRef","useRef","resolvedSize","useGcsaComponentSize","messages","useGcsaLocaleMessages","zIndex","onOpenChange","useGcsaPopupZIndex","hasGroups","item","useMemo","createListCollection","selectedValue","formatGcsaLocaleMessage","isEmpty","positionerStyle","positioning","createGcsaPopupPositioning","details","preserveDrawerScrollFrom","gcsaControlSizeClass","Portal"],"mappings":"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"}

package/dist/GcsaSkeleton.d.ts

@@ -0,0 +1,6 @@
+export type GcsaSkeletonProps = {
+    width?: string;
+    height?: string;
+    className?: string;
+};
+export declare function GcsaSkeleton({ width, height, className }: GcsaSkeletonProps): import("react").JSX.Element;

package/dist/GcsaSkeleton.js

@@ -0,0 +1,19 @@
+import { jsx as n } from "react/jsx-runtime";
+function i({
+  width: t = "100%",
+  height: r = "16px",
+  className: e
+}) {
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      className: `gcsa-skeleton${e ? ` ${e}` : ""}`,
+      style: { width: t, height: r },
+      "aria-hidden": "true"
+    }
+  );
+}
+export {
+  i as GcsaSkeleton
+};
+//# sourceMappingURL=GcsaSkeleton.js.map

package/dist/GcsaSkeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaSkeleton.js","sources":["../src/GcsaSkeleton.tsx"],"sourcesContent":["export type GcsaSkeletonProps = {\n  width?: string;\n  height?: string;\n  className?: string;\n};\n\nexport function GcsaSkeleton({\n  width = '100%',\n  height = '16px',\n  className\n}: GcsaSkeletonProps) {\n  return (\n    <div\n      className={`gcsa-skeleton${className ? ` ${className}` : ''}`}\n      style={{ width, height }}\n      aria-hidden=\"true\"\n    />\n  );\n}\n"],"names":["GcsaSkeleton","width","height","className","jsx"],"mappings":";AAMO,SAASA,EAAa;AAAA,EAC3B,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,WAAAC;AACF,GAAsB;AACpB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,gBAAgBD,IAAY,IAAIA,CAAS,KAAK,EAAE;AAAA,MAC3D,OAAO,EAAE,OAAAF,GAAO,QAAAC,EAAA;AAAA,MAChB,eAAY;AAAA,IAAA;AAAA,EAAA;AAGlB;"}

package/dist/GcsaSpace.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+export type GcsaSpaceProps = {
+    vertical?: boolean;
+    className?: string;
+    children?: ReactNode;
+};
+export declare function GcsaSpace({ vertical, className, children }: GcsaSpaceProps): import("react").JSX.Element;

package/dist/GcsaSpace.js

@@ -0,0 +1,14 @@
+import { jsx as r } from "react/jsx-runtime";
+function p({ vertical: a, className: c, children: e }) {
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      className: `gcsa-space${a ? " gcsa-space--vertical" : ""}${c ? ` ${c}` : ""}`,
+      children: e
+    }
+  );
+}
+export {
+  p as GcsaSpace
+};
+//# sourceMappingURL=GcsaSpace.js.map

package/dist/GcsaSpace.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaSpace.js","sources":["../src/GcsaSpace.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nexport type GcsaSpaceProps = {\n  vertical?: boolean;\n  className?: string;\n  children?: ReactNode;\n};\n\nexport function GcsaSpace({ vertical, className, children }: GcsaSpaceProps) {\n  return (\n    <div\n      className={`gcsa-space${vertical ? ' gcsa-space--vertical' : ''}${className ? ` ${className}` : ''}`}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["GcsaSpace","vertical","className","children","jsx"],"mappings":";AAQO,SAASA,EAAU,EAAE,UAAAC,GAAU,WAAAC,GAAW,UAAAC,KAA4B;AAC3E,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,aAAaH,IAAW,0BAA0B,EAAE,GAAGC,IAAY,IAAIA,CAAS,KAAK,EAAE;AAAA,MAEjG,UAAAC;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/GcsaSpin.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+export type GcsaSpinProps = {
+    spinning?: boolean;
+    className?: string;
+    children?: ReactNode;
+};
+export declare function GcsaSpin({ spinning, className, children }: GcsaSpinProps): import("react").JSX.Element;

package/dist/GcsaSpin.js

@@ -0,0 +1,16 @@
+import { jsxs as t, jsx as o } from "react/jsx-runtime";
+function i({ spinning: a = !0, className: e, children: s }) {
+  const n = [
+    "gcsa-spin",
+    s != null && s !== !1 ? "gcsa-spin--nested" : null,
+    e
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ t("div", { className: n, "aria-busy": a, children: [
+    a ? /* @__PURE__ */ o("span", { className: "gcsa-spin__dot", "aria-hidden": "true" }) : null,
+    s
+  ] });
+}
+export {
+  i as GcsaSpin
+};
+//# sourceMappingURL=GcsaSpin.js.map

package/dist/GcsaSpin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaSpin.js","sources":["../src/GcsaSpin.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nexport type GcsaSpinProps = {\n  spinning?: boolean;\n  className?: string;\n  children?: ReactNode;\n};\n\nexport function GcsaSpin({ spinning = true, className, children }: GcsaSpinProps) {\n  const nested = children != null && children !== false;\n  const rootClassName = [\n    'gcsa-spin',\n    nested ? 'gcsa-spin--nested' : null,\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={rootClassName} aria-busy={spinning}>\n      {spinning ? <span className=\"gcsa-spin__dot\" aria-hidden=\"true\" /> : null}\n      {children}\n    </div>\n  );\n}\n"],"names":["GcsaSpin","spinning","className","children","rootClassName","jsxs"],"mappings":";AAQO,SAASA,EAAS,EAAE,UAAAC,IAAW,IAAM,WAAAC,GAAW,UAAAC,KAA2B;AAEhF,QAAMC,IAAgB;AAAA,IACpB;AAAA,IAFaD,KAAY,QAAQA,MAAa,KAGrC,sBAAsB;AAAA,IAC/BD;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SACE,gBAAAG,EAAC,OAAA,EAAI,WAAWD,GAAe,aAAWH,GACvC,UAAA;AAAA,IAAAA,sBAAY,QAAA,EAAK,WAAU,kBAAiB,eAAY,QAAO,IAAK;AAAA,IACpEE;AAAA,EAAA,GACH;AAEJ;"}

package/dist/GcsaStatistic.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+export type GcsaStatisticProps = {
+    label: string;
+    value?: string | number;
+    className?: string;
+    children?: ReactNode;
+};
+export declare function GcsaStatistic({ label, value, className, children }: GcsaStatisticProps): import("react").JSX.Element;

package/dist/GcsaStatistic.js

@@ -0,0 +1,11 @@
+import { jsxs as e, jsx as i } from "react/jsx-runtime";
+function r({ label: t, value: a, className: s, children: c }) {
+  return /* @__PURE__ */ e("div", { className: `gcsa-statistic${s ? ` ${s}` : ""}`, children: [
+    /* @__PURE__ */ i("div", { className: "gcsa-statistic__label", children: t }),
+    /* @__PURE__ */ i("div", { className: "gcsa-statistic__value", children: c ?? a })
+  ] });
+}
+export {
+  r as GcsaStatistic
+};
+//# sourceMappingURL=GcsaStatistic.js.map

package/dist/GcsaStatistic.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaStatistic.js","sources":["../src/GcsaStatistic.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nexport type GcsaStatisticProps = {\n  label: string;\n  value?: string | number;\n  className?: string;\n  children?: ReactNode;\n};\n\nexport function GcsaStatistic({ label, value, className, children }: GcsaStatisticProps) {\n  return (\n    <div className={`gcsa-statistic${className ? ` ${className}` : ''}`}>\n      <div className=\"gcsa-statistic__label\">{label}</div>\n      <div className=\"gcsa-statistic__value\">{children ?? value}</div>\n    </div>\n  );\n}\n"],"names":["GcsaStatistic","label","value","className","children","jsxs","jsx"],"mappings":";AASO,SAASA,EAAc,EAAE,OAAAC,GAAO,OAAAC,GAAO,WAAAC,GAAW,UAAAC,KAAgC;AACvF,SACE,gBAAAC,EAAC,SAAI,WAAW,iBAAiBF,IAAY,IAAIA,CAAS,KAAK,EAAE,IAC/D,UAAA;AAAA,IAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,yBAAyB,UAAAL,GAAM;AAAA,IAC9C,gBAAAK,EAAC,OAAA,EAAI,WAAU,yBAAyB,eAAYJ,EAAA,CAAM;AAAA,EAAA,GAC5D;AAEJ;"}

package/dist/GcsaSteps.d.ts

@@ -0,0 +1,10 @@
+import { GcsaStepItem } from '@gcsa/console-core';
+export type GcsaStepsProps = {
+    items: GcsaStepItem[];
+    current?: number;
+    direction?: 'horizontal' | 'vertical';
+    clickable?: boolean;
+    onCurrentChange?: (value: number) => void;
+    onChange?: (value: number, item: GcsaStepItem) => void;
+};
+export declare function GcsaSteps({ items, current, direction, clickable, onCurrentChange, onChange }: GcsaStepsProps): import("react").JSX.Element;

package/dist/GcsaSteps.js

@@ -0,0 +1,54 @@
+import { jsx as c, jsxs as p, Fragment as h } from "react/jsx-runtime";
+import { useGcsaLocaleMessages as m } from "./hooks/useGcsaLocale.js";
+function N({
+  items: l,
+  current: t = 0,
+  direction: d = "horizontal",
+  clickable: _ = !1,
+  onCurrentChange: r,
+  onChange: e
+}) {
+  const g = m(), i = (s, a) => s.status ?? (a < t ? "finish" : a === t ? "process" : "wait"), n = (s, a) => i(s, a) === "finish" ? "✓" : i(s, a) === "error" ? "!" : String(a + 1), b = (s) => {
+    r == null || r(s), e == null || e(s, l[s]);
+  };
+  return /* @__PURE__ */ c(
+    "ol",
+    {
+      className: `gcsa-steps${d === "vertical" ? " gcsa-steps--vertical" : ""}`,
+      "aria-label": g.stepsLabel,
+      children: l.map((s, a) => {
+        const o = /* @__PURE__ */ p(h, { children: [
+          /* @__PURE__ */ c("span", { className: "gcsa-steps__indicator", "aria-hidden": "true", children: n(s, a) }),
+          /* @__PURE__ */ p("span", { className: "gcsa-steps__copy", children: [
+            /* @__PURE__ */ c("strong", { children: s.title }),
+            s.description ? /* @__PURE__ */ c("small", { children: s.description }) : null
+          ] })
+        ] });
+        return /* @__PURE__ */ p(
+          "li",
+          {
+            className: `gcsa-steps__item gcsa-steps__item--${i(s, a)}${s.disabled ? " gcsa-steps__item--disabled" : ""}`,
+            children: [
+              _ && !s.disabled ? /* @__PURE__ */ c(
+                "button",
+                {
+                  type: "button",
+                  className: "gcsa-steps__trigger gcsa-focus-ring",
+                  "aria-current": a === t ? "step" : void 0,
+                  onClick: () => b(a),
+                  children: o
+                }
+              ) : /* @__PURE__ */ c("div", { className: "gcsa-steps__trigger", "aria-current": a === t ? "step" : void 0, children: o }),
+              a < l.length - 1 ? /* @__PURE__ */ c("span", { className: "gcsa-steps__connector", "aria-hidden": "true" }) : null
+            ]
+          },
+          s.key
+        );
+      })
+    }
+  );
+}
+export {
+  N as GcsaSteps
+};
+//# sourceMappingURL=GcsaSteps.js.map

package/dist/GcsaSteps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaSteps.js","sources":["../src/GcsaSteps.tsx"],"sourcesContent":["import type { GcsaStepItem } from '@gcsa/console-core';\nimport { useGcsaLocaleMessages } from './hooks/useGcsaLocale';\n\nexport type GcsaStepsProps = {\n  items: GcsaStepItem[];\n  current?: number;\n  direction?: 'horizontal' | 'vertical';\n  clickable?: boolean;\n  onCurrentChange?: (value: number) => void;\n  onChange?: (value: number, item: GcsaStepItem) => void;\n};\n\nexport function GcsaSteps({\n  items,\n  current = 0,\n  direction = 'horizontal',\n  clickable = false,\n  onCurrentChange,\n  onChange\n}: GcsaStepsProps) {\n  const messages = useGcsaLocaleMessages();\n  const status = (item: GcsaStepItem, index: number) =>\n    item.status ?? (index < current ? 'finish' : index === current ? 'process' : 'wait');\n  const indicator = (item: GcsaStepItem, index: number) =>\n    status(item, index) === 'finish' ? '✓' : status(item, index) === 'error' ? '!' : String(index + 1);\n  const change = (index: number) => {\n    onCurrentChange?.(index);\n    onChange?.(index, items[index]);\n  };\n\n  return (\n    <ol\n      className={`gcsa-steps${direction === 'vertical' ? ' gcsa-steps--vertical' : ''}`}\n      aria-label={messages.stepsLabel}\n    >\n      {items.map((item, index) => {\n        const body = (\n          <>\n            <span className=\"gcsa-steps__indicator\" aria-hidden=\"true\">\n              {indicator(item, index)}\n            </span>\n            <span className=\"gcsa-steps__copy\">\n              <strong>{item.title}</strong>\n              {item.description ? <small>{item.description}</small> : null}\n            </span>\n          </>\n        );\n        return (\n          <li\n            key={item.key}\n            className={`gcsa-steps__item gcsa-steps__item--${status(item, index)}${item.disabled ? ' gcsa-steps__item--disabled' : ''}`}\n          >\n            {clickable && !item.disabled ? (\n              <button\n                type=\"button\"\n                className=\"gcsa-steps__trigger gcsa-focus-ring\"\n                aria-current={index === current ? 'step' : undefined}\n                onClick={() => change(index)}\n              >\n                {body}\n              </button>\n            ) : (\n              <div className=\"gcsa-steps__trigger\" aria-current={index === current ? 'step' : undefined}>\n                {body}\n              </div>\n            )}\n            {index < items.length - 1 ? <span className=\"gcsa-steps__connector\" aria-hidden=\"true\" /> : null}\n          </li>\n        );\n      })}\n    </ol>\n  );\n}\n"],"names":["GcsaSteps","items","current","direction","clickable","onCurrentChange","onChange","messages","useGcsaLocaleMessages","status","item","index","indicator","change","jsx","body","jsxs","Fragment"],"mappings":";;AAYO,SAASA,EAAU;AAAA,EACxB,OAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,WAAAC,IAAY;AAAA,EACZ,iBAAAC;AAAA,EACA,UAAAC;AACF,GAAmB;AACjB,QAAMC,IAAWC,EAAA,GACXC,IAAS,CAACC,GAAoBC,MAClCD,EAAK,WAAWC,IAAQT,IAAU,WAAWS,MAAUT,IAAU,YAAY,SACzEU,IAAY,CAACF,GAAoBC,MACrCF,EAAOC,GAAMC,CAAK,MAAM,WAAW,MAAMF,EAAOC,GAAMC,CAAK,MAAM,UAAU,MAAM,OAAOA,IAAQ,CAAC,GAC7FE,IAAS,CAACF,MAAkB;AAChC,IAAAN,KAAA,QAAAA,EAAkBM,IAClBL,KAAA,QAAAA,EAAWK,GAAOV,EAAMU,CAAK;AAAA,EAC/B;AAEA,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,aAAaX,MAAc,aAAa,0BAA0B,EAAE;AAAA,MAC/E,cAAYI,EAAS;AAAA,MAEpB,UAAAN,EAAM,IAAI,CAACS,GAAMC,MAAU;AAC1B,cAAMI,IACJ,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,UAAA,gBAAAH,EAAC,QAAA,EAAK,WAAU,yBAAwB,eAAY,QACjD,UAAAF,EAAUF,GAAMC,CAAK,EAAA,CACxB;AAAA,UACA,gBAAAK,EAAC,QAAA,EAAK,WAAU,oBACd,UAAA;AAAA,YAAA,gBAAAF,EAAC,UAAA,EAAQ,YAAK,MAAA,CAAM;AAAA,YACnBJ,EAAK,cAAc,gBAAAI,EAAC,SAAA,EAAO,UAAAJ,EAAK,aAAY,IAAW;AAAA,UAAA,EAAA,CAC1D;AAAA,QAAA,GACF;AAEF,eACE,gBAAAM;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAW,sCAAsCP,EAAOC,GAAMC,CAAK,CAAC,GAAGD,EAAK,WAAW,gCAAgC,EAAE;AAAA,YAExH,UAAA;AAAA,cAAAN,KAAa,CAACM,EAAK,WAClB,gBAAAI;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAK;AAAA,kBACL,WAAU;AAAA,kBACV,gBAAcH,MAAUT,IAAU,SAAS;AAAA,kBAC3C,SAAS,MAAMW,EAAOF,CAAK;AAAA,kBAE1B,UAAAI;AAAA,gBAAA;AAAA,cAAA,IAGH,gBAAAD,EAAC,OAAA,EAAI,WAAU,uBAAsB,gBAAcH,MAAUT,IAAU,SAAS,QAC7E,UAAAa,EAAA,CACH;AAAA,cAEDJ,IAAQV,EAAM,SAAS,IAAI,gBAAAa,EAAC,UAAK,WAAU,yBAAwB,eAAY,OAAA,CAAO,IAAK;AAAA,YAAA;AAAA,UAAA;AAAA,UAjBvFJ,EAAK;AAAA,QAAA;AAAA,MAoBhB,CAAC;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/GcsaSwitch.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { GcsaComponentSize } from '@gcsa/console-core';
+export type GcsaSwitchProps = {
+    checked?: boolean;
+    label?: string;
+    className?: string;
+    size?: GcsaComponentSize;
+    children?: ReactNode;
+    onCheckedChange?: (checked: boolean) => void;
+};
+export declare function GcsaSwitch({ checked, label, className, size, children, onCheckedChange }: GcsaSwitchProps): import("react").JSX.Element;

package/dist/GcsaSwitch.js

@@ -0,0 +1,36 @@
+import { jsxs as f, jsx as t } from "react/jsx-runtime";
+import { useRef as p } from "react";
+import { Switch as s } from "@ark-ui/react/switch";
+import { gcsaControlSizeClass as w } from "@gcsa/console-core";
+import { useGcsaComponentSize as h } from "./hooks/useGcsaComponentSize.js";
+import { usePreventHiddenInputScroll as S } from "./hooks/usePreventHiddenInputScroll.js";
+function N({
+  checked: m,
+  label: o,
+  className: r,
+  size: l,
+  children: i,
+  onCheckedChange: c
+}) {
+  const e = p(null);
+  S(e);
+  const a = h(l), n = w("gcsa-switch", a);
+  return /* @__PURE__ */ f(
+    s.Root,
+    {
+      ref: e,
+      checked: m,
+      className: `gcsa-switch gcsa-focus-ring ${n}${r ? ` ${r}` : ""}`,
+      onCheckedChange: (u) => c == null ? void 0 : c(u.checked),
+      children: [
+        /* @__PURE__ */ t(s.Control, { className: "gcsa-switch__track", children: /* @__PURE__ */ t(s.Thumb, { className: "gcsa-switch__thumb" }) }),
+        o || i ? /* @__PURE__ */ t(s.Label, { className: "gcsa-switch__label", children: i ?? o }) : null,
+        /* @__PURE__ */ t(s.HiddenInput, {})
+      ]
+    }
+  );
+}
+export {
+  N as GcsaSwitch
+};
+//# sourceMappingURL=GcsaSwitch.js.map

package/dist/GcsaSwitch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaSwitch.js","sources":["../src/GcsaSwitch.tsx"],"sourcesContent":["import { useRef, type ReactNode } from 'react';\nimport { Switch } from '@ark-ui/react/switch';\nimport type { GcsaComponentSize } from '@gcsa/console-core';\nimport { gcsaControlSizeClass } from '@gcsa/console-core';\nimport { useGcsaComponentSize } from './hooks/useGcsaComponentSize';\nimport { usePreventHiddenInputScroll } from './hooks/usePreventHiddenInputScroll';\n\nexport type GcsaSwitchProps = {\n  checked?: boolean;\n  label?: string;\n  className?: string;\n  size?: GcsaComponentSize;\n  children?: ReactNode;\n  onCheckedChange?: (checked: boolean) => void;\n};\n\nexport function GcsaSwitch({\n  checked,\n  label,\n  className,\n  size,\n  children,\n  onCheckedChange\n}: GcsaSwitchProps) {\n  const rootRef = useRef<HTMLLabelElement>(null);\n  usePreventHiddenInputScroll(rootRef);\n  const resolvedSize = useGcsaComponentSize(size);\n  const sizeClass = gcsaControlSizeClass('gcsa-switch', resolvedSize);\n  return (\n    <Switch.Root\n      ref={rootRef}\n      checked={checked}\n      className={`gcsa-switch gcsa-focus-ring ${sizeClass}${className ? ` ${className}` : ''}`}\n      onCheckedChange={details => onCheckedChange?.(details.checked)}\n    >\n      <Switch.Control className=\"gcsa-switch__track\">\n        <Switch.Thumb className=\"gcsa-switch__thumb\" />\n      </Switch.Control>\n      {label || children ? (\n        <Switch.Label className=\"gcsa-switch__label\">{children ?? label}</Switch.Label>\n      ) : null}\n      <Switch.HiddenInput />\n    </Switch.Root>\n  );\n}\n"],"names":["GcsaSwitch","checked","label","className","size","children","onCheckedChange","rootRef","useRef","usePreventHiddenInputScroll","resolvedSize","useGcsaComponentSize","sizeClass","gcsaControlSizeClass","jsxs","Switch","details","jsx"],"mappings":";;;;;;AAgBO,SAASA,EAAW;AAAA,EACzB,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,iBAAAC;AACF,GAAoB;AAClB,QAAMC,IAAUC,EAAyB,IAAI;AAC7C,EAAAC,EAA4BF,CAAO;AACnC,QAAMG,IAAeC,EAAqBP,CAAI,GACxCQ,IAAYC,EAAqB,eAAeH,CAAY;AAClE,SACE,gBAAAI;AAAA,IAACC,EAAO;AAAA,IAAP;AAAA,MACC,KAAKR;AAAA,MACL,SAAAN;AAAA,MACA,WAAW,+BAA+BW,CAAS,GAAGT,IAAY,IAAIA,CAAS,KAAK,EAAE;AAAA,MACtF,iBAAiB,CAAAa,MAAWV,KAAA,gBAAAA,EAAkBU,EAAQ;AAAA,MAEtD,UAAA;AAAA,QAAA,gBAAAC,EAACF,EAAO,SAAP,EAAe,WAAU,sBACxB,UAAA,gBAAAE,EAACF,EAAO,OAAP,EAAa,WAAU,qBAAA,CAAqB,EAAA,CAC/C;AAAA,QACCb,KAASG,IACR,gBAAAY,EAACF,EAAO,OAAP,EAAa,WAAU,sBAAsB,UAAAV,KAAYH,EAAA,CAAM,IAC9D;AAAA,QACJ,gBAAAe,EAACF,EAAO,aAAP,CAAA,CAAmB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG1B;"}

package/dist/GcsaTabs.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+export type GcsaTabItem = {
+    key: string;
+    label: string;
+    disabled?: boolean;
+};
+export type GcsaTabsProps = {
+    items: GcsaTabItem[];
+    value: string;
+    variant?: 'line' | 'soft';
+    tabPanels?: Record<string, ReactNode>;
+    className?: string;
+    onValueChange?: (value: string) => void;
+};
+export declare function GcsaTabs({ items, value, variant, tabPanels, className, onValueChange }: GcsaTabsProps): import("react").JSX.Element;

package/dist/GcsaTabs.js

@@ -0,0 +1,39 @@
+import { jsxs as g, jsx as e } from "react/jsx-runtime";
+import { Tabs as c } from "@ark-ui/react/tabs";
+function _({
+  items: a,
+  value: o,
+  variant: l = "line",
+  tabPanels: i,
+  className: d,
+  onValueChange: r
+}) {
+  return /* @__PURE__ */ g(
+    c.Root,
+    {
+      className: `gcsa-tabs gcsa-ui-surface gcsa-tabs--${l}${d ? ` ${d}` : ""}`,
+      value: o,
+      onValueChange: (s) => r == null ? void 0 : r(s.value),
+      children: [
+        /* @__PURE__ */ g(c.List, { className: "gcsa-tabs__list", children: [
+          a.map((s) => /* @__PURE__ */ e(
+            c.Trigger,
+            {
+              value: s.key,
+              disabled: s.disabled,
+              className: "gcsa-tabs__trigger gcsa-focus-ring",
+              children: s.label
+            },
+            s.key
+          )),
+          l === "line" ? /* @__PURE__ */ e(c.Indicator, { className: "gcsa-tabs__indicator" }) : null
+        ] }),
+        a.map((s) => /* @__PURE__ */ e(c.Content, { value: s.key, className: "gcsa-tabs__content", children: i == null ? void 0 : i[s.key] }, s.key))
+      ]
+    }
+  );
+}
+export {
+  _ as GcsaTabs
+};
+//# sourceMappingURL=GcsaTabs.js.map

package/dist/GcsaTabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaTabs.js","sources":["../src/GcsaTabs.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { Tabs } from '@ark-ui/react/tabs';\n\nexport type GcsaTabItem = {\n  key: string;\n  label: string;\n  disabled?: boolean;\n};\n\nexport type GcsaTabsProps = {\n  items: GcsaTabItem[];\n  value: string;\n  variant?: 'line' | 'soft';\n  tabPanels?: Record<string, ReactNode>;\n  className?: string;\n  onValueChange?: (value: string) => void;\n};\n\nexport function GcsaTabs({\n  items,\n  value,\n  variant = 'line',\n  tabPanels,\n  className,\n  onValueChange\n}: GcsaTabsProps) {\n  return (\n    <Tabs.Root\n      className={`gcsa-tabs gcsa-ui-surface gcsa-tabs--${variant}${className ? ` ${className}` : ''}`}\n      value={value}\n      onValueChange={details => onValueChange?.(details.value)}\n    >\n      <Tabs.List className=\"gcsa-tabs__list\">\n        {items.map(tab => (\n          <Tabs.Trigger\n            key={tab.key}\n            value={tab.key}\n            disabled={tab.disabled}\n            className=\"gcsa-tabs__trigger gcsa-focus-ring\"\n          >\n            {tab.label}\n          </Tabs.Trigger>\n        ))}\n        {variant === 'line' ? <Tabs.Indicator className=\"gcsa-tabs__indicator\" /> : null}\n      </Tabs.List>\n      {items.map(tab => (\n        <Tabs.Content key={tab.key} value={tab.key} className=\"gcsa-tabs__content\">\n          {tabPanels?.[tab.key]}\n        </Tabs.Content>\n      ))}\n    </Tabs.Root>\n  );\n}\n"],"names":["GcsaTabs","items","value","variant","tabPanels","className","onValueChange","jsxs","Tabs","details","tab","jsx"],"mappings":";;AAkBO,SAASA,EAAS;AAAA,EACvB,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,eAAAC;AACF,GAAkB;AAChB,SACE,gBAAAC;AAAA,IAACC,EAAK;AAAA,IAAL;AAAA,MACC,WAAW,wCAAwCL,CAAO,GAAGE,IAAY,IAAIA,CAAS,KAAK,EAAE;AAAA,MAC7F,OAAAH;AAAA,MACA,eAAe,CAAAO,MAAWH,KAAA,gBAAAA,EAAgBG,EAAQ;AAAA,MAElD,UAAA;AAAA,QAAA,gBAAAF,EAACC,EAAK,MAAL,EAAU,WAAU,mBAClB,UAAA;AAAA,UAAAP,EAAM,IAAI,CAAAS,MACT,gBAAAC;AAAA,YAACH,EAAK;AAAA,YAAL;AAAA,cAEC,OAAOE,EAAI;AAAA,cACX,UAAUA,EAAI;AAAA,cACd,WAAU;AAAA,cAET,UAAAA,EAAI;AAAA,YAAA;AAAA,YALAA,EAAI;AAAA,UAAA,CAOZ;AAAA,UACAP,MAAY,SAAS,gBAAAQ,EAACH,EAAK,WAAL,EAAe,WAAU,wBAAuB,IAAK;AAAA,QAAA,GAC9E;AAAA,QACCP,EAAM,IAAI,CAAAS,wBACRF,EAAK,SAAL,EAA2B,OAAOE,EAAI,KAAK,WAAU,sBACnD,UAAAN,KAAA,gBAAAA,EAAYM,EAAI,KAAG,GADHA,EAAI,GAEvB,CACD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/GcsaTag.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+export type GcsaTagProps = {
+    tone?: 'primary' | 'success' | 'warning' | 'danger';
+    className?: string;
+    children?: ReactNode;
+};
+export declare function GcsaTag({ tone, className, children }: GcsaTagProps): import("react").JSX.Element;

package/dist/GcsaTag.js

@@ -0,0 +1,9 @@
+import { jsx as g } from "react/jsx-runtime";
+function o({ tone: a, className: s, children: c }) {
+  const t = a ? `gcsa-tag--${a}` : "";
+  return /* @__PURE__ */ g("span", { className: `gcsa-tag${t ? ` ${t}` : ""}${s ? ` ${s}` : ""}`, children: c });
+}
+export {
+  o as GcsaTag
+};
+//# sourceMappingURL=GcsaTag.js.map

package/dist/GcsaTag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaTag.js","sources":["../src/GcsaTag.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nexport type GcsaTagProps = {\n  tone?: 'primary' | 'success' | 'warning' | 'danger';\n  className?: string;\n  children?: ReactNode;\n};\n\nexport function GcsaTag({ tone, className, children }: GcsaTagProps) {\n  const toneClass = tone ? `gcsa-tag--${tone}` : '';\n  return (\n    <span className={`gcsa-tag${toneClass ? ` ${toneClass}` : ''}${className ? ` ${className}` : ''}`}>\n      {children}\n    </span>\n  );\n}\n"],"names":["GcsaTag","tone","className","children","toneClass"],"mappings":";AAQO,SAASA,EAAQ,EAAE,MAAAC,GAAM,WAAAC,GAAW,UAAAC,KAA0B;AACnE,QAAMC,IAAYH,IAAO,aAAaA,CAAI,KAAK;AAC/C,2BACG,QAAA,EAAK,WAAW,WAAWG,IAAY,IAAIA,CAAS,KAAK,EAAE,GAAGF,IAAY,IAAIA,CAAS,KAAK,EAAE,IAC5F,UAAAC,GACH;AAEJ;"}

package/dist/GcsaTextarea.d.ts

@@ -0,0 +1,13 @@
+import { TextareaHTMLAttributes } from 'react';
+import { GcsaComponentSize } from '@gcsa/console-core';
+import { GcsaTextCountFormatter } from './hooks/useGcsaTextCount';
+export type GcsaTextareaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'onChange' | 'onBlur'> & {
+    value?: string;
+    size?: GcsaComponentSize;
+    invalid?: boolean;
+    showCount?: boolean;
+    countFormatter?: GcsaTextCountFormatter;
+    onValueChange?: (value: string) => void;
+    onBlur?: () => void;
+};
+export declare function GcsaTextarea({ value, placeholder, rows, disabled, invalid, maxLength, showCount, countFormatter, size, className, onValueChange, onBlur, ...rest }: GcsaTextareaProps): import("react").JSX.Element;

package/dist/GcsaTextarea.js

@@ -0,0 +1,76 @@
+import { jsxs as j, jsx as i } from "react/jsx-runtime";
+import { useId as z, useRef as G, useLayoutEffect as T } from "react";
+import { gcsaControlSizeClass as b } from "@gcsa/console-core";
+import { useGcsaTextCount as y } from "./hooks/useGcsaTextCount.js";
+import { useGcsaComponentSize as C } from "./hooks/useGcsaComponentSize.js";
+import { patchFocusPreventScroll as I } from "./hooks/usePreventHiddenInputScroll.js";
+function $({
+  value: c = "",
+  placeholder: n = "",
+  rows: l = 4,
+  disabled: m = !1,
+  invalid: f = !1,
+  maxLength: s,
+  showCount: u,
+  countFormatter: x,
+  size: d,
+  className: p,
+  onValueChange: t,
+  onBlur: e,
+  ...v
+}) {
+  const g = C(d), a = z(), o = G(null);
+  T(() => {
+    o.current && I(o.current);
+  });
+  const { showCounter: r, countText: N, isNearLimit: S } = y({
+    modelValue: c,
+    maxLength: s,
+    showCount: u,
+    formatter: x
+  });
+  return /* @__PURE__ */ j(
+    "div",
+    {
+      className: [
+        "gcsa-text-control",
+        "gcsa-text-control--textarea",
+        b("gcsa-text-control", g),
+        r ? "gcsa-text-control--count" : null,
+        p
+      ].filter(Boolean).join(" "),
+      children: [
+        /* @__PURE__ */ i(
+          "textarea",
+          {
+            ref: o,
+            className: "gcsa-textarea",
+            value: c,
+            placeholder: n,
+            rows: l,
+            disabled: m,
+            maxLength: s,
+            "data-invalid": f || void 0,
+            "aria-describedby": r ? a : void 0,
+            onChange: (_) => t == null ? void 0 : t(_.target.value),
+            onBlur: () => e == null ? void 0 : e(),
+            ...v
+          }
+        ),
+        r ? /* @__PURE__ */ i(
+          "span",
+          {
+            id: a,
+            className: `gcsa-text-control__count${S ? " gcsa-text-control__count--near" : ""}`,
+            "aria-live": "polite",
+            children: N
+          }
+        ) : null
+      ]
+    }
+  );
+}
+export {
+  $ as GcsaTextarea
+};
+//# sourceMappingURL=GcsaTextarea.js.map

package/dist/GcsaTextarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaTextarea.js","sources":["../src/GcsaTextarea.tsx"],"sourcesContent":["import { useId, useLayoutEffect, useRef } from 'react';\nimport type { TextareaHTMLAttributes } from 'react';\nimport type { GcsaComponentSize } from '@gcsa/console-core';\nimport { gcsaControlSizeClass } from '@gcsa/console-core';\nimport { useGcsaTextCount, type GcsaTextCountFormatter } from './hooks/useGcsaTextCount';\nimport { useGcsaComponentSize } from './hooks/useGcsaComponentSize';\nimport { patchFocusPreventScroll } from './hooks/usePreventHiddenInputScroll';\n\nexport type GcsaTextareaProps = Omit<\n  TextareaHTMLAttributes<HTMLTextAreaElement>,\n  'value' | 'onChange' | 'onBlur'\n> & {\n  value?: string;\n  size?: GcsaComponentSize;\n  invalid?: boolean;\n  showCount?: boolean;\n  countFormatter?: GcsaTextCountFormatter;\n  onValueChange?: (value: string) => void;\n  onBlur?: () => void;\n};\n\nexport function GcsaTextarea({\n  value = '',\n  placeholder = '',\n  rows = 4,\n  disabled = false,\n  invalid = false,\n  maxLength,\n  showCount,\n  countFormatter,\n  size,\n  className,\n  onValueChange,\n  onBlur,\n  ...rest\n}: GcsaTextareaProps) {\n  const resolvedSize = useGcsaComponentSize(size);\n  const countId = useId();\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  useLayoutEffect(() => {\n    if (textareaRef.current) patchFocusPreventScroll(textareaRef.current);\n  });\n  const { showCounter, countText, isNearLimit } = useGcsaTextCount({\n    modelValue: value,\n    maxLength,\n    showCount,\n    formatter: countFormatter\n  });\n\n  return (\n    <div\n      className={[\n        'gcsa-text-control',\n        'gcsa-text-control--textarea',\n        gcsaControlSizeClass('gcsa-text-control', resolvedSize),\n        showCounter ? 'gcsa-text-control--count' : null,\n        className\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <textarea\n        ref={textareaRef}\n        className=\"gcsa-textarea\"\n        value={value}\n        placeholder={placeholder}\n        rows={rows}\n        disabled={disabled}\n        maxLength={maxLength}\n        data-invalid={invalid || undefined}\n        aria-describedby={showCounter ? countId : undefined}\n        onChange={event => onValueChange?.(event.target.value)}\n        onBlur={() => onBlur?.()}\n        {...rest}\n      />\n      {showCounter ? (\n        <span\n          id={countId}\n          className={`gcsa-text-control__count${isNearLimit ? ' gcsa-text-control__count--near' : ''}`}\n          aria-live=\"polite\"\n        >\n          {countText}\n        </span>\n      ) : null}\n    </div>\n  );\n}\n"],"names":["GcsaTextarea","value","placeholder","rows","disabled","invalid","maxLength","showCount","countFormatter","size","className","onValueChange","onBlur","rest","resolvedSize","useGcsaComponentSize","countId","useId","textareaRef","useRef","useLayoutEffect","patchFocusPreventScroll","showCounter","countText","isNearLimit","useGcsaTextCount","jsxs","gcsaControlSizeClass","jsx","event"],"mappings":";;;;;;AAqBO,SAASA,EAAa;AAAA,EAC3B,OAAAC,IAAQ;AAAA,EACR,aAAAC,IAAc;AAAA,EACd,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,eAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGC;AACL,GAAsB;AACpB,QAAMC,IAAeC,EAAqBN,CAAI,GACxCO,IAAUC,EAAA,GACVC,IAAcC,EAA4B,IAAI;AACpD,EAAAC,EAAgB,MAAM;AACpB,IAAIF,EAAY,WAASG,EAAwBH,EAAY,OAAO;AAAA,EACtE,CAAC;AACD,QAAM,EAAE,aAAAI,GAAa,WAAAC,GAAW,aAAAC,EAAA,IAAgBC,EAAiB;AAAA,IAC/D,YAAYxB;AAAA,IACZ,WAAAK;AAAA,IACA,WAAAC;AAAA,IACA,WAAWC;AAAA,EAAA,CACZ;AAED,SACE,gBAAAkB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACAC,EAAqB,qBAAqBb,CAAY;AAAA,QACtDQ,IAAc,6BAA6B;AAAA,QAC3CZ;AAAA,MAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MAEX,UAAA;AAAA,QAAA,gBAAAkB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAKV;AAAA,YACL,WAAU;AAAA,YACV,OAAAjB;AAAA,YACA,aAAAC;AAAA,YACA,MAAAC;AAAA,YACA,UAAAC;AAAA,YACA,WAAAE;AAAA,YACA,gBAAcD,KAAW;AAAA,YACzB,oBAAkBiB,IAAcN,IAAU;AAAA,YAC1C,UAAU,CAAAa,MAASlB,KAAA,gBAAAA,EAAgBkB,EAAM,OAAO;AAAA,YAChD,QAAQ,MAAMjB,KAAA,gBAAAA;AAAA,YACb,GAAGC;AAAA,UAAA;AAAA,QAAA;AAAA,QAELS,IACC,gBAAAM;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,IAAIZ;AAAA,YACJ,WAAW,2BAA2BQ,IAAc,oCAAoC,EAAE;AAAA,YAC1F,aAAU;AAAA,YAET,UAAAD;AAAA,UAAA;AAAA,QAAA,IAED;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/GcsaTimePicker.d.ts

@@ -0,0 +1,12 @@
+import { InputHTMLAttributes } from 'react';
+export type GcsaTimePickerProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange' | 'value' | 'placeholder' | 'readOnly'> & {
+    value?: string;
+    step?: number;
+    min?: string;
+    max?: string;
+    allowClear?: boolean;
+    invalid?: boolean;
+    placeholder?: string;
+    onChange?: (value: string) => void;
+};
+export declare function GcsaTimePicker({ value, onChange, className, step, min, max, allowClear, invalid, placeholder, disabled, ...props }: GcsaTimePickerProps): import("react").JSX.Element;