@webx-ui/core 0.13.0 → 0.14.0

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

@@ -19,10 +19,10 @@ export declare const builtinIcons: {
     readonly search: "<circle cx=\"11\" cy=\"11\" r=\"6.5\"/><path d=\"m16 16 4.5 4.5\"/>";
     readonly filter: "<path d=\"M4 5.5h16l-6.2 7.2v5.1l-3.6 2v-7.1z\"/>";
     readonly crop: "<path d=\"M6.5 2.5v13a2 2 0 0 0 2 2h13\"/><path d=\"M2.5 6.5h13a2 2 0 0 1 2 2v13\"/>";
-    readonly 'rotate-left': "<path d=\"M19.4 13.8A7.5 7.5 0 1 0 12 5\"/><path d=\"M14.3 2.9 12 5l2.3 2.1\"/>";
-    readonly 'rotate-right': "<path d=\"M4.6 13.8A7.5 7.5 0 1 1 12 5\"/><path d=\"M9.7 2.9 12 5l-2.3 2.1\"/>";
-    readonly 'flip-horizontal': "<path d=\"M12 3v18\" stroke-dasharray=\"3 3\"/><path d=\"M9.2 7.2v9.6L3.6 12z\"/><path d=\"M14.8 7.2v9.6L20.4 12z\"/>";
-    readonly 'flip-vertical': "<path d=\"M3 12h18\" stroke-dasharray=\"3 3\"/><path d=\"M7.2 9.2h9.6L12 3.6z\"/><path d=\"M7.2 14.8h9.6L12 20.4z\"/>";
+    readonly 'rotate-left': "<path d=\"M4.5 9.5A8 8 0 1 1 4 13.5\"/><path d=\"M9.5 9.5h-5v-5\"/>";
+    readonly 'rotate-right': "<path d=\"M19.5 9.5A8 8 0 1 0 20 13.5\"/><path d=\"M14.5 9.5h5v-5\"/>";
+    readonly 'flip-horizontal': "<path d=\"M12 3.5v17\" stroke-dasharray=\"2.5 2.5\"/><path d=\"M9.5 7.5v9L4 14.5v-5z\" fill=\"currentColor\" stroke=\"none\"/><path d=\"M14.5 7.5v9l5.5-2v-5z\"/>";
+    readonly 'flip-vertical': "<path d=\"M3.5 12h17\" stroke-dasharray=\"2.5 2.5\"/><path d=\"M7.5 9.5h9L14.5 4h-5z\" fill=\"currentColor\" stroke=\"none\"/><path d=\"M7.5 14.5h9L14.5 20h-5z\"/>";
     readonly refresh: "<path d=\"M4 12a8 8 0 0 1 13.7-5.6L20 8.5\"/><path d=\"M20 4.5v4h-4\"/><path d=\"M20 12a8 8 0 0 1-13.7 5.6L4 15.5\"/><path d=\"M4 19.5v-4h4\"/>";
     readonly upload: "<path d=\"M12 16V4m0 0-4.5 4.5M12 4l4.5 4.5\"/><path d=\"M4 15v3.5A1.5 1.5 0 0 0 5.5 20h13a1.5 1.5 0 0 0 1.5-1.5V15\"/>";
     readonly download: "<path d=\"M12 4v12m0 0-4.5-4.5M12 16l4.5-4.5\"/><path d=\"M4 15v3.5A1.5 1.5 0 0 0 5.5 20h13a1.5 1.5 0 0 0 1.5-1.5V15\"/>";

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

@@ -33,6 +33,7 @@ declare const _default: import('vue').DefineComponent<ImageEditorProps, {
     footer: boolean;
     background: string;
     format: "auto" | "image/jpeg" | "image/png" | "image/webp";
+    filters: boolean;
     resizable: boolean;
     minSize: number;
     maxWidth: number;
@@ -54,7 +55,15 @@ declare const _default: import('vue').DefineComponent<ImageEditorProps, {
     flipVerticalLabel: string;
     ratioLabel: string;
     cropLabel: string;
+    outputLabel: string;
+    outputHint: string;
     widthLabel: string;
+    heightLabel: string;
+    adjustLabel: string;
+    brightnessLabel: string;
+    contrastLabel: string;
+    saturationLabel: string;
+    monoLabel: string;
     freeLabel: string;
     originalLabel: string;
     errorText: string;

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

@@ -0,0 +1,23 @@
+import { ImageEditorAdjustments } from './types';
+/** Nothing done to the picture: the reading every slider starts at. */
+export declare const NEUTRAL: ImageEditorAdjustments;
+export declare function isNeutral(adjust: ImageEditorAdjustments): boolean;
+/**
+ * The adjustments as a CSS `filter` — the same string the `<img>` is shown through and
+ * the canvas is drawn under, which is what keeps the preview honest.
+ *
+ * Order matters and is the order a reader expects: lighten, then stretch the contrast,
+ * then the colour, and black-and-white last so that it wins over whatever the saturation
+ * slider was left at.
+ */
+export declare function filterString(adjust: ImageEditorAdjustments): string;
+/**
+ * The same arithmetic by hand, for a browser whose canvas has no `filter`.
+ *
+ * Safari only learned `ctx.filter` in 16.4, and where it is missing it is missing
+ * silently: the picture on screen is adjusted, the file that comes out is not. Doing the
+ * pass ourselves is the difference between a wrong file and a slow one.
+ *
+ * Written over the pixels in place, in the order `filterString` composes them.
+ */
+export declare function applyAdjustments(pixels: Uint8ClampedArray, adjust: ImageEditorAdjustments): void;

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

@@ -1,3 +1,4 @@
 export { default as WxImageEditor } from './ImageEditor';
 export { ratioLabelFor } from './crop';
+export { filterString } from './filters';
 export type * from './types';

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

@@ -15,6 +15,18 @@ export interface ImageEditorRatioOption {
     /** Derived from the number when it is left out — `1.7778` reads as `16:9`. */
     label?: string;
 }
+/**
+ * The adjustments, as percentages of what the picture already is: 100 leaves it alone.
+ * They are the four a photograph for a website actually wants, and no more — a preset is
+ * a name for a set of these numbers, and can be built on top without the editor knowing.
+ */
+export interface ImageEditorAdjustments {
+    brightness: number;
+    contrast: number;
+    saturation: number;
+    /** Black and white, which overrules whatever the saturation is set to. */
+    mono: boolean;
+}
 /** What the editor hands over. Nothing is uploaded; this is a blob and its measurements. */
 export interface ImageEditorResult {
     blob: Blob;
@@ -33,6 +45,10 @@ export interface ImageEditorResult {
     rotation: number;
     flipX: boolean;
     flipY: boolean;
+    /** The adjustments as they stood, and the CSS `filter` that says the same thing. */
+    adjustments: ImageEditorAdjustments;
+    /** Empty when the picture was left alone. A server can apply the same numbers. */
+    filter: string;
 }
 export interface ImageEditorProps {
     /** The picture: a URL, or the `File` an upload field just handed you. */
@@ -55,8 +71,13 @@ export interface ImageEditorProps {
     rotatable?: boolean;
     /** Mirroring, across and down. */
     flippable?: boolean;
-    /** Offers the output size — the field that scales the cut-out down before it is written. */
+    /** Offers the output size — the fields that scale the cut-out down before it is written. */
     resizable?: boolean;
+    /**
+     * Offers the adjustments: brightness, contrast, saturation and black-and-white, behind
+     * one button. Off by default, so an editor asked for as a cropper stays one.
+     */
+    filters?: boolean;
     /** Largest output, in pixels. A bigger crop is scaled down to fit inside it. */
     maxWidth?: number;
     maxHeight?: number;
@@ -93,8 +114,17 @@ export interface ImageEditorProps {
     /** Accessible name of the ratio picker, and of the crop box itself. */
     ratioLabel?: string;
     cropLabel?: string;
-    /** The output-size field. */
+    /** The output-size row: its caption, the tip on that caption, and the two fields. */
+    outputLabel?: string;
+    outputHint?: string;
     widthLabel?: string;
+    heightLabel?: string;
+    /** The adjustments: the button, and the four things inside its panel. */
+    adjustLabel?: string;
+    brightnessLabel?: string;
+    contrastLabel?: string;
+    saturationLabel?: string;
+    monoLabel?: string;
     freeLabel?: string;
     originalLabel?: string;
     /** Shown in place of the picture when it will not load. */

package/dist/components/Progress/Progress.d.ts

@@ -29,8 +29,8 @@ declare const __VLS_component: import('vue').DefineComponent<ProgressProps, {},
     max: number;
     indeterminate: boolean;
     formatter: (value: number, max: number) => string;
-    thickness: number;
     showValue: boolean;
+    thickness: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/Slider/Slider.d.ts

@@ -19,8 +19,8 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {},
     range: boolean;
     min: number;
     step: number;
+    minStepsBetweenThumbs: number;
     showValue: boolean;
     marks: Record<number, string>;
-    minStepsBetweenThumbs: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

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

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