@webx-ui/core 0.16.0 → 0.18.0

package/dist/components/CodeEditor/CodeEditor.d.ts

@@ -0,0 +1,44 @@
+import { Extension } from '@codemirror/state';
+import { EditorView } from '@codemirror/view';
+import { CodeEditorDiagnostic, CodeEditorProps } from './types';
+type __VLS_Props = CodeEditorProps;
+declare function format(): boolean;
+type __VLS_PublicProps = {
+    modelValue?: string;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
+    view: import('vue').ShallowRef<EditorView | null, EditorView | null>;
+    focus: () => void | undefined;
+    format: typeof format;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    change: (value: string) => any;
+    "update:modelValue": (value: string) => any;
+    blur: () => any;
+    focus: () => any;
+    lint: (diagnostics: CodeEditorDiagnostic[]) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onChange?: ((value: string) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onBlur?: (() => any) | undefined;
+    onFocus?: (() => any) | undefined;
+    onLint?: ((diagnostics: CodeEditorDiagnostic[]) => any) | undefined;
+}>, {
+    size: import('../..').ControlSize;
+    disabled: boolean;
+    placeholder: string;
+    ariaLabel: string;
+    status: import('../..').ControlStatus;
+    id: string;
+    language: import('./types').CodeEditorLanguage;
+    readonly: boolean;
+    minHeight: string;
+    maxHeight: string;
+    lineNumbers: boolean;
+    lineWrapping: boolean;
+    tabSize: number;
+    lint: boolean;
+    extensions: Extension[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    host: HTMLDivElement;
+}, any>;
+export default _default;

package/dist/components/CodeEditor/highlight.d.ts

@@ -0,0 +1,7 @@
+import { HighlightStyle } from '@codemirror/language';
+/**
+ * Syntax colours come from the semantic tokens, so both themes are covered by the
+ * same style and a project that re-tints its primary colour re-tints its code too.
+ * The palette is deliberately small: five roles, not a rainbow.
+ */
+export declare const highlightStyle: HighlightStyle;

package/dist/components/CodeEditor/index.d.ts

@@ -0,0 +1,2 @@
+export { default as WxCodeEditor } from './CodeEditor';
+export type * from './types';

package/dist/components/CodeEditor/languages.d.ts

@@ -0,0 +1,14 @@
+import { Extension } from '@codemirror/state';
+import { LintSource } from '@codemirror/lint';
+import { CodeEditorLanguage } from './types';
+interface LanguageSupport {
+    extension: () => Extension;
+    /** Only JSON has a parser cheap enough to run on every keystroke. */
+    linter?: () => LintSource;
+}
+/**
+ * Each entry is a factory rather than an instance: language support carries
+ * state fields, and CodeMirror expects a fresh one per editor.
+ */
+export declare const LANGUAGES: Record<CodeEditorLanguage, LanguageSupport>;
+export {};

package/dist/components/CodeEditor/types.d.ts

@@ -0,0 +1,56 @@
+import { Extension } from '@codemirror/state';
+import { EditorView } from '@codemirror/view';
+import { ControlSize, ControlStatus } from '../../composables/useFormField';
+/** The languages the editor highlights out of the box. `plain` highlights nothing. */
+export type CodeEditorLanguage = 'json' | 'javascript' | 'typescript' | 'html' | 'css' | 'markdown' | 'yaml' | 'php' | 'plain';
+export interface CodeEditorDiagnostic {
+    /** Offset of the first character the problem covers. */
+    from: number;
+    /** Offset just past the last character it covers. */
+    to: number;
+    severity: 'error' | 'warning' | 'info' | 'hint';
+    message: string;
+}
+export interface CodeEditorProps {
+    language?: CodeEditorLanguage;
+    placeholder?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    size?: ControlSize;
+    status?: ControlStatus;
+    id?: string;
+    /** Accessible label used when there is no visible `<label>`. */
+    ariaLabel?: string;
+    /** Height of the editing area before it starts growing. */
+    minHeight?: string;
+    /** Height at which the editor stops growing and scrolls instead. */
+    maxHeight?: string;
+    lineNumbers?: boolean;
+    /** Wrap long lines instead of scrolling horizontally. */
+    lineWrapping?: boolean;
+    /** Width of one indentation step, in spaces; Tab inserts this many. */
+    tabSize?: number;
+    /**
+     * Check the document with the language's own linter and underline what it finds.
+     * Only JSON ships with one; the flag is ignored elsewhere.
+     */
+    lint?: boolean;
+    /** Extra CodeMirror extensions, for anything this component does not wrap. */
+    extensions?: Extension[];
+}
+export interface CodeEditorEmits {
+    change: [value: string];
+    focus: [];
+    blur: [];
+    /** The linter ran; an empty list means the document is valid. */
+    lint: [diagnostics: CodeEditorDiagnostic[]];
+}
+export interface CodeEditorExposed {
+    view: EditorView | null;
+    focus: () => void;
+    /**
+     * Re-indents a JSON document with `tabSize` spaces. Returns `false` and leaves the
+     * text alone when it does not parse or the language is not JSON.
+     */
+    format: () => boolean;
+}

package/dist/components/ColorPicker/ColorPicker.d.ts

@@ -19,7 +19,7 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {},
     clearable: boolean;
     status: import('../..').ControlStatus;
     id: string;
-    presets: string[];
     readonly: boolean;
+    presets: string[];
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/components/Countdown/Countdown.d.ts

@@ -28,9 +28,9 @@ declare const __VLS_component: import('vue').DefineComponent<CountdownProps, {
     title: string;
     tone: import('..').TextTone;
     align: import('..').TextAlign;
+    format: string;
     prefix: string;
     suffix: string;
-    format: string;
     interval: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;

package/dist/components/Dialog/Dialog.d.ts

@@ -82,10 +82,10 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
     closeLabel: string;
     width: number | string;
     scroll: import('./types').DialogScroll;
+    minHeight: number;
     height: number | string;
     stickyFooter: boolean;
     minWidth: number;
-    minHeight: number;
     sidebarWidth: number | string;
     closeOnOverlay: boolean;
     closeOnEscape: boolean;

package/dist/components/Icon/icons.d.ts

@@ -43,6 +43,7 @@ export declare const builtinIcons: {
     readonly user: "<circle cx=\"12\" cy=\"8\" r=\"3.75\"/><path d=\"M4.5 20a7.5 7.5 0 0 1 15 0\"/>";
     readonly users: "<circle cx=\"9.5\" cy=\"8.5\" r=\"3.4\"/><path d=\"M2.5 20a7 7 0 0 1 14 0\"/><path d=\"M16 5.5a3.4 3.4 0 0 1 0 6.6M17.5 14.2A6.3 6.3 0 0 1 21.5 20\"/>";
     readonly settings: "<circle cx=\"12\" cy=\"12\" r=\"3\"/><path d=\"M12 4v2.5M12 17.5V20M4 12h2.5M17.5 12H20M6.34 6.34l1.77 1.77M15.89 15.89l1.77 1.77M17.66 6.34l-1.77 1.77M6.34 17.66l1.77-1.77\"/>";
+    readonly gear: "<path stroke-linejoin=\"round\" d=\"M10.6 4.7L10.7 2.5L13.3 2.5L13.4 4.7L16.1 5.8L17.8 4.4L19.6 6.2L18.2 7.9L19.3 10.6L21.5 10.7L21.5 13.3L19.3 13.4L18.2 16.1L19.6 17.8L17.8 19.6L16.1 18.2L13.4 19.3L13.3 21.5L10.7 21.5L10.6 19.3L7.9 18.2L6.2 19.6L4.4 17.8L5.8 16.1L4.7 13.4L2.5 13.3L2.5 10.7L4.7 10.6L5.8 7.9L4.4 6.2L6.2 4.4L7.9 5.8Z\"/><circle cx=\"12\" cy=\"12\" r=\"3\"/>";
     readonly sliders: "<path d=\"M4 7h9M17 7h3M4 17h3M11 17h9\"/><circle cx=\"15\" cy=\"7\" r=\"2\"/><circle cx=\"9\" cy=\"17\" r=\"2\"/>";
     readonly home: "<path d=\"M4 10.5 12 4l8 6.5V19a1.5 1.5 0 0 1-1.5 1.5H15V14H9v6.5H5.5A1.5 1.5 0 0 1 4 19Z\"/>";
     readonly file: "<path d=\"M13.5 3.5H7a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V9zm0 0V9H19\"/>";

package/dist/components/ImageEditor/ImageEditor.d.ts

@@ -31,8 +31,9 @@ declare const _default: import('vue').DefineComponent<ImageEditorProps, {
 }>, {
     disabled: boolean;
     footer: boolean;
-    background: string;
+    maxHeight: number;
     format: "auto" | "image/jpeg" | "image/png" | "image/webp";
+    background: string;
     filters: boolean;
     resizable: boolean;
     minSize: number;
@@ -45,7 +46,6 @@ declare const _default: import('vue').DefineComponent<ImageEditorProps, {
     ratios: (ImageEditorRatio | ImageEditorRatioOption)[];
     rotatable: boolean;
     flippable: boolean;
-    maxHeight: number;
     quality: number;
     crossOrigin: "anonymous" | "use-credentials" | "";
     resetLabel: string;

package/dist/components/InputNumber/InputNumber.d.ts

@@ -29,8 +29,8 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
     id: string;
     max: number;
     wheel: boolean;
-    min: number;
     readonly: boolean;
+    min: number;
     step: number;
     precision: number;
     controls: boolean;

package/dist/components/Scrollbar/Scrollbar.d.ts

@@ -23,8 +23,8 @@ declare const __VLS_component: import('vue').DefineComponent<ScrollbarProps, {
 }>, {
     size: import('./types').ScrollbarSize;
     always: boolean;
-    height: number | string;
     maxHeight: number | string;
+    height: number | string;
     axis: import('./types').ScrollbarAxis;
     chainScroll: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {

package/dist/components/Text/Text.d.ts

@@ -13,10 +13,10 @@ declare const __VLS_component: import('vue').DefineComponent<TextProps, {}, {},
     as: string;
     tone: import('./types').TextTone;
     align: import('./types').TextAlign;
+    italic: boolean;
     truncate: boolean | number;
     mono: boolean;
     weight: import('./types').TextWeight;
-    italic: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/Tooltip/Tooltip.d.ts

@@ -31,8 +31,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
     align: import('./types').TooltipAlign;
     offset: number;
     teleport: boolean;
-    arrow: boolean;
     delay: number;
+    arrow: boolean;
     maxWidth: number | string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;

package/dist/components/Upload/Upload.d.ts

@@ -54,12 +54,12 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
     multiple: boolean;
     disabled: boolean;
     max: number;
+    hint: string;
     removable: boolean;
     accept: string;
     maxSize: number;
     buttonOnly: boolean;
     buttonText: string;
-    hint: string;
     gallery: boolean;
     beforeAdd: (file: File) => boolean | Promise<boolean>;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {

package/dist/components/index.d.ts

@@ -17,6 +17,7 @@ export * from './ButtonGroup';
 export * from './Card';
 export * from './Cascader';
 export * from './Checkbox';
+export * from './CodeEditor';
 export * from './CheckboxGroup';
 export * from './Col';
 export * from './ColorPicker';