@jinmi/ui 0.0.0-stage → 6.0.1

package/es/dashboard/FilterSidebar/FilterSidebar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterSidebar.mjs","names":["styles","surfaceStyles"],"sources":["../../../src/dashboard/FilterSidebar/FilterSidebar.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { Filter } from 'lucide-react';\r\nimport { useState } from 'react';\r\n\r\nimport Button from '@/base-ui/Button';\r\nimport { DraggablePanel } from '@/base-ui/DraggablePanel';\r\nimport { Drawer } from '@/base-ui/Drawer';\r\n\r\nimport { useIsCompact, useLocalStorage } from '../hooks';\r\nimport { styles as surfaceStyles } from '../Surface/style';\r\nimport { FilterSplitProvider } from './context';\r\nimport { styles } from './style';\r\nimport type { FilterOptionProps, FilterRowProps, FilterSidebarProps } from './type';\r\nimport { clampSidebarWidth, sidebarWidth } from './width';\r\n\r\nfunction usePageSidebar(wide: boolean | undefined, storageKey: string | undefined) {\r\n  const fallback = wide ? sidebarWidth.wide : sidebarWidth.narrow;\r\n  const [prefs, setPrefs] = useLocalStorage<{ expand?: boolean; width?: number }>(storageKey, {\r\n    expand: true,\r\n    width: fallback,\r\n  });\r\n  return {\r\n    expand: prefs.expand !== false,\r\n    onExpandChange: (expand: boolean) => setPrefs((current) => ({ ...current, expand })),\r\n    onSizeChange: (size: { width?: number | string }) => {\r\n      const next = typeof size.width === 'number' ? size.width : fallback;\r\n      setPrefs((current) => ({ ...current, width: clampSidebarWidth(next, fallback) }));\r\n    },\r\n    width: clampSidebarWidth(Number(prefs.width), fallback),\r\n  };\r\n}\r\n\r\nfunction FilterSidebar({\r\n  body,\r\n  children,\r\n  flush,\r\n  head,\r\n  header,\r\n  label,\r\n  storageKey,\r\n  summary,\r\n  wide,\r\n}: FilterSidebarProps) {\r\n  const isCompact = useIsCompact();\r\n  const [drawerOpen, setDrawerOpen] = useState(false);\r\n  const sidebar = usePageSidebar(wide, storageKey);\r\n  const close = () => setDrawerOpen(false);\r\n\r\n  if (isCompact) {\r\n    return (\r\n      <FilterSplitProvider active={!flush}>\r\n        <div className={styles.layout}>\r\n          {header}\r\n          <Button block icon={Filter} onClick={() => setDrawerOpen(true)}>\r\n            {summary}\r\n          </Button>\r\n          <Drawer open={drawerOpen} placement=\"left\" title={label} width={300} onClose={close}>\r\n            <div className={styles.drawerPanel}>\r\n              {head?.(close)}\r\n              {body(close)}\r\n            </div>\r\n          </Drawer>\r\n          <div className={styles.content}>{children}</div>\r\n        </div>\r\n      </FilterSplitProvider>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <FilterSplitProvider active={!flush}>\r\n      <div\r\n        className={flush ? styles.layout : `${styles.layout} ${surfaceStyles.card}`}\r\n        data-flush={flush ? true : undefined}\r\n        data-page-layout={flush ? 'flush' : undefined}\r\n        data-split-card={flush ? undefined : true}\r\n      >\r\n        <DraggablePanel\r\n          expandable\r\n          showHandleWhenCollapsed\r\n          aria-label={label}\r\n          className={styles.sidebar}\r\n          classNames={{ content: styles.panel }}\r\n          collapseThreshold={sidebarWidth.collapse}\r\n          data-flush={flush ? true : undefined}\r\n          defaultSize={{ width: wide ? sidebarWidth.wide : sidebarWidth.narrow }}\r\n          expand={sidebar.expand}\r\n          maxWidth={sidebarWidth.max}\r\n          minWidth={sidebarWidth.min}\r\n          mode=\"fixed\"\r\n          placement=\"left\"\r\n          showBorder={false}\r\n          size={{ width: sidebar.width }}\r\n          onExpandChange={sidebar.onExpandChange}\r\n          onSizeChange={(_delta, size) => sidebar.onSizeChange(size)}\r\n        >\r\n          {head ? <div className={styles.head}>{head(close)}</div> : null}\r\n          <div className={styles.body} data-flush={flush ? true : undefined}>\r\n            {body(close)}\r\n          </div>\r\n        </DraggablePanel>\r\n        <div className={styles.content} data-flush={flush ? true : undefined}>\r\n          {header}\r\n          {children}\r\n        </div>\r\n      </div>\r\n    </FilterSplitProvider>\r\n  );\r\n}\r\n\r\nFilterSidebar.displayName = 'FilterSidebar';\r\n\r\nfunction FilterRow({ count, name }: FilterRowProps) {\r\n  return (\r\n    <span className={styles.row}>\r\n      <span className={styles.name}>{name}</span>\r\n      {count !== undefined ? <span className={styles.count}>{count}</span> : null}\r\n    </span>\r\n  );\r\n}\r\n\r\nFilterRow.displayName = 'FilterRow';\r\n\r\nfunction FilterOption({ count, icon, label, name, onClick, selected, title }: FilterOptionProps) {\r\n  return (\r\n    <button\r\n      aria-label={label}\r\n      aria-pressed={selected}\r\n      className={styles.option}\r\n      title={title}\r\n      type=\"button\"\r\n      onClick={onClick}\r\n    >\r\n      {icon}\r\n      <span className={styles.name}>{name}</span>\r\n      {count !== undefined ? <span className={styles.count}>{count}</span> : null}\r\n    </button>\r\n  );\r\n}\r\n\r\nFilterOption.displayName = 'FilterOption';\r\n\r\nexport { FilterOption, FilterRow };\r\nexport default FilterSidebar;\r\n"],"mappings":"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"}

package/es/dashboard/FilterSidebar/context.d.mts

@@ -0,0 +1,7 @@
+import { ReactNode } from "react";
+//#region src/dashboard/FilterSidebar/context.d.ts
+/** True when this content sits in a filter split that is itself the card. */
+declare function useInFilterSplit(): boolean;
+//#endregion
+export { useInFilterSplit };
+//# sourceMappingURL=context.d.mts.map

package/es/dashboard/FilterSidebar/context.mjs

@@ -0,0 +1,19 @@
+"use client";
+import { createContext, use } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/dashboard/FilterSidebar/context.tsx
+const FilterSplitContext = createContext(false);
+function FilterSplitProvider({ active, children }) {
+	return /* @__PURE__ */ jsx(FilterSplitContext, {
+		value: active,
+		children
+	});
+}
+/** True when this content sits in a filter split that is itself the card. */
+function useInFilterSplit() {
+	return use(FilterSplitContext);
+}
+//#endregion
+export { FilterSplitProvider, useInFilterSplit };
+
+//# sourceMappingURL=context.mjs.map

package/es/dashboard/FilterSidebar/context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.mjs","names":[],"sources":["../../../src/dashboard/FilterSidebar/context.tsx"],"sourcesContent":["'use client';\r\n\r\nimport type { ReactNode } from 'react';\r\nimport { createContext, use } from 'react';\r\n\r\nconst FilterSplitContext = createContext(false);\r\n\r\nexport function FilterSplitProvider({\r\n  active,\r\n  children,\r\n}: {\r\n  active: boolean;\r\n  children: ReactNode;\r\n}) {\r\n  return <FilterSplitContext value={active}>{children}</FilterSplitContext>;\r\n}\r\n\r\n/** True when this content sits in a filter split that is itself the card. */\r\nexport function useInFilterSplit() {\r\n  return use(FilterSplitContext);\r\n}\r\n"],"mappings":";;;;AAKA,MAAM,qBAAqB,cAAc,KAAK;AAE9C,SAAgB,oBAAoB,EAClC,QACA,YAIC;CACD,OAAO,oBAAC,oBAAD;EAAoB,OAAO;EAAS;CAA6B,CAAA;AAC1E;;AAGA,SAAgB,mBAAmB;CACjC,OAAO,IAAI,kBAAkB;AAC/B"}

package/es/dashboard/FilterSidebar/index.d.mts

@@ -0,0 +1,4 @@
+import { useInFilterSplit } from "./context.mjs";
+import { FilterOptionProps, FilterRowProps, FilterSidebarProps } from "./type.mjs";
+import FilterSidebar, { FilterOption, FilterRow } from "./FilterSidebar.mjs";
+export { FilterOption, type FilterOptionProps, FilterRow, type FilterRowProps, type FilterSidebarProps, FilterSidebar as default, useInFilterSplit };

package/es/dashboard/FilterSidebar/style.mjs

@@ -0,0 +1,155 @@
+import { createStaticStyles } from "antd-style";
+//#region src/dashboard/FilterSidebar/style.ts
+const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
+	body: css`
+    overflow-y: auto;
+    max-block-size: 360px;
+    padding-block-end: 16px;
+    padding-inline: 12px;
+
+    &[data-flush='true'] {
+      flex: 1;
+      min-block-size: 0;
+      max-block-size: none;
+    }
+  `,
+	content: css`
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    gap: 16px;
+
+    min-inline-size: 0;
+    padding-inline-start: 20px;
+
+    &[data-flush='true'] {
+      overflow-y: auto;
+      padding: 24px;
+    }
+
+    [data-split-card='true'] & {
+      padding-block: 16px 0;
+      padding-inline: 16px;
+
+      > :last-child {
+        margin-inline: -16px;
+      }
+    }
+
+    ${responsive.laptop} {
+      overflow: visible;
+      padding: 0;
+
+      > :last-child {
+        margin-inline: 0;
+      }
+    }
+  `,
+	count: css`
+    flex: none;
+    font-size: ${cssVar.fontSizeSM};
+    font-variant-numeric: tabular-nums;
+    color: ${cssVar.colorTextTertiary};
+  `,
+	drawerPanel: css`
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  `,
+	head: css`
+    display: flex;
+    flex: none;
+    flex-direction: column;
+    gap: 8px;
+
+    padding: 12px;
+  `,
+	layout: css`
+    display: flex;
+
+    &[data-flush='true'] {
+      flex: 1;
+      min-block-size: 0;
+    }
+
+    &[data-split-card='true'] {
+      overflow: hidden;
+      align-items: stretch;
+    }
+
+    ${responsive.laptop} {
+      flex-direction: column;
+      gap: 12px;
+    }
+  `,
+	name: css`
+    overflow: hidden;
+    flex: 1;
+
+    min-inline-size: 0;
+
+    text-align: start;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  `,
+	option: css`
+    cursor: pointer;
+
+    display: flex;
+    gap: 6px;
+    align-items: center;
+
+    inline-size: 100%;
+    min-block-size: 36px;
+    padding-inline: 8px;
+    border: none;
+    border-radius: ${cssVar.borderRadius};
+
+    font: inherit;
+    color: ${cssVar.colorText};
+
+    background: none;
+
+    &:hover {
+      background: ${cssVar.colorFillTertiary};
+    }
+
+    &[aria-pressed='true'] {
+      font-weight: 500;
+      background: ${cssVar.controlItemBgActive};
+    }
+  `,
+	row: css`
+    display: flex;
+    flex: 1;
+    gap: 6px;
+    align-items: center;
+
+    min-inline-size: 0;
+  `,
+	panel: css`
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+
+    min-block-size: 0;
+    border-inline-end: 1px solid ${cssVar.colorBorderSecondary};
+
+    [data-split-card='true'] & {
+      block-size: 100%;
+      border-inline-end-color: ${cssVar.colorBorder};
+    }
+  `,
+	sidebar: css`
+    align-self: stretch;
+    min-block-size: 0;
+
+    &[data-flush='true'] {
+      block-size: 100%;
+    }
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/dashboard/FilterSidebar/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/FilterSidebar/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\r\n  body: css`\r\n    overflow-y: auto;\r\n    max-block-size: 360px;\r\n    padding-block-end: 16px;\r\n    padding-inline: 12px;\r\n\r\n    &[data-flush='true'] {\r\n      flex: 1;\r\n      min-block-size: 0;\r\n      max-block-size: none;\r\n    }\r\n  `,\r\n  content: css`\r\n    display: flex;\r\n    flex: 1;\r\n    flex-direction: column;\r\n    gap: 16px;\r\n\r\n    min-inline-size: 0;\r\n    padding-inline-start: 20px;\r\n\r\n    &[data-flush='true'] {\r\n      overflow-y: auto;\r\n      padding: 24px;\r\n    }\r\n\r\n    [data-split-card='true'] & {\r\n      padding-block: 16px 0;\r\n      padding-inline: 16px;\r\n\r\n      > :last-child {\r\n        margin-inline: -16px;\r\n      }\r\n    }\r\n\r\n    ${responsive.laptop} {\r\n      overflow: visible;\r\n      padding: 0;\r\n\r\n      > :last-child {\r\n        margin-inline: 0;\r\n      }\r\n    }\r\n  `,\r\n  count: css`\r\n    flex: none;\r\n    font-size: ${cssVar.fontSizeSM};\r\n    font-variant-numeric: tabular-nums;\r\n    color: ${cssVar.colorTextTertiary};\r\n  `,\r\n  drawerPanel: css`\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 8px;\r\n  `,\r\n  head: css`\r\n    display: flex;\r\n    flex: none;\r\n    flex-direction: column;\r\n    gap: 8px;\r\n\r\n    padding: 12px;\r\n  `,\r\n  layout: css`\r\n    display: flex;\r\n\r\n    &[data-flush='true'] {\r\n      flex: 1;\r\n      min-block-size: 0;\r\n    }\r\n\r\n    &[data-split-card='true'] {\r\n      overflow: hidden;\r\n      align-items: stretch;\r\n    }\r\n\r\n    ${responsive.laptop} {\r\n      flex-direction: column;\r\n      gap: 12px;\r\n    }\r\n  `,\r\n  name: css`\r\n    overflow: hidden;\r\n    flex: 1;\r\n\r\n    min-inline-size: 0;\r\n\r\n    text-align: start;\r\n    text-overflow: ellipsis;\r\n    white-space: nowrap;\r\n  `,\r\n  option: css`\r\n    cursor: pointer;\r\n\r\n    display: flex;\r\n    gap: 6px;\r\n    align-items: center;\r\n\r\n    inline-size: 100%;\r\n    min-block-size: 36px;\r\n    padding-inline: 8px;\r\n    border: none;\r\n    border-radius: ${cssVar.borderRadius};\r\n\r\n    font: inherit;\r\n    color: ${cssVar.colorText};\r\n\r\n    background: none;\r\n\r\n    &:hover {\r\n      background: ${cssVar.colorFillTertiary};\r\n    }\r\n\r\n    &[aria-pressed='true'] {\r\n      font-weight: 500;\r\n      background: ${cssVar.controlItemBgActive};\r\n    }\r\n  `,\r\n  row: css`\r\n    display: flex;\r\n    flex: 1;\r\n    gap: 6px;\r\n    align-items: center;\r\n\r\n    min-inline-size: 0;\r\n  `,\r\n  panel: css`\r\n    overflow: hidden;\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    min-block-size: 0;\r\n    border-inline-end: 1px solid ${cssVar.colorBorderSecondary};\r\n\r\n    [data-split-card='true'] & {\r\n      block-size: 100%;\r\n      border-inline-end-color: ${cssVar.colorBorder};\r\n    }\r\n  `,\r\n  sidebar: css`\r\n    align-self: stretch;\r\n    min-block-size: 0;\r\n\r\n    &[data-flush='true'] {\r\n      block-size: 100%;\r\n    }\r\n  `,\r\n}));\r\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,MAAM,GAAG;;;;;;;;;;;;CAYT,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;MAuBR,WAAW,OAAO;;;;;;;;;CAStB,OAAO,GAAG;;iBAEK,OAAO,WAAW;;aAEtB,OAAO,kBAAkB;;CAEpC,aAAa,GAAG;;;;;CAKhB,MAAM,GAAG;;;;;;;;CAQT,QAAQ,GAAG;;;;;;;;;;;;;MAaP,WAAW,OAAO;;;;;CAKtB,MAAM,GAAG;;;;;;;;;;CAUT,QAAQ,GAAG;;;;;;;;;;;qBAWQ,OAAO,aAAa;;;aAG5B,OAAO,UAAU;;;;;oBAKV,OAAO,kBAAkB;;;;;oBAKzB,OAAO,oBAAoB;;;CAG7C,KAAK,GAAG;;;;;;;;CAQR,OAAO,GAAG;;;;;;mCAMuB,OAAO,qBAAqB;;;;iCAI9B,OAAO,YAAY;;;CAGlD,SAAS,GAAG;;;;;;;;AAQd,EAAE"}

package/es/dashboard/FilterSidebar/type.d.mts

@@ -0,0 +1,44 @@
+import { ReactNode } from "react";
+//#region src/dashboard/FilterSidebar/type.d.ts
+interface FilterSidebarProps {
+  /** Scrolling choices. `dismiss` closes the compact drawer. */
+  body: (dismiss: () => void) => ReactNode;
+  children: ReactNode;
+  /**
+   * Fill the parent and scroll the two panes separately.
+   * Leave this off when a header or tabs sit above the split.
+   */
+  flush?: boolean;
+  /**
+   * Fixed controls, such as search. They stay put while `body` scrolls.
+   * `dismiss` closes the compact drawer.
+   */
+  head?: (dismiss: () => void) => ReactNode;
+  /** Title block rendered in the content pane, above the compact trigger. */
+  header?: ReactNode;
+  /** Names the sidebar, and titles the drawer on compact screens. */
+  label: string;
+  /** Persists width and collapsed state. */
+  storageKey?: string;
+  /** Current filter, shown on the compact trigger. */
+  summary: string;
+  /** Wider rail. Default width is 264px; wide is 300px. */
+  wide?: boolean;
+}
+interface FilterRowProps {
+  count?: ReactNode;
+  name: ReactNode;
+}
+interface FilterOptionProps {
+  count?: ReactNode;
+  icon?: ReactNode;
+  /** Overrides the accessible name when the visible one lacks context. */
+  label?: string;
+  name: ReactNode;
+  onClick: () => void;
+  selected: boolean;
+  title?: string;
+}
+//#endregion
+export { FilterOptionProps, FilterRowProps, FilterSidebarProps };
+//# sourceMappingURL=type.d.mts.map

package/es/dashboard/FilterSidebar/width.mjs

@@ -0,0 +1,18 @@
+//#region src/dashboard/FilterSidebar/width.ts
+const MIN_WIDTH = 200;
+const MAX_WIDTH = 480;
+function clampSidebarWidth(width, fallback) {
+	if (!Number.isFinite(width)) return fallback;
+	return Math.min(MAX_WIDTH, Math.max(MIN_WIDTH, Math.round(width)));
+}
+const sidebarWidth = {
+	collapse: 80,
+	max: MAX_WIDTH,
+	min: MIN_WIDTH,
+	narrow: 264,
+	wide: 300
+};
+//#endregion
+export { clampSidebarWidth, sidebarWidth };
+
+//# sourceMappingURL=width.mjs.map

package/es/dashboard/FilterSidebar/width.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"width.mjs","names":[],"sources":["../../../src/dashboard/FilterSidebar/width.ts"],"sourcesContent":["const MIN_WIDTH = 200;\r\nconst MAX_WIDTH = 480;\r\n\r\nexport function clampSidebarWidth(width: number, fallback: number) {\r\n  if (!Number.isFinite(width)) return fallback;\r\n  return Math.min(MAX_WIDTH, Math.max(MIN_WIDTH, Math.round(width)));\r\n}\r\n\r\nexport const sidebarWidth = {\r\n  collapse: 80,\r\n  max: MAX_WIDTH,\r\n  min: MIN_WIDTH,\r\n  narrow: 264,\r\n  wide: 300,\r\n};\r\n"],"mappings":";AAAA,MAAM,YAAY;AAClB,MAAM,YAAY;AAElB,SAAgB,kBAAkB,OAAe,UAAkB;CACjE,IAAI,CAAC,OAAO,SAAS,KAAK,GAAG,OAAO;CACpC,OAAO,KAAK,IAAI,WAAW,KAAK,IAAI,WAAW,KAAK,MAAM,KAAK,CAAC,CAAC;AACnE;AAEA,MAAa,eAAe;CAC1B,UAAU;CACV,KAAK;CACL,KAAK;CACL,QAAQ;CACR,MAAM;AACR"}

package/es/dashboard/PageHeader/PageHeader.d.mts

@@ -0,0 +1,9 @@
+import { PageHeaderProps } from "./type.mjs";
+//#region src/dashboard/PageHeader/PageHeader.d.ts
+declare function PageHeader({ action, children, description, mark, title }: PageHeaderProps): import("react").JSX.Element;
+declare namespace PageHeader {
+  var displayName: string;
+}
+//#endregion
+export { PageHeader as default };
+//# sourceMappingURL=PageHeader.d.mts.map

package/es/dashboard/PageHeader/PageHeader.mjs

@@ -0,0 +1,37 @@
+"use client";
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import Text from "../../base-ui/Text/Text.mjs";
+import { styles } from "./style.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/dashboard/PageHeader/PageHeader.tsx
+function PageHeader({ action, children, description, mark, title }) {
+	const extra = action ?? children;
+	return /* @__PURE__ */ jsxs("div", {
+		className: styles.root,
+		children: [/* @__PURE__ */ jsxs(FlexBasic_default, {
+			align: mark ? "flex-start" : void 0,
+			gap: 12,
+			horizontal: Boolean(mark),
+			children: [mark, /* @__PURE__ */ jsxs(FlexBasic_default, {
+				gap: 8,
+				children: [/* @__PURE__ */ jsx(Text, {
+					as: "h1",
+					className: styles.title,
+					weight: "bold",
+					children: title
+				}), description ? /* @__PURE__ */ jsx(Text, {
+					className: styles.description,
+					children: description
+				}) : null]
+			})]
+		}), extra ? /* @__PURE__ */ jsx("div", {
+			className: styles.actions,
+			children: extra
+		}) : null]
+	});
+}
+PageHeader.displayName = "PageHeader";
+//#endregion
+export { PageHeader as default };
+
+//# sourceMappingURL=PageHeader.mjs.map

package/es/dashboard/PageHeader/PageHeader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageHeader.mjs","names":["Flexbox"],"sources":["../../../src/dashboard/PageHeader/PageHeader.tsx"],"sourcesContent":["'use client';\r\n\r\nimport Text from '@/base-ui/Text';\r\nimport { Flexbox } from '@/Flex';\r\n\r\nimport { styles } from './style';\r\nimport type { PageHeaderProps } from './type';\r\n\r\nfunction PageHeader({ action, children, description, mark, title }: PageHeaderProps) {\r\n  const extra = action ?? children;\r\n  return (\r\n    <div className={styles.root}>\r\n      <Flexbox align={mark ? 'flex-start' : undefined} gap={12} horizontal={Boolean(mark)}>\r\n        {mark}\r\n        <Flexbox gap={8}>\r\n          <Text as=\"h1\" className={styles.title} weight=\"bold\">\r\n            {title}\r\n          </Text>\r\n          {description ? <Text className={styles.description}>{description}</Text> : null}\r\n        </Flexbox>\r\n      </Flexbox>\r\n      {extra ? <div className={styles.actions}>{extra}</div> : null}\r\n    </div>\r\n  );\r\n}\r\n\r\nPageHeader.displayName = 'PageHeader';\r\n\r\nexport default PageHeader;\r\n"],"mappings":";;;;;;AAQA,SAAS,WAAW,EAAE,QAAQ,UAAU,aAAa,MAAM,SAA0B;CACnF,MAAM,QAAQ,UAAU;CACxB,OACE,qBAAC,OAAD;EAAK,WAAW,OAAO;EAAvB,UAAA,CACE,qBAACA,mBAAD;GAAS,OAAO,OAAO,eAAe,KAAA;GAAW,KAAK;GAAI,YAAY,QAAQ,IAAI;GAAlF,UAAA,CACG,MACD,qBAACA,mBAAD;IAAS,KAAK;IAAd,UAAA,CACE,oBAAC,MAAD;KAAM,IAAG;KAAK,WAAW,OAAO;KAAO,QAAO;KAC3C,UAAA;IACG,CAAA,GACL,cAAc,oBAAC,MAAD;KAAM,WAAW,OAAO;KAAc,UAAA;IAAkB,CAAA,IAAI,IACpE;GACF,CAAA,CAAA;EACR,CAAA,GAAA,QAAQ,oBAAC,OAAD;GAAK,WAAW,OAAO;GAAU,UAAA;EAAW,CAAA,IAAI,IACtD;;AAET;AAEA,WAAW,cAAc"}

package/es/dashboard/PageHeader/index.d.mts

@@ -0,0 +1,3 @@
+import { PageHeaderProps } from "./type.mjs";
+import PageHeader from "./PageHeader.mjs";
+export { type PageHeaderProps, PageHeader as default };

package/es/dashboard/PageHeader/style.mjs

@@ -0,0 +1,47 @@
+import { createStaticStyles } from "antd-style";
+//#region src/dashboard/PageHeader/style.ts
+const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
+	actions: css`
+    display: flex;
+    flex: none;
+    gap: 8px;
+    align-items: center;
+
+    ${responsive.mobile} {
+      inline-size: 100%;
+
+      button,
+      a {
+        min-block-size: 44px;
+      }
+    }
+  `,
+	description: css`
+    max-inline-size: 68ch;
+    line-height: 1.6;
+    color: ${cssVar.colorTextSecondary};
+  `,
+	root: css`
+    display: flex;
+    gap: 16px;
+    align-items: flex-start;
+    justify-content: space-between;
+
+    inline-size: 100%;
+    min-inline-size: 0;
+
+    ${responsive.mobile} {
+      flex-direction: column;
+      align-items: stretch;
+    }
+  `,
+	title: css`
+    margin: 0;
+    font-size: ${cssVar.fontSizeHeading3};
+    line-height: ${cssVar.lineHeightHeading3};
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/dashboard/PageHeader/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/PageHeader/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\r\n\r\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\r\n  actions: css`\r\n    display: flex;\r\n    flex: none;\r\n    gap: 8px;\r\n    align-items: center;\r\n\r\n    ${responsive.mobile} {\r\n      inline-size: 100%;\r\n\r\n      button,\r\n      a {\r\n        min-block-size: 44px;\r\n      }\r\n    }\r\n  `,\r\n  description: css`\r\n    max-inline-size: 68ch;\r\n    line-height: 1.6;\r\n    color: ${cssVar.colorTextSecondary};\r\n  `,\r\n  root: css`\r\n    display: flex;\r\n    gap: 16px;\r\n    align-items: flex-start;\r\n    justify-content: space-between;\r\n\r\n    inline-size: 100%;\r\n    min-inline-size: 0;\r\n\r\n    ${responsive.mobile} {\r\n      flex-direction: column;\r\n      align-items: stretch;\r\n    }\r\n  `,\r\n  title: css`\r\n    margin: 0;\r\n    font-size: ${cssVar.fontSizeHeading3};\r\n    line-height: ${cssVar.lineHeightHeading3};\r\n  `,\r\n}));\r\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,SAAS,GAAG;;;;;;MAMR,WAAW,OAAO;;;;;;;;;CAStB,aAAa,GAAG;;;aAGL,OAAO,mBAAmB;;CAErC,MAAM,GAAG;;;;;;;;;MASL,WAAW,OAAO;;;;;CAKtB,OAAO,GAAG;;iBAEK,OAAO,iBAAiB;mBACtB,OAAO,mBAAmB;;AAE7C,EAAE"}

package/es/dashboard/PageHeader/type.d.mts

@@ -0,0 +1,14 @@
+import { ReactNode } from "react";
+//#region src/dashboard/PageHeader/type.d.ts
+interface PageHeaderProps {
+  /** Actions at the end of the header. Falls back to `children`. */
+  action?: ReactNode;
+  children?: ReactNode;
+  description?: ReactNode;
+  /** Mark beside the title, such as an avatar. */
+  mark?: ReactNode;
+  title: ReactNode;
+}
+//#endregion
+export { PageHeaderProps };
+//# sourceMappingURL=type.d.mts.map

package/es/dashboard/PageSkeleton/PageSkeleton.d.mts

@@ -0,0 +1,25 @@
+import { LoadingAnnouncerProps, PageHeaderSkeletonProps, PageLoadingProps, TableSkeletonProps } from "./type.mjs";
+//#region src/dashboard/PageSkeleton/PageSkeleton.d.ts
+declare function LoadingAnnouncer({ label }: LoadingAnnouncerProps): import("react").JSX.Element;
+declare namespace LoadingAnnouncer {
+  var displayName: string;
+}
+declare function PageHeaderSkeleton({ action }: PageHeaderSkeletonProps): import("react").JSX.Element;
+declare namespace PageHeaderSkeleton {
+  var displayName: string;
+}
+declare function TableSkeleton({ framed, leading, rows }: TableSkeletonProps): import("react").JSX.Element;
+declare namespace TableSkeleton {
+  var displayName: string;
+}
+declare function StatCardSkeleton(): import("react").JSX.Element;
+declare namespace StatCardSkeleton {
+  var displayName: string;
+}
+declare function PageLoading({ header, label, stats }: PageLoadingProps): import("react").JSX.Element;
+declare namespace PageLoading {
+  var displayName: string;
+}
+//#endregion
+export { LoadingAnnouncer, PageHeaderSkeleton, StatCardSkeleton, TableSkeleton, PageLoading as default };
+//# sourceMappingURL=PageSkeleton.d.mts.map

package/es/dashboard/PageSkeleton/PageSkeleton.mjs

@@ -0,0 +1,136 @@
+"use client";
+import Skeleton from "../../base-ui/Skeleton/index.mjs";
+import { styles } from "../Surface/style.mjs";
+import { styles as styles$1 } from "./style.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/dashboard/PageSkeleton/PageSkeleton.tsx
+const bone = {
+	height: void 0,
+	width: void 0
+};
+const lineWidths = [
+	["68%", "36%"],
+	["52%", "28%"],
+	["76%", "42%"],
+	["58%", "32%"]
+];
+function LoadingAnnouncer({ label }) {
+	return /* @__PURE__ */ jsx("output", {
+		"aria-live": "polite",
+		className: styles$1.srOnly,
+		children: label
+	});
+}
+LoadingAnnouncer.displayName = "LoadingAnnouncer";
+function PageHeaderSkeleton({ action = true }) {
+	return /* @__PURE__ */ jsxs("div", {
+		"aria-hidden": true,
+		className: styles$1.header,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: styles$1.headerCopy,
+			children: [/* @__PURE__ */ jsx(Skeleton, {
+				className: styles$1.title,
+				style: bone
+			}), /* @__PURE__ */ jsx(Skeleton.Text, {
+				fontSize: 14,
+				width: "46%"
+			})]
+		}), action ? /* @__PURE__ */ jsx(Skeleton, {
+			className: styles$1.action,
+			style: bone
+		}) : null]
+	});
+}
+PageHeaderSkeleton.displayName = "PageHeaderSkeleton";
+function TableSkeleton({ framed = true, leading = "text", rows = 6 }) {
+	return /* @__PURE__ */ jsxs("div", {
+		"aria-hidden": true,
+		className: framed ? `${styles$1.table} ${styles.card}` : styles$1.table,
+		children: [/* @__PURE__ */ jsx("div", {
+			className: styles$1.thead,
+			children: [
+				96,
+				72,
+				64,
+				48
+			].map((width, index) => /* @__PURE__ */ jsx(Skeleton, {
+				className: styles$1.theadCell,
+				style: {
+					...bone,
+					width
+				}
+			}, index))
+		}), Array.from({ length: rows }, (_, index) => /* @__PURE__ */ jsxs("div", {
+			className: styles$1.row,
+			children: [
+				leading === "avatar" ? /* @__PURE__ */ jsx(Skeleton.Avatar, {
+					shape: "circle",
+					size: 24
+				}) : null,
+				leading === "icon" ? /* @__PURE__ */ jsx(Skeleton.Avatar, {
+					shape: "square",
+					size: 24
+				}) : null,
+				/* @__PURE__ */ jsx("div", {
+					className: styles$1.copy,
+					children: /* @__PURE__ */ jsx(Skeleton.Text, {
+						fontSize: 14,
+						rows: 2,
+						width: [...lineWidths[index % lineWidths.length]]
+					})
+				}),
+				/* @__PURE__ */ jsx(Skeleton, {
+					className: styles$1.tag,
+					style: bone
+				}),
+				/* @__PURE__ */ jsx(Skeleton, {
+					className: styles$1.cell,
+					style: bone
+				})
+			]
+		}, index))]
+	});
+}
+TableSkeleton.displayName = "TableSkeleton";
+function StatCardSkeleton() {
+	return /* @__PURE__ */ jsxs("div", {
+		"aria-hidden": true,
+		className: `${styles$1.stat} ${styles.card}`,
+		children: [
+			/* @__PURE__ */ jsx(Skeleton.Text, {
+				fontSize: 14,
+				width: 72
+			}),
+			/* @__PURE__ */ jsx(Skeleton, {
+				className: styles$1.statValue,
+				style: bone
+			}),
+			/* @__PURE__ */ jsx(Skeleton.Text, {
+				fontSize: 14,
+				width: "68%"
+			})
+		]
+	});
+}
+StatCardSkeleton.displayName = "StatCardSkeleton";
+function PageLoading({ header = true, label = "Loading", stats = 4 }) {
+	return /* @__PURE__ */ jsxs("div", {
+		"aria-busy": "true",
+		className: styles$1.page,
+		children: [
+			/* @__PURE__ */ jsx(LoadingAnnouncer, { label }),
+			header ? /* @__PURE__ */ jsx(PageHeaderSkeleton, {}) : null,
+			/* @__PURE__ */ jsx("section", {
+				"aria-hidden": true,
+				className: styles$1.statGrid,
+				children: Array.from({ length: stats }, (_, index) => /* @__PURE__ */ jsx(StatCardSkeleton, {}, index))
+			}),
+			/* @__PURE__ */ jsx(TableSkeleton, {})
+		]
+	});
+}
+PageLoading.displayName = "PageLoading";
+//#endregion
+export { LoadingAnnouncer, PageHeaderSkeleton, StatCardSkeleton, TableSkeleton, PageLoading as default };
+
+//# sourceMappingURL=PageSkeleton.mjs.map

package/es/dashboard/PageSkeleton/PageSkeleton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageSkeleton.mjs","names":["styles","surfaceStyles"],"sources":["../../../src/dashboard/PageSkeleton/PageSkeleton.tsx"],"sourcesContent":["'use client';\r\n\r\nimport Skeleton from '@/base-ui/Skeleton';\r\n\r\nimport { styles as surfaceStyles } from '../Surface/style';\r\nimport { styles } from './style';\r\nimport type {\r\n  LoadingAnnouncerProps,\r\n  PageHeaderSkeletonProps,\r\n  PageLoadingProps,\r\n  TableSkeletonProps,\r\n} from './type';\r\n\r\nconst bone = { height: undefined, width: undefined };\r\nconst lineWidths = [\r\n  ['68%', '36%'],\r\n  ['52%', '28%'],\r\n  ['76%', '42%'],\r\n  ['58%', '32%'],\r\n] as const;\r\n\r\nfunction LoadingAnnouncer({ label }: LoadingAnnouncerProps) {\r\n  return (\r\n    <output aria-live=\"polite\" className={styles.srOnly}>\r\n      {label}\r\n    </output>\r\n  );\r\n}\r\n\r\nLoadingAnnouncer.displayName = 'LoadingAnnouncer';\r\n\r\nfunction PageHeaderSkeleton({ action = true }: PageHeaderSkeletonProps) {\r\n  return (\r\n    <div aria-hidden className={styles.header}>\r\n      <div className={styles.headerCopy}>\r\n        <Skeleton className={styles.title} style={bone} />\r\n        <Skeleton.Text fontSize={14} width=\"46%\" />\r\n      </div>\r\n      {action ? <Skeleton className={styles.action} style={bone} /> : null}\r\n    </div>\r\n  );\r\n}\r\n\r\nPageHeaderSkeleton.displayName = 'PageHeaderSkeleton';\r\n\r\nfunction TableSkeleton({ framed = true, leading = 'text', rows = 6 }: TableSkeletonProps) {\r\n  const head = [96, 72, 64, 48];\r\n  return (\r\n    <div aria-hidden className={framed ? `${styles.table} ${surfaceStyles.card}` : styles.table}>\r\n      <div className={styles.thead}>\r\n        {head.map((width, index) => (\r\n          <Skeleton className={styles.theadCell} key={index} style={{ ...bone, width }} />\r\n        ))}\r\n      </div>\r\n      {Array.from({ length: rows }, (_, index) => (\r\n        <div className={styles.row} key={index}>\r\n          {leading === 'avatar' ? <Skeleton.Avatar shape=\"circle\" size={24} /> : null}\r\n          {leading === 'icon' ? <Skeleton.Avatar shape=\"square\" size={24} /> : null}\r\n          <div className={styles.copy}>\r\n            <Skeleton.Text\r\n              fontSize={14}\r\n              rows={2}\r\n              width={[...lineWidths[index % lineWidths.length]]}\r\n            />\r\n          </div>\r\n          <Skeleton className={styles.tag} style={bone} />\r\n          <Skeleton className={styles.cell} style={bone} />\r\n        </div>\r\n      ))}\r\n    </div>\r\n  );\r\n}\r\n\r\nTableSkeleton.displayName = 'TableSkeleton';\r\n\r\nfunction StatCardSkeleton() {\r\n  return (\r\n    <div aria-hidden className={`${styles.stat} ${surfaceStyles.card}`}>\r\n      <Skeleton.Text fontSize={14} width={72} />\r\n      <Skeleton className={styles.statValue} style={bone} />\r\n      <Skeleton.Text fontSize={14} width=\"68%\" />\r\n    </div>\r\n  );\r\n}\r\n\r\nStatCardSkeleton.displayName = 'StatCardSkeleton';\r\n\r\nfunction PageLoading({ header = true, label = 'Loading', stats = 4 }: PageLoadingProps) {\r\n  return (\r\n    <div aria-busy=\"true\" className={styles.page}>\r\n      <LoadingAnnouncer label={label} />\r\n      {header ? <PageHeaderSkeleton /> : null}\r\n      <section aria-hidden className={styles.statGrid}>\r\n        {Array.from({ length: stats }, (_, index) => (\r\n          <StatCardSkeleton key={index} />\r\n        ))}\r\n      </section>\r\n      <TableSkeleton />\r\n    </div>\r\n  );\r\n}\r\n\r\nPageLoading.displayName = 'PageLoading';\r\n\r\nexport { LoadingAnnouncer, PageHeaderSkeleton, StatCardSkeleton, TableSkeleton };\r\nexport default PageLoading;\r\n"],"mappings":"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"}