@umodeapporg/ui 0.0.0-canary.ca10e69

package/dist/components/Form/CurrencyInput.d.ts

@@ -0,0 +1,8 @@
+import { default as ControlledInput } from './ControlledInput';
+type TControlledInputComponentProps = React.ComponentProps<typeof ControlledInput>;
+interface ICurrencyInputProps extends Omit<TControlledInputComponentProps, 'value' | 'onChange' | 'type'> {
+    value: string;
+    onChange: (value: string) => void;
+}
+declare const CurrencyInput: React.FC<ICurrencyInputProps>;
+export default CurrencyInput;

package/dist/components/Form/CurrencyInput.js

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import { formatCurrency } from "../../helpers/formatHelpers.js";
+import ControlledInput from "./ControlledInput.js";
+const NUMERIC_INPUT_MODE = "numeric";
+const CurrencyInput = ({ value, onChange, ...rest }) => {
+  const parsed = value ? parseFloat(value) : NaN;
+  const display = Number.isNaN(parsed) ? "" : formatCurrency(Math.round(parsed * 100));
+  const handleChange = (event) => {
+    const digits = event.target.value.replace(/\D/g, "");
+    onChange(digits ? (Number(digits) / 100).toString() : "");
+  };
+  return /* @__PURE__ */ jsx(ControlledInput, { ...rest, inputMode: NUMERIC_INPUT_MODE, value: display, onChange: handleChange });
+};
+export {
+  CurrencyInput as default
+};
+//# sourceMappingURL=CurrencyInput.js.map

package/dist/components/Form/CurrencyInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CurrencyInput.js","sources":["../../../src/components/Form/CurrencyInput.tsx"],"sourcesContent":["import { formatCurrency } from '@/helpers/formatHelpers';\n\nimport ControlledInput from './ControlledInput';\n\nconst NUMERIC_INPUT_MODE = 'numeric' as const;\n\ntype TControlledInputComponentProps = React.ComponentProps<typeof ControlledInput>;\n\ninterface ICurrencyInputProps extends Omit<TControlledInputComponentProps, 'value' | 'onChange' | 'type'> {\n  value: string;\n  onChange: (value: string) => void;\n}\n\nconst CurrencyInput: React.FC<ICurrencyInputProps> = ({ value, onChange, ...rest }) => {\n  const parsed = value ? parseFloat(value) : NaN;\n  const display = Number.isNaN(parsed) ? '' : formatCurrency(Math.round(parsed * 100));\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const digits = event.target.value.replace(/\\D/g, '');\n    onChange(digits ? (Number(digits) / 100).toString() : '');\n  };\n\n  return <ControlledInput {...rest} inputMode={NUMERIC_INPUT_MODE} value={display} onChange={handleChange} />;\n};\n\nexport default CurrencyInput;\n"],"names":[],"mappings":";;;AAIA,MAAM,qBAAqB;AAS3B,MAAM,gBAA+C,CAAC,EAAE,OAAO,UAAU,GAAG,WAAW;AACrF,QAAM,SAAS,QAAQ,WAAW,KAAK,IAAI;AAC3C,QAAM,UAAU,OAAO,MAAM,MAAM,IAAI,KAAK,eAAe,KAAK,MAAM,SAAS,GAAG,CAAC;AAEnF,QAAM,eAAe,CAAC,UAA+C;AACnE,UAAM,SAAS,MAAM,OAAO,MAAM,QAAQ,OAAO,EAAE;AACnD,aAAS,UAAU,OAAO,MAAM,IAAI,KAAK,SAAA,IAAa,EAAE;AAAA,EAC1D;AAEA,SAAO,oBAAC,mBAAiB,GAAG,MAAM,WAAW,oBAAoB,OAAO,SAAS,UAAU,aAAA,CAAc;AAC3G;"}

package/dist/components/Form/FieldLabel.d.ts

@@ -0,0 +1,16 @@
+interface IFieldLabelProps extends Omit<React.LabelHTMLAttributes<HTMLLabelElement>, 'htmlFor' | 'className' | 'children'> {
+    /** The `id` of the field. Required: a label pointing at nothing names nothing. */
+    htmlFor: string;
+    className?: string;
+    children: React.ReactNode;
+}
+/**
+ * The label written above a field. A field's own `label` is a placeholder plus an accessible name,
+ * so it is gone as soon as the field is filled: a form over something that already exists reads as
+ * a column of bare values, and a choice already made no longer says what it was about.
+ *
+ * Leave the field's `label` out when using this: the association is what names the field then, and
+ * the placeholder is free for an actual example.
+ */
+declare const FieldLabel: React.FC<IFieldLabelProps>;
+export default FieldLabel;

package/dist/components/Form/FieldLabel.js

@@ -0,0 +1,7 @@
+import { jsx } from "react/jsx-runtime";
+import { mergeClasses } from "../../helpers/mergeClasses.js";
+const FieldLabel = ({ htmlFor, className, children, ...rest }) => /* @__PURE__ */ jsx("label", { ...rest, htmlFor, className: mergeClasses("block text-sm font-medium text-foreground", className), children });
+export {
+  FieldLabel as default
+};
+//# sourceMappingURL=FieldLabel.js.map

package/dist/components/Form/FieldLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLabel.js","sources":["../../../src/components/Form/FieldLabel.tsx"],"sourcesContent":["import { mergeClasses } from '@/helpers/mergeClasses';\n\ninterface IFieldLabelProps extends Omit<\n  React.LabelHTMLAttributes<HTMLLabelElement>,\n  'htmlFor' | 'className' | 'children'\n> {\n  /** The `id` of the field. Required: a label pointing at nothing names nothing. */\n  htmlFor: string;\n  className?: string;\n  children: React.ReactNode;\n}\n\n/**\n * The label written above a field. A field's own `label` is a placeholder plus an accessible name,\n * so it is gone as soon as the field is filled: a form over something that already exists reads as\n * a column of bare values, and a choice already made no longer says what it was about.\n *\n * Leave the field's `label` out when using this: the association is what names the field then, and\n * the placeholder is free for an actual example.\n */\nconst FieldLabel: React.FC<IFieldLabelProps> = ({ htmlFor, className, children, ...rest }) => (\n  <label {...rest} htmlFor={htmlFor} className={mergeClasses('block text-sm font-medium text-foreground', className)}>\n    {children}\n  </label>\n);\n\nexport default FieldLabel;\n"],"names":[],"mappings":";;AAoBA,MAAM,aAAyC,CAAC,EAAE,SAAS,WAAW,UAAU,GAAG,KAAA,0BAChF,SAAA,EAAO,GAAG,MAAM,SAAkB,WAAW,aAAa,6CAA6C,SAAS,GAC9G,SAAA,CACH;"}

package/dist/components/Form/RichTextEditor.d.ts

@@ -0,0 +1,86 @@
+import { IUseFileAttachmentsResult, TFileUploader } from '../../hooks/useFileAttachments';
+import { SymbolCodepoints } from '../UI/MaterialSymbol';
+import { IStagedImageAction } from './attachments/AttachmentPreviewList';
+/** An extra entry in the attach menu, for a source only the host knows about (a camera dialog). */
+export interface IRichTextAttachAction {
+    key: string;
+    icon: SymbolCodepoints;
+    label: string;
+    onClick: () => void;
+}
+/**
+ * Files travel BESIDE the text: the host owns a list of attachments of its own (a chat message
+ * has one) and reads `controller.readyAttachments` when it saves.
+ */
+export interface IRichTextAttachmentsConfig {
+    controller: IUseFileAttachmentsResult;
+    extraActions?: Array<IRichTextAttachAction>;
+    /**
+     * Actions offered on a staged IMAGE before it is sent, so a picture is corrected on its way out
+     * instead of being sent and then corrected as a second file.
+     */
+    imageActions?: Array<IStagedImageAction>;
+    /** The host already renders the staged previews somewhere else. */
+    hidePreviews?: boolean;
+    /** The host already wraps a wider drop target around this editor. */
+    hideDropzone?: boolean;
+}
+/**
+ * Files travel INSIDE the text: the upload result is written into the body as a chip, so the
+ * reference persists anywhere the HTML itself is stored and no host needs a new field.
+ */
+export interface IRichTextInlineUploadConfig {
+    uploadFile?: TFileUploader;
+    maxFiles?: number;
+    maxFileSizeBytes?: number;
+}
+interface IRichTextEditorProps {
+    value?: string;
+    onChange?: (html: string) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    error?: boolean;
+    className?: string;
+    minHeight?: number;
+    /** Rendered inside the toolbar row, right-aligned: host actions that belong to the field. */
+    toolbarSlot?: React.ReactNode;
+    /** Rendered in the editor's own bottom bar, after the controls the editor owns. */
+    actionsSlot?: React.ReactNode;
+    onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+    /** Fires when the editable area loses focus, for hosts that persist on blur. */
+    onBlur?: () => void;
+    /**
+     * Fires with the full HTML when the editor changes the content on its own, which today means
+     * an inline upload landing after the field already lost focus. A host that persists on blur
+     * would otherwise never hear about the file it just attached.
+     */
+    onCommit?: (html: string) => void;
+    /** 'bare' drops the border and focus ring: the host owns the chrome around the field. */
+    variant?: 'default' | 'bare';
+    /** Hosts with their own action bar (the chat composer) toggle the formatting row on demand. */
+    showToolbar?: boolean;
+    /** Renders the formatting toggle in the bottom bar and lets the editor own the row's state. */
+    formattingToggle?: boolean;
+    attachments?: IRichTextAttachmentsConfig;
+    inlineUpload?: IRichTextInlineUploadConfig;
+}
+export interface IRichTextEditorHandle {
+    focus: () => void;
+    /** Viewport rect of the caret, for anchoring a popover to what is being typed. */
+    getCaretRect: () => DOMRect | null;
+    /**
+     * Text typed after the trigger and before the caret, or null when the caret is not inside a
+     * trigger word. Drives both "is the mention menu relevant" and "what is being searched".
+     * Spaces are allowed inside the query (people have compound names); the host decides when a
+     * spaced query stopped matching anyone and closes the menu.
+     */
+    getMentionQuery: (trigger: string) => string | null;
+    /**
+     * Deletes the trigger AND the query the user typed after it, then writes the markup in their
+     * place, so picking someone from a mention menu replaces everything typed since the `@`
+     * instead of stacking the mention after it.
+     */
+    replaceTriggerWith: (trigger: string, query: string, html: string) => void;
+}
+declare const RichTextEditor: import('react').ForwardRefExoticComponent<IRichTextEditorProps & import('react').RefAttributes<IRichTextEditorHandle>>;
+export default RichTextEditor;