@askrjs/themes 0.0.3 → 0.0.4

package/dist/components/sidebar/sidebar.js

@@ -0,0 +1,228 @@
+import { classes } from "../_internal/classes.js";
+import { mergeProps } from "../_internal/merge-props.js";
+import { isJsxElement, toChildArray } from "../_internal/jsx.js";
+import { ShellPanelWatcher, ShellResponsiveWatcher, isShellPanelChild, renderKeyedShellChildren, renderKeyedShellPanelChildren } from "../shell/shell-responsive.js";
+import { NavBrand } from "../navbar/navbar.js";
+import { SidebarContext, SidebarResponsiveContext } from "./sidebar.context.js";
+import { SidebarPanel } from "./sidebar-panel.js";
+import { SidebarToggle } from "./sidebar-toggle.js";
+import { isSidebarCollapsed, resolveSidebarCollapsible } from "./sidebar.shared.js";
+import { Fragment, jsx, jsxs } from "@askrjs/askr/jsx-runtime";
+import { state } from "@askrjs/askr";
+//#region src/components/sidebar/sidebar.tsx
+function splitSidebarChildren(children) {
+	const brandIndex = children.findIndex((child) => isJsxElement(child) && child.type === NavBrand);
+	if (brandIndex === -1) return { items: children };
+	return {
+		brand: children[brandIndex],
+		items: children.filter((_, index) => index !== brandIndex)
+	};
+}
+function isSidebarToggleChild(child) {
+	return isJsxElement(child) && child.type === SidebarToggle;
+}
+function splitSidebarToggle(children) {
+	const toggleIndex = children.findIndex((child) => isSidebarToggleChild(child));
+	if (toggleIndex === -1) return { items: children };
+	const toggleChild = children[toggleIndex];
+	return {
+		items: children.filter((_, index) => index !== toggleIndex),
+		toggle: toggleChild?.props
+	};
+}
+function renderSidebarMenuContents(label, icon, iconPlacement) {
+	const renderedIcon = /* @__PURE__ */ jsx("span", {
+		class: "sidebar-toggle-icon",
+		"data-slot": "sidebar-toggle-icon",
+		"aria-hidden": "true",
+		children: icon ?? /* @__PURE__ */ jsxs("span", {
+			class: "sidebar-toggle-glyph sidebar-toggle-glyph--menu",
+			children: [
+				/* @__PURE__ */ jsx("span", {}),
+				/* @__PURE__ */ jsx("span", {}),
+				/* @__PURE__ */ jsx("span", {})
+			]
+		})
+	});
+	const renderedLabel = /* @__PURE__ */ jsx("span", {
+		class: "sidebar-toggle-label",
+		"data-slot": "sidebar-toggle-label",
+		children: label
+	});
+	if (iconPlacement === "end") return /* @__PURE__ */ jsxs(Fragment, { children: [renderedLabel, renderedIcon] });
+	return /* @__PURE__ */ jsxs(Fragment, { children: [renderedIcon, renderedLabel] });
+}
+function renderSidebarRailContents(label, collapsed, toggle) {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+		class: "sidebar-rail-toggle-icon",
+		"data-slot": "sidebar-rail-toggle-icon",
+		"aria-hidden": "true",
+		children: (collapsed ? toggle?.collapsedIcon : toggle?.expandedIcon) ?? /* @__PURE__ */ jsx("span", { class: classes("sidebar-toggle-glyph", "sidebar-toggle-glyph--rail", collapsed ? "is-collapsed" : "is-expanded") })
+	}), /* @__PURE__ */ jsx("span", {
+		class: "sidebar-rail-toggle-label",
+		"data-slot": "sidebar-rail-toggle-label",
+		children: label
+	})] });
+}
+function Sidebar(props) {
+	const { children, collapsed: controlledCollapsed, breakpoint, collapseIcon, collapseIconPlacement = "start", collapseLabel, collapsible, defaultCollapsed = false, id, "aria-label": ariaLabel, onCollapsedChange, class: className, ref, ...rest } = props;
+	const effectiveCollapseLabel = collapseLabel ?? (typeof ariaLabel === "string" ? ariaLabel : void 0) ?? "Menu";
+	const childItems = toChildArray(children);
+	const explicitPanelItems = childItems.filter((child) => isShellPanelChild(child, SidebarPanel));
+	const contentItems = childItems.filter((child) => !isShellPanelChild(child, SidebarPanel));
+	const isResponsive = breakpoint !== void 0;
+	const responsiveCollapsedState = state(isResponsive ? isSidebarCollapsed(breakpoint) : false);
+	const drawerOpenState = state(false);
+	const panelId = typeof id === "string" ? `${id}-panel` : void 0;
+	const collapseBehavior = resolveSidebarCollapsible(collapsible);
+	const isRailCollapsible = collapseBehavior === "icon";
+	const railCollapsedState = state(defaultCollapsed);
+	const responsiveCollapsed = responsiveCollapsedState();
+	const drawerOpen = drawerOpenState();
+	const internalRailCollapsed = railCollapsedState();
+	const isMobile = isResponsive ? responsiveCollapsed : false;
+	const isDrawerOpen = isResponsive && isMobile && drawerOpen;
+	const isRailCollapsed = isRailCollapsible ? controlledCollapsed ?? internalRailCollapsed ?? false : false;
+	const closeDrawer = () => drawerOpenState.set(false);
+	const closeDrawerOnNavActivation = (event) => {
+		const target = event.target;
+		if (!(target instanceof Element)) return;
+		if (target.closest("a[data-slot=\"nav-link\"], a[data-slot=\"nav-item\"], a.navbar-item")) closeDrawer();
+	};
+	const toggleDrawer = () => {
+		drawerOpenState.set(!drawerOpenState());
+	};
+	const setRailCollapsed = (nextCollapsed) => {
+		if (!isRailCollapsible) return;
+		if (controlledCollapsed === void 0) railCollapsedState.set(nextCollapsed);
+		onCollapsedChange?.(nextCollapsed);
+	};
+	const toggleRail = () => {
+		if (!isRailCollapsible) return;
+		setRailCollapsed(!isRailCollapsed);
+	};
+	const { items: drawerSourceItems, toggle: railToggleConfig } = splitSidebarToggle(contentItems);
+	const { brand: drawerBrand, items: drawerItems } = splitSidebarChildren(drawerSourceItems);
+	const desktopChildren = renderKeyedShellChildren(drawerSourceItems, "sidebar-desktop");
+	const drawerChildren = renderKeyedShellChildren(drawerItems, "sidebar-drawer");
+	const contextValue = {
+		active: () => isResponsive,
+		collapseLabel: () => effectiveCollapseLabel,
+		closePanel: closeDrawer,
+		iconCollapsed: () => isRailCollapsed,
+		isRailCollapsible: () => isRailCollapsible,
+		orientation: () => "vertical",
+		panelId: () => panelId,
+		panelOpen: () => isDrawerOpen,
+		togglePanel: toggleDrawer,
+		toggleRail
+	};
+	const panelContext = {
+		active: isResponsive,
+		collapseLabel: effectiveCollapseLabel,
+		onClose: closeDrawer,
+		open: isDrawerOpen,
+		panelId
+	};
+	const panels = explicitPanelItems.length > 0 ? renderKeyedShellPanelChildren(explicitPanelItems, "sidebar-panel", panelContext) : isResponsive ? /* @__PURE__ */ jsx(SidebarPanel, {
+		active: isResponsive,
+		brand: drawerBrand,
+		collapseLabel: effectiveCollapseLabel,
+		onClose: closeDrawer,
+		onClick: closeDrawerOnNavActivation,
+		open: isDrawerOpen,
+		panelId,
+		children: drawerChildren
+	}) : null;
+	const finalProps = mergeProps(rest, {
+		ref,
+		"aria-label": ariaLabel,
+		class: classes("sidebar", className),
+		"data-collapse-below": breakpoint,
+		"data-collapsible": collapseBehavior === "none" ? void 0 : collapseBehavior,
+		"data-icon-collapsed": isRailCollapsible ? isRailCollapsed ? "true" : "false" : void 0,
+		"data-mobile-open": isResponsive ? drawerOpen ? "true" : "false" : void 0,
+		"data-orientation": "vertical",
+		"data-responsive-collapsed": isMobile ? "true" : "false",
+		"data-slot": "sidebar"
+	});
+	return /* @__PURE__ */ jsx(SidebarContext.Scope, {
+		value: { orientation: () => "vertical" },
+		children: /* @__PURE__ */ jsx(SidebarResponsiveContext.Scope, {
+			value: contextValue,
+			children: /* @__PURE__ */ jsxs("nav", {
+				...finalProps,
+				children: [
+					isResponsive ? /* @__PURE__ */ jsx("div", {
+						class: "sidebar-mobile",
+						"data-slot": "sidebar-mobile",
+						children: /* @__PURE__ */ jsx("button", {
+							"aria-controls": panelId,
+							"aria-expanded": isDrawerOpen ? "true" : "false",
+							"aria-label": effectiveCollapseLabel,
+							class: "sidebar-toggle",
+							"data-slot": "sidebar-toggle",
+							"data-state": isDrawerOpen ? "open" : "closed",
+							"data-variant": "mobile",
+							type: "button",
+							onClick: toggleDrawer,
+							children: renderSidebarMenuContents(effectiveCollapseLabel, collapseIcon, collapseIconPlacement)
+						})
+					}) : null,
+					/* @__PURE__ */ jsxs("div", {
+						class: "sidebar-shell",
+						"data-orientation": "vertical",
+						"data-slot": "sidebar-shell",
+						children: [isRailCollapsible && !isMobile ? /* @__PURE__ */ jsx("div", {
+							class: "sidebar-rail",
+							"data-slot": "sidebar-rail",
+							"data-state": isRailCollapsed ? "collapsed" : "expanded",
+							children: /* @__PURE__ */ jsx("button", {
+								"aria-expanded": isRailCollapsed ? "false" : "true",
+								"aria-label": isRailCollapsed ? `Expand ${effectiveCollapseLabel}` : `Collapse ${effectiveCollapseLabel}`,
+								class: "sidebar-rail-toggle",
+								"data-slot": "sidebar-rail-toggle",
+								"data-state": isRailCollapsed ? "collapsed" : "expanded",
+								type: "button",
+								onClick: toggleRail,
+								children: renderSidebarRailContents(effectiveCollapseLabel, isRailCollapsed, railToggleConfig)
+							})
+						}) : null, desktopChildren]
+					}),
+					panels,
+					isResponsive && isDrawerOpen ? /* @__PURE__ */ jsx("button", {
+						"aria-label": `Close ${effectiveCollapseLabel}`,
+						class: "sidebar-backdrop",
+						"data-slot": "sidebar-backdrop",
+						"data-state": "open",
+						tabIndex: -1,
+						type: "button",
+						onClick: closeDrawer
+					}) : null,
+					isResponsive ? /* @__PURE__ */ jsx(ShellResponsiveWatcher, {
+						breakpoint,
+						isCollapsed: isSidebarCollapsed,
+						onResize: (nextCollapsed) => {
+							responsiveCollapsedState.set(nextCollapsed);
+						},
+						onExpand: () => {
+							drawerOpenState.set(false);
+						}
+					}) : null,
+					/* @__PURE__ */ jsx(ShellPanelWatcher, {
+						contentId: panelId,
+						open: isDrawerOpen,
+						panelSlot: "sidebar-panel",
+						onClose: () => {
+							closeDrawer();
+						}
+					})
+				]
+			})
+		})
+	});
+}
+//#endregion
+export { Sidebar };
+
+//# sourceMappingURL=sidebar.js.map

package/dist/components/sidebar/sidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.js","names":[],"sources":["../../../src/components/sidebar/sidebar.tsx"],"sourcesContent":["import { state } from \"@askrjs/askr\";\nimport { classes } from \"../_internal/classes\";\nimport { isJsxElement, toChildArray } from \"../_internal/jsx\";\nimport { mergeProps } from \"../_internal/merge-props\";\nimport { NavBrand } from \"../navbar/navbar\";\nimport {\n  isShellPanelChild,\n  renderKeyedShellChildren,\n  renderKeyedShellPanelChildren,\n  ShellPanelWatcher,\n  ShellResponsiveWatcher,\n} from \"../shell/shell-responsive\";\nimport { SidebarContext, SidebarResponsiveContext } from \"./sidebar.context\";\nimport { SidebarPanel } from \"./sidebar-panel\";\nimport { SidebarToggle } from \"./sidebar-toggle\";\nimport { isSidebarCollapsed, resolveSidebarCollapsible } from \"./sidebar.shared\";\nimport type { SidebarProps } from \"./sidebar.types\";\nimport type { CollapseIconPlacement } from \"../shell/shell-nav.types\";\n\ntype SidebarChildren = {\n  brand?: unknown;\n  items: unknown[];\n};\n\ntype SidebarToggleConfig = {\n  collapsedIcon?: unknown;\n  expandedIcon?: unknown;\n};\n\nfunction splitSidebarChildren(children: unknown[]): SidebarChildren {\n  const brandIndex = children.findIndex((child) => isJsxElement(child) && child.type === NavBrand);\n\n  if (brandIndex === -1) {\n    return { items: children };\n  }\n\n  return {\n    brand: children[brandIndex],\n    items: children.filter((_, index) => index !== brandIndex),\n  };\n}\n\nfunction isSidebarToggleChild(child: unknown): boolean {\n  return isJsxElement(child) && child.type === SidebarToggle;\n}\n\nfunction splitSidebarToggle(children: unknown[]): {\n  items: unknown[];\n  toggle?: SidebarToggleConfig;\n} {\n  const toggleIndex = children.findIndex((child) => isSidebarToggleChild(child));\n\n  if (toggleIndex === -1) {\n    return { items: children };\n  }\n\n  const toggleChild = children[toggleIndex] as { props?: SidebarToggleConfig } | undefined;\n\n  return {\n    items: children.filter((_, index) => index !== toggleIndex),\n    toggle: toggleChild?.props,\n  };\n}\n\nfunction renderSidebarMenuContents(\n  label: string,\n  icon: unknown,\n  iconPlacement: CollapseIconPlacement,\n): JSX.Element {\n  const renderedIcon = (\n    <span class=\"sidebar-toggle-icon\" data-slot=\"sidebar-toggle-icon\" aria-hidden=\"true\">\n      {icon ?? (\n        <span class=\"sidebar-toggle-glyph sidebar-toggle-glyph--menu\">\n          <span />\n          <span />\n          <span />\n        </span>\n      )}\n    </span>\n  );\n  const renderedLabel = (\n    <span class=\"sidebar-toggle-label\" data-slot=\"sidebar-toggle-label\">\n      {label}\n    </span>\n  );\n\n  if (iconPlacement === \"end\") {\n    return (\n      <>\n        {renderedLabel}\n        {renderedIcon}\n      </>\n    );\n  }\n\n  return (\n    <>\n      {renderedIcon}\n      {renderedLabel}\n    </>\n  );\n}\n\nfunction renderSidebarRailContents(\n  label: string,\n  collapsed: boolean,\n  toggle: SidebarToggleConfig | undefined,\n): JSX.Element {\n  const icon = collapsed ? toggle?.collapsedIcon : toggle?.expandedIcon;\n\n  return (\n    <>\n      <span\n        class=\"sidebar-rail-toggle-icon\"\n        data-slot=\"sidebar-rail-toggle-icon\"\n        aria-hidden=\"true\"\n      >\n        {icon ?? (\n          <span\n            class={classes(\n              \"sidebar-toggle-glyph\",\n              \"sidebar-toggle-glyph--rail\",\n              collapsed ? \"is-collapsed\" : \"is-expanded\",\n            )}\n          />\n        )}\n      </span>\n      <span class=\"sidebar-rail-toggle-label\" data-slot=\"sidebar-rail-toggle-label\">\n        {label}\n      </span>\n    </>\n  );\n}\n\nexport function Sidebar(props: SidebarProps): JSX.Element {\n  const {\n    children,\n    collapsed: controlledCollapsed,\n    breakpoint,\n    collapseIcon,\n    collapseIconPlacement = \"start\",\n    collapseLabel,\n    collapsible,\n    defaultCollapsed = false,\n    id,\n    \"aria-label\": ariaLabel,\n    onCollapsedChange,\n    class: className,\n    ref,\n    ...rest\n  } = props;\n  const effectiveCollapseLabel =\n    collapseLabel ?? (typeof ariaLabel === \"string\" ? ariaLabel : undefined) ?? \"Menu\";\n  const childItems = toChildArray(children);\n  const explicitPanelItems = childItems.filter((child) => isShellPanelChild(child, SidebarPanel));\n  const contentItems = childItems.filter((child) => !isShellPanelChild(child, SidebarPanel));\n  const isResponsive = breakpoint !== undefined;\n  const responsiveCollapsedState = state(isResponsive ? isSidebarCollapsed(breakpoint) : false);\n  const drawerOpenState = state(false);\n  const panelId = typeof id === \"string\" ? `${id}-panel` : undefined;\n  const collapseBehavior = resolveSidebarCollapsible(collapsible);\n  const isRailCollapsible = collapseBehavior === \"icon\";\n  const railCollapsedState = state(defaultCollapsed);\n  const responsiveCollapsed = responsiveCollapsedState();\n  const drawerOpen = drawerOpenState();\n  const internalRailCollapsed = railCollapsedState();\n  const isMobile = isResponsive ? responsiveCollapsed : false;\n  const isDrawerOpen = isResponsive && isMobile && drawerOpen;\n  const isRailCollapsed = isRailCollapsible\n    ? (controlledCollapsed ?? internalRailCollapsed ?? false)\n    : false;\n  const closeDrawer = () => drawerOpenState.set(false);\n  const closeDrawerOnNavActivation = (event: MouseEvent) => {\n    const target = event.target;\n\n    if (!(target instanceof Element)) {\n      return;\n    }\n\n    if (target.closest('a[data-slot=\"nav-link\"], a[data-slot=\"nav-item\"], a.navbar-item')) {\n      closeDrawer();\n    }\n  };\n  const toggleDrawer = () => {\n    drawerOpenState.set(!drawerOpenState());\n  };\n  const setRailCollapsed = (nextCollapsed: boolean) => {\n    if (!isRailCollapsible) {\n      return;\n    }\n\n    if (controlledCollapsed === undefined) {\n      railCollapsedState.set(nextCollapsed);\n    }\n\n    onCollapsedChange?.(nextCollapsed);\n  };\n  const toggleRail = () => {\n    if (!isRailCollapsible) {\n      return;\n    }\n\n    setRailCollapsed(!isRailCollapsed);\n  };\n  const { items: drawerSourceItems, toggle: railToggleConfig } = splitSidebarToggle(contentItems);\n  const { brand: drawerBrand, items: drawerItems } = splitSidebarChildren(drawerSourceItems);\n  const desktopChildren = renderKeyedShellChildren(drawerSourceItems, \"sidebar-desktop\");\n  const drawerChildren = renderKeyedShellChildren(drawerItems, \"sidebar-drawer\");\n\n  const contextValue = {\n    active: () => isResponsive,\n    collapseLabel: () => effectiveCollapseLabel,\n    closePanel: closeDrawer,\n    iconCollapsed: () => isRailCollapsed,\n    isRailCollapsible: () => isRailCollapsible,\n    orientation: () => \"vertical\" as const,\n    panelId: () => panelId,\n    panelOpen: () => isDrawerOpen,\n    togglePanel: toggleDrawer,\n    toggleRail,\n  };\n  const panelContext = {\n    active: isResponsive,\n    collapseLabel: effectiveCollapseLabel,\n    onClose: closeDrawer,\n    open: isDrawerOpen,\n    panelId,\n  };\n  const panels =\n    explicitPanelItems.length > 0 ? (\n      renderKeyedShellPanelChildren(explicitPanelItems, \"sidebar-panel\", panelContext)\n    ) : isResponsive ? (\n      <SidebarPanel\n        active={isResponsive}\n        brand={drawerBrand}\n        collapseLabel={effectiveCollapseLabel}\n        onClose={closeDrawer}\n        onClick={closeDrawerOnNavActivation}\n        open={isDrawerOpen}\n        panelId={panelId}\n      >\n        {drawerChildren}\n      </SidebarPanel>\n    ) : null;\n\n  const finalProps = mergeProps(rest, {\n    ref,\n    \"aria-label\": ariaLabel,\n    class: classes(\"sidebar\", className),\n    \"data-collapse-below\": breakpoint,\n    \"data-collapsible\": collapseBehavior === \"none\" ? undefined : collapseBehavior,\n    \"data-icon-collapsed\": isRailCollapsible ? (isRailCollapsed ? \"true\" : \"false\") : undefined,\n    \"data-mobile-open\": isResponsive ? (drawerOpen ? \"true\" : \"false\") : undefined,\n    \"data-orientation\": \"vertical\",\n    \"data-responsive-collapsed\": isMobile ? \"true\" : \"false\",\n    \"data-slot\": \"sidebar\",\n  });\n\n  return (\n    <SidebarContext.Scope value={{ orientation: () => \"vertical\" as const }}>\n      <SidebarResponsiveContext.Scope value={contextValue}>\n        <nav {...finalProps}>\n          {isResponsive ? (\n            <div class=\"sidebar-mobile\" data-slot=\"sidebar-mobile\">\n              <button\n                aria-controls={panelId}\n                aria-expanded={isDrawerOpen ? \"true\" : \"false\"}\n                aria-label={effectiveCollapseLabel}\n                class=\"sidebar-toggle\"\n                data-slot=\"sidebar-toggle\"\n                data-state={isDrawerOpen ? \"open\" : \"closed\"}\n                data-variant=\"mobile\"\n                type=\"button\"\n                onClick={toggleDrawer}\n              >\n                {renderSidebarMenuContents(\n                  effectiveCollapseLabel,\n                  collapseIcon,\n                  collapseIconPlacement,\n                )}\n              </button>\n            </div>\n          ) : null}\n\n          <div class=\"sidebar-shell\" data-orientation=\"vertical\" data-slot=\"sidebar-shell\">\n            {isRailCollapsible && !isMobile ? (\n              <div\n                class=\"sidebar-rail\"\n                data-slot=\"sidebar-rail\"\n                data-state={isRailCollapsed ? \"collapsed\" : \"expanded\"}\n              >\n                <button\n                  aria-expanded={isRailCollapsed ? \"false\" : \"true\"}\n                  aria-label={\n                    isRailCollapsed\n                      ? `Expand ${effectiveCollapseLabel}`\n                      : `Collapse ${effectiveCollapseLabel}`\n                  }\n                  class=\"sidebar-rail-toggle\"\n                  data-slot=\"sidebar-rail-toggle\"\n                  data-state={isRailCollapsed ? \"collapsed\" : \"expanded\"}\n                  type=\"button\"\n                  onClick={toggleRail}\n                >\n                  {renderSidebarRailContents(\n                    effectiveCollapseLabel,\n                    isRailCollapsed,\n                    railToggleConfig,\n                  )}\n                </button>\n              </div>\n            ) : null}\n            {desktopChildren}\n          </div>\n\n          {panels}\n\n          {isResponsive && isDrawerOpen ? (\n            <button\n              aria-label={`Close ${effectiveCollapseLabel}`}\n              class=\"sidebar-backdrop\"\n              data-slot=\"sidebar-backdrop\"\n              data-state=\"open\"\n              tabIndex={-1}\n              type=\"button\"\n              onClick={closeDrawer}\n            />\n          ) : null}\n\n          {isResponsive ? (\n            <ShellResponsiveWatcher\n              breakpoint={breakpoint}\n              isCollapsed={isSidebarCollapsed}\n              onResize={(nextCollapsed) => {\n                responsiveCollapsedState.set(nextCollapsed);\n              }}\n              onExpand={() => {\n                drawerOpenState.set(false);\n              }}\n            />\n          ) : null}\n\n          <ShellPanelWatcher\n            contentId={panelId}\n            open={isDrawerOpen}\n            panelSlot=\"sidebar-panel\"\n            onClose={() => {\n              closeDrawer();\n            }}\n          />\n        </nav>\n      </SidebarResponsiveContext.Scope>\n    </SidebarContext.Scope>\n  );\n}\n"],"mappings":"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"}

package/dist/components/sidebar/sidebar.shared.js

@@ -0,0 +1,12 @@
+import { isNavbarCollapsed } from "../navbar/navbar.shared.js";
+//#region src/components/sidebar/sidebar.shared.ts
+function resolveSidebarCollapsible(collapsible) {
+	return collapsible ?? "none";
+}
+function isSidebarCollapsed(breakpoint) {
+	return isNavbarCollapsed(breakpoint);
+}
+//#endregion
+export { isSidebarCollapsed, resolveSidebarCollapsible };
+
+//# sourceMappingURL=sidebar.shared.js.map

package/dist/components/sidebar/sidebar.shared.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar.shared.js","names":[],"sources":["../../../src/components/sidebar/sidebar.shared.ts"],"sourcesContent":["import { NAVBAR_COLLAPSE_BREAKPOINTS, isNavbarCollapsed } from \"../navbar/navbar.shared\";\nimport type { CollapseBreakpoint, Collapsible } from \"../shell/shell-nav.types\";\n\nexport { NAVBAR_COLLAPSE_BREAKPOINTS, isNavbarCollapsed };\n\nexport function resolveSidebarCollapsible(collapsible: Collapsible | undefined): Collapsible {\n  return collapsible ?? \"none\";\n}\n\nexport function isSidebarCollapsed(breakpoint: CollapseBreakpoint): boolean {\n  return isNavbarCollapsed(breakpoint);\n}\n"],"mappings":";;AAKA,SAAgB,0BAA0B,aAAmD;CAC3F,OAAO,eAAe;;AAGxB,SAAgB,mBAAmB,YAAyC;CAC1E,OAAO,kBAAkB,WAAW"}

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

@@ -0,0 +1,30 @@
+import { CollapseBreakpoint, CollapseIconPlacement, Collapsible } from "../shell/shell-nav.types.js";
+
+//#region src/components/sidebar/sidebar.types.d.ts
+type SidebarProps = Omit<JSX.IntrinsicElements["nav"], "children"> & {
+  children?: unknown;
+  breakpoint?: CollapseBreakpoint;
+  collapseIcon?: unknown;
+  collapseIconPlacement?: CollapseIconPlacement;
+  collapsed?: boolean;
+  collapseLabel?: string;
+  collapsible?: Collapsible;
+  defaultCollapsed?: boolean;
+  onCollapsedChange?: (collapsed: boolean) => void;
+};
+type SidebarToggleProps = Omit<JSX.IntrinsicElements["button"], "children" | "onClick" | "type"> & {
+  collapsedIcon: unknown;
+  expandedIcon: unknown;
+};
+type SidebarPanelProps = Omit<JSX.IntrinsicElements["div"], "children"> & {
+  active?: boolean;
+  brand?: unknown;
+  children?: unknown;
+  collapseLabel?: string;
+  onClose?: () => void;
+  open?: boolean;
+  panelId?: string;
+};
+//#endregion
+export { SidebarPanelProps, SidebarProps, SidebarToggleProps };
+//# sourceMappingURL=sidebar.types.d.ts.map

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

@@ -1,3 +1,3 @@
-export { Skeleton } from "./skeleton";
-export { SKELETON_A11Y_CONTRACT, type SkeletonA11yContract } from "./skeleton.a11y";
-export type { SkeletonOwnProps, SkeletonProps, SkeletonAsChildProps } from "./skeleton.types";
+import { SkeletonAsChildProps, SkeletonOwnProps, SkeletonProps } from "./skeleton.types.js";
+import { Skeleton } from "./skeleton.js";
+import { SKELETON_A11Y_CONTRACT, SkeletonA11yContract } from "./skeleton.a11y.js";

package/dist/components/skeleton/skeleton.a11y.d.ts

@@ -1,12 +1,16 @@
+//#region src/components/skeleton/skeleton.a11y.d.ts
 /**
  * Accessibility contract for Skeleton.
  */
-export declare const SKELETON_A11Y_CONTRACT: {
-    readonly DATA_ATTRIBUTES: {
-        readonly slot: "data-slot";
-    };
-    readonly MARKER: "data-skeleton";
-    readonly DECORATIVE_ATTRIBUTE: "aria-hidden";
-    readonly DECORATIVE_VALUE: "true";
+declare const SKELETON_A11Y_CONTRACT: {
+  readonly DATA_ATTRIBUTES: {
+    readonly slot: "data-slot";
+  };
+  readonly MARKER: "data-skeleton";
+  readonly DECORATIVE_ATTRIBUTE: "aria-hidden";
+  readonly DECORATIVE_VALUE: "true";
 };
-export type SkeletonA11yContract = typeof SKELETON_A11Y_CONTRACT;
+type SkeletonA11yContract = typeof SKELETON_A11Y_CONTRACT;
+//#endregion
+export { SKELETON_A11Y_CONTRACT, SkeletonA11yContract };
+//# sourceMappingURL=skeleton.a11y.d.ts.map

package/dist/components/skeleton/skeleton.d.ts

@@ -1,3 +1,8 @@
-import type { SkeletonAsChildProps, SkeletonProps } from "./skeleton.types";
-export declare function Skeleton(props: SkeletonProps): JSX.Element;
-export declare function Skeleton(props: SkeletonAsChildProps): JSX.Element;
+import { SkeletonAsChildProps, SkeletonProps } from "./skeleton.types.js";
+
+//#region src/components/skeleton/skeleton.d.ts
+declare function Skeleton(props: SkeletonProps): JSX.Element;
+declare function Skeleton(props: SkeletonAsChildProps): JSX.Element;
+//#endregion
+export { Skeleton };
+//# sourceMappingURL=skeleton.d.ts.map

package/dist/components/skeleton/skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.js","names":[],"sources":["../../../src/components/skeleton/skeleton.tsx"],"sourcesContent":["import { Slot } from \"@askrjs/askr/foundations\";\nimport { mergeProps } from \"../_internal/merge-props\";\nimport type { SkeletonAsChildProps, SkeletonProps } from \"./skeleton.types\";\n\nexport function Skeleton(props: SkeletonProps): JSX.Element;\nexport function Skeleton(props: SkeletonAsChildProps): JSX.Element;\nexport function Skeleton(props: SkeletonProps | SkeletonAsChildProps) {\n  const { asChild, children, ref, ...rest } = props;\n  const finalProps = mergeProps(rest, {\n    ref,\n    \"data-slot\": \"skeleton\",\n    \"data-skeleton\": \"true\",\n    \"aria-hidden\": \"true\",\n  });\n\n  if (asChild) {\n    return <Slot asChild {...finalProps} children={children} />;\n  }\n\n  return <div {...finalProps}>{children}</div>;\n}\n"],"mappings":";;;;AAMA,SAAgB,SAAS,OAA6C;CACpE,MAAM,EAAE,SAAS,UAAU,KAAK,GAAG,SAAS;CAC5C,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,aAAa;EACb,iBAAiB;EACjB,eAAe;EAChB,CAAC;CAEF,IAAI,SACF,OAAO,oBAAC,MAAD;EAAM,SAAA;EAAQ,GAAI;EAAsB;EAAY,CAAA;CAG7D,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAa;EAAe,CAAA"}

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

@@ -1,13 +1,19 @@
-import type { JSXElement, Ref } from "@askrjs/askr/foundations";
-export type SkeletonOwnProps = {
-    children?: unknown;
+import { JSXElement } from "@askrjs/askr/foundations";
+import { Ref } from "@askrjs/askr/foundations/utilities";
+
+//#region src/components/skeleton/skeleton.types.d.ts
+type SkeletonOwnProps = {
+  children?: unknown;
 };
-export type SkeletonProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & SkeletonOwnProps & {
-    asChild?: false;
-    ref?: Ref<HTMLDivElement>;
+type SkeletonProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & SkeletonOwnProps & {
+  asChild?: false;
+  ref?: Ref<HTMLDivElement>;
 };
-export type SkeletonAsChildProps = SkeletonOwnProps & {
-    asChild: true;
-    children: JSXElement;
-    ref?: Ref<unknown>;
+type SkeletonAsChildProps = SkeletonOwnProps & {
+  asChild: true;
+  children: JSXElement;
+  ref?: Ref<unknown>;
 };
+//#endregion
+export { SkeletonAsChildProps, SkeletonOwnProps, SkeletonProps };
+//# sourceMappingURL=skeleton.types.d.ts.map

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

@@ -1,3 +1,3 @@
-export { Spacer } from "./spacer";
-export { SPACER_A11Y_CONTRACT, type SpacerA11yContract } from "./spacer.a11y";
-export type { SpacerProps, SpacerOwnProps, SpacerAxis, SpacerNativeProps, SpacerAsChildProps, } from "./spacer.types";
+import { SpacerAsChildProps, SpacerAxis, SpacerNativeProps, SpacerOwnProps, SpacerProps } from "./spacer.types.js";
+import { Spacer } from "./spacer.js";
+import { SPACER_A11Y_CONTRACT, SpacerA11yContract } from "./spacer.a11y.js";

package/dist/components/spacer/spacer.a11y.d.ts

@@ -1,13 +1,17 @@
-export declare const SPACER_A11Y_CONTRACT: {
-    readonly DATA_ATTRIBUTES: {
-        readonly slot: "data-slot";
-        readonly axis: "data-axis";
-        readonly grow: "data-grow";
-        readonly shrink: "data-shrink";
-        readonly basis: "data-basis";
-    };
-    readonly SLOT_VALUES: {
-        readonly root: "spacer";
-    };
+//#region src/components/spacer/spacer.a11y.d.ts
+declare const SPACER_A11Y_CONTRACT: {
+  readonly DATA_ATTRIBUTES: {
+    readonly slot: "data-slot";
+    readonly axis: "data-axis";
+    readonly grow: "data-grow";
+    readonly shrink: "data-shrink";
+    readonly basis: "data-basis";
+  };
+  readonly SLOT_VALUES: {
+    readonly root: "spacer";
+  };
 };
-export type SpacerA11yContract = typeof SPACER_A11Y_CONTRACT;
+type SpacerA11yContract = typeof SPACER_A11Y_CONTRACT;
+//#endregion
+export { SPACER_A11Y_CONTRACT, SpacerA11yContract };
+//# sourceMappingURL=spacer.a11y.d.ts.map

package/dist/components/spacer/spacer.d.ts

@@ -1,3 +1,8 @@
-import type { SpacerAsChildProps, SpacerNativeProps } from "./spacer.types";
-export declare function Spacer(props: SpacerNativeProps): JSX.Element;
-export declare function Spacer(props: SpacerAsChildProps): JSX.Element;
+import { SpacerAsChildProps, SpacerNativeProps } from "./spacer.types.js";
+
+//#region src/components/spacer/spacer.d.ts
+declare function Spacer(props: SpacerNativeProps): JSX.Element;
+declare function Spacer(props: SpacerAsChildProps): JSX.Element;
+//#endregion
+export { Spacer };
+//# sourceMappingURL=spacer.d.ts.map

package/dist/{spacer → components/spacer}/spacer.js

@@ -1,5 +1,6 @@
 import { mergeProps } from "../_internal/merge-props.js";
 import { isCssLength, mergeLayoutStyles } from "../_internal/layout.js";
+import { styleDeclarationsToClass } from "../_internal/style.js";
 import { isJsxElement, toChildArray } from "../_internal/jsx.js";
 import { jsx } from "@askrjs/askr/jsx-runtime";
 import { Slot } from "@askrjs/askr/foundations";
@@ -18,11 +19,12 @@ function Spacer(props) {
 		if (shrink !== void 0 && shrink !== 1) layoutStyle.flexShrink = shrink;
 		if (isCssLength(basis)) layoutStyle.flexBasis = basis;
 	}
+	const layoutClass = styleDeclarationsToClass(mergeLayoutStyles(layoutStyle, userStyle));
 	const finalProps = mergeProps(rest, {
 		ref,
 		"data-slot": "spacer",
 		"data-axis": axis,
-		style: mergeLayoutStyles(layoutStyle, userStyle)
+		...layoutClass ? { class: layoutClass } : {}
 	});
 	const keyedChildren = toChildArray(children).map((child, index) => {
 		if (!isJsxElement(child) || child.key != null) return child;

package/dist/components/spacer/spacer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spacer.js","names":[],"sources":["../../../src/components/spacer/spacer.tsx"],"sourcesContent":["import { Slot } from \"@askrjs/askr/foundations\";\nimport { mergeProps } from \"../_internal/merge-props\";\nimport { isCssLength, mergeLayoutStyles } from \"../_internal/layout\";\nimport { styleDeclarationsToClass } from \"../_internal/style\";\nimport { isJsxElement, toChildArray } from \"../_internal/jsx\";\nimport type { SpacerAsChildProps, SpacerNativeProps } from \"./spacer.types\";\n\nexport function Spacer(props: SpacerNativeProps): JSX.Element;\nexport function Spacer(props: SpacerAsChildProps): JSX.Element;\nexport function Spacer(props: SpacerNativeProps | SpacerAsChildProps) {\n  const { asChild, children, grow, shrink, basis, axis, ref, style: userStyle, ...rest } = props;\n\n  const layoutStyle: Record<string, string | number> = {};\n\n  if (axis === \"inline\") {\n    if (shrink !== undefined && shrink !== 0) {\n      layoutStyle.flexShrink = shrink;\n    }\n    if (isCssLength(basis)) layoutStyle.width = basis!;\n  } else if (axis === \"block\") {\n    if (shrink !== undefined && shrink !== 0) {\n      layoutStyle.flexShrink = shrink;\n    }\n    if (isCssLength(basis)) layoutStyle.height = basis!;\n  } else {\n    if (grow !== undefined && grow !== 1) {\n      layoutStyle.flexGrow = grow;\n    }\n    if (shrink !== undefined && shrink !== 1) {\n      layoutStyle.flexShrink = shrink;\n    }\n    if (isCssLength(basis)) {\n      layoutStyle.flexBasis = basis!;\n    }\n  }\n\n  const layoutClass = styleDeclarationsToClass(mergeLayoutStyles(layoutStyle, userStyle));\n\n  const finalProps = mergeProps(rest, {\n    ref,\n    \"data-slot\": \"spacer\",\n    \"data-axis\": axis,\n    ...(layoutClass ? { class: layoutClass } : {}),\n  });\n  const keyedChildren = toChildArray(children).map((child, index) => {\n    if (!isJsxElement(child) || child.key != null) {\n      return child;\n    }\n\n    return {\n      ...child,\n      key: `spacer-${index}`,\n    };\n  });\n\n  if (asChild) {\n    return <Slot asChild {...finalProps} children={children} />;\n  }\n\n  return <div {...finalProps}>{keyedChildren}</div>;\n}\n"],"mappings":";;;;;;;AASA,SAAgB,OAAO,OAA+C;CACpE,MAAM,EAAE,SAAS,UAAU,MAAM,QAAQ,OAAO,MAAM,KAAK,OAAO,WAAW,GAAG,SAAS;CAEzF,MAAM,cAA+C,EAAE;CAEvD,IAAI,SAAS,UAAU;EACrB,IAAI,WAAW,KAAA,KAAa,WAAW,GACrC,YAAY,aAAa;EAE3B,IAAI,YAAY,MAAM,EAAE,YAAY,QAAQ;QACvC,IAAI,SAAS,SAAS;EAC3B,IAAI,WAAW,KAAA,KAAa,WAAW,GACrC,YAAY,aAAa;EAE3B,IAAI,YAAY,MAAM,EAAE,YAAY,SAAS;QACxC;EACL,IAAI,SAAS,KAAA,KAAa,SAAS,GACjC,YAAY,WAAW;EAEzB,IAAI,WAAW,KAAA,KAAa,WAAW,GACrC,YAAY,aAAa;EAE3B,IAAI,YAAY,MAAM,EACpB,YAAY,YAAY;;CAI5B,MAAM,cAAc,yBAAyB,kBAAkB,aAAa,UAAU,CAAC;CAEvF,MAAM,aAAa,WAAW,MAAM;EAClC;EACA,aAAa;EACb,aAAa;EACb,GAAI,cAAc,EAAE,OAAO,aAAa,GAAG,EAAE;EAC9C,CAAC;CACF,MAAM,gBAAgB,aAAa,SAAS,CAAC,KAAK,OAAO,UAAU;EACjE,IAAI,CAAC,aAAa,MAAM,IAAI,MAAM,OAAO,MACvC,OAAO;EAGT,OAAO;GACL,GAAG;GACH,KAAK,UAAU;GAChB;GACD;CAEF,IAAI,SACF,OAAO,oBAAC,MAAD;EAAM,SAAA;EAAQ,GAAI;EAAsB;EAAY,CAAA;CAG7D,OAAO,oBAAC,OAAD;EAAK,GAAI;YAAa;EAAoB,CAAA"}

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

@@ -1,24 +1,26 @@
-import type { JSXElement, Ref } from "@askrjs/askr/foundations";
-export type SpacerAxis = "inline" | "block";
-export type SpacerOwnProps = {
-    /** flex-grow factor (default 1 when no axis is set). */
-    grow?: number;
-    /** flex-shrink factor (default 1 when no axis is set, 0 when axis is set). */
-    shrink?: number;
-    /** CSS flex-basis / width (axis=inline) / height (axis=block) value. Applied as inline style only when it is a real CSS length. */
-    basis?: string;
-    /** When set, renders a fixed space along the given axis instead of a flex-grow spacer. */
-    axis?: SpacerAxis;
-    children?: unknown;
+import { JSXElement } from "@askrjs/askr/foundations";
+import { Ref } from "@askrjs/askr/foundations/utilities";
+
+//#region src/components/spacer/spacer.types.d.ts
+type SpacerAxis = "inline" | "block";
+type SpacerOwnProps = {
+  /** flex-grow factor (default 1 when no axis is set). */grow?: number; /** flex-shrink factor (default 1 when no axis is set, 0 when axis is set). */
+  shrink?: number; /** CSS flex-basis / width (axis=inline) / height (axis=block) value. */
+  basis?: string; /** When set, renders a fixed space along the given axis instead of a flex-grow spacer. */
+  axis?: SpacerAxis;
+  children?: unknown;
 };
-export type SpacerNativeProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & SpacerOwnProps & {
-    asChild?: false;
-    ref?: Ref<HTMLDivElement>;
+type SpacerNativeProps = Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & SpacerOwnProps & {
+  asChild?: false;
+  ref?: Ref<HTMLDivElement>;
 };
-export type SpacerAsChildProps = SpacerOwnProps & {
-    asChild: true;
-    children: JSXElement;
-    ref?: Ref<unknown>;
-    style?: JSX.IntrinsicElements["div"]["style"];
+type SpacerAsChildProps = SpacerOwnProps & {
+  asChild: true;
+  children: JSXElement;
+  ref?: Ref<unknown>;
+  style?: JSX.IntrinsicElements["div"]["style"];
 };
-export type SpacerProps = SpacerNativeProps | SpacerAsChildProps;
+type SpacerProps = SpacerNativeProps | SpacerAsChildProps;
+//#endregion
+export { SpacerAsChildProps, SpacerAxis, SpacerNativeProps, SpacerOwnProps, SpacerProps };
+//# sourceMappingURL=spacer.types.d.ts.map

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

@@ -1,2 +1,2 @@
-export { Spinner } from "./spinner";
-export type { SpinnerOwnProps, SpinnerProps } from "./spinner.types";
+import { SpinnerOwnProps, SpinnerProps } from "./spinner.types.js";
+import { Spinner } from "./spinner.js";

package/dist/components/spinner/spinner.d.ts

@@ -1,2 +1,7 @@
-import type { SpinnerProps } from "./spinner.types";
-export declare function Spinner(props: SpinnerProps): JSX.Element;
+import { SpinnerProps } from "./spinner.types.js";
+
+//#region src/components/spinner/spinner.d.ts
+declare function Spinner(props: SpinnerProps): JSX.Element;
+//#endregion
+export { Spinner };
+//# sourceMappingURL=spinner.d.ts.map

package/dist/components/spinner/spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spinner.js","names":[],"sources":["../../../src/components/spinner/spinner.tsx"],"sourcesContent":["import { ProgressCircle } from \"@askrjs/ui\";\nimport type { SpinnerProps } from \"./spinner.types\";\n\nexport function Spinner(props: SpinnerProps): JSX.Element {\n  const {\n    label,\n    \"aria-label\": ariaLabel,\n    ...rest\n  } = props as SpinnerProps & {\n    \"aria-label\"?: string;\n  };\n\n  return (\n    <ProgressCircle\n      {...rest}\n      aria-label={ariaLabel ?? label ?? \"Loading\"}\n      value={null}\n      getValueLabel={() => label ?? \"Loading\"}\n    />\n  );\n}\n"],"mappings":";;;AAGA,SAAgB,QAAQ,OAAkC;CACxD,MAAM,EACJ,OACA,cAAc,WACd,GAAG,SACD;CAIJ,OACE,oBAAC,gBAAD;EACE,GAAI;EACJ,cAAY,aAAa,SAAS;EAClC,OAAO;EACP,qBAAqB,SAAS;EAC9B,CAAA"}

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

@@ -1,5 +1,10 @@
-import type { ProgressCircleProps } from "@askrjs/ui";
-export type SpinnerOwnProps = Omit<ProgressCircleProps, "value" | "getValueLabel"> & {
-    label?: string;
+import { ProgressCircleProps } from "@askrjs/ui";
+
+//#region src/components/spinner/spinner.types.d.ts
+type SpinnerOwnProps = Omit<ProgressCircleProps, "value" | "getValueLabel"> & {
+  label?: string;
 };
-export type SpinnerProps = SpinnerOwnProps;
+type SpinnerProps = SpinnerOwnProps;
+//#endregion
+export { SpinnerOwnProps, SpinnerProps };
+//# sourceMappingURL=spinner.types.d.ts.map

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

@@ -1,3 +1,3 @@
-export { Stack } from "./stack";
-export { STACK_A11Y_CONTRACT, type StackA11yContract } from "./stack.a11y";
-export type { StackProps, StackOwnProps, StackDivProps, StackAsChildProps } from "./stack.types";
+import { StackAsChildProps, StackDivProps, StackOwnProps, StackProps } from "./stack.types.js";
+import { Stack } from "./stack.js";
+import { STACK_A11Y_CONTRACT, StackA11yContract } from "./stack.a11y.js";

package/dist/components/stack/stack.a11y.d.ts

@@ -1,14 +1,18 @@
-export declare const STACK_A11Y_CONTRACT: {
-    readonly DATA_ATTRIBUTES: {
-        readonly slot: "data-slot";
-        readonly layout: "data-ak-layout";
-        readonly gap: "data-gap";
-        readonly align: "data-align";
-        readonly justify: "data-justify";
-        readonly wrap: "data-wrap";
-    };
-    readonly SLOT_VALUES: {
-        readonly root: "stack";
-    };
+//#region src/components/stack/stack.a11y.d.ts
+declare const STACK_A11Y_CONTRACT: {
+  readonly DATA_ATTRIBUTES: {
+    readonly slot: "data-slot";
+    readonly layout: "data-ak-layout";
+    readonly gap: "data-gap";
+    readonly align: "data-align";
+    readonly justify: "data-justify";
+    readonly wrap: "data-wrap";
+  };
+  readonly SLOT_VALUES: {
+    readonly root: "stack";
+  };
 };
-export type StackA11yContract = typeof STACK_A11Y_CONTRACT;
+type StackA11yContract = typeof STACK_A11Y_CONTRACT;
+//#endregion
+export { STACK_A11Y_CONTRACT, StackA11yContract };
+//# sourceMappingURL=stack.a11y.d.ts.map

package/dist/components/stack/stack.d.ts

@@ -1,3 +1,8 @@
-import type { StackAsChildProps, StackDivProps } from "./stack.types";
-export declare function Stack(props: StackDivProps): JSX.Element;
-export declare function Stack(props: StackAsChildProps): JSX.Element;
+import { StackAsChildProps, StackDivProps } from "./stack.types.js";
+
+//#region src/components/stack/stack.d.ts
+declare function Stack(props: StackDivProps): JSX.Element;
+declare function Stack(props: StackAsChildProps): JSX.Element;
+//#endregion
+export { Stack };
+//# sourceMappingURL=stack.d.ts.map

package/dist/components/stack/stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack.js","names":[],"sources":["../../../src/components/stack/stack.tsx"],"sourcesContent":["import { Flex } from \"../flex\";\nimport type { StackAsChildProps, StackDivProps } from \"./stack.types\";\n\nexport function Stack(props: StackDivProps): JSX.Element;\nexport function Stack(props: StackAsChildProps): JSX.Element;\nexport function Stack(props: StackDivProps | StackAsChildProps) {\n  const { children, ...rest } = props;\n  return (\n    <Flex {...(rest as Record<string, unknown>)} data-slot=\"stack\" direction=\"column\">\n      {children}\n    </Flex>\n  );\n}\n"],"mappings":";;;AAKA,SAAgB,MAAM,OAA0C;CAC9D,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,OACE,oBAAC,MAAD;EAAM,GAAK;EAAkC,aAAU;EAAQ,WAAU;EACtE;EACI,CAAA"}