@lobehub/ui 5.57.2 → 6.0.0-beta.1

package/es/dashboard/FilterSidebar/style.mjs

@@ -1,154 +1,139 @@
-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%;
-    }
-  `
-}));
+const styles = {
+	body: {
+		kg3NbH: "lbaope02",
+		kskxy: "lb2z3yb8",
+		kGO01o: "lb1l90r2v",
+		kORKVm: "lb1odjw0f",
+		$$css: true
+	},
+	bodyFlush: {
+		kUk6DE: "lb98rzlu",
+		kskxy: "lb7ab17h",
+		kAzted: "lb2lwn1j",
+		$$css: true
+	},
+	content: {
+		kUk6DE: "lb98rzlu",
+		kOIVth: "lbou54vl",
+		kVQacm: "lb1s54mqq",
+		k1xSpc: "lb78zum5",
+		kXwgrk: "lbdt5ytf",
+		k7Eaqz: "lbeuugli",
+		kZCmMZ: "lb106a9eq lbzvo47g",
+		$$css: true
+	},
+	contentFlush: {
+		k8WAf4: "lbr9q8rw",
+		kwRFfy: "lb64bnmy",
+		kZCmMZ: "lb13jy36j",
+		kORKVm: "lb1odjw0f",
+		$$css: true
+	},
+	contentSplit: {
+		kGO01o: "lb18d9i69",
+		kLKAdn: "lbyamay9",
+		kwRFfy: "lbv54qhq",
+		kZCmMZ: "lbf7dkkf",
+		$$css: true
+	},
+	count: {
+		kUk6DE: "lb1okw0bk",
+		kMwMTN: "lb53gy9q",
+		kGuDYH: "lbxobqjj",
+		kcqcaj: "lbss6m8b",
+		$$css: true
+	},
+	drawerPanel: {
+		kOIVth: "lb167g77z",
+		k1xSpc: "lb78zum5",
+		kXwgrk: "lbdt5ytf",
+		$$css: true
+	},
+	head: {
+		kmVPX3: "lbc7ga6q",
+		kUk6DE: "lb1okw0bk",
+		kOIVth: "lb167g77z",
+		k1xSpc: "lb78zum5",
+		kXwgrk: "lbdt5ytf",
+		$$css: true
+	},
+	layout: {
+		kOIVth: "lb2f0dpi",
+		k1xSpc: "lb78zum5",
+		kXwgrk: "lb10tjgcu",
+		$$css: true
+	},
+	layoutFlush: {
+		kUk6DE: "lb98rzlu",
+		kAzted: "lb2lwn1j",
+		$$css: true
+	},
+	layoutSplit: {
+		kVQacm: "lbb3r6kr",
+		kGNEyG: "lb1qjc9v5",
+		$$css: true
+	},
+	name: {
+		kUk6DE: "lb98rzlu",
+		kVQacm: "lbb3r6kr",
+		k7Eaqz: "lbeuugli",
+		k9WMMc: "lb1yc453h",
+		kg5iWk: "lblyipyv",
+		khDVqt: "lbuxw1ft",
+		$$css: true
+	},
+	option: {
+		kVVagm: "lbln7xf2",
+		kVAM5u: "lb181nr7w",
+		kaIpWk: "lb1sbi92r",
+		ksu8eU: "lbng3xce",
+		kMzoRj: "lbfn42iu",
+		kOIVth: "lb17d4w8g",
+		kg3NbH: "lbdqyycr",
+		kGNEyG: "lb6s0dn4",
+		kWkggS: "lbjbqb8w lbgvpk99 lb1pribh5",
+		kMwMTN: "lb66ogz0",
+		kkrTdU: "lb1ypdohk",
+		k1xSpc: "lb78zum5",
+		k63SB2: "lba9ewkg",
+		kzqmXN: "lbh8yej3",
+		kAzted: "lbu0aao5",
+		$$css: true
+	},
+	panel: {
+		kVQacm: "lbb3r6kr",
+		kBCPoo: "lb17bfco5",
+		k8ry5P: "lb18b5jzi",
+		ke9TFa: "lb1lun4ml",
+		k1xSpc: "lb78zum5",
+		kXwgrk: "lbdt5ytf",
+		kAzted: "lb2lwn1j",
+		$$css: true
+	},
+	panelSplit: {
+		kZKoxP: "lb5yr21d",
+		kBCPoo: "lb1aht071",
+		$$css: true
+	},
+	row: {
+		kUk6DE: "lb98rzlu",
+		kOIVth: "lb17d4w8g",
+		kGNEyG: "lb6s0dn4",
+		k1xSpc: "lb78zum5",
+		k7Eaqz: "lbeuugli",
+		$$css: true
+	},
+	sidebar: {
+		kSGwAc: "lbkh2ocl",
+		kAzted: "lb2lwn1j",
+		$$css: true
+	},
+	sidebarFlush: {
+		kZKoxP: "lb5yr21d",
+		$$css: true
+	}
+};
 //#endregion
 export { styles };
 

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

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/FilterSidebar/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n  body: css`\n    overflow-y: auto;\n    max-block-size: 360px;\n    padding-block-end: 16px;\n    padding-inline: 12px;\n\n    &[data-flush='true'] {\n      flex: 1;\n      min-block-size: 0;\n      max-block-size: none;\n    }\n  `,\n  content: css`\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    gap: 16px;\n\n    min-inline-size: 0;\n    padding-inline-start: 20px;\n\n    &[data-flush='true'] {\n      overflow-y: auto;\n      padding: 24px;\n    }\n\n    [data-split-card='true'] & {\n      padding-block: 16px 0;\n      padding-inline: 16px;\n\n      > :last-child {\n        margin-inline: -16px;\n      }\n    }\n\n    ${responsive.laptop} {\n      overflow: visible;\n      padding: 0;\n\n      > :last-child {\n        margin-inline: 0;\n      }\n    }\n  `,\n  count: css`\n    flex: none;\n    font-size: ${cssVar.fontSizeSM};\n    font-variant-numeric: tabular-nums;\n    color: ${cssVar.colorTextTertiary};\n  `,\n  drawerPanel: css`\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n  `,\n  head: css`\n    display: flex;\n    flex: none;\n    flex-direction: column;\n    gap: 8px;\n\n    padding: 12px;\n  `,\n  layout: css`\n    display: flex;\n\n    &[data-flush='true'] {\n      flex: 1;\n      min-block-size: 0;\n    }\n\n    &[data-split-card='true'] {\n      overflow: hidden;\n      align-items: stretch;\n    }\n\n    ${responsive.laptop} {\n      flex-direction: column;\n      gap: 12px;\n    }\n  `,\n  name: css`\n    overflow: hidden;\n    flex: 1;\n\n    min-inline-size: 0;\n\n    text-align: start;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  `,\n  option: css`\n    cursor: pointer;\n\n    display: flex;\n    gap: 6px;\n    align-items: center;\n\n    inline-size: 100%;\n    min-block-size: 36px;\n    padding-inline: 8px;\n    border: none;\n    border-radius: ${cssVar.borderRadius};\n\n    font: inherit;\n    color: ${cssVar.colorText};\n\n    background: none;\n\n    &:hover {\n      background: ${cssVar.colorFillTertiary};\n    }\n\n    &[aria-pressed='true'] {\n      font-weight: 500;\n      background: ${cssVar.controlItemBgActive};\n    }\n  `,\n  row: css`\n    display: flex;\n    flex: 1;\n    gap: 6px;\n    align-items: center;\n\n    min-inline-size: 0;\n  `,\n  panel: css`\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n\n    min-block-size: 0;\n    border-inline-end: 1px solid ${cssVar.colorBorderSecondary};\n\n    [data-split-card='true'] & {\n      block-size: 100%;\n      border-inline-end-color: ${cssVar.colorBorder};\n    }\n  `,\n  sidebar: css`\n    align-self: stretch;\n    min-block-size: 0;\n\n    &[data-flush='true'] {\n      block-size: 100%;\n    }\n  `,\n}));\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"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/FilterSidebar/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\nimport { media } from '@/styles/stylex/media.stylex';\n\nconst pressed = ':is([aria-pressed=\"true\"])';\n\nexport const styles = stylex.create({\n  body: {\n    paddingInline: 12,\n    maxBlockSize: 360,\n    paddingBlockEnd: 16,\n    overflowY: 'auto',\n  },\n  bodyFlush: {\n    flex: '1',\n    maxBlockSize: 'none',\n    minBlockSize: 0,\n  },\n  content: {\n    flex: '1',\n    gap: 16,\n    overflow: { default: null, [media.laptop]: 'visible' },\n    display: 'flex',\n    flexDirection: 'column',\n    minInlineSize: 0,\n    paddingInlineStart: { default: 20, [media.laptop]: 0 },\n  },\n  contentFlush: {\n    paddingBlock: 24,\n    paddingInlineEnd: 24,\n    paddingInlineStart: 24,\n    overflowY: 'auto',\n  },\n  contentSplit: {\n    paddingBlockEnd: '0',\n    paddingBlockStart: '16px',\n    paddingInlineEnd: 16,\n    paddingInlineStart: 16,\n  },\n  count: {\n    flex: 'none',\n    color: cssVar.colorTextTertiary,\n    fontSize: cssVar.fontSizeSM,\n    fontVariantNumeric: 'tabular-nums',\n  },\n  drawerPanel: {\n    gap: 8,\n    display: 'flex',\n    flexDirection: 'column',\n  },\n  head: {\n    padding: 12,\n    flex: 'none',\n    gap: 8,\n    display: 'flex',\n    flexDirection: 'column',\n  },\n  layout: {\n    gap: { default: null, [media.laptop]: 12 },\n    display: 'flex',\n    flexDirection: { default: null, [media.laptop]: 'column' },\n  },\n  layoutFlush: {\n    flex: '1',\n    minBlockSize: 0,\n  },\n  layoutSplit: {\n    overflow: 'hidden',\n    alignItems: 'stretch',\n  },\n  name: {\n    flex: '1',\n    overflow: 'hidden',\n    minInlineSize: 0,\n    textAlign: 'start',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  },\n  option: {\n    font: 'inherit',\n    borderColor: 'currentcolor',\n    borderRadius: cssVar.borderRadius,\n    borderStyle: 'none',\n    borderWidth: 'medium',\n    gap: 6,\n    paddingInline: 8,\n    alignItems: 'center',\n    backgroundColor: {\n      'default': 'transparent',\n      [pressed]: cssVar.controlItemBgActive,\n      ':hover:not([aria-pressed=\"true\"])': cssVar.colorFillTertiary,\n    },\n    color: cssVar.colorText,\n    cursor: 'pointer',\n    display: 'flex',\n    fontWeight: { default: null, [pressed]: 500 },\n    inlineSize: '100%',\n    minBlockSize: 36,\n  },\n  panel: {\n    overflow: 'hidden',\n    borderInlineEndColor: cssVar.colorBorderSecondary,\n    borderInlineEndStyle: 'solid',\n    borderInlineEndWidth: 1,\n    display: 'flex',\n    flexDirection: 'column',\n    minBlockSize: 0,\n  },\n  panelSplit: {\n    blockSize: '100%',\n    borderInlineEndColor: cssVar.colorBorder,\n  },\n  row: {\n    flex: '1',\n    gap: 6,\n    alignItems: 'center',\n    display: 'flex',\n    minInlineSize: 0,\n  },\n  sidebar: {\n    alignSelf: 'stretch',\n    minBlockSize: 0,\n  },\n  sidebarFlush: {\n    blockSize: '100%',\n  },\n});\n"],"mappings":";AAMA,MAAa,SAAS;CACpB,MAAM;EACJ,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,WAAW;EACT,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,cAAc;EACZ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,cAAc;EACZ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,aAAa;EACX,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,QAAQ;EACN,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,aAAa;EACX,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,aAAa;EACX,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,QAAQ;EACN,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,YAAY;EACV,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,KAAK;EACH,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,cAAc;EACZ,QAAQ;EACR,OAAO;CACT;AACF"}

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

@@ -1,6 +1,6 @@
 import { ReactNode } from "react";
 //#region src/dashboard/FilterSidebar/type.d.ts
-interface FilterSidebarProps {
+export interface FilterSidebarProps {
   /** Scrolling choices. `dismiss` closes the compact drawer. */
   body: (dismiss: () => void) => ReactNode;
   children: ReactNode;
@@ -25,11 +25,11 @@ interface FilterSidebarProps {
   /** Wider rail. Default width is 264px; wide is 300px. */
   wide?: boolean;
 }
-interface FilterRowProps {
+export interface FilterRowProps {
   count?: ReactNode;
   name: ReactNode;
 }
-interface FilterOptionProps {
+export interface FilterOptionProps {
   count?: ReactNode;
   icon?: ReactNode;
   /** Overrides the accessible name when the visible one lacks context. */
@@ -40,5 +40,4 @@ interface FilterOptionProps {
   title?: string;
 }
 //#endregion
-export { FilterOptionProps, FilterRowProps, FilterSidebarProps };
 //# sourceMappingURL=type.d.mts.map

package/es/dashboard/PageHeader/PageHeader.mjs

@@ -1,13 +1,26 @@
 "use client";
+import { styleProps } from "../../styles/stylex/props.mjs";
+import { cssVar } from "../../styles/stylex/cssVar.stylex.mjs";
 import FlexBasic_default from "../../Flex/FlexBasic.mjs";
-import Text from "../../base-ui/Text/Text.mjs";
+import Text from "../../Text/Text.mjs";
 import { styles } from "./style.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
+import * as stylex from "@stylexjs/stylex";
 //#region src/dashboard/PageHeader/PageHeader.tsx
+const titleStyle = {
+	fontSize: cssVar.fontSizeHeading3,
+	lineHeight: cssVar.lineHeightHeading3,
+	margin: 0
+};
+const descriptionStyle = {
+	color: cssVar.colorTextSecondary,
+	lineHeight: 1.6,
+	maxInlineSize: "68ch"
+};
 function PageHeader({ action, children, description, mark, title }) {
 	const extra = action ?? children;
 	return /* @__PURE__ */ jsxs("div", {
-		className: styles.root,
+		...stylex.props(styles.root),
 		children: [/* @__PURE__ */ jsxs(FlexBasic_default, {
 			align: mark ? "flex-start" : void 0,
 			gap: 12,
@@ -16,16 +29,16 @@ function PageHeader({ action, children, description, mark, title }) {
 				gap: 8,
 				children: [/* @__PURE__ */ jsx(Text, {
 					as: "h1",
-					className: styles.title,
+					style: titleStyle,
 					weight: "bold",
 					children: title
 				}), description ? /* @__PURE__ */ jsx(Text, {
-					className: styles.description,
+					style: descriptionStyle,
 					children: description
 				}) : null]
 			})]
 		}), extra ? /* @__PURE__ */ jsx("div", {
-			className: styles.actions,
+			...styleProps(styles.actions, "lobe-page-header-actions"),
 			children: extra
 		}) : null]
 	});

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

@@ -1 +1 @@
-{"version":3,"file":"PageHeader.mjs","names":["Flexbox"],"sources":["../../../src/dashboard/PageHeader/PageHeader.tsx"],"sourcesContent":["'use client';\n\nimport Text from '@/base-ui/Text';\nimport { Flexbox } from '@/Flex';\n\nimport { styles } from './style';\nimport type { PageHeaderProps } from './type';\n\nfunction PageHeader({ action, children, description, mark, title }: PageHeaderProps) {\n  const extra = action ?? children;\n  return (\n    <div className={styles.root}>\n      <Flexbox align={mark ? 'flex-start' : undefined} gap={12} horizontal={Boolean(mark)}>\n        {mark}\n        <Flexbox gap={8}>\n          <Text as=\"h1\" className={styles.title} weight=\"bold\">\n            {title}\n          </Text>\n          {description ? <Text className={styles.description}>{description}</Text> : null}\n        </Flexbox>\n      </Flexbox>\n      {extra ? <div className={styles.actions}>{extra}</div> : null}\n    </div>\n  );\n}\n\nPageHeader.displayName = 'PageHeader';\n\nexport default PageHeader;\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"}
+{"version":3,"file":"PageHeader.mjs","names":["Flexbox"],"sources":["../../../src/dashboard/PageHeader/PageHeader.tsx"],"sourcesContent":["'use client';\n\nimport './style.css';\n\nimport * as stylex from '@stylexjs/stylex';\n\nimport { Flexbox } from '@/Flex';\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\nimport { styleProps } from '@/styles/stylex/props';\nimport Text from '@/Text';\n\nimport { styles } from './style';\nimport type { PageHeaderProps } from './type';\n\nconst titleStyle = {\n  fontSize: cssVar.fontSizeHeading3,\n  lineHeight: cssVar.lineHeightHeading3,\n  margin: 0,\n};\nconst descriptionStyle = {\n  color: cssVar.colorTextSecondary,\n  lineHeight: 1.6,\n  maxInlineSize: '68ch',\n};\n\nfunction PageHeader({ action, children, description, mark, title }: PageHeaderProps) {\n  const extra = action ?? children;\n  return (\n    <div {...stylex.props(styles.root)}>\n      <Flexbox align={mark ? 'flex-start' : undefined} gap={12} horizontal={Boolean(mark)}>\n        {mark}\n        <Flexbox gap={8}>\n          <Text as=\"h1\" style={titleStyle} weight=\"bold\">\n            {title}\n          </Text>\n          {description ? <Text style={descriptionStyle}>{description}</Text> : null}\n        </Flexbox>\n      </Flexbox>\n      {extra ? (\n        <div {...styleProps(styles.actions, 'lobe-page-header-actions')}>{extra}</div>\n      ) : null}\n    </div>\n  );\n}\n\nPageHeader.displayName = 'PageHeader';\n\nexport default PageHeader;\n"],"mappings":";;;;;;;;;AAUA,MAAM,aAAa;CACjB,UAAU,OAAO;CACjB,YAAY,OAAO;CACnB,QAAQ;AACV;AACA,MAAM,mBAAmB;CACvB,OAAO,OAAO;CACd,YAAY;CACZ,eAAe;AACjB;AACA,SAAS,WAAW,EAClB,QACA,UACA,aACA,MACA,SACkB;CAClB,MAAM,QAAQ,UAAU;CACxB,OAAO,qBAAC,OAAD;EAAK,GAAI,OAAO,MAAM,OAAO,IAAI;EAAjC,UAAA,CACH,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,OAAO;KAAY,QAAO;KACrC,UAAA;IACG,CAAA,GACL,cAAc,oBAAC,MAAD;KAAM,OAAO;KAAmB,UAAA;IAAkB,CAAA,IAAI,IAC9D;GACF,CAAA,CAAA;EACR,CAAA,GAAA,QAAQ,oBAAC,OAAD;GAAK,GAAI,WAAW,OAAO,SAAS,0BAA0B;GAAI,UAAA;EAAW,CAAA,IAAI,IACvF;;AACT;AACA,WAAW,cAAc"}

package/es/dashboard/PageHeader/style.mjs

@@ -1,46 +1,24 @@
-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};
-  `
-}));
+const styles = {
+	actions: {
+		kUk6DE: "lb1okw0bk",
+		kOIVth: "lb167g77z",
+		kGNEyG: "lb6s0dn4",
+		k1xSpc: "lb78zum5",
+		kzqmXN: "lbc4a2h3",
+		$$css: true
+	},
+	root: {
+		kOIVth: "lbou54vl",
+		kGNEyG: "lb1cy8zhl lb1p67ayb",
+		k1xSpc: "lb78zum5",
+		kXwgrk: "lbrhvytc",
+		kzqmXN: "lbh8yej3",
+		kjj79g: "lb1qughib",
+		k7Eaqz: "lbeuugli",
+		$$css: true
+	}
+};
 //#endregion
 export { styles };
 

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

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/PageHeader/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n  actions: css`\n    display: flex;\n    flex: none;\n    gap: 8px;\n    align-items: center;\n\n    ${responsive.mobile} {\n      inline-size: 100%;\n\n      button,\n      a {\n        min-block-size: 44px;\n      }\n    }\n  `,\n  description: css`\n    max-inline-size: 68ch;\n    line-height: 1.6;\n    color: ${cssVar.colorTextSecondary};\n  `,\n  root: css`\n    display: flex;\n    gap: 16px;\n    align-items: flex-start;\n    justify-content: space-between;\n\n    inline-size: 100%;\n    min-inline-size: 0;\n\n    ${responsive.mobile} {\n      flex-direction: column;\n      align-items: stretch;\n    }\n  `,\n  title: css`\n    margin: 0;\n    font-size: ${cssVar.fontSizeHeading3};\n    line-height: ${cssVar.lineHeightHeading3};\n  `,\n}));\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"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/PageHeader/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nimport { media } from '@/styles/stylex/media.stylex';\n\nexport const styles = stylex.create({\n  actions: {\n    flex: 'none',\n    gap: 8,\n    alignItems: 'center',\n    display: 'flex',\n    inlineSize: { default: null, [media.mobile]: '100%' },\n  },\n  root: {\n    gap: 16,\n    alignItems: { default: 'flex-start', [media.mobile]: 'stretch' },\n    display: 'flex',\n    flexDirection: { default: null, [media.mobile]: 'column' },\n    inlineSize: '100%',\n    justifyContent: 'space-between',\n    minInlineSize: 0,\n  },\n});\n"],"mappings":";AAGA,MAAa,SAAS;CACpB,SAAS;EACP,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;AACF"}

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

@@ -1,6 +1,6 @@
 import { ReactNode } from "react";
 //#region src/dashboard/PageHeader/type.d.ts
-interface PageHeaderProps {
+export interface PageHeaderProps {
   /** Actions at the end of the header. Falls back to `children`. */
   action?: ReactNode;
   children?: ReactNode;
@@ -10,5 +10,4 @@ interface PageHeaderProps {
   title: ReactNode;
 }
 //#endregion
-export { PageHeaderProps };
 //# sourceMappingURL=type.d.mts.map