@gcsa/console-react 0.1.0

package/dist/GcsaMenu.js

@@ -0,0 +1,241 @@
+import { jsx as n, jsxs as o } from "react/jsx-runtime";
+import { useState as w, useEffect as B, useMemo as L } from "react";
+import { Collapsible as $ } from "@ark-ui/react/collapsible";
+import { Menu as c } from "@ark-ui/react/menu";
+import { createGcsaPopupPositioning as D } from "@gcsa/console-core";
+import { GcsaIcon as y } from "./GcsaIcon.js";
+import { GcsaTooltip as T } from "./GcsaTooltip.js";
+function E(s) {
+  var a;
+  return !!((a = s.children) != null && a.length) && s.type !== "group" && s.type !== "divider";
+}
+function x(s) {
+  return s.filter((a) => a.type !== "group" && a.type !== "divider").map((a) => ({
+    key: a.key,
+    label: a.label,
+    disabled: a.disabled
+  }));
+}
+function z(s, a) {
+  var l;
+  return s.key === a ? !0 : ((l = s.children) == null ? void 0 : l.some((i) => i.key === a)) ?? !1;
+}
+function N({ item: s }) {
+  return s.icon ? /* @__PURE__ */ n("span", { className: "gcsa-menu__icon", "aria-hidden": "true", children: s.icon }) : s.iconKey ? /* @__PURE__ */ n("span", { className: "gcsa-menu__icon", "aria-hidden": "true", children: /* @__PURE__ */ n(y, { name: s.iconKey }) }) : null;
+}
+function M({
+  items: s,
+  mode: a,
+  selectedKey: l,
+  openKeys: i,
+  collapsed: g = !1,
+  depth: u,
+  onSelect: d,
+  onToggle: b
+}) {
+  const h = L(() => new Set(i), [i]), f = g && u === 0;
+  return /* @__PURE__ */ n(
+    "ul",
+    {
+      className: `gcsa-menu__list${u > 0 ? " gcsa-menu__list--nested" : ""}`,
+      role: "none",
+      children: s.map((e) => {
+        if (e.type === "divider")
+          return /* @__PURE__ */ n("li", { className: "gcsa-menu__node gcsa-menu__node--divider", role: "none", children: /* @__PURE__ */ n("div", { className: "gcsa-menu__divider", role: "separator" }) }, e.key);
+        if (e.type === "group")
+          return /* @__PURE__ */ n("li", { className: "gcsa-menu__node gcsa-menu__node--group", role: "none", children: /* @__PURE__ */ n("div", { className: "gcsa-menu__group-label", children: e.label }) }, e.key);
+        if (E(e)) {
+          if (g && a !== "horizontal") {
+            const t = x(e.children), _ = z(e, l);
+            return /* @__PURE__ */ n("li", { className: "gcsa-menu__node", role: "none", children: /* @__PURE__ */ o(
+              c.Root,
+              {
+                positioning: D({ placement: "right-start", gutter: 8 }),
+                onSelect: (r) => d(r.value),
+                children: [
+                  /* @__PURE__ */ n(T, { content: e.label, placement: "right", gutter: 10, children: /* @__PURE__ */ n(c.Trigger, { asChild: !0, children: /* @__PURE__ */ o(
+                    "button",
+                    {
+                      type: "button",
+                      className: `gcsa-menu__item gcsa-menu__item--submenu gcsa-focus-ring${_ ? " gcsa-menu__item--selected" : ""}${e.disabled ? " gcsa-menu__item--disabled" : ""}`,
+                      disabled: e.disabled,
+                      children: [
+                        /* @__PURE__ */ n(N, { item: e }),
+                        /* @__PURE__ */ n("span", { className: "gcsa-menu__label", children: e.label })
+                      ]
+                    }
+                  ) }) }),
+                  /* @__PURE__ */ n(c.Positioner, { children: /* @__PURE__ */ n(c.Content, { className: "gcsa-dropdown gcsa-ui-surface", children: t.map((r) => /* @__PURE__ */ n(
+                    c.Item,
+                    {
+                      value: r.key,
+                      disabled: r.disabled,
+                      className: "gcsa-dropdown__item",
+                      children: /* @__PURE__ */ n(c.ItemText, { children: r.label })
+                    },
+                    r.key
+                  )) }) })
+                ]
+              }
+            ) }, e.key);
+          }
+          if (a === "horizontal") {
+            const t = x(e.children), _ = z(e, l);
+            return /* @__PURE__ */ n("li", { className: "gcsa-menu__node", role: "none", children: /* @__PURE__ */ n("div", { className: "gcsa-menu__branch", children: /* @__PURE__ */ o(c.Root, { onSelect: (r) => d(r.value), children: [
+              /* @__PURE__ */ n(c.Trigger, { asChild: !0, children: /* @__PURE__ */ o(
+                "button",
+                {
+                  type: "button",
+                  className: `gcsa-menu__item gcsa-menu__item--submenu gcsa-focus-ring${_ ? " gcsa-menu__item--selected" : ""}${e.disabled ? " gcsa-menu__item--disabled" : ""}`,
+                  disabled: e.disabled,
+                  children: [
+                    /* @__PURE__ */ n("span", { className: "gcsa-menu__label", children: e.label }),
+                    /* @__PURE__ */ n("span", { className: "gcsa-menu__arrow", "aria-hidden": "true", children: /* @__PURE__ */ n(y, { name: "chevronLeft", size: "sm" }) })
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ n(c.Positioner, { children: /* @__PURE__ */ n(c.Content, { className: "gcsa-dropdown gcsa-ui-surface", children: t.map((r) => /* @__PURE__ */ n(
+                c.Item,
+                {
+                  value: r.key,
+                  disabled: r.disabled,
+                  className: "gcsa-dropdown__item",
+                  children: /* @__PURE__ */ n(c.ItemText, { children: r.label })
+                },
+                r.key
+              )) }) })
+            ] }) }) }, e.key);
+          }
+          return /* @__PURE__ */ n("li", { className: "gcsa-menu__node", role: "none", children: /* @__PURE__ */ o(
+            $.Root,
+            {
+              open: h.has(e.key),
+              className: "gcsa-menu__submenu",
+              onOpenChange: (t) => b(e.key, t.open),
+              children: [
+                /* @__PURE__ */ o(
+                  $.Trigger,
+                  {
+                    className: `gcsa-menu__item gcsa-menu__item--submenu gcsa-focus-ring${e.key === l ? " gcsa-menu__item--selected" : ""}${e.disabled ? " gcsa-menu__item--disabled" : ""}`,
+                    disabled: e.disabled,
+                    "data-selected": e.key === l ? "" : void 0,
+                    children: [
+                      /* @__PURE__ */ n(N, { item: e }),
+                      /* @__PURE__ */ n("span", { className: "gcsa-menu__label", children: e.label }),
+                      /* @__PURE__ */ n("span", { className: "gcsa-menu__arrow", "aria-hidden": "true", children: /* @__PURE__ */ n(y, { name: "chevronLeft", size: "sm" }) })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ n($.Content, { className: "gcsa-menu__submenu-panel", children: /* @__PURE__ */ n(
+                  M,
+                  {
+                    items: e.children,
+                    mode: a,
+                    selectedKey: l,
+                    openKeys: i,
+                    collapsed: g,
+                    depth: u + 1,
+                    onSelect: d,
+                    onToggle: b
+                  }
+                ) })
+              ]
+            }
+          ) }, e.key);
+        }
+        const p = `gcsa-menu__item gcsa-focus-ring${e.key === l ? " gcsa-menu__item--selected" : ""}${e.disabled ? " gcsa-menu__item--disabled" : ""}`, v = e.href ? /* @__PURE__ */ o(
+          "a",
+          {
+            href: e.href,
+            className: p,
+            role: "menuitem",
+            "aria-current": e.key === l ? "page" : void 0,
+            children: [
+              /* @__PURE__ */ n(N, { item: e }),
+              /* @__PURE__ */ n("span", { className: "gcsa-menu__label", children: e.label })
+            ]
+          }
+        ) : /* @__PURE__ */ o(
+          "button",
+          {
+            type: "button",
+            className: p,
+            role: "menuitem",
+            disabled: e.disabled,
+            "aria-current": e.key === l ? "page" : void 0,
+            onClick: () => {
+              e.disabled || d(e.key);
+            },
+            children: [
+              /* @__PURE__ */ n(N, { item: e }),
+              /* @__PURE__ */ n("span", { className: "gcsa-menu__label", children: e.label })
+            ]
+          }
+        );
+        return /* @__PURE__ */ n("li", { className: "gcsa-menu__node", role: "none", children: /* @__PURE__ */ n(
+          T,
+          {
+            content: e.label,
+            placement: "right",
+            disabled: !f,
+            gutter: 10,
+            children: v
+          }
+        ) }, e.key);
+      })
+    }
+  );
+}
+function V({
+  items: s,
+  selectedKey: a,
+  defaultSelectedKey: l,
+  openKeys: i,
+  defaultOpenKeys: g,
+  mode: u = "vertical",
+  collapsed: d = !1,
+  className: b,
+  onSelectedKeyChange: h,
+  onSelect: f,
+  onOpenKeysChange: e
+}) {
+  const [p, v] = w(
+    a ?? l ?? ""
+  ), [t, _] = w(i ?? g ?? []), r = a ?? p, k = i ?? t;
+  B(() => {
+    d && (_([]), e == null || e([]));
+  }, [d]);
+  function G(m) {
+    a === void 0 && v(m), h == null || h(m), f == null || f(m);
+  }
+  function P(m, S) {
+    const I = S ? [.../* @__PURE__ */ new Set([...k, m])] : k.filter((j) => j !== m);
+    i === void 0 && _(I), e == null || e(I);
+  }
+  const R = `gcsa-menu--${u}`;
+  return /* @__PURE__ */ n(
+    "nav",
+    {
+      className: `gcsa-menu gcsa-ui-surface ${R}${d ? " gcsa-menu--collapsed" : ""}${b ? ` ${b}` : ""}`,
+      role: "menu",
+      "aria-orientation": u === "horizontal" ? "horizontal" : "vertical",
+      children: /* @__PURE__ */ n(
+        M,
+        {
+          items: s,
+          mode: u,
+          selectedKey: r,
+          openKeys: k,
+          collapsed: d,
+          depth: 0,
+          onSelect: G,
+          onToggle: P
+        }
+      )
+    }
+  );
+}
+export {
+  V as GcsaMenu
+};
+//# sourceMappingURL=GcsaMenu.js.map

package/dist/GcsaMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaMenu.js","sources":["../src/GcsaMenu.tsx"],"sourcesContent":["import { useEffect, useMemo, useState, type ReactNode } from 'react';\nimport { Collapsible } from '@ark-ui/react/collapsible';\nimport { Menu } from '@ark-ui/react/menu';\nimport type { GcsaMenuItem, GcsaMenuMode } from '@gcsa/console-core';\nimport { createGcsaPopupPositioning } from '@gcsa/console-core';\nimport { GcsaIcon } from './GcsaIcon';\nimport { GcsaTooltip } from './GcsaTooltip';\n\nexport type { GcsaMenuItem, GcsaMenuMode } from '@gcsa/console-core';\n\nexport type GcsaMenuProps = {\n  items: GcsaMenuItem[];\n  selectedKey?: string;\n  defaultSelectedKey?: string;\n  openKeys?: string[];\n  defaultOpenKeys?: string[];\n  mode?: GcsaMenuMode;\n  collapsed?: boolean;\n  className?: string;\n  onSelectedKeyChange?: (key: string) => void;\n  onSelect?: (key: string) => void;\n  onOpenKeysChange?: (keys: string[]) => void;\n};\n\ntype MenuNodesProps = {\n  items: GcsaMenuItem[];\n  mode: GcsaMenuMode;\n  selectedKey: string;\n  openKeys: string[];\n  collapsed?: boolean;\n  depth: number;\n  onSelect: (key: string) => void;\n  onToggle: (key: string, open: boolean) => void;\n};\n\nfunction isBranch(item: GcsaMenuItem) {\n  return Boolean(item.children?.length) && item.type !== 'group' && item.type !== 'divider';\n}\n\nfunction flattenDropdownItems(items: GcsaMenuItem[]) {\n  return items\n    .filter(item => item.type !== 'group' && item.type !== 'divider')\n    .map(item => ({\n      key: item.key,\n      label: item.label,\n      disabled: item.disabled\n    }));\n}\n\nfunction branchContainsSelection(item: GcsaMenuItem, selectedKey: string) {\n  if (item.key === selectedKey) return true;\n  return item.children?.some(child => child.key === selectedKey) ?? false;\n}\n\nfunction MenuIcon({ item }: { item: GcsaMenuItem }) {\n  if (item.icon) {\n    return (\n      <span className=\"gcsa-menu__icon\" aria-hidden=\"true\">\n        {item.icon as ReactNode}\n      </span>\n    );\n  }\n  if (item.iconKey) {\n    return (\n      <span className=\"gcsa-menu__icon\" aria-hidden=\"true\">\n        <GcsaIcon name={item.iconKey} />\n      </span>\n    );\n  }\n  return null;\n}\n\nfunction MenuNodes({\n  items,\n  mode,\n  selectedKey,\n  openKeys,\n  collapsed = false,\n  depth,\n  onSelect,\n  onToggle\n}: MenuNodesProps) {\n  const openKeySet = useMemo(() => new Set(openKeys), [openKeys]);\n  const showTooltips = collapsed && depth === 0;\n\n  return (\n    <ul\n      className={`gcsa-menu__list${depth > 0 ? ' gcsa-menu__list--nested' : ''}`}\n      role=\"none\"\n    >\n      {items.map(item => {\n        if (item.type === 'divider') {\n          return (\n            <li key={item.key} className=\"gcsa-menu__node gcsa-menu__node--divider\" role=\"none\">\n              <div className=\"gcsa-menu__divider\" role=\"separator\" />\n            </li>\n          );\n        }\n\n        if (item.type === 'group') {\n          return (\n            <li key={item.key} className=\"gcsa-menu__node gcsa-menu__node--group\" role=\"none\">\n              <div className=\"gcsa-menu__group-label\">{item.label}</div>\n            </li>\n          );\n        }\n\n        if (isBranch(item)) {\n          if (collapsed && mode !== 'horizontal') {\n            const childItems = flattenDropdownItems(item.children!);\n            const branchSelected = branchContainsSelection(item, selectedKey);\n\n            return (\n              <li key={item.key} className=\"gcsa-menu__node\" role=\"none\">\n                <Menu.Root\n                  positioning={createGcsaPopupPositioning({ placement: 'right-start', gutter: 8 })}\n                  onSelect={details => onSelect(details.value)}\n                >\n                  <GcsaTooltip content={item.label} placement=\"right\" gutter={10}>\n                    <Menu.Trigger asChild>\n                      <button\n                        type=\"button\"\n                        className={`gcsa-menu__item gcsa-menu__item--submenu gcsa-focus-ring${\n                          branchSelected ? ' gcsa-menu__item--selected' : ''\n                        }${item.disabled ? ' gcsa-menu__item--disabled' : ''}`}\n                        disabled={item.disabled}\n                      >\n                        <MenuIcon item={item} />\n                        <span className=\"gcsa-menu__label\">{item.label}</span>\n                      </button>\n                    </Menu.Trigger>\n                  </GcsaTooltip>\n                  <Menu.Positioner>\n                    <Menu.Content className=\"gcsa-dropdown gcsa-ui-surface\">\n                      {childItems.map(child => (\n                        <Menu.Item\n                          key={child.key}\n                          value={child.key}\n                          disabled={child.disabled}\n                          className=\"gcsa-dropdown__item\"\n                        >\n                          <Menu.ItemText>{child.label}</Menu.ItemText>\n                        </Menu.Item>\n                      ))}\n                    </Menu.Content>\n                  </Menu.Positioner>\n                </Menu.Root>\n              </li>\n            );\n          }\n\n          if (mode === 'horizontal') {\n            const childItems = flattenDropdownItems(item.children!);\n            const branchSelected = branchContainsSelection(item, selectedKey);\n\n            return (\n              <li key={item.key} className=\"gcsa-menu__node\" role=\"none\">\n                <div className=\"gcsa-menu__branch\">\n                  <Menu.Root onSelect={details => onSelect(details.value)}>\n                    <Menu.Trigger asChild>\n                      <button\n                        type=\"button\"\n                        className={`gcsa-menu__item gcsa-menu__item--submenu gcsa-focus-ring${\n                          branchSelected ? ' gcsa-menu__item--selected' : ''\n                        }${item.disabled ? ' gcsa-menu__item--disabled' : ''}`}\n                        disabled={item.disabled}\n                      >\n                        <span className=\"gcsa-menu__label\">{item.label}</span>\n                        <span className=\"gcsa-menu__arrow\" aria-hidden=\"true\">\n                          <GcsaIcon name=\"chevronLeft\" size=\"sm\" />\n                        </span>\n                      </button>\n                    </Menu.Trigger>\n                    <Menu.Positioner>\n                      <Menu.Content className=\"gcsa-dropdown gcsa-ui-surface\">\n                        {childItems.map(child => (\n                          <Menu.Item\n                            key={child.key}\n                            value={child.key}\n                            disabled={child.disabled}\n                            className=\"gcsa-dropdown__item\"\n                          >\n                            <Menu.ItemText>{child.label}</Menu.ItemText>\n                          </Menu.Item>\n                        ))}\n                      </Menu.Content>\n                    </Menu.Positioner>\n                  </Menu.Root>\n                </div>\n              </li>\n            );\n          }\n\n          return (\n            <li key={item.key} className=\"gcsa-menu__node\" role=\"none\">\n              <Collapsible.Root\n                open={openKeySet.has(item.key)}\n                className=\"gcsa-menu__submenu\"\n                onOpenChange={details => onToggle(item.key, details.open)}\n              >\n                <Collapsible.Trigger\n                  className={`gcsa-menu__item gcsa-menu__item--submenu gcsa-focus-ring${\n                    item.key === selectedKey ? ' gcsa-menu__item--selected' : ''\n                  }${item.disabled ? ' gcsa-menu__item--disabled' : ''}`}\n                  disabled={item.disabled}\n                  data-selected={item.key === selectedKey ? '' : undefined}\n                >\n                  <MenuIcon item={item} />\n                  <span className=\"gcsa-menu__label\">{item.label}</span>\n                  <span className=\"gcsa-menu__arrow\" aria-hidden=\"true\">\n                    <GcsaIcon name=\"chevronLeft\" size=\"sm\" />\n                  </span>\n                </Collapsible.Trigger>\n                <Collapsible.Content className=\"gcsa-menu__submenu-panel\">\n                  <MenuNodes\n                    items={item.children!}\n                    mode={mode}\n                    selectedKey={selectedKey}\n                    openKeys={openKeys}\n                    collapsed={collapsed}\n                    depth={depth + 1}\n                    onSelect={onSelect}\n                    onToggle={onToggle}\n                  />\n                </Collapsible.Content>\n              </Collapsible.Root>\n            </li>\n          );\n        }\n\n        const itemClassName = `gcsa-menu__item gcsa-focus-ring${\n          item.key === selectedKey ? ' gcsa-menu__item--selected' : ''\n        }${item.disabled ? ' gcsa-menu__item--disabled' : ''}`;\n\n        const leafNode = item.href ? (\n          <a\n            href={item.href}\n            className={itemClassName}\n            role=\"menuitem\"\n            aria-current={item.key === selectedKey ? 'page' : undefined}\n          >\n            <MenuIcon item={item} />\n            <span className=\"gcsa-menu__label\">{item.label}</span>\n          </a>\n        ) : (\n          <button\n            type=\"button\"\n            className={itemClassName}\n            role=\"menuitem\"\n            disabled={item.disabled}\n            aria-current={item.key === selectedKey ? 'page' : undefined}\n            onClick={() => {\n              if (!item.disabled) onSelect(item.key);\n            }}\n          >\n            <MenuIcon item={item} />\n            <span className=\"gcsa-menu__label\">{item.label}</span>\n          </button>\n        );\n\n        return (\n          <li key={item.key} className=\"gcsa-menu__node\" role=\"none\">\n            <GcsaTooltip\n              content={item.label}\n              placement=\"right\"\n              disabled={!showTooltips}\n              gutter={10}\n            >\n              {leafNode}\n            </GcsaTooltip>\n          </li>\n        );\n      })}\n    </ul>\n  );\n}\n\nexport function GcsaMenu({\n  items,\n  selectedKey,\n  defaultSelectedKey,\n  openKeys,\n  defaultOpenKeys,\n  mode = 'vertical',\n  collapsed = false,\n  className,\n  onSelectedKeyChange,\n  onSelect,\n  onOpenKeysChange\n}: GcsaMenuProps) {\n  const [innerSelectedKey, setInnerSelectedKey] = useState(\n    selectedKey ?? defaultSelectedKey ?? ''\n  );\n  const [innerOpenKeys, setInnerOpenKeys] = useState<string[]>(openKeys ?? defaultOpenKeys ?? []);\n\n  const resolvedSelectedKey = selectedKey ?? innerSelectedKey;\n  const resolvedOpenKeys = openKeys ?? innerOpenKeys;\n\n  useEffect(() => {\n    if (!collapsed) return;\n    setInnerOpenKeys([]);\n    onOpenKeysChange?.([]);\n  }, [collapsed]);\n\n  function handleSelect(key: string) {\n    if (selectedKey === undefined) setInnerSelectedKey(key);\n    onSelectedKeyChange?.(key);\n    onSelect?.(key);\n  }\n\n  function handleToggle(key: string, open: boolean) {\n    const next = open\n      ? [...new Set([...resolvedOpenKeys, key])]\n      : resolvedOpenKeys.filter(item => item !== key);\n    if (openKeys === undefined) setInnerOpenKeys(next);\n    onOpenKeysChange?.(next);\n  }\n\n  const modeClass = `gcsa-menu--${mode}`;\n  const collapsedClass = collapsed ? ' gcsa-menu--collapsed' : '';\n\n  return (\n    <nav\n      className={`gcsa-menu gcsa-ui-surface ${modeClass}${collapsedClass}${className ? ` ${className}` : ''}`}\n      role=\"menu\"\n      aria-orientation={mode === 'horizontal' ? 'horizontal' : 'vertical'}\n    >\n      <MenuNodes\n        items={items}\n        mode={mode}\n        selectedKey={resolvedSelectedKey}\n        openKeys={resolvedOpenKeys}\n        collapsed={collapsed}\n        depth={0}\n        onSelect={handleSelect}\n        onToggle={handleToggle}\n      />\n    </nav>\n  );\n}\n"],"names":["isBranch","item","_a","flattenDropdownItems","items","branchContainsSelection","selectedKey","child","MenuIcon","jsx","GcsaIcon","MenuNodes","mode","openKeys","collapsed","depth","onSelect","onToggle","openKeySet","useMemo","showTooltips","childItems","branchSelected","jsxs","Menu","createGcsaPopupPositioning","details","GcsaTooltip","Collapsible","itemClassName","leafNode","GcsaMenu","defaultSelectedKey","defaultOpenKeys","className","onSelectedKeyChange","onOpenKeysChange","innerSelectedKey","setInnerSelectedKey","useState","innerOpenKeys","setInnerOpenKeys","resolvedSelectedKey","resolvedOpenKeys","useEffect","handleSelect","key","handleToggle","open","next","modeClass"],"mappings":"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"}

package/dist/GcsaModal.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+export type GcsaModalProps = {
+    open: boolean;
+    title?: string;
+    closable?: boolean;
+    footer?: ReactNode;
+    onOpenChange?: (open: boolean) => void;
+    children?: ReactNode;
+};
+export declare function GcsaModal({ open, title, closable, footer, onOpenChange, children }: GcsaModalProps): import("react").JSX.Element;

package/dist/GcsaModal.js

@@ -0,0 +1,45 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { Dialog as a } from "@ark-ui/react/dialog";
+import { Portal as g } from "@ark-ui/react/portal";
+import { useGcsaLocaleMessages as p } from "./hooks/useGcsaLocale.js";
+import { useGcsaOverlayZIndex as f } from "./hooks/useOverlayZIndex.js";
+function b({
+  open: o,
+  title: l,
+  closable: t = !0,
+  footer: r,
+  onOpenChange: s,
+  children: n
+}) {
+  const m = p(), { backdropZ: c, positionerZ: d } = f(o), u = c == null ? void 0 : { zIndex: c }, _ = d == null ? void 0 : { zIndex: d };
+  return /* @__PURE__ */ e(
+    a.Root,
+    {
+      open: o,
+      lazyMount: !0,
+      unmountOnExit: !0,
+      onOpenChange: (h) => s == null ? void 0 : s(h.open),
+      children: /* @__PURE__ */ i(g, { children: [
+        /* @__PURE__ */ e(a.Backdrop, { className: "gcsa-modal__backdrop", style: u }),
+        /* @__PURE__ */ e(a.Positioner, { className: "gcsa-modal__positioner", style: _, children: /* @__PURE__ */ i(a.Content, { className: "gcsa-modal__panel gcsa-ui-surface", children: [
+          t ? /* @__PURE__ */ e(a.CloseTrigger, { className: "gcsa-modal__close", "aria-label": m.close, children: /* @__PURE__ */ e("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e(
+            "path",
+            {
+              d: "M2 2l10 10M12 2L2 12",
+              stroke: "currentColor",
+              strokeWidth: "1.5",
+              strokeLinecap: "round"
+            }
+          ) }) }) : null,
+          l ? /* @__PURE__ */ e("header", { className: "gcsa-modal__header", children: /* @__PURE__ */ e(a.Title, { asChild: !0, children: /* @__PURE__ */ e("div", { className: "gcsa-modal__title", children: l }) }) }) : null,
+          /* @__PURE__ */ e("div", { className: `gcsa-modal__body${l ? " gcsa-modal__body--titled" : ""}`, children: n }),
+          r ? /* @__PURE__ */ e("div", { className: "gcsa-modal__footer", children: r }) : null
+        ] }) })
+      ] })
+    }
+  );
+}
+export {
+  b as GcsaModal
+};
+//# sourceMappingURL=GcsaModal.js.map

package/dist/GcsaModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaModal.js","sources":["../src/GcsaModal.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { Dialog } from '@ark-ui/react/dialog';\nimport { Portal } from '@ark-ui/react/portal';\nimport { useGcsaLocaleMessages } from './hooks/useGcsaLocale';\nimport { useGcsaOverlayZIndex } from './hooks/useOverlayZIndex';\n\nexport type GcsaModalProps = {\n  open: boolean;\n  title?: string;\n  closable?: boolean;\n  footer?: ReactNode;\n  onOpenChange?: (open: boolean) => void;\n  children?: ReactNode;\n};\n\nexport function GcsaModal({\n  open,\n  title,\n  closable = true,\n  footer,\n  onOpenChange,\n  children\n}: GcsaModalProps) {\n  const messages = useGcsaLocaleMessages();\n  const { backdropZ, positionerZ } = useGcsaOverlayZIndex(open);\n  const backdropStyle = (backdropZ == null ? undefined : { zIndex: backdropZ }) as CSSProperties | undefined;\n  const positionerStyle = (positionerZ == null ? undefined : { zIndex: positionerZ }) as CSSProperties | undefined;\n\n  return (\n    <Dialog.Root\n      open={open}\n      lazyMount\n      unmountOnExit\n      onOpenChange={details => onOpenChange?.(details.open)}\n    >\n      <Portal>\n        <Dialog.Backdrop className=\"gcsa-modal__backdrop\" style={backdropStyle} />\n        <Dialog.Positioner className=\"gcsa-modal__positioner\" style={positionerStyle}>\n          <Dialog.Content className=\"gcsa-modal__panel gcsa-ui-surface\">\n            {closable ? (\n              <Dialog.CloseTrigger className=\"gcsa-modal__close\" aria-label={messages.close}>\n                <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" aria-hidden=\"true\">\n                  <path\n                    d=\"M2 2l10 10M12 2L2 12\"\n                    stroke=\"currentColor\"\n                    strokeWidth=\"1.5\"\n                    strokeLinecap=\"round\"\n                  />\n                </svg>\n              </Dialog.CloseTrigger>\n            ) : null}\n            {title ? (\n              <header className=\"gcsa-modal__header\">\n                <Dialog.Title asChild>\n                  <div className=\"gcsa-modal__title\">{title}</div>\n                </Dialog.Title>\n              </header>\n            ) : null}\n            <div className={`gcsa-modal__body${title ? ' gcsa-modal__body--titled' : ''}`}>\n              {children}\n            </div>\n            {footer ? <div className=\"gcsa-modal__footer\">{footer}</div> : null}\n          </Dialog.Content>\n        </Dialog.Positioner>\n      </Portal>\n    </Dialog.Root>\n  );\n}\n"],"names":["GcsaModal","open","title","closable","footer","onOpenChange","children","messages","useGcsaLocaleMessages","backdropZ","positionerZ","useGcsaOverlayZIndex","backdropStyle","positionerStyle","jsx","Dialog","details","Portal","jsxs"],"mappings":";;;;;AAeO,SAASA,EAAU;AAAA,EACxB,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,QAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AACF,GAAmB;AACjB,QAAMC,IAAWC,EAAA,GACX,EAAE,WAAAC,GAAW,aAAAC,MAAgBC,EAAqBV,CAAI,GACtDW,IAAiBH,KAAa,OAAO,SAAY,EAAE,QAAQA,EAAA,GAC3DI,IAAmBH,KAAe,OAAO,SAAY,EAAE,QAAQA,EAAA;AAErE,SACE,gBAAAI;AAAA,IAACC,EAAO;AAAA,IAAP;AAAA,MACC,MAAAd;AAAA,MACA,WAAS;AAAA,MACT,eAAa;AAAA,MACb,cAAc,CAAAe,MAAWX,KAAA,gBAAAA,EAAeW,EAAQ;AAAA,MAEhD,4BAACC,GAAA,EACC,UAAA;AAAA,QAAA,gBAAAH,EAACC,EAAO,UAAP,EAAgB,WAAU,wBAAuB,OAAOH,GAAe;AAAA,QACxE,gBAAAE,EAACC,EAAO,YAAP,EAAkB,WAAU,0BAAyB,OAAOF,GAC3D,UAAA,gBAAAK,EAACH,EAAO,SAAP,EAAe,WAAU,qCACvB,UAAA;AAAA,UAAAZ,IACC,gBAAAW,EAACC,EAAO,cAAP,EAAoB,WAAU,qBAAoB,cAAYR,EAAS,OACtE,UAAA,gBAAAO,EAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,eAAY,QACtE,UAAA,gBAAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,GAAE;AAAA,cACF,QAAO;AAAA,cACP,aAAY;AAAA,cACZ,eAAc;AAAA,YAAA;AAAA,UAAA,EAChB,CACF,GACF,IACE;AAAA,UACHZ,IACC,gBAAAY,EAAC,UAAA,EAAO,WAAU,sBAChB,UAAA,gBAAAA,EAACC,EAAO,OAAP,EAAa,SAAO,IACnB,4BAAC,OAAA,EAAI,WAAU,qBAAqB,UAAAb,EAAA,CAAM,GAC5C,GACF,IACE;AAAA,UACJ,gBAAAY,EAAC,SAAI,WAAW,mBAAmBZ,IAAQ,8BAA8B,EAAE,IACxE,UAAAI,GACH;AAAA,UACCF,IAAS,gBAAAU,EAAC,OAAA,EAAI,WAAU,sBAAsB,aAAO,IAAS;AAAA,QAAA,EAAA,CACjE,EAAA,CACF;AAAA,MAAA,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/GcsaMultiSelect.d.ts

@@ -0,0 +1,23 @@
+import { GcsaPopupPlacement, GcsaSelectOption, GcsaSelectSize } from '@gcsa/console-core';
+export type GcsaMultiSelectPlacement = GcsaPopupPlacement;
+export type GcsaMultiSelectProps = {
+    value: string[];
+    options: GcsaSelectOption[];
+    placeholder?: string;
+    invalid?: boolean;
+    /** 下拉相对触发器的初始方位 */
+    placement?: GcsaMultiSelectPlacement;
+    listMaxHeight?: number;
+    listHintThreshold?: number;
+    groupOrder?: string[];
+    /** 触发器内最多展示的 tag 数，超出显示 +N */
+    maxTagCount?: number;
+    /** 是否挂载到 body；嵌套浮层应设为 false */
+    portalled?: boolean;
+    /** 下拉面板是否与触发器同宽 */
+    sameWidth?: boolean;
+    size?: GcsaSelectSize;
+    className?: string;
+    onValueChange?: (value: string[]) => void;
+};
+export declare function GcsaMultiSelect({ value, options, placeholder, invalid, placement, listMaxHeight, listHintThreshold, groupOrder, maxTagCount, portalled, sameWidth, size, className, onValueChange }: GcsaMultiSelectProps): import("react").JSX.Element;

package/dist/GcsaMultiSelect.js

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

package/dist/GcsaMultiSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaMultiSelect.js","sources":["../src/GcsaMultiSelect.tsx"],"sourcesContent":["import { useMemo, useRef, type CSSProperties, type MouseEvent } 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 { GcsaTag } from './GcsaTag';\nimport { useGcsaLocaleMessages } from './hooks/useGcsaLocale';\nimport { useGcsaPopupZIndex } from './hooks/useGcsaPopupZIndex';\nimport { useGcsaComponentSize } from './hooks/useGcsaComponentSize';\nimport { preserveDrawerScrollFrom } from './utils/preserveDrawerScroll';\n\nexport type GcsaMultiSelectPlacement = GcsaPopupPlacement;\n\nexport type GcsaMultiSelectProps = {\n  value: string[];\n  options: GcsaSelectOption[];\n  placeholder?: string;\n  invalid?: boolean;\n  /** 下拉相对触发器的初始方位 */\n  placement?: GcsaMultiSelectPlacement;\n  listMaxHeight?: number;\n  listHintThreshold?: number;\n  groupOrder?: string[];\n  /** 触发器内最多展示的 tag 数，超出显示 +N */\n  maxTagCount?: number;\n  /** 是否挂载到 body；嵌套浮层应设为 false */\n  portalled?: boolean;\n  /** 下拉面板是否与触发器同宽 */\n  sameWidth?: boolean;\n  size?: GcsaSelectSize;\n  className?: string;\n  onValueChange?: (value: string[]) => void;\n};\n\nfunction MultiSelectContent({\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 GcsaMultiSelect({\n  value,\n  options,\n  placeholder,\n  invalid,\n  placement = 'bottom-start',\n  listMaxHeight = 280,\n  listHintThreshold = 16,\n  groupOrder,\n  maxTagCount = 2,\n  portalled = true,\n  sameWidth = true,\n  size,\n  className,\n  onValueChange\n}: GcsaMultiSelectProps) {\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  const selectedValues = value ?? [];\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 selectedOptions = useMemo(\n    () =>\n      selectedValues.map(\n        item => options.find(opt => opt.value === item) || { label: item, value: item }\n      ),\n    [selectedValues, options]\n  );\n\n  const visibleTags = selectedOptions.slice(0, maxTagCount);\n  const hiddenCount = Math.max(0, selectedOptions.length - visibleTags.length);\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  const removeTag = (optionValue: string, event: MouseEvent) => {\n    event.preventDefault();\n    event.stopPropagation();\n    onValueChange?.(selectedValues.filter(item => item !== optionValue));\n  };\n\n  const triggerClassName = [\n    'gcsa-select-trigger',\n    'gcsa-multi-select__trigger',\n    'gcsa-focus-ring',\n    gcsaControlSizeClass('gcsa-select-trigger', resolvedSize),\n    className\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <Select.Root\n      collection={collection}\n      value={selectedValues}\n      multiple\n      closeOnSelect={false}\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)}\n    >\n      <Select.Control ref={controlRef} className=\"gcsa-select-control gcsa-multi-select\">\n        <Select.Trigger className={triggerClassName} data-invalid={invalid || undefined}>\n          <span className=\"gcsa-multi-select__value\">\n            {selectedOptions.length === 0 ? (\n              <span className=\"gcsa-multi-select__placeholder\">{placeholder}</span>\n            ) : (\n              <>\n                {visibleTags.map(option => (\n                  <GcsaTag key={option.value} tone=\"primary\" className=\"gcsa-multi-select__tag\">\n                    <span className=\"gcsa-multi-select__tag-label\">{option.label}</span>\n                    <button\n                      type=\"button\"\n                      className=\"gcsa-multi-select__tag-remove\"\n                      aria-label=\"remove\"\n                      onPointerDown={event => {\n                        event.preventDefault();\n                        event.stopPropagation();\n                      }}\n                      onClick={event => removeTag(option.value, event)}\n                    >\n                      <GcsaIcon name=\"close\" size=\"sm\" />\n                    </button>\n                  </GcsaTag>\n                ))}\n                {hiddenCount > 0 ? (\n                  <GcsaTag tone=\"primary\" className=\"gcsa-multi-select__tag gcsa-multi-select__tag--rest\">\n                    +{hiddenCount}\n                  </GcsaTag>\n                ) : null}\n              </>\n            )}\n          </span>\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            <MultiSelectContent\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          <MultiSelectContent\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":["MultiSelectContent","collection","contentStyle","showListHint","listHintText","empty","emptyText","jsx","Select","jsxs","Fragment","groupLabel","groupItems","opt","GcsaIcon","GcsaMultiSelect","value","options","placeholder","invalid","placement","listMaxHeight","listHintThreshold","groupOrder","maxTagCount","portalled","sameWidth","size","className","onValueChange","controlRef","useRef","resolvedSize","useGcsaComponentSize","messages","useGcsaLocaleMessages","zIndex","onOpenChange","useGcsaPopupZIndex","hasGroups","item","selectedValues","useMemo","createListCollection","selectedOptions","visibleTags","hiddenCount","formatGcsaLocaleMessage","isEmpty","positionerStyle","positioning","createGcsaPopupPositioning","removeTag","optionValue","event","triggerClassName","gcsaControlSizeClass","details","preserveDrawerScrollFrom","option","GcsaTag","Portal"],"mappings":"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"}

package/dist/GcsaPagination.d.ts

@@ -0,0 +1,17 @@
+import { GcsaPaginationAlign, GcsaPaginationLayoutPart } from '@gcsa/console-core';
+export type GcsaPaginationProps = {
+    page: number;
+    total: number;
+    pageSize?: number;
+    pageSizeOptions?: number[];
+    showPageSize?: boolean;
+    showJumper?: boolean;
+    pageSizeLabel?: string;
+    jumperLabel?: string;
+    layout?: string | GcsaPaginationLayoutPart[];
+    align?: GcsaPaginationAlign;
+    onPageSizeChange?: (pageSize: number) => void;
+    className?: string;
+    onPageChange?: (page: number) => void;
+};
+export declare function GcsaPagination({ page, total, pageSize, pageSizeOptions, showPageSize, showJumper, pageSizeLabel, jumperLabel, layout, align, onPageSizeChange, className, onPageChange }: GcsaPaginationProps): import("react").JSX.Element;