@sybilion/uilib 1.3.84 → 1.3.85

package/dist/esm/components/ui/Chat/ChatPrompt/ChatPrompt.styl.js

@@ -1,7 +1,7 @@
 import styleInject from 'style-inject';
 
-var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.ChatPrompt_root__5G5bq{align-items:stretch;display:flex;flex-direction:column;gap:var(--p-2);padding:var(--p-3);position:relative}.ChatPrompt_composer__H3c3N{align-items:flex-end;display:flex;flex-direction:row;gap:var(--p-3);position:relative;width:100%}.ChatPrompt_fileInput__xdgPn{display:none}.ChatPrompt_attachButton__gi-qF{align-self:flex-end;flex-shrink:0}.ChatPrompt_editorWrap__Q7gat{align-self:stretch;flex:1;min-width:0}.ChatPrompt_editorMount__Phh4D{background:transparent;border:none;border-radius:0!important;box-shadow:none!important;display:flex;flex:1;flex-direction:column;max-height:200px;min-height:40px;min-width:0;padding:0!important}.ChatPrompt_editorMount__Phh4D:focus-within{box-shadow:none!important}.ChatPrompt_editorMount__Phh4D .ProseMirror{border:none!important;box-shadow:none!important;flex:1;margin:0;max-height:200px!important;min-height:40px!important;outline:none!important;overflow-x:hidden!important;overflow-y:auto!important;padding:var(--p-2) 0 0!important;resize:none!important;white-space:pre-wrap;word-break:break-word}.ChatPrompt_editorMount__Phh4D .ProseMirror p.is-empty.is-editor-empty:before{color:var(--muted-foreground);content:attr(data-placeholder);float:left;height:0;pointer-events:none}.ChatPrompt_editorMount__Phh4D .ProseMirror .chat-prompt-command-chip,.ChatPrompt_editorMount__Phh4D .ProseMirror .slash-mention{align-items:center;background:var(--muted);border-radius:var(--radius-sm);display:inline-flex;font-size:.875em;line-height:1.4;padding:0 var(--p-1);-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:baseline;white-space:nowrap}.ChatPrompt_editorMount__Phh4D .ProseMirror .chat-prompt-command-chip{color:var(--foreground)}.ChatPrompt_submitColumn__0rY1R{align-items:center;display:flex;flex-direction:column;flex-shrink:0;justify-content:flex-end;margin-top:-4px}.ChatPrompt_submitColumn__0rY1R>button:focus{box-shadow:0 0 0 2px var(--brand-color-500)!important}.ChatPrompt_submitColumn__0rY1R>button:first-child{border:none;position:relative;transition:all .2s}.ChatPrompt_submitColumn__0rY1R>button:first-child:focus{transform:scale(1.2)}.ChatPrompt_submitColumn__0rY1R>button:first-child:before{bottom:-100%;content:\"\";left:-100%;position:absolute;right:-100%;top:-100%}.ChatPrompt_attachments__KG-fG{display:flex;flex-wrap:wrap;gap:var(--p-2);margin-bottom:var(--p-2)}.ChatPrompt_attachmentItem__QJk7J{flex:1 1 300px;max-width:300px;min-width:0}";
-var S = {"root":"ChatPrompt_root__5G5bq","composer":"ChatPrompt_composer__H3c3N","fileInput":"ChatPrompt_fileInput__xdgPn","attachButton":"ChatPrompt_attachButton__gi-qF","editorWrap":"ChatPrompt_editorWrap__Q7gat","editorMount":"ChatPrompt_editorMount__Phh4D","submitColumn":"ChatPrompt_submitColumn__0rY1R","attachments":"ChatPrompt_attachments__KG-fG","attachmentItem":"ChatPrompt_attachmentItem__QJk7J"};
+var css_248z = "@media (max-width:768px){:root{--page-x-padding:var(--p-6);--page-y-padding:var(--p-6)}}.ChatPrompt_root__5G5bq{align-items:stretch;display:flex;flex-direction:column;gap:var(--p-2);padding:var(--p-3);position:relative}.ChatPrompt_composer__H3c3N{align-items:flex-end;display:flex;flex-direction:row;gap:var(--p-3);position:relative;width:100%}.ChatPrompt_fileInput__xdgPn{display:none}.ChatPrompt_attachButton__gi-qF,.ChatPrompt_submitButton__gvhDN{position:relative;top:-2px}.ChatPrompt_attachButton__gi-qF{align-self:flex-end;flex-shrink:0}.ChatPrompt_editorWrap__Q7gat{align-self:stretch;flex:1;min-width:0}.ChatPrompt_editorMount__Phh4D{background:transparent;border:none;border-radius:0!important;box-shadow:none!important;display:flex;flex:1;flex-direction:column;max-height:200px;min-height:40px;min-width:0;padding:0!important}.ChatPrompt_editorMount__Phh4D:focus-within{box-shadow:none!important}.ChatPrompt_editorMount__Phh4D .ProseMirror{border:none!important;box-shadow:none!important;flex:1;margin:0;max-height:200px!important;min-height:40px!important;outline:none!important;overflow-x:hidden!important;overflow-y:auto!important;padding:var(--p-2) 0 0!important;resize:none!important;white-space:pre-wrap;word-break:break-word}.ChatPrompt_editorMount__Phh4D .ProseMirror p.is-empty.is-editor-empty:before{color:var(--muted-foreground);content:attr(data-placeholder);float:left;height:0;pointer-events:none}.ChatPrompt_editorMount__Phh4D .ProseMirror .chat-prompt-command-chip,.ChatPrompt_editorMount__Phh4D .ProseMirror .slash-mention{align-items:center;background:var(--muted);border-radius:var(--radius-sm);display:inline-flex;font-size:.875em;line-height:1.4;padding:0 var(--p-1);-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:baseline;white-space:nowrap}.ChatPrompt_editorMount__Phh4D .ProseMirror .chat-prompt-command-chip{color:var(--foreground)}.ChatPrompt_submitColumn__0rY1R{align-items:center;display:flex;flex-direction:column;flex-shrink:0;justify-content:flex-end}.ChatPrompt_submitColumn__0rY1R>button:focus{box-shadow:0 0 0 2px var(--brand-color-500)!important}.ChatPrompt_submitColumn__0rY1R>button:first-child{border:none;position:relative;transition:all .2s}.ChatPrompt_submitColumn__0rY1R>button:first-child:focus{transform:scale(1.2)}.ChatPrompt_submitColumn__0rY1R>button:first-child:before{bottom:-100%;content:\"\";left:-100%;position:absolute;right:-100%;top:-100%}.ChatPrompt_attachments__KG-fG{display:flex;flex-wrap:wrap;gap:var(--p-2);margin-bottom:var(--p-2)}.ChatPrompt_attachmentItem__QJk7J{flex:1 1 300px;max-width:300px;min-width:0}";
+var S = {"root":"ChatPrompt_root__5G5bq","composer":"ChatPrompt_composer__H3c3N","fileInput":"ChatPrompt_fileInput__xdgPn","attachButton":"ChatPrompt_attachButton__gi-qF","submitButton":"ChatPrompt_submitButton__gvhDN","editorWrap":"ChatPrompt_editorWrap__Q7gat","editorMount":"ChatPrompt_editorMount__Phh4D","submitColumn":"ChatPrompt_submitColumn__0rY1R","attachments":"ChatPrompt_attachments__KG-fG","attachmentItem":"ChatPrompt_attachmentItem__QJk7J"};
 styleInject(css_248z);
 
 export { S as default };

package/dist/esm/components/ui/FileChip/FileChip.js

@@ -3,7 +3,6 @@ import cn from 'classnames';
 import { CsvIcon } from '../../icons/CsvIcon/CsvIcon.js';
 import { CardHeader, CardAction } from '../Card/Card.js';
 import { XIcon, FileTextIcon } from '@phosphor-icons/react';
-import { LayoutDashboard } from 'lucide-react';
 import S from './FileChip.styl.js';
 
 const FORMAT_ICON_SIZE = 32;
@@ -11,16 +10,13 @@ function FormatIcon({ format }) {
     if (format === 'csv') {
         return jsx(CsvIcon, { size: FORMAT_ICON_SIZE });
     }
-    if (format === 'dashboard') {
-        return (jsx(LayoutDashboard, { size: FORMAT_ICON_SIZE, "aria-hidden": true, style: { color: 'var(--muted-foreground)' } }));
-    }
     return (jsx(FileTextIcon, { size: FORMAT_ICON_SIZE, "aria-hidden": true, style: { color: 'var(--muted-foreground)' } }));
 }
-function FileChipHeader({ name, format, hint, onRemove, }) {
-    return (jsx(CardHeader, { className: S.header, icon: jsx(FormatIcon, { format: format }), title: name, description: hint, titleClassName: S.title, descriptionClassName: S.hint, tooltipProps: { maxWidth: 400 }, children: onRemove ? (jsx(CardAction, { children: jsx("button", { type: "button", className: S.remove, "aria-label": `Remove ${name}`, onClick: onRemove, children: jsx(XIcon, { size: 14, "aria-hidden": true }) }) })) : null }));
+function FileChipHeader({ name, format, hint, icon, onRemove, }) {
+    return (jsx(CardHeader, { className: S.header, icon: icon ?? jsx(FormatIcon, { format: format }), title: name, description: hint, titleClassName: S.title, descriptionClassName: S.hint, tooltipProps: { maxWidth: 400 }, children: onRemove ? (jsx(CardAction, { children: jsx("button", { type: "button", className: S.remove, "aria-label": `Remove ${name}`, onClick: onRemove, children: jsx(XIcon, { size: 14, "aria-hidden": true }) }) })) : null }));
 }
-function FileChip({ name, format, hint, onClick, onRemove, className, }) {
-    const header = (jsx(FileChipHeader, { name: name, format: format, hint: hint, onRemove: onRemove }));
+function FileChip({ name, format, hint, icon, onClick, onRemove, className, }) {
+    const header = (jsx(FileChipHeader, { name: name, format: format, hint: hint, icon: icon, onRemove: onRemove }));
     if (onClick) {
         return (jsx("button", { type: "button", className: cn(S.root, S.interactive, className), "aria-label": `${hint}: ${name}`, onClick: onClick, children: header }));
     }

package/dist/esm/types/src/components/ui/FileChip/FileChip.d.ts

@@ -1,2 +1,2 @@
 import type { FileChipProps } from './FileChip.types';
-export declare function FileChip({ name, format, hint, onClick, onRemove, className, }: FileChipProps): import("react/jsx-runtime").JSX.Element;
+export declare function FileChip({ name, format, hint, icon, onClick, onRemove, className, }: FileChipProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/src/components/ui/FileChip/FileChip.types.d.ts

@@ -1,8 +1,9 @@
-export type FileChipFormat = 'csv' | 'pdf' | 'text' | 'dashboard';
+export type FileChipFormat = 'csv' | 'pdf' | 'text';
 export type FileChipProps = {
     name: string;
     format: FileChipFormat;
     hint: string;
+    icon?: React.ReactNode;
     onClick?: () => void;
     onRemove?: () => void;
     disabled?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sybilion/uilib",
-  "version": "1.3.84",
+  "version": "1.3.85",
   "description": "Sybilion Design System — React UI components (Webpack + Stylus)",
   "publishConfig": {
     "access": "public",

package/src/components/ui/Chat/ChatPrompt/ChatPrompt.styl

@@ -21,6 +21,11 @@ INPUT_MAX_HEIGHT = 200px
 .fileInput
   display none
 
+.attachButton
+.submitButton
+  position relative
+  top -2px
+
 .attachButton
   flex-shrink 0
   align-self flex-end
@@ -99,7 +104,6 @@ INPUT_MAX_HEIGHT = 200px
   flex-shrink 0
   align-items center
   justify-content flex-end
-  margin-top -4px
 
   & > button:focus
     box-shadow 0 0 0 2px var(--brand-color-500) !important

package/src/components/ui/Chat/ChatPrompt/ChatPrompt.styl.d.ts

@@ -9,6 +9,7 @@ interface CssExports {
   'editorWrap': string;
   'fileInput': string;
   'root': string;
+  'submitButton': string;
   'submitColumn': string;
 }
 export const cssExports: CssExports;

package/src/components/ui/FileChip/FileChip.tsx

@@ -3,7 +3,6 @@ import cn from 'classnames';
 import { CsvIcon } from '#uilib/components/icons/CsvIcon/CsvIcon';
 import { CardAction, CardHeader } from '#uilib/components/ui/Card';
 import { FileTextIcon, XIcon } from '@phosphor-icons/react';
-import { LayoutDashboard } from 'lucide-react';
 
 import S from './FileChip.styl';
 import type { FileChipFormat, FileChipProps } from './FileChip.types';
@@ -15,16 +14,6 @@ function FormatIcon({ format }: { format: FileChipFormat }) {
     return <CsvIcon size={FORMAT_ICON_SIZE} />;
   }
 
-  if (format === 'dashboard') {
-    return (
-      <LayoutDashboard
-        size={FORMAT_ICON_SIZE}
-        aria-hidden
-        style={{ color: 'var(--muted-foreground)' }}
-      />
-    );
-  }
-
   return (
     <FileTextIcon
       size={FORMAT_ICON_SIZE}
@@ -38,12 +27,16 @@ function FileChipHeader({
   name,
   format,
   hint,
+  icon,
   onRemove,
-}: Pick<FileChipProps, 'name' | 'format' | 'hint' | 'onRemove' | 'disabled'>) {
+}: Pick<
+  FileChipProps,
+  'name' | 'format' | 'hint' | 'icon' | 'onRemove' | 'disabled'
+>) {
   return (
     <CardHeader
       className={S.header}
-      icon={<FormatIcon format={format} />}
+      icon={icon ?? <FormatIcon format={format} />}
       title={name}
       description={hint}
       titleClassName={S.title}
@@ -70,6 +63,7 @@ export function FileChip({
   name,
   format,
   hint,
+  icon,
   onClick,
   onRemove,
   className,
@@ -79,6 +73,7 @@ export function FileChip({
       name={name}
       format={format}
       hint={hint}
+      icon={icon}
       onRemove={onRemove}
     />
   );

package/src/components/ui/FileChip/FileChip.types.ts

@@ -1,9 +1,10 @@
-export type FileChipFormat = 'csv' | 'pdf' | 'text' | 'dashboard';
+export type FileChipFormat = 'csv' | 'pdf' | 'text';
 
 export type FileChipProps = {
   name: string;
   format: FileChipFormat;
   hint: string;
+  icon?: React.ReactNode;
   onClick?: () => void;
   onRemove?: () => void;
   disabled?: boolean;