@x-plat/design-system 0.13.0 → 0.14.1

package/dist/index.cjs

@@ -347,6 +347,7 @@ __export(index_exports, {
   ThumbsUpIcon: () => ThumbsUpIcon_default,
   TimePicker: () => TimePicker_default,
   ToastProvider: () => ToastProvider,
+  ToggleChip: () => ToggleChip_default,
   ToggleLeftIcon: () => ToggleLeftIcon_default,
   ToggleRightIcon: () => ToggleRightIcon_default,
   ToolIcon: () => ToolIcon_default,
@@ -8388,10 +8389,8 @@ var import_react19 = __toESM(require("react"), 1);
 var useAutoPosition = (triggerRef, popRef, enabled = true) => {
   const [position, setPosition] = import_react19.default.useState({
     position: {},
-    direction: "bottom",
-    repositioning: false
+    direction: "bottom"
   });
-  const placedRef = import_react19.default.useRef(false);
   const calculatePosition = import_react19.default.useCallback(() => {
     if (!triggerRef.current || !popRef.current) return;
     const triggerRect = triggerRef.current.getBoundingClientRect();
@@ -8414,18 +8413,10 @@ var useAutoPosition = (triggerRef, popRef, enabled = true) => {
       left = triggerRect.right - popW;
     }
     if (left < 8) left = 8;
-    setPosition({
-      position: { top, left },
-      direction,
-      repositioning: placedRef.current
-    });
-    placedRef.current = true;
+    setPosition({ position: { top, left }, direction });
   }, [triggerRef, popRef]);
   import_react19.default.useLayoutEffect(() => {
-    if (!enabled) {
-      placedRef.current = false;
-      return;
-    }
+    if (!enabled) return;
     calculatePosition();
     const raf = requestAnimationFrame(calculatePosition);
     return () => cancelAnimationFrame(raf);
@@ -8491,7 +8482,7 @@ var Dropdown = (props) => {
   const [visible, setVisible] = import_react21.default.useState(false);
   const triggerRef = import_react21.default.useRef(null);
   const menuRef = import_react21.default.useRef(null);
-  const { position, direction, repositioning } = useAutoPosition_default(triggerRef, menuRef, mounted);
+  const { position, direction } = useAutoPosition_default(triggerRef, menuRef, mounted);
   useClickOutside_default([triggerRef, menuRef], () => setIsOpen(false), isOpen);
   useEscapeKey(isOpen, () => {
     setIsOpen(false);
@@ -8526,7 +8517,7 @@ var Dropdown = (props) => {
       "div",
       {
         ref: menuRef,
-        className: clsx_default("lib-xplat-dropdown-menu", direction, { visible }, repositioning && "repositioning"),
+        className: clsx_default("lib-xplat-dropdown-menu", direction, { visible }),
         style: { top: position.top, left: position.left },
         role: "menu",
         children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime322.jsx)(
@@ -10458,7 +10449,6 @@ var PopOver = (props) => {
             className: clsx_default(
               "lib-xplat-pop-over-content",
               position.direction,
-              position.repositioning && "repositioning",
               eventTrigger && "visible"
             ),
             ref: popRef,
@@ -10805,7 +10795,7 @@ var SelectRoot = (props) => {
         mounted && /* @__PURE__ */ (0, import_jsx_runtime337.jsx)(Portal_default, { children: /* @__PURE__ */ (0, import_jsx_runtime337.jsxs)(
           "div",
           {
-            className: clsx_default("lib-xplat-select-content", size, position.direction, stateClass, position.repositioning && "repositioning"),
+            className: clsx_default("lib-xplat-select-content", size, position.direction, stateClass),
             ref: contentRef,
             style: { ...position.position, width: triggerRef.current?.offsetWidth },
             role: "listbox",
@@ -11698,7 +11688,7 @@ var TimePicker = (props) => {
       "div",
       {
         ref: contentRef,
-        className: clsx_default("lib-xplat-time-picker-content", size, visible ? "enter" : "exit", position.repositioning && "repositioning"),
+        className: clsx_default("lib-xplat-time-picker-content", size, visible ? "enter" : "exit"),
         style: { ...position.position, width: triggerRef.current?.offsetWidth },
         role: "listbox",
         children: options.map((t) => /* @__PURE__ */ (0, import_jsx_runtime351.jsx)(
@@ -11818,9 +11808,33 @@ var ToastProvider = ({
 };
 ToastProvider.displayName = "ToastProvider";
 
+// src/components/ToggleChip/ToggleChip.tsx
+var import_jsx_runtime353 = require("react/jsx-runtime");
+var ToggleChip = (props) => {
+  const { children, selected = false, onClick, disabled = false, size = "md" } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(
+    "button",
+    {
+      type: "button",
+      className: clsx_default(
+        "lib-xplat-chip",
+        "lib-xplat-toggle-chip",
+        size,
+        selected ? "selected" : "unselected"
+      ),
+      "aria-pressed": selected,
+      disabled,
+      onClick,
+      children
+    }
+  );
+};
+ToggleChip.displayName = "ToggleChip";
+var ToggleChip_default = ToggleChip;
+
 // src/components/Tooltip/Tooltip.tsx
 var import_react42 = __toESM(require("react"), 1);
-var import_jsx_runtime353 = require("react/jsx-runtime");
+var import_jsx_runtime354 = require("react/jsx-runtime");
 var OFFSET = 12;
 var GAP = 8;
 var SHOW_DELAY = 300;
@@ -11925,8 +11939,8 @@ var Tooltip = (props) => {
     window.clearTimeout(delayTimer.current);
     cancelAnimationFrame(rafRef.current);
   }, []);
-  if (!title && !description) return /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(import_jsx_runtime353.Fragment, { children });
-  return /* @__PURE__ */ (0, import_jsx_runtime353.jsxs)(
+  if (!title && !description) return /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(import_jsx_runtime354.Fragment, { children });
+  return /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)(
     "div",
     {
       ref: triggerRef,
@@ -11939,7 +11953,7 @@ var Tooltip = (props) => {
       onBlur: close,
       children: [
         children,
-        visible && /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(Portal_default, { children: /* @__PURE__ */ (0, import_jsx_runtime353.jsxs)(
+        visible && /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(Portal_default, { children: /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)(
           "div",
           {
             ref: tooltipRef,
@@ -11947,8 +11961,8 @@ var Tooltip = (props) => {
             className: clsx_default("lib-xplat-tooltip", shape),
             style: { position: "fixed", left: pos.left, top: pos.top },
             children: [
-              title && /* @__PURE__ */ (0, import_jsx_runtime353.jsx)("div", { className: "tooltip-title", children: title }),
-              description && /* @__PURE__ */ (0, import_jsx_runtime353.jsx)("div", { className: "tooltip-desc", children: description })
+              title && /* @__PURE__ */ (0, import_jsx_runtime354.jsx)("div", { className: "tooltip-title", children: title }),
+              description && /* @__PURE__ */ (0, import_jsx_runtime354.jsx)("div", { className: "tooltip-desc", children: description })
             ]
           }
         ) })
@@ -11961,10 +11975,10 @@ var Tooltip_default = Tooltip;
 
 // src/components/Video/Video.tsx
 var import_react43 = __toESM(require("react"), 1);
-var import_jsx_runtime354 = require("react/jsx-runtime");
-var PipIcon = () => /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)("svg", { viewBox: "0 0 24 24", width: "1em", height: "1em", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime354.jsx)("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2" }),
-  /* @__PURE__ */ (0, import_jsx_runtime354.jsx)("rect", { x: "12", y: "11", width: "7", height: "6", rx: "1", fill: "currentColor" })
+var import_jsx_runtime355 = require("react/jsx-runtime");
+var PipIcon = () => /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)("svg", { viewBox: "0 0 24 24", width: "1em", height: "1em", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime355.jsx)("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2" }),
+  /* @__PURE__ */ (0, import_jsx_runtime355.jsx)("rect", { x: "12", y: "11", width: "7", height: "6", rx: "1", fill: "currentColor" })
 ] });
 var formatTime = (sec) => {
   if (!Number.isFinite(sec) || sec < 0) return "0:00";
@@ -12139,13 +12153,13 @@ var Video = import_react43.default.forwardRef((props, ref) => {
   const volumePct = (isMuted ? 0 : volume) * 100;
   const VolumeGlyph = isMuted || volume === 0 ? VolumeXIcon_default : volume < 0.5 ? VolumeIcon_default : Volume2Icon_default;
   const pipSupported = typeof document !== "undefined" && "pictureInPictureEnabled" in document && document.pictureInPictureEnabled;
-  return /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)(
     "div",
     {
       ref: containerRef,
       className: clsx_default("lib-xplat-video", showControls && "has-controls"),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
           "video",
           {
             ref: setRefs,
@@ -12166,7 +12180,7 @@ var Video = import_react43.default.forwardRef((props, ref) => {
             children
           }
         ),
-        showCenterPlay && /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+        showCenterPlay && /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
           "button",
           {
             type: "button",
@@ -12178,11 +12192,11 @@ var Video = import_react43.default.forwardRef((props, ref) => {
             onClick: togglePlay,
             "aria-label": isPlaying ? "\uC77C\uC2DC\uC815\uC9C0" : "\uC7AC\uC0DD",
             tabIndex: -1,
-            children: /* @__PURE__ */ (0, import_jsx_runtime354.jsx)("span", { className: "center-play-icon", children: /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(PlayCircleIcon_default, {}) })
+            children: /* @__PURE__ */ (0, import_jsx_runtime355.jsx)("span", { className: "center-play-icon", children: /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(PlayCircleIcon_default, {}) })
           }
         ),
-        showControls && /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)("div", { className: "controls", onClick: (e) => e.stopPropagation(), children: [
-          /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+        showControls && /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)("div", { className: "controls", onClick: (e) => e.stopPropagation(), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
             "input",
             {
               type: "range",
@@ -12199,29 +12213,29 @@ var Video = import_react43.default.forwardRef((props, ref) => {
               }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)("div", { className: "controls-row", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)("div", { className: "controls-row", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
               "button",
               {
                 type: "button",
                 className: "control-btn",
                 onClick: togglePlay,
                 "aria-label": isPlaying ? "\uC77C\uC2DC\uC815\uC9C0" : "\uC7AC\uC0DD",
-                children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(PauseIcon_default, {}) : /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(PlayIcon_default, {})
+                children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(PauseIcon_default, {}) : /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(PlayIcon_default, {})
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)("div", { className: "volume-group", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)("div", { className: "volume-group", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
                 "button",
                 {
                   type: "button",
                   className: "control-btn",
                   onClick: toggleMute,
                   "aria-label": isMuted ? "\uC74C\uC18C\uAC70 \uD574\uC81C" : "\uC74C\uC18C\uAC70",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(VolumeGlyph, {})
+                  children: /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(VolumeGlyph, {})
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
                 "input",
                 {
                   type: "range",
@@ -12236,14 +12250,14 @@ var Video = import_react43.default.forwardRef((props, ref) => {
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)("span", { className: "time", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)("span", { className: "time", children: [
               formatTime(currentTime),
               " / ",
               formatTime(duration)
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime354.jsx)("div", { className: "controls-spacer" }),
-            playbackRates && playbackRates.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)("div", { className: clsx_default("rate-group", rateMenuOpen && "is-open"), children: [
-              /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)(
+            /* @__PURE__ */ (0, import_jsx_runtime355.jsx)("div", { className: "controls-spacer" }),
+            playbackRates && playbackRates.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)("div", { className: clsx_default("rate-group", rateMenuOpen && "is-open"), children: [
+              /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)(
                 "button",
                 {
                   type: "button",
@@ -12257,7 +12271,7 @@ var Video = import_react43.default.forwardRef((props, ref) => {
                   ]
                 }
               ),
-              rateMenuOpen && /* @__PURE__ */ (0, import_jsx_runtime354.jsx)("ul", { className: "rate-menu", role: "menu", children: playbackRates.map((r2) => /* @__PURE__ */ (0, import_jsx_runtime354.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)(
+              rateMenuOpen && /* @__PURE__ */ (0, import_jsx_runtime355.jsx)("ul", { className: "rate-menu", role: "menu", children: playbackRates.map((r2) => /* @__PURE__ */ (0, import_jsx_runtime355.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)(
                 "button",
                 {
                   type: "button",
@@ -12271,7 +12285,7 @@ var Video = import_react43.default.forwardRef((props, ref) => {
                 }
               ) }, r2)) })
             ] }),
-            showCaptions && /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+            showCaptions && /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
               "button",
               {
                 type: "button",
@@ -12279,37 +12293,37 @@ var Video = import_react43.default.forwardRef((props, ref) => {
                 onClick: toggleCaptions,
                 "aria-label": captionsOn ? "\uC790\uB9C9 \uB044\uAE30" : "\uC790\uB9C9 \uCF1C\uAE30",
                 "aria-pressed": captionsOn,
-                children: /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(TypeIcon_default, {})
+                children: /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(TypeIcon_default, {})
               }
             ),
-            showPip && pipSupported && /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+            showPip && pipSupported && /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
               "button",
               {
                 type: "button",
                 className: clsx_default("control-btn", isPip && "is-active"),
                 onClick: togglePip,
                 "aria-label": isPip ? "PIP \uC885\uB8CC" : "PIP",
-                children: /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(PipIcon, {})
+                children: /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(PipIcon, {})
               }
             ),
-            showDownload && /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+            showDownload && /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
               "a",
               {
                 className: "control-btn",
                 href: src,
                 download: downloadFileName ?? true,
                 "aria-label": "\uB2E4\uC6B4\uB85C\uB4DC",
-                children: /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(DownloadIcon_default, {})
+                children: /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(DownloadIcon_default, {})
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
               "button",
               {
                 type: "button",
                 className: "control-btn",
                 onClick: toggleFullscreen,
                 "aria-label": isFullscreen ? "\uC804\uCCB4\uD654\uBA74 \uC885\uB8CC" : "\uC804\uCCB4\uD654\uBA74",
-                children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(MinimizeIcon_default, {}) : /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(MaximizeIcon_default, {})
+                children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(MinimizeIcon_default, {}) : /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(MaximizeIcon_default, {})
               }
             )
           ] })
@@ -12322,7 +12336,7 @@ Video.displayName = "Video";
 var Video_default = Video;
 
 // src/layout/Grid/FullGrid/FullGrid.tsx
-var import_jsx_runtime355 = require("react/jsx-runtime");
+var import_jsx_runtime356 = require("react/jsx-runtime");
 var GAP_MAP = {
   none: "var(--spacing-space-none)",
   xs: "var(--spacing-space-1)",
@@ -12335,13 +12349,13 @@ var GAP_MAP = {
 var FullGrid = (props) => {
   const { children, gap } = props;
   const style = gap != null ? { gap: GAP_MAP[gap] } : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime355.jsx)("div", { className: "lib-xplat-full-grid", style, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime356.jsx)("div", { className: "lib-xplat-full-grid", style, children });
 };
 FullGrid.displayName = "FullGrid";
 var FullGrid_default = FullGrid;
 
 // src/layout/Grid/FullScreen/FullScreen.tsx
-var import_jsx_runtime356 = require("react/jsx-runtime");
+var import_jsx_runtime357 = require("react/jsx-runtime");
 var GAP_MAP2 = {
   none: "var(--spacing-space-none)",
   xs: "var(--spacing-space-1)",
@@ -12354,13 +12368,13 @@ var GAP_MAP2 = {
 var FullScreen = (props) => {
   const { children, gap } = props;
   const style = gap != null ? { gap: GAP_MAP2[gap] } : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime356.jsx)("div", { className: "lib-xplat-full-screen", style, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime357.jsx)("div", { className: "lib-xplat-full-screen", style, children });
 };
 FullScreen.displayName = "FullScreen";
 var FullScreen_default = FullScreen;
 
 // src/layout/Grid/Item/Item.tsx
-var import_jsx_runtime357 = require("react/jsx-runtime");
+var import_jsx_runtime358 = require("react/jsx-runtime");
 var calculateSpans = (column) => {
   const spans = {};
   let inherited = column.default;
@@ -12377,35 +12391,35 @@ var GridItem = ({ column, children, className }) => {
   Object.entries(spans).forEach(([key, value]) => {
     style[`--column-${key}`] = value;
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime357.jsx)("div", { className: clsx_default("lib-xplat-grid-item", className), style, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime358.jsx)("div", { className: clsx_default("lib-xplat-grid-item", className), style, children });
 };
 GridItem.displayName = "GridItem";
 var Item_default = GridItem;
 
 // src/layout/Header/Header.tsx
-var import_jsx_runtime358 = require("react/jsx-runtime");
+var import_jsx_runtime359 = require("react/jsx-runtime");
 var Header = ({
   logo,
   centerContent,
   rightContent
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime358.jsxs)("div", { className: "lib-xplat-layout-header", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime358.jsx)("div", { children: logo }),
-    /* @__PURE__ */ (0, import_jsx_runtime358.jsx)("div", { children: centerContent }),
-    /* @__PURE__ */ (0, import_jsx_runtime358.jsx)("div", { children: rightContent })
+  return /* @__PURE__ */ (0, import_jsx_runtime359.jsxs)("div", { className: "lib-xplat-layout-header", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime359.jsx)("div", { children: logo }),
+    /* @__PURE__ */ (0, import_jsx_runtime359.jsx)("div", { children: centerContent }),
+    /* @__PURE__ */ (0, import_jsx_runtime359.jsx)("div", { children: rightContent })
   ] });
 };
 Header.displayName = "Header";
 var Header_default = Header;
 
 // src/layout/Layout/Layout.tsx
-var import_jsx_runtime359 = require("react/jsx-runtime");
+var import_jsx_runtime360 = require("react/jsx-runtime");
 var Layout = (props) => {
   const { header, sideBar, children } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime359.jsx)("div", { className: "lib-xplat-layout", children: /* @__PURE__ */ (0, import_jsx_runtime359.jsxs)("div", { className: "lib-xplat-layout-content-wrapper", children: [
-    sideBar && /* @__PURE__ */ (0, import_jsx_runtime359.jsx)(import_jsx_runtime359.Fragment, { children: sideBar }),
-    /* @__PURE__ */ (0, import_jsx_runtime359.jsxs)("div", { className: "lib-xplat-layout-content", children: [
-      header && /* @__PURE__ */ (0, import_jsx_runtime359.jsx)("div", { className: "lib-xplat-layout-conent-header", children: header }),
+  return /* @__PURE__ */ (0, import_jsx_runtime360.jsx)("div", { className: "lib-xplat-layout", children: /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)("div", { className: "lib-xplat-layout-content-wrapper", children: [
+    sideBar && /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(import_jsx_runtime360.Fragment, { children: sideBar }),
+    /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)("div", { className: "lib-xplat-layout-content", children: [
+      header && /* @__PURE__ */ (0, import_jsx_runtime360.jsx)("div", { className: "lib-xplat-layout-conent-header", children: header }),
       children
     ] })
   ] }) });
@@ -12427,18 +12441,18 @@ var useSideBarContext = () => {
 var SideBarContext_default = SideBarContext;
 
 // src/layout/SideBar/SideBar.tsx
-var import_jsx_runtime360 = require("react/jsx-runtime");
+var import_jsx_runtime361 = require("react/jsx-runtime");
 var SideBar = (props) => {
   const { children, className } = props;
   const [isOpen, setIsOpen] = import_react45.default.useState(true);
   const handleSwitchSideBar = () => {
     setIsOpen((prev) => !prev);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(
     SideBarContext_default.Provider,
     {
       value: { isSidebarOpen: isOpen, handleSwitchSideBar },
-      children: /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(
         "div",
         {
           className: clsx_default(
@@ -12773,6 +12787,7 @@ var SideBar_default = SideBar;
   ThumbsUpIcon,
   TimePicker,
   ToastProvider,
+  ToggleChip,
   ToggleLeftIcon,
   ToggleRightIcon,
   ToolIcon,

package/dist/index.css

@@ -3322,9 +3322,6 @@
   color: var(--semantic-text-disabled);
   cursor: not-allowed;
 }
-.lib-xplat-dropdown-menu.repositioning {
-  transition: none;
-}
 
 /* src/components/Editor/editor.scss */
 .lib-xplat-editor {
@@ -4183,9 +4180,6 @@
   opacity: 1;
   transform: scale(1);
 }
-.lib-xplat-pop-over-content.repositioning {
-  transition: none;
-}
 
 /* src/components/Progress/progress.scss */
 .lib-xplat-progress {
@@ -4580,9 +4574,6 @@
   cursor: not-allowed;
   color: var(--semantic-text-disabled);
 }
-.lib-xplat-select-content.repositioning {
-  transition: none;
-}
 
 /* src/components/Skeleton/skeleton.scss */
 .lib-xplat-skeleton {
@@ -5683,9 +5674,6 @@
   font-weight: var(--semantic-typo-label-1-m-weight);
   letter-spacing: var(--semantic-typo-label-1-m-ls);
 }
-.lib-xplat-time-picker-content.repositioning {
-  transition: none;
-}
 
 /* src/components/Toast/toast.scss */
 .lib-xplat-toast-container {
@@ -5806,6 +5794,43 @@
   }
 }
 
+/* src/components/ToggleChip/togglechip.scss */
+.lib-xplat-toggle-chip {
+  cursor: pointer;
+  font-family: inherit;
+  transition:
+    background-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94),
+    border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94),
+    color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+}
+.lib-xplat-toggle-chip.unselected {
+  color: var(--semantic-text-secondary);
+  background-color: var(--semantic-surface-neutral-primary);
+  border: 1px solid var(--semantic-border-primary);
+}
+.lib-xplat-toggle-chip.unselected:hover:not(:disabled) {
+  color: var(--semantic-text-primary);
+  background-color: var(--semantic-surface-neutral-secondary);
+}
+.lib-xplat-toggle-chip {
+}
+.lib-xplat-toggle-chip.selected {
+  color: var(--semantic-text-brand-primary);
+  background-color: var(--semantic-surface-brand-subtle);
+  border: 1px solid var(--semantic-border-brand-primary);
+}
+.lib-xplat-toggle-chip.selected:hover:not(:disabled) {
+  background-color: var(--semantic-surface-brand-secondary);
+}
+.lib-xplat-toggle-chip:focus-visible {
+  outline: 2px solid var(--semantic-interaction-focus-ring);
+  outline-offset: 2px;
+}
+.lib-xplat-toggle-chip:disabled {
+  cursor: not-allowed;
+  opacity: 0.4;
+}
+
 /* src/components/Video/video.scss */
 .lib-xplat-video {
   position: relative;

package/dist/index.d.cts

@@ -27,7 +27,7 @@ export { Input, PasswordInput } from './components/Input/index.cjs';
 export { Link } from './components/Link/index.cjs';
 export { LinkButton } from './components/LinkButton/index.cjs';
 export { Modal } from './components/Modal/index.cjs';
-export { NotificationBadge as Badge, NotificationBadge } from './components/NotificationBadge/index.cjs';
+export { Badge, Badge as NotificationBadge } from './components/NotificationBadge/index.cjs';
 export { Pagination } from './components/Pagination/index.cjs';
 export { PopOver } from './components/PopOver/index.cjs';
 export { Progress } from './components/Progress/index.cjs';
@@ -45,17 +45,18 @@ export { Tag } from './components/Tag/index.cjs';
 export { TextArea } from './components/TextArea/index.cjs';
 export { TimePicker } from './components/TimePicker/index.cjs';
 export { ToastProvider, useToast } from './components/Toast/index.cjs';
+export { ToggleChip } from './components/ToggleChip/index.cjs';
 export { Tooltip } from './components/Tooltip/index.cjs';
 export { Video, VideoProps } from './components/Video/index.cjs';
 export { FullGrid } from './layout/Grid/FullGrid/index.cjs';
 export { FullScreen } from './layout/Grid/FullScreen/index.cjs';
 export { GridItem } from './layout/Grid/Item/index.cjs';
-export { B as BREAKPOINT_KEYS_ORDERED, a as BreakpointKey, b as GridColumnConfig, G as GridSpanFor, c as breakpoints, g as gridColumns } from './breakpoints-DsXkJgdl.cjs';
+export { B as BREAKPOINT_KEYS_ORDERED, a as BreakpointKey, G as GridColumnConfig, b as GridSpanFor, c as breakpoints, g as gridColumns } from './breakpoints-CKkNxA-y.cjs';
 export { Header } from './layout/Header/index.cjs';
 export { Layout } from './layout/Layout/index.cjs';
 export { SideBar, SideBarContext, useSideBarContext } from './layout/SideBar/index.cjs';
 export { TokenVar, cssVar, semantic } from '@x-plat/tokens-core';
-export { ActivityIcon, AirplayIcon, AlertCircleIcon, AlertOctagonIcon, AlertTriangleIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, AnchorIcon, ApertureIcon, ArchiveIcon, ArrowDownCircleIcon, ArrowDownIcon, ArrowDownLeftIcon, ArrowDownRightIcon, ArrowLeftCircleIcon, ArrowLeftIcon, ArrowRightCircleIcon, ArrowRightIcon, ArrowUpCircleIcon, ArrowUpIcon, ArrowUpLeftIcon, ArrowUpRightIcon, AtSignIcon, AwardIcon, BarChart2Icon, BarChartIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BluetoothIcon, BoldIcon, BookIcon, BookOpenIcon, BookmarkIcon, BoxIcon, BriefcaseIcon, CalendarIcon, CalenderIcon, CallActiveIcon, CallForwardedIcon, DefaultCall as CallIcon, CallIncomingIcon, CallMissedIcon, CallOffIcon, CallOutgoingIcon, CameraIcon, CameraOffIcon, CastIcon, CheckCircleIcon, CheckIcon, CheckSquareIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpIcon, ChromeIcon, CircleIcon, ClipboardIcon, ClockIcon, CloseEyeIcon, CloudDrizzleIcon, CloudIcon, CloudLightningIcon, CloudOffIcon, CloudRainIcon, CloudSnowIcon, CodeIcon, CodepenIcon, CodesandboxIcon, CoffeeIcon, ColorProps, ColorToken, ColumnsIcon, CommandIcon, CompassIcon, CopyIcon, CornerDownLeftIcon, CornerDownRightIcon, CornerLeftDownIcon, CornerLeftUpIcon, CornerRightDownIcon, CornerRightUpIcon, CornerUpLeftIcon, CornerUpRightIcon, CpuIcon, CreditCardIcon, CropIcon, CrosshairIcon, DatabaseIcon, DefaultCall, DeleteIcon, DiscIcon, DivideCircleIcon, DivideIcon, DivideSquareIcon, DollarSignIcon, DownloadCloudIcon, DownloadIcon, DribbbleIcon, DropletIcon, Edit2Icon, Edit3Icon, EditIcon, ErrorIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FacebookIcon, FastForwardIcon, FeatherIcon, FigmaIcon, FileIcon, FileMinusIcon, FilePlusIcon, FileTextIcon, FilmIcon, FilterIcon, FlagIcon, FolderIcon, FolderMinusIcon, FolderPlusIcon, FramerIcon, FrownIcon, GierIcon, GiftIcon, GitBranchIcon, GitCommitIcon, GitMergeIcon, GitPullRequestIcon, GithubIcon, GitlabIcon, GlobeIcon, GridIcon, HardDriveIcon, HashIcon, HeadphonesIcon, HeartIcon, HelpCircleIcon, HexagonIcon, HomeIcon, ImageIcon, InboxIcon, InfoIcon, InstagramIcon, ItalicIcon, KeyIcon, LayersIcon, LayoutIcon, LifeBuoyIcon, Link2Icon, LinkIcon, LinkedinIcon, ListIcon, LoaderIcon, LockIcon, LogInIcon, LogOutIcon, MailIcon, MapIcon, MapPinIcon, Maximize2Icon, MaximizeIcon, MehIcon, MenuIcon, MessageCircleIcon, MessageSquareIcon, MicIcon, MicOffIcon, Minimize2Icon, MinimizeIcon, MinusCircleIcon, MinusIcon, MinusSquareIcon, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, MousePointerIcon, MoveIcon, MusicIcon, Navigation2Icon, NavigationIcon, OctagonIcon, OpenEyeIcon, PackageIcon, PaperclipIcon, PauseCircleIcon, PauseIcon, PenToolIcon, PercentIcon, PieChartIcon, PlayCircleIcon, PlayIcon, PlusCircleIcon, PlusIcon, PlusSquareIcon, PocketIcon, PowerIcon, PrinterIcon, ProfileIcon, RadioIcon, RefreshCcwIcon, RefreshCwIcon, RepeatIcon, RewindIcon, RotateCcwIcon, RotateCwIcon, RssIcon, SaveIcon, ScissorsIcon, SearchIcon, SemanticColorToken, SendIcon, ServerIcon, SettingsIcon, Share2Icon, ShareIcon, ShieldIcon, ShieldOffIcon, ShoppingBagIcon, ShoppingCartIcon, ShuffleIcon, SidebarIcon, SkipBackIcon, SkipForwardIcon, SlackIcon, SlashIcon, SlidersIcon, SmartphoneIcon, SmileIcon, SpeakerIcon, SquareIcon, StarIcon, StopCircleIcon, SuccessIcon, SunIcon, SunriseIcon, SunsetIcon, TableIcon, TabletIcon, TagIcon, TargetIcon, TerminalIcon, ThermometerIcon, ThumbsDownIcon, ThumbsUpIcon, ToggleLeftIcon, ToggleRightIcon, ToolIcon, Trash2Icon, TrashIcon, TrelloIcon, TrendingDownIcon, TrendingUpIcon, TriangleIcon, TruckIcon, TvIcon, TwitchIcon, TwitterIcon, TypeIcon, UmbrellaIcon, UnderlineIcon, UnlockIcon, UploadCloudIcon, UploadIcon, UserCheckIcon, UserIcon, UserMinusIcon, UserPlusIcon, UserXIcon, UsersIcon, VideoIcon, VideoOffIcon, VoicemailIcon, Volume1Icon, Volume2Icon, VolumeIcon, VolumeXIcon, WatchIcon, WifiIcon, WifiOffIcon, WindIcon, XCircleIcon, XIcon, XOctagonIcon, XSquareIcon, YoutubeIcon, ZapIcon, ZapOffIcon, ZoomInIcon, ZoomOutIcon } from './tokens/index.cjs';
+export { ActivityIcon, AirplayIcon, AlertCircleIcon, AlertOctagonIcon, AlertTriangleIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, AnchorIcon, ApertureIcon, ArchiveIcon, ArrowDownCircleIcon, ArrowDownIcon, ArrowDownLeftIcon, ArrowDownRightIcon, ArrowLeftCircleIcon, ArrowLeftIcon, ArrowRightCircleIcon, ArrowRightIcon, ArrowUpCircleIcon, ArrowUpIcon, ArrowUpLeftIcon, ArrowUpRightIcon, AtSignIcon, AwardIcon, BarChart2Icon, BarChartIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BluetoothIcon, BoldIcon, BookIcon, BookOpenIcon, BookmarkIcon, BoxIcon, BriefcaseIcon, CalendarIcon, CalenderIcon, CallActiveIcon, CallForwardedIcon, CallIcon, CallIncomingIcon, CallMissedIcon, CallOffIcon, CallOutgoingIcon, CameraIcon, CameraOffIcon, CastIcon, CheckCircleIcon, CheckIcon, CheckSquareIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpIcon, ChromeIcon, CircleIcon, ClipboardIcon, ClockIcon, CloseEyeIcon, CloudDrizzleIcon, CloudIcon, CloudLightningIcon, CloudOffIcon, CloudRainIcon, CloudSnowIcon, CodeIcon, CodepenIcon, CodesandboxIcon, CoffeeIcon, ColorProps, ColorToken, ColumnsIcon, CommandIcon, CompassIcon, CopyIcon, CornerDownLeftIcon, CornerDownRightIcon, CornerLeftDownIcon, CornerLeftUpIcon, CornerRightDownIcon, CornerRightUpIcon, CornerUpLeftIcon, CornerUpRightIcon, CpuIcon, CreditCardIcon, CropIcon, CrosshairIcon, DatabaseIcon, CallIcon as DefaultCall, DeleteIcon, DiscIcon, DivideCircleIcon, DivideIcon, DivideSquareIcon, DollarSignIcon, DownloadCloudIcon, DownloadIcon, DribbbleIcon, DropletIcon, Edit2Icon, Edit3Icon, EditIcon, ErrorIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FacebookIcon, FastForwardIcon, FeatherIcon, FigmaIcon, FileIcon, FileMinusIcon, FilePlusIcon, FileTextIcon, FilmIcon, FilterIcon, FlagIcon, FolderIcon, FolderMinusIcon, FolderPlusIcon, FramerIcon, FrownIcon, GierIcon, GiftIcon, GitBranchIcon, GitCommitIcon, GitMergeIcon, GitPullRequestIcon, GithubIcon, GitlabIcon, GlobeIcon, GridIcon, HardDriveIcon, HashIcon, HeadphonesIcon, HeartIcon, HelpCircleIcon, HexagonIcon, HomeIcon, ImageIcon, InboxIcon, InfoIcon, InstagramIcon, ItalicIcon, KeyIcon, LayersIcon, LayoutIcon, LifeBuoyIcon, Link2Icon, LinkIcon, LinkedinIcon, ListIcon, LoaderIcon, LockIcon, LogInIcon, LogOutIcon, MailIcon, MapIcon, MapPinIcon, Maximize2Icon, MaximizeIcon, MehIcon, MenuIcon, MessageCircleIcon, MessageSquareIcon, MicIcon, MicOffIcon, Minimize2Icon, MinimizeIcon, MinusCircleIcon, MinusIcon, MinusSquareIcon, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, MousePointerIcon, MoveIcon, MusicIcon, Navigation2Icon, NavigationIcon, OctagonIcon, OpenEyeIcon, PackageIcon, PaperclipIcon, PauseCircleIcon, PauseIcon, PenToolIcon, PercentIcon, PieChartIcon, PlayCircleIcon, PlayIcon, PlusCircleIcon, PlusIcon, PlusSquareIcon, PocketIcon, PowerIcon, PrinterIcon, ProfileIcon, RadioIcon, RefreshCcwIcon, RefreshCwIcon, RepeatIcon, RewindIcon, RotateCcwIcon, RotateCwIcon, RssIcon, SaveIcon, ScissorsIcon, SearchIcon, SemanticColorToken, SendIcon, ServerIcon, SettingsIcon, Share2Icon, ShareIcon, ShieldIcon, ShieldOffIcon, ShoppingBagIcon, ShoppingCartIcon, ShuffleIcon, SidebarIcon, SkipBackIcon, SkipForwardIcon, SlackIcon, SlashIcon, SlidersIcon, SmartphoneIcon, SmileIcon, SpeakerIcon, SquareIcon, StarIcon, StopCircleIcon, SuccessIcon, SunIcon, SunriseIcon, SunsetIcon, TableIcon, TabletIcon, TagIcon, TargetIcon, TerminalIcon, ThermometerIcon, ThumbsDownIcon, ThumbsUpIcon, ToggleLeftIcon, ToggleRightIcon, ToolIcon, Trash2Icon, TrashIcon, TrelloIcon, TrendingDownIcon, TrendingUpIcon, TriangleIcon, TruckIcon, TvIcon, TwitchIcon, TwitterIcon, TypeIcon, UmbrellaIcon, UnderlineIcon, UnlockIcon, UploadCloudIcon, UploadIcon, UserCheckIcon, UserIcon, UserMinusIcon, UserPlusIcon, UserXIcon, UsersIcon, VideoIcon, VideoOffIcon, VoicemailIcon, Volume1Icon, Volume2Icon, VolumeIcon, VolumeXIcon, WatchIcon, WifiIcon, WifiOffIcon, WindIcon, XCircleIcon, XIcon, XOctagonIcon, XSquareIcon, YoutubeIcon, ZapIcon, ZapOffIcon, ZoomInIcon, ZoomOutIcon } from './tokens/index.cjs';
 import 'react';
 import './attributes-DJIWir_0.cjs';
 import './validation-Dqo1zqhT.cjs';

package/dist/index.d.ts

@@ -27,7 +27,7 @@ export { Input, PasswordInput } from './components/Input/index.js';
 export { Link } from './components/Link/index.js';
 export { LinkButton } from './components/LinkButton/index.js';
 export { Modal } from './components/Modal/index.js';
-export { NotificationBadge as Badge, NotificationBadge } from './components/NotificationBadge/index.js';
+export { Badge, Badge as NotificationBadge } from './components/NotificationBadge/index.js';
 export { Pagination } from './components/Pagination/index.js';
 export { PopOver } from './components/PopOver/index.js';
 export { Progress } from './components/Progress/index.js';
@@ -45,17 +45,18 @@ export { Tag } from './components/Tag/index.js';
 export { TextArea } from './components/TextArea/index.js';
 export { TimePicker } from './components/TimePicker/index.js';
 export { ToastProvider, useToast } from './components/Toast/index.js';
+export { ToggleChip } from './components/ToggleChip/index.js';
 export { Tooltip } from './components/Tooltip/index.js';
 export { Video, VideoProps } from './components/Video/index.js';
 export { FullGrid } from './layout/Grid/FullGrid/index.js';
 export { FullScreen } from './layout/Grid/FullScreen/index.js';
 export { GridItem } from './layout/Grid/Item/index.js';
-export { B as BREAKPOINT_KEYS_ORDERED, a as BreakpointKey, b as GridColumnConfig, G as GridSpanFor, c as breakpoints, g as gridColumns } from './breakpoints-DsXkJgdl.js';
+export { B as BREAKPOINT_KEYS_ORDERED, a as BreakpointKey, G as GridColumnConfig, b as GridSpanFor, c as breakpoints, g as gridColumns } from './breakpoints-CKkNxA-y.js';
 export { Header } from './layout/Header/index.js';
 export { Layout } from './layout/Layout/index.js';
 export { SideBar, SideBarContext, useSideBarContext } from './layout/SideBar/index.js';
 export { TokenVar, cssVar, semantic } from '@x-plat/tokens-core';
-export { ActivityIcon, AirplayIcon, AlertCircleIcon, AlertOctagonIcon, AlertTriangleIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, AnchorIcon, ApertureIcon, ArchiveIcon, ArrowDownCircleIcon, ArrowDownIcon, ArrowDownLeftIcon, ArrowDownRightIcon, ArrowLeftCircleIcon, ArrowLeftIcon, ArrowRightCircleIcon, ArrowRightIcon, ArrowUpCircleIcon, ArrowUpIcon, ArrowUpLeftIcon, ArrowUpRightIcon, AtSignIcon, AwardIcon, BarChart2Icon, BarChartIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BluetoothIcon, BoldIcon, BookIcon, BookOpenIcon, BookmarkIcon, BoxIcon, BriefcaseIcon, CalendarIcon, CalenderIcon, CallActiveIcon, CallForwardedIcon, DefaultCall as CallIcon, CallIncomingIcon, CallMissedIcon, CallOffIcon, CallOutgoingIcon, CameraIcon, CameraOffIcon, CastIcon, CheckCircleIcon, CheckIcon, CheckSquareIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpIcon, ChromeIcon, CircleIcon, ClipboardIcon, ClockIcon, CloseEyeIcon, CloudDrizzleIcon, CloudIcon, CloudLightningIcon, CloudOffIcon, CloudRainIcon, CloudSnowIcon, CodeIcon, CodepenIcon, CodesandboxIcon, CoffeeIcon, ColorProps, ColorToken, ColumnsIcon, CommandIcon, CompassIcon, CopyIcon, CornerDownLeftIcon, CornerDownRightIcon, CornerLeftDownIcon, CornerLeftUpIcon, CornerRightDownIcon, CornerRightUpIcon, CornerUpLeftIcon, CornerUpRightIcon, CpuIcon, CreditCardIcon, CropIcon, CrosshairIcon, DatabaseIcon, DefaultCall, DeleteIcon, DiscIcon, DivideCircleIcon, DivideIcon, DivideSquareIcon, DollarSignIcon, DownloadCloudIcon, DownloadIcon, DribbbleIcon, DropletIcon, Edit2Icon, Edit3Icon, EditIcon, ErrorIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FacebookIcon, FastForwardIcon, FeatherIcon, FigmaIcon, FileIcon, FileMinusIcon, FilePlusIcon, FileTextIcon, FilmIcon, FilterIcon, FlagIcon, FolderIcon, FolderMinusIcon, FolderPlusIcon, FramerIcon, FrownIcon, GierIcon, GiftIcon, GitBranchIcon, GitCommitIcon, GitMergeIcon, GitPullRequestIcon, GithubIcon, GitlabIcon, GlobeIcon, GridIcon, HardDriveIcon, HashIcon, HeadphonesIcon, HeartIcon, HelpCircleIcon, HexagonIcon, HomeIcon, ImageIcon, InboxIcon, InfoIcon, InstagramIcon, ItalicIcon, KeyIcon, LayersIcon, LayoutIcon, LifeBuoyIcon, Link2Icon, LinkIcon, LinkedinIcon, ListIcon, LoaderIcon, LockIcon, LogInIcon, LogOutIcon, MailIcon, MapIcon, MapPinIcon, Maximize2Icon, MaximizeIcon, MehIcon, MenuIcon, MessageCircleIcon, MessageSquareIcon, MicIcon, MicOffIcon, Minimize2Icon, MinimizeIcon, MinusCircleIcon, MinusIcon, MinusSquareIcon, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, MousePointerIcon, MoveIcon, MusicIcon, Navigation2Icon, NavigationIcon, OctagonIcon, OpenEyeIcon, PackageIcon, PaperclipIcon, PauseCircleIcon, PauseIcon, PenToolIcon, PercentIcon, PieChartIcon, PlayCircleIcon, PlayIcon, PlusCircleIcon, PlusIcon, PlusSquareIcon, PocketIcon, PowerIcon, PrinterIcon, ProfileIcon, RadioIcon, RefreshCcwIcon, RefreshCwIcon, RepeatIcon, RewindIcon, RotateCcwIcon, RotateCwIcon, RssIcon, SaveIcon, ScissorsIcon, SearchIcon, SemanticColorToken, SendIcon, ServerIcon, SettingsIcon, Share2Icon, ShareIcon, ShieldIcon, ShieldOffIcon, ShoppingBagIcon, ShoppingCartIcon, ShuffleIcon, SidebarIcon, SkipBackIcon, SkipForwardIcon, SlackIcon, SlashIcon, SlidersIcon, SmartphoneIcon, SmileIcon, SpeakerIcon, SquareIcon, StarIcon, StopCircleIcon, SuccessIcon, SunIcon, SunriseIcon, SunsetIcon, TableIcon, TabletIcon, TagIcon, TargetIcon, TerminalIcon, ThermometerIcon, ThumbsDownIcon, ThumbsUpIcon, ToggleLeftIcon, ToggleRightIcon, ToolIcon, Trash2Icon, TrashIcon, TrelloIcon, TrendingDownIcon, TrendingUpIcon, TriangleIcon, TruckIcon, TvIcon, TwitchIcon, TwitterIcon, TypeIcon, UmbrellaIcon, UnderlineIcon, UnlockIcon, UploadCloudIcon, UploadIcon, UserCheckIcon, UserIcon, UserMinusIcon, UserPlusIcon, UserXIcon, UsersIcon, VideoIcon, VideoOffIcon, VoicemailIcon, Volume1Icon, Volume2Icon, VolumeIcon, VolumeXIcon, WatchIcon, WifiIcon, WifiOffIcon, WindIcon, XCircleIcon, XIcon, XOctagonIcon, XSquareIcon, YoutubeIcon, ZapIcon, ZapOffIcon, ZoomInIcon, ZoomOutIcon } from './tokens/index.js';
+export { ActivityIcon, AirplayIcon, AlertCircleIcon, AlertOctagonIcon, AlertTriangleIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, AnchorIcon, ApertureIcon, ArchiveIcon, ArrowDownCircleIcon, ArrowDownIcon, ArrowDownLeftIcon, ArrowDownRightIcon, ArrowLeftCircleIcon, ArrowLeftIcon, ArrowRightCircleIcon, ArrowRightIcon, ArrowUpCircleIcon, ArrowUpIcon, ArrowUpLeftIcon, ArrowUpRightIcon, AtSignIcon, AwardIcon, BarChart2Icon, BarChartIcon, BatteryChargingIcon, BatteryIcon, BellIcon, BellOffIcon, BluetoothIcon, BoldIcon, BookIcon, BookOpenIcon, BookmarkIcon, BoxIcon, BriefcaseIcon, CalendarIcon, CalenderIcon, CallActiveIcon, CallForwardedIcon, CallIcon, CallIncomingIcon, CallMissedIcon, CallOffIcon, CallOutgoingIcon, CameraIcon, CameraOffIcon, CastIcon, CheckCircleIcon, CheckIcon, CheckSquareIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsDownIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpIcon, ChromeIcon, CircleIcon, ClipboardIcon, ClockIcon, CloseEyeIcon, CloudDrizzleIcon, CloudIcon, CloudLightningIcon, CloudOffIcon, CloudRainIcon, CloudSnowIcon, CodeIcon, CodepenIcon, CodesandboxIcon, CoffeeIcon, ColorProps, ColorToken, ColumnsIcon, CommandIcon, CompassIcon, CopyIcon, CornerDownLeftIcon, CornerDownRightIcon, CornerLeftDownIcon, CornerLeftUpIcon, CornerRightDownIcon, CornerRightUpIcon, CornerUpLeftIcon, CornerUpRightIcon, CpuIcon, CreditCardIcon, CropIcon, CrosshairIcon, DatabaseIcon, CallIcon as DefaultCall, DeleteIcon, DiscIcon, DivideCircleIcon, DivideIcon, DivideSquareIcon, DollarSignIcon, DownloadCloudIcon, DownloadIcon, DribbbleIcon, DropletIcon, Edit2Icon, Edit3Icon, EditIcon, ErrorIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FacebookIcon, FastForwardIcon, FeatherIcon, FigmaIcon, FileIcon, FileMinusIcon, FilePlusIcon, FileTextIcon, FilmIcon, FilterIcon, FlagIcon, FolderIcon, FolderMinusIcon, FolderPlusIcon, FramerIcon, FrownIcon, GierIcon, GiftIcon, GitBranchIcon, GitCommitIcon, GitMergeIcon, GitPullRequestIcon, GithubIcon, GitlabIcon, GlobeIcon, GridIcon, HardDriveIcon, HashIcon, HeadphonesIcon, HeartIcon, HelpCircleIcon, HexagonIcon, HomeIcon, ImageIcon, InboxIcon, InfoIcon, InstagramIcon, ItalicIcon, KeyIcon, LayersIcon, LayoutIcon, LifeBuoyIcon, Link2Icon, LinkIcon, LinkedinIcon, ListIcon, LoaderIcon, LockIcon, LogInIcon, LogOutIcon, MailIcon, MapIcon, MapPinIcon, Maximize2Icon, MaximizeIcon, MehIcon, MenuIcon, MessageCircleIcon, MessageSquareIcon, MicIcon, MicOffIcon, Minimize2Icon, MinimizeIcon, MinusCircleIcon, MinusIcon, MinusSquareIcon, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoreVerticalIcon, MousePointerIcon, MoveIcon, MusicIcon, Navigation2Icon, NavigationIcon, OctagonIcon, OpenEyeIcon, PackageIcon, PaperclipIcon, PauseCircleIcon, PauseIcon, PenToolIcon, PercentIcon, PieChartIcon, PlayCircleIcon, PlayIcon, PlusCircleIcon, PlusIcon, PlusSquareIcon, PocketIcon, PowerIcon, PrinterIcon, ProfileIcon, RadioIcon, RefreshCcwIcon, RefreshCwIcon, RepeatIcon, RewindIcon, RotateCcwIcon, RotateCwIcon, RssIcon, SaveIcon, ScissorsIcon, SearchIcon, SemanticColorToken, SendIcon, ServerIcon, SettingsIcon, Share2Icon, ShareIcon, ShieldIcon, ShieldOffIcon, ShoppingBagIcon, ShoppingCartIcon, ShuffleIcon, SidebarIcon, SkipBackIcon, SkipForwardIcon, SlackIcon, SlashIcon, SlidersIcon, SmartphoneIcon, SmileIcon, SpeakerIcon, SquareIcon, StarIcon, StopCircleIcon, SuccessIcon, SunIcon, SunriseIcon, SunsetIcon, TableIcon, TabletIcon, TagIcon, TargetIcon, TerminalIcon, ThermometerIcon, ThumbsDownIcon, ThumbsUpIcon, ToggleLeftIcon, ToggleRightIcon, ToolIcon, Trash2Icon, TrashIcon, TrelloIcon, TrendingDownIcon, TrendingUpIcon, TriangleIcon, TruckIcon, TvIcon, TwitchIcon, TwitterIcon, TypeIcon, UmbrellaIcon, UnderlineIcon, UnlockIcon, UploadCloudIcon, UploadIcon, UserCheckIcon, UserIcon, UserMinusIcon, UserPlusIcon, UserXIcon, UsersIcon, VideoIcon, VideoOffIcon, VoicemailIcon, Volume1Icon, Volume2Icon, VolumeIcon, VolumeXIcon, WatchIcon, WifiIcon, WifiOffIcon, WindIcon, XCircleIcon, XIcon, XOctagonIcon, XSquareIcon, YoutubeIcon, ZapIcon, ZapOffIcon, ZoomInIcon, ZoomOutIcon } from './tokens/index.js';
 import 'react';
 import './attributes-DJIWir_0.js';
 import './validation-Dqo1zqhT.js';