@lobehub/ui 5.57.3 → 6.0.0-beta.1

package/es/chat/ChatItem/style.mjs

@@ -1,324 +1,117 @@
-import { createStaticStyles, responsive } from "antd-style";
 //#region src/chat/ChatItem/style.ts
-const styles = createStaticStyles(({ css, cssVar }) => {
-	const blockStylish = css`
-    padding-block: 8px;
-    padding-inline: 12px;
-    border: 1px solid color-mix(in srgb, ${cssVar.colorBorderSecondary} 66%, transparent);
-    border-radius: ${cssVar.borderRadiusLG};
-
-    background-color: ${cssVar.colorBgContainer};
-  `;
-	const rawStylishWithTitle = css`
-    padding-block-start: 0;
-  `;
-	const rawStylishWithoutTitle = css`
-    padding-block-start: 6px;
-  `;
-	const rawContainerStylish = css`
-    margin-block-end: -16px;
-    transition: background-color 100ms ${cssVar.motionEaseOut};
-  `;
-	const editingStylish = css`
-    width: 100%;
-  `;
-	return {
-		actionsBubbleLeft: css`
-      flex: none;
-      align-self: flex-end;
-      justify-content: flex-end;
-    `,
-		actionsBubbleRight: css`
-      flex: none;
-      align-self: flex-end;
-      justify-content: flex-start;
-    `,
-		actionsDocsLeft: css`
-      flex: none;
-      align-self: flex-start;
-      justify-content: flex-end;
-    `,
-		actionsDocsRight: css`
-      flex: none;
-      align-self: flex-end;
-      justify-content: flex-start;
-    `,
-		actionsEditing: css`
-      pointer-events: none !important;
-      opacity: 0 !important;
-    `,
-		avatarContainer: css`
-      position: relative;
-      flex: none;
-      width: var(--chat-item-avatar-size, 40px);
-      height: var(--chat-item-avatar-size, 40px);
-    `,
-		avatarGroupContainer: css`
-      width: var(--chat-item-avatar-size, 40px);
-    `,
-		container: css`
-      position: relative;
-
-      width: 100%;
-      max-width: 100vw;
-      padding-block: 24px 12px;
-      padding-inline: 12px;
-
-      time {
-        display: inline-block;
-        white-space: nowrap;
-      }
-
-      div[role='menubar'] {
-        display: flex;
-      }
-
-      time,
-      div[role='menubar'] {
-        pointer-events: none;
-        opacity: 0;
-        transition: opacity 200ms ${cssVar.motionEaseOut};
-      }
-
-      &:hover {
-        time,
-        div[role='menubar'] {
-          pointer-events: unset;
-          opacity: 1;
-        }
-      }
-
-      div[role='menubar']:has([data-popup-open]),
-      div[role='menubar'][data-popup-open] {
-        pointer-events: unset !important;
-        opacity: 1 !important;
-
-        [data-popup-open] {
-          background: ${cssVar.colorFillTertiary};
-        }
-      }
-
-      ${responsive.sm} {
-        padding-block-start: 12px;
-        padding-inline: 8px;
-      }
-    `,
-		containerDocs: css`
-      ${rawContainerStylish}
-      position: relative;
-
-      width: 100%;
-      max-width: 100vw;
-      padding-block: 24px 12px;
-      padding-inline: 12px;
-
-      time {
-        display: inline-block;
-        white-space: nowrap;
-      }
-
-      div[role='menubar'] {
-        display: flex;
-      }
-
-      time,
-      div[role='menubar'] {
-        pointer-events: none;
-        opacity: 0;
-        transition: opacity 200ms ${cssVar.motionEaseOut};
-      }
-
-      &:hover {
-        time,
-        div[role='menubar'] {
-          pointer-events: unset;
-          opacity: 1;
-        }
-      }
-
-      div[role='menubar']:has(.lobe-dropdown-menu-trigger[data-popup-open]) {
-        pointer-events: unset;
-        opacity: 1;
-      }
-
-      ${responsive.sm} {
-        padding-block-start: 16px;
-        padding-inline: 8px;
-      }
-    `,
-		editingContainer: css`
-      ${editingStylish}
-      padding-block: 8px 12px;
-      padding-inline: 12px;
-      border: 1px solid ${cssVar.colorBorderSecondary};
-
-      &:active,
-      &:hover {
-        border-color: ${cssVar.colorBorder};
-      }
-    `,
-		editingContainerDocs: css`
-      ${editingStylish}
-      padding-block: 8px 12px;
-      padding-inline: 12px;
-      border: 1px solid ${cssVar.colorBorderSecondary};
-      border-radius: ${cssVar.borderRadius};
-
-      background: ${cssVar.colorFillQuaternary};
-
-      &:active,
-      &:hover {
-        border-color: ${cssVar.colorBorder};
-      }
-    `,
-		editingInput: css`
-      width: 100%;
-    `,
-		errorContainer: css`
-      position: relative;
-      overflow: hidden;
-      width: 100%;
-    `,
-		loadingLeft: css`
-      position: absolute;
-      inset-block-end: 0;
-      inset-inline-start: -4px;
-
-      width: 16px;
-      height: 16px;
-      border-radius: 50%;
-
-      color: ${cssVar.colorBgLayout};
-
-      background: ${cssVar.colorPrimary};
-    `,
-		loadingRight: css`
-      position: absolute;
-      inset-block-end: 0;
-      inset-inline-end: -4px;
-
-      width: 16px;
-      height: 16px;
-      border-radius: 50%;
-
-      color: ${cssVar.colorBgLayout};
-
-      background: ${cssVar.colorPrimary};
-    `,
-		messageBubble: css`
-      ${blockStylish}
-      position: relative;
-      overflow: hidden;
-      max-width: 100%;
-
-      ${responsive.sm} {
-        width: 100%;
-      }
-    `,
-		messageContainer: css`
-      position: relative;
-      overflow: hidden;
-      max-width: 100%;
-
-      ${responsive.sm} {
-        overflow-x: auto;
-      }
-    `,
-		messageContainerEditing: css`
-      ${editingStylish}
-      position: relative;
-      overflow: hidden;
-      max-width: 100%;
-
-      ${responsive.sm} {
-        overflow-x: auto;
-      }
-    `,
-		messageContainerEditingWithTime: css`
-      ${editingStylish}
-      position: relative;
-      overflow: hidden;
-      max-width: 100%;
-      margin-block-start: -16px;
-
-      ${responsive.sm} {
-        overflow-x: auto;
-      }
-    `,
-		messageContainerWithTime: css`
-      position: relative;
-      overflow: hidden;
-      max-width: 100%;
-      margin-block-start: -16px;
-
-      ${responsive.sm} {
-        overflow-x: auto;
-      }
-    `,
-		messageContent: css`
-      position: relative;
-      overflow: hidden;
-      max-width: 100%;
-
-      ${responsive.sm} {
-        flex-direction: column !important;
-      }
-    `,
-		messageContentEditing: css`
-      ${editingStylish}
-      position: relative;
-      overflow: hidden;
-      max-width: 100%;
-
-      ${responsive.sm} {
-        flex-direction: column !important;
-      }
-    `,
-		messageDocsWithTitle: css`
-      ${rawStylishWithTitle}
-      position: relative;
-      overflow: hidden;
-      max-width: 100%;
-
-      ${responsive.sm} {
-        width: 100%;
-      }
-    `,
-		messageDocsWithoutTitle: css`
-      ${rawStylishWithoutTitle}
-      position: relative;
-      overflow: hidden;
-      max-width: 100%;
-
-      ${responsive.sm} {
-        width: 100%;
-      }
-    `,
-		messageExtra: css`
-      /* message-extra class */
-    `,
-		nameLeft: css`
-      pointer-events: none;
-
-      margin-block-end: 6px;
-
-      font-size: 12px;
-      line-height: 1;
-      color: ${cssVar.colorTextDescription};
-      text-align: start;
-    `,
-		nameRight: css`
-      pointer-events: none;
-
-      margin-block-end: 6px;
-
-      font-size: 12px;
-      line-height: 1;
-      color: ${cssVar.colorTextDescription};
-      text-align: end;
-    `
-	};
-});
+const styles = {
+	actionsBottom: {
+		kSGwAc: "lbpvyfi4",
+		$$css: true
+	},
+	actionsTop: {
+		kSGwAc: "lbqcrz7y",
+		$$css: true
+	},
+	avatarContainer: {
+		kUk6DE: "lb1okw0bk",
+		kVAEAm: "lb1n2onr6",
+		kZKoxP: "lbxdx1yr",
+		kzqmXN: "lbrrbwm",
+		$$css: true
+	},
+	container: {
+		kg3NbH: "lbaope02 lb13w2y4a",
+		kGO01o: "lbsag5q8",
+		kLKAdn: "lb1p5oq8j lbikjck6",
+		kVAEAm: "lb1n2onr6",
+		ks0D6T: "lb16xn7b0",
+		$$css: true
+	},
+	containerDocs: {
+		kmkexE: "lbjy6m49",
+		k1K539: "lb1oo3vh0",
+		kLKAdn: "lb1p5oq8j lb1maa3oc",
+		$$css: true
+	},
+	editingInput: {
+		kzqmXN: "lbh8yej3",
+		$$css: true
+	},
+	editingContainer: {
+		kVAM5u: "lb10cypdb lb3mg3nv lb2l9g25",
+		ksu8eU: "lb1y0btm7",
+		kMzoRj: "lbmkeg23",
+		$$css: true
+	},
+	editingContainerDocs: {
+		kaIpWk: "lb1sbi92r",
+		kWkggS: "lb91pywm",
+		$$css: true
+	},
+	errorContainer: {
+		kVQacm: "lbb3r6kr",
+		kVAEAm: "lb1n2onr6",
+		$$css: true
+	},
+	loading: {
+		kaIpWk: "lb16rqkct",
+		kWkggS: "lb1hsafae",
+		kMwMTN: "lb15g0kca",
+		krVfgx: "lb1ey2m1c",
+		kVAEAm: "lb10l6tqk",
+		$$css: true
+	},
+	loadingLeft: {
+		kLqNvP: "lbl3v32j",
+		$$css: true
+	},
+	loadingRight: {
+		kt4wiu: "lbqwxbl3",
+		$$css: true
+	},
+	messageContent: {
+		kXwgrk: "lbanpzrq",
+		$$css: true
+	},
+	narrowFullWidth: {
+		kzqmXN: "lb17b7nro",
+		$$css: true
+	},
+	messageBubble: {
+		kVAM5u: "lb93mhwi",
+		kaIpWk: "lb1ndkxwp",
+		ksu8eU: "lb1y0btm7",
+		kMzoRj: "lbmkeg23",
+		kWkggS: "lb6yijhg",
+		$$css: true
+	},
+	messageBox: {
+		kVQacm: "lbb3r6kr",
+		kVAEAm: "lb1n2onr6",
+		ks0D6T: "lb193iq5w",
+		$$css: true
+	},
+	messageContainer: {
+		kXHlph: "lbrbat52",
+		$$css: true
+	},
+	name: {
+		kMwMTN: "lb19ppog9",
+		kGuDYH: "lbfifm61",
+		kLWn49: "lbo5v014",
+		k1K539: "lbzueoph",
+		kfzvcC: "lb47corl",
+		$$css: true
+	},
+	nameLeft: {
+		k9WMMc: "lb1yc453h",
+		$$css: true
+	},
+	nameRight: {
+		k9WMMc: "lbp4054r",
+		$$css: true
+	},
+	withTime: {
+		keoZOQ: "lbwya9rg",
+		$$css: true
+	}
+};
 //#endregion
 export { styles };
 

package/es/chat/ChatItem/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/chat/ChatItem/style.ts"],"sourcesContent":["import { createStaticStyles, responsive } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => {\n  const blockStylish = css`\n    padding-block: 8px;\n    padding-inline: 12px;\n    border: 1px solid color-mix(in srgb, ${cssVar.colorBorderSecondary} 66%, transparent);\n    border-radius: ${cssVar.borderRadiusLG};\n\n    background-color: ${cssVar.colorBgContainer};\n  `;\n\n  const rawStylishWithTitle = css`\n    padding-block-start: 0;\n  `;\n\n  const rawStylishWithoutTitle = css`\n    padding-block-start: 6px;\n  `;\n\n  const rawContainerStylish = css`\n    margin-block-end: -16px;\n    transition: background-color 100ms ${cssVar.motionEaseOut};\n  `;\n\n  const editingStylish = css`\n    width: 100%;\n  `;\n\n  return {\n    // Actions styles - placement + variant + editing combinations\n    actionsBubbleLeft: css`\n      flex: none;\n      align-self: flex-end;\n      justify-content: flex-end;\n    `,\n    actionsBubbleRight: css`\n      flex: none;\n      align-self: flex-end;\n      justify-content: flex-start;\n    `,\n    actionsDocsLeft: css`\n      flex: none;\n      align-self: flex-start;\n      justify-content: flex-end;\n    `,\n    actionsDocsRight: css`\n      flex: none;\n      align-self: flex-end;\n      justify-content: flex-start;\n    `,\n    actionsEditing: css`\n      pointer-events: none !important;\n      opacity: 0 !important;\n    `,\n\n    avatarContainer: css`\n      position: relative;\n      flex: none;\n      width: var(--chat-item-avatar-size, 40px);\n      height: var(--chat-item-avatar-size, 40px);\n    `,\n    avatarGroupContainer: css`\n      width: var(--chat-item-avatar-size, 40px);\n    `,\n    container: css`\n      position: relative;\n\n      width: 100%;\n      max-width: 100vw;\n      padding-block: 24px 12px;\n      padding-inline: 12px;\n\n      time {\n        display: inline-block;\n        white-space: nowrap;\n      }\n\n      div[role='menubar'] {\n        display: flex;\n      }\n\n      time,\n      div[role='menubar'] {\n        pointer-events: none;\n        opacity: 0;\n        transition: opacity 200ms ${cssVar.motionEaseOut};\n      }\n\n      &:hover {\n        time,\n        div[role='menubar'] {\n          pointer-events: unset;\n          opacity: 1;\n        }\n      }\n\n      div[role='menubar']:has([data-popup-open]),\n      div[role='menubar'][data-popup-open] {\n        pointer-events: unset !important;\n        opacity: 1 !important;\n\n        [data-popup-open] {\n          background: ${cssVar.colorFillTertiary};\n        }\n      }\n\n      ${responsive.sm} {\n        padding-block-start: 12px;\n        padding-inline: 8px;\n      }\n    `,\n\n    containerDocs: css`\n      ${rawContainerStylish}\n      position: relative;\n\n      width: 100%;\n      max-width: 100vw;\n      padding-block: 24px 12px;\n      padding-inline: 12px;\n\n      time {\n        display: inline-block;\n        white-space: nowrap;\n      }\n\n      div[role='menubar'] {\n        display: flex;\n      }\n\n      time,\n      div[role='menubar'] {\n        pointer-events: none;\n        opacity: 0;\n        transition: opacity 200ms ${cssVar.motionEaseOut};\n      }\n\n      &:hover {\n        time,\n        div[role='menubar'] {\n          pointer-events: unset;\n          opacity: 1;\n        }\n      }\n\n      div[role='menubar']:has(.lobe-dropdown-menu-trigger[data-popup-open]) {\n        pointer-events: unset;\n        opacity: 1;\n      }\n\n      ${responsive.sm} {\n        padding-block-start: 16px;\n        padding-inline: 8px;\n      }\n    `,\n    editingContainer: css`\n      ${editingStylish}\n      padding-block: 8px 12px;\n      padding-inline: 12px;\n      border: 1px solid ${cssVar.colorBorderSecondary};\n\n      &:active,\n      &:hover {\n        border-color: ${cssVar.colorBorder};\n      }\n    `,\n\n    editingContainerDocs: css`\n      ${editingStylish}\n      padding-block: 8px 12px;\n      padding-inline: 12px;\n      border: 1px solid ${cssVar.colorBorderSecondary};\n      border-radius: ${cssVar.borderRadius};\n\n      background: ${cssVar.colorFillQuaternary};\n\n      &:active,\n      &:hover {\n        border-color: ${cssVar.colorBorder};\n      }\n    `,\n\n    editingInput: css`\n      width: 100%;\n    `,\n\n    errorContainer: css`\n      position: relative;\n      overflow: hidden;\n      width: 100%;\n    `,\n\n    loadingLeft: css`\n      position: absolute;\n      inset-block-end: 0;\n      inset-inline-start: -4px;\n\n      width: 16px;\n      height: 16px;\n      border-radius: 50%;\n\n      color: ${cssVar.colorBgLayout};\n\n      background: ${cssVar.colorPrimary};\n    `,\n\n    loadingRight: css`\n      position: absolute;\n      inset-block-end: 0;\n      inset-inline-end: -4px;\n\n      width: 16px;\n      height: 16px;\n      border-radius: 50%;\n\n      color: ${cssVar.colorBgLayout};\n\n      background: ${cssVar.colorPrimary};\n    `,\n\n    messageBubble: css`\n      ${blockStylish}\n      position: relative;\n      overflow: hidden;\n      max-width: 100%;\n\n      ${responsive.sm} {\n        width: 100%;\n      }\n    `,\n\n    messageContainer: css`\n      position: relative;\n      overflow: hidden;\n      max-width: 100%;\n\n      ${responsive.sm} {\n        overflow-x: auto;\n      }\n    `,\n\n    messageContainerEditing: css`\n      ${editingStylish}\n      position: relative;\n      overflow: hidden;\n      max-width: 100%;\n\n      ${responsive.sm} {\n        overflow-x: auto;\n      }\n    `,\n\n    messageContainerEditingWithTime: css`\n      ${editingStylish}\n      position: relative;\n      overflow: hidden;\n      max-width: 100%;\n      margin-block-start: -16px;\n\n      ${responsive.sm} {\n        overflow-x: auto;\n      }\n    `,\n\n    messageContainerWithTime: css`\n      position: relative;\n      overflow: hidden;\n      max-width: 100%;\n      margin-block-start: -16px;\n\n      ${responsive.sm} {\n        overflow-x: auto;\n      }\n    `,\n\n    messageContent: css`\n      position: relative;\n      overflow: hidden;\n      max-width: 100%;\n\n      ${responsive.sm} {\n        flex-direction: column !important;\n      }\n    `,\n\n    messageContentEditing: css`\n      ${editingStylish}\n      position: relative;\n      overflow: hidden;\n      max-width: 100%;\n\n      ${responsive.sm} {\n        flex-direction: column !important;\n      }\n    `,\n\n    messageDocsWithTitle: css`\n      ${rawStylishWithTitle}\n      position: relative;\n      overflow: hidden;\n      max-width: 100%;\n\n      ${responsive.sm} {\n        width: 100%;\n      }\n    `,\n\n    messageDocsWithoutTitle: css`\n      ${rawStylishWithoutTitle}\n      position: relative;\n      overflow: hidden;\n      max-width: 100%;\n\n      ${responsive.sm} {\n        width: 100%;\n      }\n    `,\n\n    messageExtra: css`\n      /* message-extra class */\n    `,\n\n    nameLeft: css`\n      pointer-events: none;\n\n      margin-block-end: 6px;\n\n      font-size: 12px;\n      line-height: 1;\n      color: ${cssVar.colorTextDescription};\n      text-align: start;\n    `,\n\n    nameRight: css`\n      pointer-events: none;\n\n      margin-block-end: 6px;\n\n      font-size: 12px;\n      line-height: 1;\n      color: ${cssVar.colorTextDescription};\n      text-align: end;\n    `,\n  };\n});\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,aAAa;CAC5D,MAAM,eAAe,GAAG;;;2CAGiB,OAAO,qBAAqB;qBAClD,OAAO,eAAe;;wBAEnB,OAAO,iBAAiB;;CAG9C,MAAM,sBAAsB,GAAG;;;CAI/B,MAAM,yBAAyB,GAAG;;;CAIlC,MAAM,sBAAsB,GAAG;;yCAEQ,OAAO,cAAc;;CAG5D,MAAM,iBAAiB,GAAG;;;CAI1B,OAAO;EAEL,mBAAmB,GAAG;;;;;EAKtB,oBAAoB,GAAG;;;;;EAKvB,iBAAiB,GAAG;;;;;EAKpB,kBAAkB,GAAG;;;;;EAKrB,gBAAgB,GAAG;;;;EAKnB,iBAAiB,GAAG;;;;;;EAMpB,sBAAsB,GAAG;;;EAGzB,WAAW,GAAG;;;;;;;;;;;;;;;;;;;;;oCAqBkB,OAAO,cAAc;;;;;;;;;;;;;;;;;wBAiBjC,OAAO,kBAAkB;;;;QAIzC,WAAW,GAAG;;;;;EAMlB,eAAe,GAAG;QACd,oBAAoB;;;;;;;;;;;;;;;;;;;;;oCAqBQ,OAAO,cAAc;;;;;;;;;;;;;;;;QAgBjD,WAAW,GAAG;;;;;EAKlB,kBAAkB,GAAG;QACjB,eAAe;;;0BAGG,OAAO,qBAAqB;;;;wBAI9B,OAAO,YAAY;;;EAIvC,sBAAsB,GAAG;QACrB,eAAe;;;0BAGG,OAAO,qBAAqB;uBAC/B,OAAO,aAAa;;oBAEvB,OAAO,oBAAoB;;;;wBAIvB,OAAO,YAAY;;;EAIvC,cAAc,GAAG;;;EAIjB,gBAAgB,GAAG;;;;;EAMnB,aAAa,GAAG;;;;;;;;;eASL,OAAO,cAAc;;oBAEhB,OAAO,aAAa;;EAGpC,cAAc,GAAG;;;;;;;;;eASN,OAAO,cAAc;;oBAEhB,OAAO,aAAa;;EAGpC,eAAe,GAAG;QACd,aAAa;;;;;QAKb,WAAW,GAAG;;;;EAKlB,kBAAkB,GAAG;;;;;QAKjB,WAAW,GAAG;;;;EAKlB,yBAAyB,GAAG;QACxB,eAAe;;;;;QAKf,WAAW,GAAG;;;;EAKlB,iCAAiC,GAAG;QAChC,eAAe;;;;;;QAMf,WAAW,GAAG;;;;EAKlB,0BAA0B,GAAG;;;;;;QAMzB,WAAW,GAAG;;;;EAKlB,gBAAgB,GAAG;;;;;QAKf,WAAW,GAAG;;;;EAKlB,uBAAuB,GAAG;QACtB,eAAe;;;;;QAKf,WAAW,GAAG;;;;EAKlB,sBAAsB,GAAG;QACrB,oBAAoB;;;;;QAKpB,WAAW,GAAG;;;;EAKlB,yBAAyB,GAAG;QACxB,uBAAuB;;;;;QAKvB,WAAW,GAAG;;;;EAKlB,cAAc,GAAG;;;EAIjB,UAAU,GAAG;;;;;;;eAOF,OAAO,qBAAqB;;;EAIvC,WAAW,GAAG;;;;;;;eAOH,OAAO,qBAAqB;;;CAGzC;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/chat/ChatItem/style.ts"],"sourcesContent":["import './style.css';\n\nimport * as stylex from '@stylexjs/stylex';\n\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\nimport { media } from '@/styles/stylex/media.stylex';\n\nexport const styles = stylex.create({\n  actionsBottom: {\n    alignSelf: 'flex-end',\n  },\n  actionsTop: {\n    alignSelf: 'flex-start',\n  },\n  avatarContainer: {\n    flex: 'none',\n    position: 'relative',\n    height: 'var(--chat-item-avatar-size, 40px)',\n    width: 'var(--chat-item-avatar-size, 40px)',\n  },\n  container: {\n    paddingInline: { default: 12, [media.sm]: 8 },\n    paddingBlockEnd: 12,\n    paddingBlockStart: { default: 24, [media.sm]: 12 },\n    position: 'relative',\n    maxWidth: '100vw',\n  },\n  containerDocs: {\n    transition: `background-color 100ms ${cssVar.motionEaseOut}`,\n    marginBlockEnd: -16,\n    paddingBlockStart: { default: 24, [media.sm]: 16 },\n  },\n  editingInput: {\n    width: '100%',\n  },\n  editingContainer: {\n    borderColor: {\n      'default': cssVar.colorBorderSecondary,\n      ':hover': cssVar.colorBorder,\n      ':active': cssVar.colorBorder,\n    },\n    borderStyle: 'solid',\n    borderWidth: 1,\n  },\n  editingContainerDocs: {\n    borderRadius: cssVar.borderRadius,\n    backgroundColor: cssVar.colorFillQuaternary,\n  },\n  errorContainer: {\n    overflow: 'hidden',\n    position: 'relative',\n  },\n  loading: {\n    borderRadius: '50%',\n    backgroundColor: cssVar.colorPrimary,\n    color: cssVar.colorBgLayout,\n    insetBlockEnd: 0,\n    position: 'absolute',\n  },\n  loadingLeft: {\n    insetInlineStart: -4,\n  },\n  loadingRight: {\n    insetInlineEnd: -4,\n  },\n  messageContent: {\n    flexDirection: { default: null, [media.sm]: 'column' },\n  },\n  narrowFullWidth: {\n    width: { default: null, [media.sm]: '100%' },\n  },\n  messageBubble: {\n    borderColor: `color-mix(in srgb, ${cssVar.colorBorderSecondary} 66%, transparent)`,\n    borderRadius: cssVar.borderRadiusLG,\n    borderStyle: 'solid',\n    borderWidth: 1,\n    backgroundColor: cssVar.colorBgContainer,\n  },\n  messageBox: {\n    overflow: 'hidden',\n    position: 'relative',\n    maxWidth: '100%',\n  },\n  messageContainer: {\n    overflowX: { default: null, [media.sm]: 'auto' },\n  },\n  name: {\n    color: cssVar.colorTextDescription,\n    fontSize: 12,\n    lineHeight: 1,\n    marginBlockEnd: 6,\n    pointerEvents: 'none',\n  },\n  nameLeft: {\n    textAlign: 'start',\n  },\n  nameRight: {\n    textAlign: 'end',\n  },\n  withTime: {\n    marginBlockStart: -16,\n  },\n});\n"],"mappings":";AAMA,MAAa,SAAS;CACpB,eAAe;EACb,QAAQ;EACR,OAAO;CACT;CACA,YAAY;EACV,QAAQ;EACR,OAAO;CACT;CACA,iBAAiB;EACf,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,WAAW;EACT,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,eAAe;EACb,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,cAAc;EACZ,QAAQ;EACR,OAAO;CACT;CACA,kBAAkB;EAChB,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,sBAAsB;EACpB,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,gBAAgB;EACd,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,aAAa;EACX,QAAQ;EACR,OAAO;CACT;CACA,cAAc;EACZ,QAAQ;EACR,OAAO;CACT;CACA,gBAAgB;EACd,QAAQ;EACR,OAAO;CACT;CACA,iBAAiB;EACf,QAAQ;EACR,OAAO;CACT;CACA,eAAe;EACb,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,YAAY;EACV,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,kBAAkB;EAChB,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,UAAU;EACR,QAAQ;EACR,OAAO;CACT;CACA,WAAW;EACT,QAAQ;EACR,OAAO;CACT;CACA,UAAU;EACR,QAAQ;EACR,OAAO;CACT;AACF"}

package/es/chat/ChatItem/type.d.mts

@@ -1,19 +1,19 @@
 import { FlexboxProps } from "../../Flex/type.mjs";
 import "../../Flex/index.mjs";
 import { DivProps } from "../../types/index.mjs";
-import { AvatarProps } from "../../base-ui/Avatar/type.mjs";
-import "../../base-ui/Avatar/index.mjs";
+import { AlertProps } from "../../Alert/type.mjs";
+import "../../Alert/index.mjs";
+import { AvatarProps } from "../../Avatar/type.mjs";
+import "../../Avatar/index.mjs";
 import { MarkdownProps } from "../../Markdown/type.mjs";
 import "../../Markdown/index.mjs";
-import { AlertProps } from "../../base-ui/Alert/type.mjs";
-import "../../base-ui/Alert/index.mjs";
 import { EditableMessageProps } from "../EditableMessage/type.mjs";
 import "../EditableMessage/index.mjs";
 import { MetaData } from "../types/meta.mjs";
 import "../types/index.mjs";
 import { ReactNode } from "react";
 //#region src/chat/ChatItem/type.d.ts
-interface ChatItemProps extends Omit<FlexboxProps, 'children' | 'onChange'> {
+export interface ChatItemProps extends Omit<FlexboxProps, 'children' | 'onChange'> {
   aboveMessage?: ReactNode;
   /**
    * @description Actions to be displayed in the chat item
@@ -95,5 +95,4 @@ interface ChatItemProps extends Omit<FlexboxProps, 'children' | 'onChange'> {
   variant?: 'bubble' | 'docs';
 }
 //#endregion
-export { ChatItemProps };
 //# sourceMappingURL=type.d.mts.map

package/es/chat/ChatList/ChatList.mjs

@@ -1,15 +1,15 @@
 "use client";
-import { ToastHost } from "../../base-ui/Toast/imperative.mjs";
+import { styleProps } from "../../styles/stylex/props.mjs";
+import { ToastHost } from "../../Toast/imperative.mjs";
 import ChatListItem from "./components/ChatListItem.mjs";
 import HistoryDivider from "./components/HistoryDivider.mjs";
 import { styles } from "./style.mjs";
 import { Fragment, memo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { cx } from "antd-style";
 //#region src/chat/ChatList/ChatList.tsx
 const ChatList = memo(({ onActionsClick, onAvatarsClick, renderMessagesExtra, className, data, variant = "bubble", text, showTitle, onMessageChange, renderMessages, renderErrorMessages, loadingId, renderItems, enableHistoryCount, renderActions, historyCount = 0, showAvatar, ...rest }) => {
 	return /* @__PURE__ */ jsxs("div", {
-		className: cx(styles.container, className),
+		...styleProps(styles.container, className),
 		...rest,
 		children: [data.map((item, index) => {
 			const itemProps = {

package/es/chat/ChatList/ChatList.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChatList.mjs","names":[],"sources":["../../../src/chat/ChatList/ChatList.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { Fragment, memo } from 'react';\n\nimport { ToastHost } from '@/base-ui/Toast';\n\nimport ChatListItem from './components/ChatListItem';\nimport HistoryDivider from './components/HistoryDivider';\nimport { styles } from './style';\nimport type { ChatListProps } from './type';\n\nconst ChatList = memo<ChatListProps>(\n  ({\n    onActionsClick,\n    onAvatarsClick,\n    renderMessagesExtra,\n    className,\n    data,\n    variant = 'bubble',\n    text,\n    showTitle,\n    onMessageChange,\n    renderMessages,\n    renderErrorMessages,\n    loadingId,\n    renderItems,\n    enableHistoryCount,\n    renderActions,\n    historyCount = 0,\n    showAvatar,\n    ...rest\n  }) => {\n    return (\n      <div className={cx(styles.container, className)} {...rest}>\n        {data.map((item, index) => {\n          const itemProps = {\n            loading: loadingId === item.id,\n            onActionsClick,\n            onAvatarsClick,\n            onMessageChange,\n            renderActions,\n            renderErrorMessages,\n            renderItems,\n            renderMessages,\n            renderMessagesExtra,\n            showAvatar,\n            showTitle,\n            text,\n            variant,\n          };\n\n          const historyLength = data.length;\n          const enableHistoryDivider =\n            enableHistoryCount &&\n            historyLength > historyCount &&\n            historyCount === historyLength - index + 1;\n\n          return (\n            <Fragment key={item.id}>\n              <HistoryDivider enable={enableHistoryDivider} text={text?.history} />\n              <ChatListItem {...itemProps} {...item} />\n            </Fragment>\n          );\n        })}\n        <ToastHost />\n      </div>\n    );\n  },\n);\n\nexport default ChatList;\n"],"mappings":";;;;;;;;;AAYA,MAAM,WAAW,MACd,EACC,gBACA,gBACA,qBACA,WACA,MACA,UAAU,UACV,MACA,WACA,iBACA,gBACA,qBACA,WACA,aACA,oBACA,eACA,eAAe,GACf,YACA,GAAG,WACC;CACJ,OACE,qBAAC,OAAD;EAAK,WAAW,GAAG,OAAO,WAAW,SAAS;EAAG,GAAI;EAArD,UAAA,CACG,KAAK,KAAK,MAAM,UAAU;GACzB,MAAM,YAAY;IAChB,SAAS,cAAc,KAAK;IAC5B;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GAEA,MAAM,gBAAgB,KAAK;GAC3B,MAAM,uBACJ,sBACA,gBAAgB,gBAChB,iBAAiB,gBAAgB,QAAQ;GAE3C,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,gBAAD;IAAgB,QAAQ;IAAsB,MAAM,MAAM;GAAU,CAAA,GACpE,oBAAC,cAAD;IAAc,GAAI;IAAW,GAAI;GAAO,CAAA,CAChC,EAAA,GAHK,KAAK,EAGV;EAEd,CAAC,GACD,oBAAC,WAAD,CAAY,CAAA,CACT;;AAET,CACF"}
+{"version":3,"file":"ChatList.mjs","names":[],"sources":["../../../src/chat/ChatList/ChatList.tsx"],"sourcesContent":["'use client';\n\nimport { Fragment, memo } from 'react';\n\nimport { styleProps } from '@/styles/stylex/props';\nimport { ToastHost } from '@/Toast';\n\nimport ChatListItem from './components/ChatListItem';\nimport HistoryDivider from './components/HistoryDivider';\nimport { styles } from './style';\nimport type { ChatListProps } from './type';\n\nconst ChatList = memo<ChatListProps>(\n  ({\n    onActionsClick,\n    onAvatarsClick,\n    renderMessagesExtra,\n    className,\n    data,\n    variant = 'bubble',\n    text,\n    showTitle,\n    onMessageChange,\n    renderMessages,\n    renderErrorMessages,\n    loadingId,\n    renderItems,\n    enableHistoryCount,\n    renderActions,\n    historyCount = 0,\n    showAvatar,\n    ...rest\n  }) => {\n    return (\n      <div {...styleProps(styles.container, className)} {...rest}>\n        {data.map((item, index) => {\n          const itemProps = {\n            loading: loadingId === item.id,\n            onActionsClick,\n            onAvatarsClick,\n            onMessageChange,\n            renderActions,\n            renderErrorMessages,\n            renderItems,\n            renderMessages,\n            renderMessagesExtra,\n            showAvatar,\n            showTitle,\n            text,\n            variant,\n          };\n\n          const historyLength = data.length;\n          const enableHistoryDivider =\n            enableHistoryCount &&\n            historyLength > historyCount &&\n            historyCount === historyLength - index + 1;\n\n          return (\n            <Fragment key={item.id}>\n              <HistoryDivider enable={enableHistoryDivider} text={text?.history} />\n              <ChatListItem {...itemProps} {...item} />\n            </Fragment>\n          );\n        })}\n        <ToastHost />\n      </div>\n    );\n  },\n);\n\nexport default ChatList;\n"],"mappings":";;;;;;;;;AAYA,MAAM,WAAW,MACd,EACC,gBACA,gBACA,qBACA,WACA,MACA,UAAU,UACV,MACA,WACA,iBACA,gBACA,qBACA,WACA,aACA,oBACA,eACA,eAAe,GACf,YACA,GAAG,WACC;CACJ,OACE,qBAAC,OAAD;EAAK,GAAI,WAAW,OAAO,WAAW,SAAS;EAAG,GAAI;EAAtD,UAAA,CACG,KAAK,KAAK,MAAM,UAAU;GACzB,MAAM,YAAY;IAChB,SAAS,cAAc,KAAK;IAC5B;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;GACF;GAEA,MAAM,gBAAgB,KAAK;GAC3B,MAAM,uBACJ,sBACA,gBAAgB,gBAChB,iBAAiB,gBAAgB,QAAQ;GAE3C,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,gBAAD;IAAgB,QAAQ;IAAsB,MAAM,MAAM;GAAU,CAAA,GACpE,oBAAC,cAAD;IAAc,GAAI;IAAW,GAAI;GAAO,CAAA,CAChC,EAAA,GAHK,KAAK,EAGV;EAEd,CAAC,GACD,oBAAC,WAAD,CAAY,CAAA,CACT;;AAET,CACF"}

package/es/chat/ChatList/components/ChatListItem.mjs

@@ -1,5 +1,5 @@
 import { copyToClipboard } from "../../../utils/copyToClipboard.mjs";
-import { toast } from "../../../base-ui/Toast/imperative.mjs";
+import { toast } from "../../../Toast/imperative.mjs";
 import ChatItem from "../../ChatItem/ChatItem.mjs";
 import ChatActionsBar from "./ChatActionsBar.mjs";
 import { memo, useCallback, useMemo, useState } from "react";

package/es/chat/ChatList/components/ChatListItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChatListItem.mjs","names":[],"sources":["../../../../src/chat/ChatList/components/ChatListItem.tsx"],"sourcesContent":["import { memo, type ReactNode, useCallback, useMemo, useState } from 'react';\n\nimport { type AlertProps } from '@/base-ui/Alert';\nimport { toast } from '@/base-ui/Toast';\nimport ChatItem from '@/chat/ChatItem';\nimport { type ChatMessage } from '@/chat/types';\nimport { copyToClipboard } from '@/utils/copyToClipboard';\n\nimport { type ChatListItemProps, type ListItemProps } from '../type';\nimport ChatActionsBar from './ChatActionsBar';\n\nconst ChatListItem = memo<ChatListItemProps>((props) => {\n  const {\n    renderMessagesExtra,\n    showTitle,\n    onActionsClick,\n    onAvatarsClick,\n    onMessageChange,\n    variant,\n    text,\n    renderMessages,\n    renderErrorMessages,\n    renderActions,\n    loading,\n    groupNav,\n    renderItems,\n    showAvatar,\n    ...item\n  } = props;\n\n  const [editing, setEditing] = useState(false);\n\n  const RenderItem = useMemo(() => {\n    if (!renderItems || !item?.role) return;\n    let renderFunction;\n    if (renderItems?.[item.role]) renderFunction = renderItems[item.role];\n    if (!renderFunction && renderItems?.['default']) renderFunction = renderItems['default'];\n    if (!renderFunction) return;\n    return renderFunction;\n  }, [renderItems?.[item.role]]);\n\n  const RenderMessage = useCallback(\n    ({ editableContent, data }: { data: ChatMessage; editableContent: ReactNode }) => {\n      if (!renderMessages || !item?.role) return;\n      let RenderFunction;\n      if (renderMessages?.[item.role]) RenderFunction = renderMessages[item.role];\n      if (!RenderFunction && renderMessages?.['default'])\n        RenderFunction = renderMessages['default'];\n      if (!RenderFunction) return;\n      return <RenderFunction {...data} editableContent={editableContent} />;\n    },\n    [renderMessages?.[item.role]],\n  );\n\n  const MessageExtra = useCallback(\n    ({ data }: { data: ChatMessage }) => {\n      if (!renderMessagesExtra || !item?.role) return;\n      let RenderFunction;\n      if (renderMessagesExtra?.[item.role]) RenderFunction = renderMessagesExtra[item.role];\n      if (renderMessagesExtra?.['default']) RenderFunction = renderMessagesExtra['default'];\n      if (!RenderFunction) return;\n      return <RenderFunction {...data} />;\n    },\n    [renderMessagesExtra?.[item.role]],\n  );\n\n  const ErrorMessage = useCallback(\n    ({ data }: { data: ChatMessage }) => {\n      if (!renderErrorMessages || !item?.error?.type) return;\n      let RenderFunction;\n      if (renderErrorMessages?.[item.error.type])\n        RenderFunction = renderErrorMessages[item.error.type].Render;\n      if (!RenderFunction && renderErrorMessages?.['default'])\n        RenderFunction = renderErrorMessages['default'].Render;\n      if (!RenderFunction) return;\n      return <RenderFunction {...data} />;\n    },\n    [renderErrorMessages],\n  );\n\n  const Actions = useCallback(\n    ({ data }: { data: ChatMessage }) => {\n      if (!renderActions || !item?.role) return;\n      let RenderFunction;\n      if (renderActions?.[item.role]) RenderFunction = renderActions[item.role];\n      if (renderActions?.['default']) RenderFunction = renderActions['default'];\n      if (!RenderFunction) RenderFunction = ChatActionsBar;\n\n      const handleActionClick: ListItemProps['onActionsClick'] = async (action, data) => {\n        switch (action.key) {\n          case 'copy': {\n            await copyToClipboard(data.content);\n            toast.success(text?.copySuccess || 'Copy Success');\n            break;\n          }\n          case 'edit': {\n            setEditing(true);\n          }\n        }\n\n        onActionsClick?.(action, data);\n      };\n\n      return (\n        <RenderFunction\n          {...data}\n          text={text}\n          onActionClick={(actionKey) => handleActionClick?.(actionKey, data)}\n        />\n      );\n    },\n    [renderActions?.[item.role], text, onActionsClick],\n  );\n\n  const error = useMemo(() => {\n    if (!item.error) return;\n    let alertConfig = {};\n    if (item.error.type && renderErrorMessages?.[item.error.type]) {\n      alertConfig = renderErrorMessages[item.error.type]?.config as AlertProps;\n    }\n    return {\n      title: item.error?.message,\n      ...alertConfig,\n    };\n  }, [renderErrorMessages, item.error]);\n\n  if (RenderItem) return <RenderItem key={item.id} {...props} />;\n\n  return (\n    <ChatItem\n      actions={<Actions data={item} />}\n      avatar={item.meta}\n      avatarAddon={groupNav}\n      editing={editing}\n      error={error}\n      errorMessage={<ErrorMessage data={item} />}\n      loading={loading}\n      message={item.content}\n      messageExtra={<MessageExtra data={item} />}\n      placement={variant === 'bubble' ? (item.role === 'user' ? 'right' : 'left') : 'left'}\n      primary={item.role === 'user'}\n      showAvatar={showAvatar}\n      showTitle={showTitle}\n      text={text}\n      time={item.updateAt || item.createAt}\n      variant={variant}\n      renderMessage={(editableContent) => (\n        <RenderMessage data={item} editableContent={editableContent} />\n      )}\n      onAvatarClick={onAvatarsClick?.(item.role)}\n      onChange={(value) => onMessageChange?.(item.id, value)}\n      onEditingChange={setEditing}\n      onDoubleClick={(e) => {\n        if (item.id === 'default' || item.error) return;\n        if (item.role && ['assistant', 'user'].includes(item.role) && e.altKey) {\n          setEditing(true);\n        }\n      }}\n    />\n  );\n});\n\nChatListItem.displayName = 'ChatListItem';\n\nexport default ChatListItem;\n"],"mappings":"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"}
+{"version":3,"file":"ChatListItem.mjs","names":[],"sources":["../../../../src/chat/ChatList/components/ChatListItem.tsx"],"sourcesContent":["import { memo, type ReactNode, useCallback, useMemo, useState } from 'react';\n\nimport { type AlertProps } from '@/Alert';\nimport ChatItem from '@/chat/ChatItem';\nimport { type ChatMessage } from '@/chat/types';\nimport { toast } from '@/Toast';\nimport { copyToClipboard } from '@/utils/copyToClipboard';\n\nimport { type ChatListItemProps, type ListItemProps } from '../type';\nimport ChatActionsBar from './ChatActionsBar';\n\nconst ChatListItem = memo<ChatListItemProps>((props) => {\n  const {\n    renderMessagesExtra,\n    showTitle,\n    onActionsClick,\n    onAvatarsClick,\n    onMessageChange,\n    variant,\n    text,\n    renderMessages,\n    renderErrorMessages,\n    renderActions,\n    loading,\n    groupNav,\n    renderItems,\n    showAvatar,\n    ...item\n  } = props;\n\n  const [editing, setEditing] = useState(false);\n\n  const RenderItem = useMemo(() => {\n    if (!renderItems || !item?.role) return;\n    let renderFunction;\n    if (renderItems?.[item.role]) renderFunction = renderItems[item.role];\n    if (!renderFunction && renderItems?.['default']) renderFunction = renderItems['default'];\n    if (!renderFunction) return;\n    return renderFunction;\n  }, [renderItems?.[item.role]]);\n\n  const RenderMessage = useCallback(\n    ({ editableContent, data }: { data: ChatMessage; editableContent: ReactNode }) => {\n      if (!renderMessages || !item?.role) return;\n      let RenderFunction;\n      if (renderMessages?.[item.role]) RenderFunction = renderMessages[item.role];\n      if (!RenderFunction && renderMessages?.['default'])\n        RenderFunction = renderMessages['default'];\n      if (!RenderFunction) return;\n      return <RenderFunction {...data} editableContent={editableContent} />;\n    },\n    [renderMessages?.[item.role]],\n  );\n\n  const MessageExtra = useCallback(\n    ({ data }: { data: ChatMessage }) => {\n      if (!renderMessagesExtra || !item?.role) return;\n      let RenderFunction;\n      if (renderMessagesExtra?.[item.role]) RenderFunction = renderMessagesExtra[item.role];\n      if (renderMessagesExtra?.['default']) RenderFunction = renderMessagesExtra['default'];\n      if (!RenderFunction) return;\n      return <RenderFunction {...data} />;\n    },\n    [renderMessagesExtra?.[item.role]],\n  );\n\n  const ErrorMessage = useCallback(\n    ({ data }: { data: ChatMessage }) => {\n      if (!renderErrorMessages || !item?.error?.type) return;\n      let RenderFunction;\n      if (renderErrorMessages?.[item.error.type])\n        RenderFunction = renderErrorMessages[item.error.type].Render;\n      if (!RenderFunction && renderErrorMessages?.['default'])\n        RenderFunction = renderErrorMessages['default'].Render;\n      if (!RenderFunction) return;\n      return <RenderFunction {...data} />;\n    },\n    [renderErrorMessages],\n  );\n\n  const Actions = useCallback(\n    ({ data }: { data: ChatMessage }) => {\n      if (!renderActions || !item?.role) return;\n      let RenderFunction;\n      if (renderActions?.[item.role]) RenderFunction = renderActions[item.role];\n      if (renderActions?.['default']) RenderFunction = renderActions['default'];\n      if (!RenderFunction) RenderFunction = ChatActionsBar;\n\n      const handleActionClick: ListItemProps['onActionsClick'] = async (action, data) => {\n        switch (action.key) {\n          case 'copy': {\n            await copyToClipboard(data.content);\n            toast.success(text?.copySuccess || 'Copy Success');\n            break;\n          }\n          case 'edit': {\n            setEditing(true);\n          }\n        }\n\n        onActionsClick?.(action, data);\n      };\n\n      return (\n        <RenderFunction\n          {...data}\n          text={text}\n          onActionClick={(actionKey) => handleActionClick?.(actionKey, data)}\n        />\n      );\n    },\n    [renderActions?.[item.role], text, onActionsClick],\n  );\n\n  const error = useMemo(() => {\n    if (!item.error) return;\n    let alertConfig = {};\n    if (item.error.type && renderErrorMessages?.[item.error.type]) {\n      alertConfig = renderErrorMessages[item.error.type]?.config as AlertProps;\n    }\n    return {\n      title: item.error?.message,\n      ...alertConfig,\n    };\n  }, [renderErrorMessages, item.error]);\n\n  if (RenderItem) return <RenderItem key={item.id} {...props} />;\n\n  return (\n    <ChatItem\n      actions={<Actions data={item} />}\n      avatar={item.meta}\n      avatarAddon={groupNav}\n      editing={editing}\n      error={error}\n      errorMessage={<ErrorMessage data={item} />}\n      loading={loading}\n      message={item.content}\n      messageExtra={<MessageExtra data={item} />}\n      placement={variant === 'bubble' ? (item.role === 'user' ? 'right' : 'left') : 'left'}\n      primary={item.role === 'user'}\n      showAvatar={showAvatar}\n      showTitle={showTitle}\n      text={text}\n      time={item.updateAt || item.createAt}\n      variant={variant}\n      renderMessage={(editableContent) => (\n        <RenderMessage data={item} editableContent={editableContent} />\n      )}\n      onAvatarClick={onAvatarsClick?.(item.role)}\n      onChange={(value) => onMessageChange?.(item.id, value)}\n      onEditingChange={setEditing}\n      onDoubleClick={(e) => {\n        if (item.id === 'default' || item.error) return;\n        if (item.role && ['assistant', 'user'].includes(item.role) && e.altKey) {\n          setEditing(true);\n        }\n      }}\n    />\n  );\n});\n\nChatListItem.displayName = 'ChatListItem';\n\nexport default ChatListItem;\n"],"mappings":"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"}

package/es/chat/ChatList/components/HistoryDivider.mjs

@@ -1,6 +1,6 @@
-import Divider from "../../../base-ui/Divider/Divider.mjs";
 import Icon from "../../../Icon/Icon.mjs";
-import Tag from "../../../base-ui/Tag/Tag.mjs";
+import Tag from "../../../Tag/Tag.mjs";
+import Divider from "../../../Divider/Divider.mjs";
 import { jsx } from "react/jsx-runtime";
 import { Timer } from "lucide-react";
 //#region src/chat/ChatList/components/HistoryDivider.tsx

package/es/chat/ChatList/components/HistoryDivider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"HistoryDivider.mjs","names":[],"sources":["../../../../src/chat/ChatList/components/HistoryDivider.tsx"],"sourcesContent":["import { Timer } from 'lucide-react';\nimport { type FC } from 'react';\n\nimport Divider from '@/base-ui/Divider';\nimport Tag from '@/base-ui/Tag';\nimport Icon from '@/Icon';\n\ninterface HistoryDividerProps {\n  enable?: boolean;\n  text?: string;\n}\n\nconst HistoryDivider: FC<HistoryDividerProps> = ({ enable, text }) => {\n  if (!enable) return null;\n\n  return (\n    <div style={{ padding: '0 20px' }}>\n      <Divider style={{ marginBlock: 16 }}>\n        <Tag icon={<Icon icon={Timer} />}>{text || 'History Message'}</Tag>\n      </Divider>\n    </div>\n  );\n};\n\nexport default HistoryDivider;\n"],"mappings":";;;;;;AAYA,MAAM,kBAA2C,EAAE,QAAQ,WAAW;CACpE,IAAI,CAAC,QAAQ,OAAO;CAEpB,OACE,oBAAC,OAAD;EAAK,OAAO,EAAE,SAAS,SAAS;EAC9B,UAAA,oBAAC,SAAD;GAAS,OAAO,EAAE,aAAa,GAAG;GAChC,UAAA,oBAAC,KAAD;IAAK,MAAM,oBAAC,MAAD,EAAM,MAAM,MAAQ,CAAA;IAAI,UAAA,QAAQ;GAAuB,CAAA;EAC3D,CAAA;CACN,CAAA;AAET"}
+{"version":3,"file":"HistoryDivider.mjs","names":[],"sources":["../../../../src/chat/ChatList/components/HistoryDivider.tsx"],"sourcesContent":["import { Timer } from 'lucide-react';\nimport { type FC } from 'react';\n\nimport Divider from '@/Divider';\nimport Icon from '@/Icon';\nimport Tag from '@/Tag';\n\ninterface HistoryDividerProps {\n  enable?: boolean;\n  text?: string;\n}\n\nconst HistoryDivider: FC<HistoryDividerProps> = ({ enable, text }) => {\n  if (!enable) return null;\n\n  return (\n    <div style={{ padding: '0 20px' }}>\n      <Divider style={{ marginBlock: 16 }}>\n        <Tag icon={<Icon icon={Timer} />}>{text || 'History Message'}</Tag>\n      </Divider>\n    </div>\n  );\n};\n\nexport default HistoryDivider;\n"],"mappings":";;;;;;AAYA,MAAM,kBAA2C,EAAE,QAAQ,WAAW;CACpE,IAAI,CAAC,QAAQ,OAAO;CAEpB,OACE,oBAAC,OAAD;EAAK,OAAO,EAAE,SAAS,SAAS;EAC9B,UAAA,oBAAC,SAAD;GAAS,OAAO,EAAE,aAAa,GAAG;GAChC,UAAA,oBAAC,KAAD;IAAK,MAAM,oBAAC,MAAD,EAAM,MAAM,MAAQ,CAAA;IAAI,UAAA,QAAQ;GAAuB,CAAA;EAC3D,CAAA;CACN,CAAA;AAET"}

package/es/chat/ChatList/style.mjs

@@ -1,10 +1,8 @@
-import { createStaticStyles } from "antd-style";
 //#region src/chat/ChatList/style.ts
-const styles = createStaticStyles(({ css }) => {
-	return { container: css`
-      position: relative;
-    ` };
-});
+const styles = { container: {
+	kVAEAm: "lb1n2onr6",
+	$$css: true
+} };
 //#endregion
 export { styles };
 

package/es/chat/ChatList/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/chat/ChatList/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css }) => {\n  return {\n    container: css`\n      position: relative;\n    `,\n  };\n});\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,UAAU;CACpD,OAAO,EACL,WAAW,GAAG;;MAGhB;AACF,CAAC"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/chat/ChatList/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nexport const styles = stylex.create({\n  container: {\n    position: 'relative',\n  },\n});\n"],"mappings":";AACA,MAAa,SAAS,EACpB,WAAW;CACT,QAAQ;CACR,OAAO;AACT,EACF"}