@mono-lit/helper 0.0.3 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/control-tooltip-7vegYmq3.js +678 -0
- package/dist/{tooltip-FCMRUSLi.js → control-tooltip-C3rA_nSH.js} +12 -119
- package/dist/{data-source-controller-Cf_sMxEh.js → data-source-controller-C6C4ej_M.js} +1 -1
- package/dist/{data-source-options-Bk-UoaZV.js → data-source-options-Cz9fVLK8.js} +3 -2
- package/dist/{data-source-read-Cuqw3LcP.js → data-source-read-i6CYSUEl.js} +2 -1
- package/dist/{excel-DtRpxmxs.js → excel-BPdDt06G.js} +1 -1
- package/dist/{export-B91P6J1y.js → export-DgomqI_3.js} +2 -2
- package/dist/export.js +2 -2
- package/dist/{field-icons-FmyBWa0g.js → field-icons-t8rXRCKs.js} +50 -1
- package/dist/field-tooltip-FyMi9vNM.js +266 -0
- package/dist/field-tooltip.css_raw-DEctHXKm.js +270 -0
- package/dist/field-validation-CHHQi1zl.js +170 -0
- package/dist/field-validation.css_raw-B3Iu33rS.js +178 -0
- package/dist/index.js +4 -3
- package/dist/{index.node-dvrNviMx.js → index.node-DzCuvHLg.js} +1 -1
- package/dist/index.node.js +4 -3
- package/dist/input-format-GrRCJBqV.js +251 -0
- package/dist/input.css_raw-CQu2fAsU.js +5 -0
- package/dist/{mono-data-grid-BHlo1IgR.js → mono-data-grid-KDpu4d4_.js} +5 -4
- package/dist/{mono-form-controller-IYn0MuUQ.js → mono-form-controller-BkMR8g14.js} +18 -3
- package/dist/{reactive-DFCdZbH9.js → normalize-error-BmLbgANw.js} +1 -48
- package/dist/nuxt.js +36 -8
- package/dist/{popup-portal-HWhkd7oy.js → popup-portal-C8ttHDRX.js} +17 -1
- package/dist/{popup-stack-De05Y-mJ.js → popup-stack-C64WCuXq.js} +21 -1
- package/dist/src/components/accordion/accordion-core.d.ts +4 -1
- package/dist/src/components/accordion/mono-accordion.shadow.d.ts +4 -1
- package/dist/src/components/date/date-core.d.ts +3 -0
- package/dist/src/components/date/date-types.d.ts +36 -1
- package/dist/src/components/drawer/drawer-core.d.ts +1 -0
- package/dist/src/components/dropdown-table/dropdown-table-core.d.ts +3 -0
- package/dist/src/components/dropdown-table/dropdown-table-types.d.ts +31 -0
- package/dist/src/components/form/form-types.d.ts +23 -5
- package/dist/src/components/input/index.d.ts +2 -2
- package/dist/src/components/input/index.shadow.d.ts +2 -2
- package/dist/src/components/input/input-core.d.ts +23 -3
- package/dist/src/components/input/input-types.d.ts +84 -9
- package/dist/src/components/input/mono-input.d.ts +3 -2
- package/dist/src/components/input/mono-input.shadow.d.ts +3 -2
- package/dist/src/components/modal/modal-core.d.ts +1 -0
- package/dist/src/components/otp/index.d.ts +5 -0
- package/dist/src/components/otp/index.shadow.d.ts +6 -0
- package/dist/src/components/otp/mono-otp.d.ts +32 -0
- package/dist/src/components/otp/mono-otp.shadow.d.ts +30 -0
- package/dist/src/components/otp/otp-core.d.ts +91 -0
- package/dist/src/components/otp/otp-types.d.ts +161 -0
- package/dist/src/components/otp/otp-utils.d.ts +41 -0
- package/dist/src/components/select/select-core.d.ts +3 -0
- package/dist/src/components/select/select-types.d.ts +31 -0
- package/dist/src/components/slider/index.d.ts +5 -0
- package/dist/src/components/slider/index.shadow.d.ts +6 -0
- package/dist/src/components/slider/mono-slider.d.ts +33 -0
- package/dist/src/components/slider/mono-slider.shadow.d.ts +29 -0
- package/dist/src/components/slider/slider-core.d.ts +77 -0
- package/dist/src/components/slider/slider-math.d.ts +102 -0
- package/dist/src/components/slider/slider-types.d.ts +188 -0
- package/dist/src/components/tag-input/tag-input-core.d.ts +3 -0
- package/dist/src/components/tag-input/tag-input-types.d.ts +31 -0
- package/dist/src/components/textarea/textarea-core.d.ts +3 -0
- package/dist/src/components/textarea/textarea-types.d.ts +31 -0
- package/dist/src/composables/field-bubble.d.ts +34 -0
- package/dist/src/composables/field-icons.d.ts +10 -0
- package/dist/src/composables/field-tooltip.d.ts +52 -0
- package/dist/src/composables/field-validation.d.ts +58 -0
- package/dist/src/composables/popup-portal.d.ts +12 -0
- package/dist/src/composables/popup-stack.d.ts +21 -0
- package/dist/src/entries/index.d.ts +1 -1
- package/dist/src/entries/index.node.d.ts +1 -1
- package/dist/src/nuxt/index.d.ts +2 -2
- package/dist/src/nuxt/ssr-lit/index.d.ts +4 -0
- package/dist/ssr-lit/runtime/components/LitWrapper.vue +11 -0
- package/dist/ssr-lit/runtime/components/LitWrapperClient.vue +11 -0
- package/dist/ssr-lit/runtime/components/LitWrapperServer.vue +38 -0
- package/dist/ssr-lit/runtime/plugins/antiFouc.server.js +25 -0
- package/dist/ssr-lit/runtime/plugins/hydrateSupport.client.js +4 -0
- package/dist/ssr-lit/runtime/plugins/polyfill.client.js +9 -0
- package/dist/ssr-lit/runtime/utils/customElements.js +11 -0
- package/dist/ssr-lit/runtime/utils/litElementRenderer.js +28 -0
- package/dist/{styles-D-ergrfR.js → styles-BODNpZV1.js} +1 -1
- package/dist/tooltip-Drekihf5.js +102 -0
- package/dist/tooltip-loader-3U9FTOXj.js +20 -0
- package/dist/tooltip-loader-Dcp9AUZn.js +23 -0
- package/dist/tooltip.js +3 -1
- package/dist/ui/accordion.js +16 -3
- package/dist/ui/alert.js +2 -2
- package/dist/ui/breadcrumb.js +1 -1
- package/dist/ui/button-dropdown.js +1 -1
- package/dist/ui/chart.js +1 -1
- package/dist/ui/date.js +66 -5
- package/dist/ui/drawer.js +11 -2
- package/dist/ui/dropdown-table.js +60 -5
- package/dist/ui/dropdown.js +3 -2
- package/dist/ui/file-upload.js +1 -1
- package/dist/ui/form.js +1 -1
- package/dist/ui/index.css +8857 -3974
- package/dist/ui/input.js +362 -260
- package/dist/ui/menu.js +1 -1
- package/dist/ui/modal.js +11 -2
- package/dist/ui/otp.js +835 -0
- package/dist/ui/select.js +67 -3
- package/dist/ui/shadow/accordion.js +31 -4
- package/dist/ui/shadow/alert.js +1 -1
- package/dist/ui/shadow/button-dropdown.js +1 -1
- package/dist/ui/shadow/chart.js +4 -4
- package/dist/ui/shadow/date.js +67 -6
- package/dist/ui/shadow/drawer.js +11 -2
- package/dist/ui/shadow/dropdown-table.js +62 -7
- package/dist/ui/shadow/dropdown.js +3 -2
- package/dist/ui/shadow/input.js +367 -261
- package/dist/ui/shadow/modal.js +11 -2
- package/dist/ui/shadow/otp.js +842 -0
- package/dist/ui/shadow/select.js +71 -6
- package/dist/ui/shadow/sidebar.js +2 -2
- package/dist/ui/shadow/slider.js +1082 -0
- package/dist/ui/shadow/table.js +6 -6
- package/dist/ui/shadow/tag-input.js +72 -7
- package/dist/ui/shadow/textarea.js +63 -2
- package/dist/ui/sidebar.js +2 -2
- package/dist/ui/slider.js +1079 -0
- package/dist/ui/table.js +2 -2
- package/dist/ui/tag-input.js +67 -3
- package/dist/ui/textarea.js +62 -1
- package/dist/ui/theme/luma.css +505 -466
- package/dist/ui/theme/lyra.css +505 -466
- package/dist/ui/theme/maia.css +501 -466
- package/dist/ui/theme/mira.css +505 -466
- package/dist/ui/theme/nova.css +503 -466
- package/dist/ui/theme/one.css +742 -699
- package/dist/ui/theme/rhea.css +506 -466
- package/dist/ui/theme/sera.css +507 -466
- package/dist/ui/theme/vega.css +495 -466
- package/dist/{vite-DcyRlTTf.js → vite-CivRCJaf.js} +2 -0
- package/dist/vite.js +1 -1
- package/dist/vue.d.ts +10 -0
- package/package.json +30 -15
- package/dist/input.css_raw-CGESifay.js +0 -5
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import { Constructor } from "../../composables/hybird-prop.js";
|
|
2
|
+
import { CssSizeValue } from "../../composables/css-size.js";
|
|
3
|
+
import { FieldTooltipController, FieldTooltipValue } from "../../composables/field-tooltip.js";
|
|
4
|
+
import { OtpColor, OtpCssClass, OtpGroups, OtpLabelPosition, OtpSize, OtpType, OtpValidationPosition, OtpValidationState, OtpVariant } from "./otp-types.js";
|
|
5
|
+
import { FieldValidationController } from "../../composables/field-validation.js";
|
|
6
|
+
import { LitElement, TemplateResult, nothing } from "lit";
|
|
7
|
+
//#region src/components/otp/otp-core.d.ts
|
|
8
|
+
export type OtpSlotName = 'prefix' | 'suffix' | 'label' | 'helper';
|
|
9
|
+
/** Glyphs the builds draw: only the clear `×`. */
|
|
10
|
+
export type OtpIconName = 'close';
|
|
11
|
+
/** Public surface added by the core mixin (for typing the wrappers + tag map). */
|
|
12
|
+
export declare class MonoOtpCoreInterface {
|
|
13
|
+
cssClass: OtpCssClass;
|
|
14
|
+
cssClassName: string;
|
|
15
|
+
type: OtpType;
|
|
16
|
+
length: number | string;
|
|
17
|
+
groups?: OtpGroups;
|
|
18
|
+
separator: string;
|
|
19
|
+
mask: boolean;
|
|
20
|
+
size: OtpSize;
|
|
21
|
+
color: OtpColor;
|
|
22
|
+
variant: OtpVariant;
|
|
23
|
+
labelPosition: OtpLabelPosition;
|
|
24
|
+
validationPosition: OtpValidationPosition;
|
|
25
|
+
modelValue: string;
|
|
26
|
+
value: string;
|
|
27
|
+
name: string;
|
|
28
|
+
placeholder: string;
|
|
29
|
+
label: string;
|
|
30
|
+
helperText: string;
|
|
31
|
+
tooltip: FieldTooltipValue;
|
|
32
|
+
validationState: OtpValidationState;
|
|
33
|
+
validationMessage: string;
|
|
34
|
+
error: boolean;
|
|
35
|
+
errorMessage: string;
|
|
36
|
+
success: boolean;
|
|
37
|
+
successMessage: string;
|
|
38
|
+
autocomplete: string;
|
|
39
|
+
inputmode: string;
|
|
40
|
+
ariaLabelText?: string;
|
|
41
|
+
disabled: boolean;
|
|
42
|
+
readonly: boolean;
|
|
43
|
+
required: boolean;
|
|
44
|
+
clearable: boolean;
|
|
45
|
+
autofocus: boolean;
|
|
46
|
+
width?: CssSizeValue;
|
|
47
|
+
height?: CssSizeValue;
|
|
48
|
+
minWidth?: CssSizeValue;
|
|
49
|
+
maxWidth?: CssSizeValue;
|
|
50
|
+
minHeight?: CssSizeValue;
|
|
51
|
+
maxHeight?: CssSizeValue;
|
|
52
|
+
/** True once every box holds a character. */
|
|
53
|
+
readonly complete: boolean;
|
|
54
|
+
/** Focus a box — by default the first empty one (or the last when full). */
|
|
55
|
+
focus(index?: number | FocusOptions): void;
|
|
56
|
+
blur(): void;
|
|
57
|
+
/** Empty every box (fires `input`, `change` and `clear`). */
|
|
58
|
+
clear(): void;
|
|
59
|
+
protected readonly _tooltip: FieldTooltipController;
|
|
60
|
+
protected readonly _validation: FieldValidationController;
|
|
61
|
+
protected _hasPrefixSlotState: boolean;
|
|
62
|
+
protected _hasSuffixSlotState: boolean;
|
|
63
|
+
protected _hasLabelSlotState: boolean;
|
|
64
|
+
protected _hasHelperSlotState: boolean;
|
|
65
|
+
protected readonly _otpId: string;
|
|
66
|
+
protected readonly _messageId: string;
|
|
67
|
+
protected readonly _resolvedValidationState: OtpValidationState;
|
|
68
|
+
protected _cls(base: string, key: keyof OtpCssClass): string;
|
|
69
|
+
protected _renderLabel(): TemplateResult | typeof nothing;
|
|
70
|
+
protected _renderLabelText(): TemplateResult | string;
|
|
71
|
+
protected _renderHelperText(base: string): TemplateResult | typeof nothing;
|
|
72
|
+
protected _renderAffix(name: 'prefix' | 'suffix'): TemplateResult | typeof nothing;
|
|
73
|
+
protected renderIcon(name: OtpIconName): TemplateResult;
|
|
74
|
+
}
|
|
75
|
+
/**
|
|
76
|
+
* `MonoOtpCore` — all render-mode-agnostic logic for `mono-otp`: N single-character boxes that
|
|
77
|
+
* behave as ONE field. The value is a contiguous prefix of the boxes (box i holds `value[i]`), so
|
|
78
|
+
* focus can never land past the first empty box, Backspace / Delete shift the rest left, and a
|
|
79
|
+
* paste or an SMS autofill overwrites from the focused box on (see `otp-utils.ts`).
|
|
80
|
+
*
|
|
81
|
+
* Same prop surface as mono-input (size / color / variant / label-position / validation-position
|
|
82
|
+
* / tooltip / messages / states / sizing), wired to `controlMonoForm` through
|
|
83
|
+
* `MonoFormControlCore`: `input` per edit (live rules), `change` when focus leaves the group
|
|
84
|
+
* (change rules, marks touched), plus `complete` once every box is filled.
|
|
85
|
+
*
|
|
86
|
+
* Each build supplies `createRenderRoot()`, the slot strategy (the `_render*` hooks below) and
|
|
87
|
+
* `renderIcon()` — light captures `slot="…"` children into `[data-mono-slot]` placeholders,
|
|
88
|
+
* shadow uses native `<slot>`s.
|
|
89
|
+
*/
|
|
90
|
+
export declare const MonoOtpCore: <T extends Constructor<LitElement>>(superClass: T) => Constructor<MonoOtpCoreInterface> & T;
|
|
91
|
+
//#endregion
|
|
@@ -0,0 +1,161 @@
|
|
|
1
|
+
import { VisibilityProps } from "../../composables/visibility.js";
|
|
2
|
+
import { MonoTooltipOptions } from "../tooltip/tooltip-types.js";
|
|
3
|
+
//#region src/components/otp/otp-types.d.ts
|
|
4
|
+
/** Which characters a box accepts: digits (default), letters + digits (uppercased), or any non-space character. */
|
|
5
|
+
export type OtpType = 'numeric' | 'alphanumeric' | 'text';
|
|
6
|
+
export type OtpSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
7
|
+
export type OtpVariant = 'outlined' | 'filled' | 'underlined';
|
|
8
|
+
/** `notched` is accepted for parity with mono-input but renders as `top` — there is no single box to notch. */
|
|
9
|
+
export type OtpLabelPosition = 'top' | 'notched' | 'left' | 'right';
|
|
10
|
+
export type OtpValidationPosition = 'bottom' | 'icon' | 'float';
|
|
11
|
+
export type OtpColor = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'teal' | 'purple' | 'neutral' | 'dark';
|
|
12
|
+
export type OtpValidationState = 'default' | 'valid' | 'invalid' | 'warning';
|
|
13
|
+
/** `groups`: a group size (`3`), a list (`[3, 3]`), or the same list from markup (`"3,3"`). */
|
|
14
|
+
export type OtpGroups = number | number[] | string;
|
|
15
|
+
export type OtpModelEventDetail = {
|
|
16
|
+
/** The code typed so far — the boxes joined, always a contiguous prefix. */
|
|
17
|
+
modelValue: string;
|
|
18
|
+
currentValue: string;
|
|
19
|
+
oldValue: string;
|
|
20
|
+
value: string;
|
|
21
|
+
/** True once every box is filled. */
|
|
22
|
+
complete: boolean;
|
|
23
|
+
/** The box the edit happened in (`-1` for a clear or a blur commit). */
|
|
24
|
+
index: number;
|
|
25
|
+
name?: string;
|
|
26
|
+
sourceEvent?: Event;
|
|
27
|
+
};
|
|
28
|
+
export type OtpModelEvent = CustomEvent<OtpModelEventDetail>;
|
|
29
|
+
export interface OtpCssClass {
|
|
30
|
+
root?: string;
|
|
31
|
+
label?: string;
|
|
32
|
+
required?: string;
|
|
33
|
+
field?: string;
|
|
34
|
+
group?: string;
|
|
35
|
+
cell?: string;
|
|
36
|
+
separator?: string;
|
|
37
|
+
prefix?: string;
|
|
38
|
+
suffix?: string;
|
|
39
|
+
clear?: string;
|
|
40
|
+
messageWrap?: string;
|
|
41
|
+
message?: string;
|
|
42
|
+
}
|
|
43
|
+
export interface OtpProps extends VisibilityProps {
|
|
44
|
+
/** Which characters a box accepts: `numeric` (default), `alphanumeric` (uppercased) or `text`. */
|
|
45
|
+
type?: OtpType;
|
|
46
|
+
/** Number of boxes (default 6). */
|
|
47
|
+
length?: number | string;
|
|
48
|
+
/**
|
|
49
|
+
* Split the boxes into groups with a separator between them: a group size (`3` → 3-3),
|
|
50
|
+
* a list (`[3, 3]`, `[2, 2, 2]`) or the markup form `"3,3"`.
|
|
51
|
+
*/
|
|
52
|
+
groups?: OtpGroups;
|
|
53
|
+
/** Text drawn between groups (default `-`). An empty string leaves only the gap. */
|
|
54
|
+
separator?: string;
|
|
55
|
+
/** Hide the typed characters like a password. */
|
|
56
|
+
mask?: boolean;
|
|
57
|
+
/** Visual size of the boxes. */
|
|
58
|
+
size?: OtpSize;
|
|
59
|
+
/** Theme color applied to focus. */
|
|
60
|
+
color?: OtpColor;
|
|
61
|
+
/** Visual style of each box (outlined, filled, or underlined). */
|
|
62
|
+
variant?: OtpVariant;
|
|
63
|
+
/** Where the label sits: `top` (default), `left` or `right`. `notched` renders as `top`. */
|
|
64
|
+
labelPosition?: OtpLabelPosition;
|
|
65
|
+
'label-position'?: OtpLabelPosition;
|
|
66
|
+
labelposition?: OtpLabelPosition;
|
|
67
|
+
/** Where the validation message shows: `bottom` (default), `icon` or `float` (see mono-input). */
|
|
68
|
+
validationPosition?: OtpValidationPosition;
|
|
69
|
+
'validation-position'?: OtpValidationPosition;
|
|
70
|
+
validationposition?: OtpValidationPosition;
|
|
71
|
+
/** A placeholder character drawn in every empty box (e.g. `○` or `-`). */
|
|
72
|
+
placeholder?: string;
|
|
73
|
+
/** Current code. */
|
|
74
|
+
value?: string | number;
|
|
75
|
+
/** Form field name — a hidden input carries the joined code for a native form submit. */
|
|
76
|
+
name?: string;
|
|
77
|
+
/** Two-way bound value. */
|
|
78
|
+
modelValue?: string | number;
|
|
79
|
+
'model-value'?: string | number;
|
|
80
|
+
modelvalue?: string | number;
|
|
81
|
+
/** Disables interaction and dims the boxes. */
|
|
82
|
+
disabled?: boolean;
|
|
83
|
+
/** Makes the boxes read-only while still focusable. */
|
|
84
|
+
readonly?: boolean;
|
|
85
|
+
/** Shows a clear button when a code has been typed. */
|
|
86
|
+
clearable?: boolean;
|
|
87
|
+
/** Marks the field as required and shows a required indicator. */
|
|
88
|
+
required?: boolean;
|
|
89
|
+
/** Focuses the first empty box on first render. */
|
|
90
|
+
autofocus?: boolean;
|
|
91
|
+
/** Label text displayed above the boxes. */
|
|
92
|
+
label?: string;
|
|
93
|
+
/** Helper text shown below the boxes. */
|
|
94
|
+
helperText?: string;
|
|
95
|
+
'helper-text'?: string;
|
|
96
|
+
helpertext?: string;
|
|
97
|
+
/** Info icon at the end of the label (plain text, or full `mono-tooltip` options). */
|
|
98
|
+
tooltip?: string | MonoTooltipOptions;
|
|
99
|
+
/** Explicit validation state for styling and messaging. */
|
|
100
|
+
validationState?: OtpValidationState;
|
|
101
|
+
'validation-state'?: OtpValidationState;
|
|
102
|
+
validationstate?: OtpValidationState;
|
|
103
|
+
/** Validation message shown below the boxes. */
|
|
104
|
+
validationMessage?: string;
|
|
105
|
+
'validation-message'?: string;
|
|
106
|
+
validationmessage?: string;
|
|
107
|
+
/** Marks the field in an error state. */
|
|
108
|
+
error?: boolean;
|
|
109
|
+
/** Error message shown below the boxes. */
|
|
110
|
+
errorMessage?: string;
|
|
111
|
+
'error-message'?: string;
|
|
112
|
+
errormessage?: string;
|
|
113
|
+
/** Marks the field in a success state. */
|
|
114
|
+
success?: boolean;
|
|
115
|
+
/** Success message shown below the boxes. */
|
|
116
|
+
successMessage?: string;
|
|
117
|
+
'success-message'?: string;
|
|
118
|
+
successmessage?: string;
|
|
119
|
+
/** Native autocomplete hint on the first box (default `one-time-code`, which lets phones offer an SMS code). */
|
|
120
|
+
autocomplete?: string;
|
|
121
|
+
/** On-screen keyboard hint. Defaults to `numeric` for `type="numeric"`, otherwise `text`. */
|
|
122
|
+
inputmode?: string;
|
|
123
|
+
/** Accessible label for the group; each box reads "<label> – character i of n". */
|
|
124
|
+
ariaLabelText?: string;
|
|
125
|
+
ariaLabel?: string;
|
|
126
|
+
'aria-label'?: string;
|
|
127
|
+
'aria-label-text'?: string;
|
|
128
|
+
arialabel?: string;
|
|
129
|
+
arialabeltext?: string;
|
|
130
|
+
/** Explicit sizing of the root (CSS length or px number). */
|
|
131
|
+
width?: string | number;
|
|
132
|
+
height?: string | number;
|
|
133
|
+
minWidth?: string | number;
|
|
134
|
+
'min-width'?: string | number;
|
|
135
|
+
maxWidth?: string | number;
|
|
136
|
+
'max-width'?: string | number;
|
|
137
|
+
minHeight?: string | number;
|
|
138
|
+
'min-height'?: string | number;
|
|
139
|
+
maxHeight?: string | number;
|
|
140
|
+
'max-height'?: string | number;
|
|
141
|
+
/** Per-part class overrides for internal elements. */
|
|
142
|
+
cssClass?: OtpCssClass;
|
|
143
|
+
/** Simple HTML root class only. */
|
|
144
|
+
'css-class'?: string;
|
|
145
|
+
}
|
|
146
|
+
export interface OtpEvents {
|
|
147
|
+
input: OtpModelEvent;
|
|
148
|
+
change: OtpModelEvent;
|
|
149
|
+
/** Every box is filled. */
|
|
150
|
+
complete: OtpModelEvent;
|
|
151
|
+
clear: OtpModelEvent;
|
|
152
|
+
'mno-input': OtpModelEvent;
|
|
153
|
+
mnoInput: OtpModelEvent;
|
|
154
|
+
'mno-change': OtpModelEvent;
|
|
155
|
+
mnoChange: OtpModelEvent;
|
|
156
|
+
'mno-complete': OtpModelEvent;
|
|
157
|
+
mnoComplete: OtpModelEvent;
|
|
158
|
+
'mno-clear': OtpModelEvent;
|
|
159
|
+
mnoClear: OtpModelEvent;
|
|
160
|
+
}
|
|
161
|
+
//#endregion
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { OtpGroups, OtpType } from "./otp-types.js";
|
|
2
|
+
//#region src/components/otp/otp-utils.d.ts
|
|
3
|
+
/**
|
|
4
|
+
* Pure helpers behind `mono-otp`. The value is always a CONTIGUOUS prefix of the boxes — box i
|
|
5
|
+
* holds `value[i]` — so every edit is a string operation and the boxes are just its characters.
|
|
6
|
+
*/
|
|
7
|
+
export declare const OTP_DEFAULT_LENGTH = 6;
|
|
8
|
+
/** One character cleaned for `type`; `''` when it is not accepted. */
|
|
9
|
+
export declare function sanitizeOtpChar(ch: string, type?: OtpType): string;
|
|
10
|
+
/** A whole string cleaned for `type` — rejected characters are dropped, not kept as holes. */
|
|
11
|
+
export declare function sanitizeOtpText(text: unknown, type?: OtpType): string;
|
|
12
|
+
/** `length` from a prop or attribute: a whole number ≥ 1, else the default. */
|
|
13
|
+
export declare function resolveOtpLength(length: unknown): number;
|
|
14
|
+
/** The model for `length` boxes: cleaned and cut to fit. */
|
|
15
|
+
export declare function normaliseOtpValue(value: unknown, length: number, type?: OtpType): string;
|
|
16
|
+
/**
|
|
17
|
+
* Group sizes → the box indexes a separator goes BEFORE. `3` repeats (6 boxes → 3-3, 8 → 3-3-2);
|
|
18
|
+
* a list is taken as given and any boxes past it form one last group.
|
|
19
|
+
*/
|
|
20
|
+
export declare function parseOtpGroups(groups: OtpGroups | null | undefined, length: number): number[];
|
|
21
|
+
export interface OtpEdit {
|
|
22
|
+
value: string;
|
|
23
|
+
/** The box to focus next. */
|
|
24
|
+
caret: number;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Put `text` at box `index`. One character replaces that box; several (a paste, an SMS
|
|
28
|
+
* autofill) overwrite from `index` onwards. Rejected characters are dropped first, so pasting
|
|
29
|
+
* `"123-456"` into a numeric field fills six boxes.
|
|
30
|
+
*/
|
|
31
|
+
export declare function spliceOtpValue(value: string, index: number, text: string, length: number, type?: OtpType): OtpEdit;
|
|
32
|
+
/** Remove the character in box `index`; the boxes after it move left. */
|
|
33
|
+
export declare function removeOtpChar(value: string, index: number, length: number): OtpEdit;
|
|
34
|
+
/**
|
|
35
|
+
* Backspace in box `index`: clear it when it holds a character, otherwise step back and clear
|
|
36
|
+
* the one before.
|
|
37
|
+
*/
|
|
38
|
+
export declare function backspaceOtp(value: string, index: number, length: number): OtpEdit;
|
|
39
|
+
/** The furthest box that can take focus: the first empty one, or the last box when full. */
|
|
40
|
+
export declare function clampCaret(index: number, filled: number, length: number): number;
|
|
41
|
+
//#endregion
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Constructor } from "../../composables/hybird-prop.js";
|
|
2
2
|
import { CssSizeValue } from "../../composables/css-size.js";
|
|
3
3
|
import { MonoSearchValue } from "../../search/data-search.js";
|
|
4
|
+
import { FieldTooltipController, FieldTooltipValue } from "../../composables/field-tooltip.js";
|
|
4
5
|
import { SelectColor, SelectCssClass, SelectDataSource, SelectDisplayGroup, SelectDisplayValue, SelectDropdownOptions, SelectItem, SelectLoadMore, SelectSize, SelectValidationState, SelectValue, SelectVariant } from "./select-types.js";
|
|
5
6
|
import { LateSlotWatcher } from "../../composables/light-slots.js";
|
|
6
7
|
import { LitElement, TemplateResult } from "lit";
|
|
@@ -31,6 +32,8 @@ export declare class MonoSelectCoreInterface {
|
|
|
31
32
|
label: string;
|
|
32
33
|
placeholder: string;
|
|
33
34
|
helperText: string;
|
|
35
|
+
tooltip: FieldTooltipValue;
|
|
36
|
+
protected readonly _tooltip: FieldTooltipController;
|
|
34
37
|
validationState: SelectValidationState;
|
|
35
38
|
validationMessage: string;
|
|
36
39
|
errorMessage: string;
|
|
@@ -3,6 +3,7 @@ import { DescribedError } from "../../utils/normalize-error.js";
|
|
|
3
3
|
import { LoadMoreMode, MonoDataSource } from "../../composables/data-source-controller.js";
|
|
4
4
|
import { VisibilityProps } from "../../composables/visibility.js";
|
|
5
5
|
import { MonoSearchValue } from "../../search/data-search.js";
|
|
6
|
+
import { MonoTooltipOptions } from "../tooltip/tooltip-types.js";
|
|
6
7
|
//#region src/components/select/select-types.d.ts
|
|
7
8
|
/**
|
|
8
9
|
* Sizes the popup PANEL only, independent of the field — the same object
|
|
@@ -13,6 +14,10 @@ export type SelectDropdownOptions = PanelSizeProps;
|
|
|
13
14
|
export type SelectSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
|
|
14
15
|
export type SelectColor = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'teal' | 'purple' | 'neutral' | 'dark';
|
|
15
16
|
export type SelectVariant = 'outlined' | 'filled' | 'underlined';
|
|
17
|
+
/** Where the label sits: above the box (default), notched into its top border (inset for filled / underlined), or beside it. */
|
|
18
|
+
export type SelectLabelPosition = 'top' | 'notched' | 'left' | 'right';
|
|
19
|
+
/** Where the validation message shows: under the box (default), behind a state icon inside it, or floating under it on hover / focus. */
|
|
20
|
+
export type SelectValidationPosition = 'bottom' | 'icon' | 'float';
|
|
16
21
|
export type SelectValidationState = 'default' | 'valid' | 'invalid' | 'warning';
|
|
17
22
|
export type SelectValue = unknown;
|
|
18
23
|
export interface SelectItem {
|
|
@@ -187,6 +192,24 @@ export interface SelectProps extends VisibilityProps {
|
|
|
187
192
|
color?: SelectColor;
|
|
188
193
|
/** Visual style variant of the select. */
|
|
189
194
|
variant?: SelectVariant;
|
|
195
|
+
/**
|
|
196
|
+
* Where the label sits: `top` (above the box, default), `notched` (on the top
|
|
197
|
+
* border for outlined; inset inside the box for filled / underlined), or
|
|
198
|
+
* `left` / `right` of the box. Knobs: `--mono-select-label-width`, `-label-side-gap`,
|
|
199
|
+
* `-label-notch-font-size`, `-label-notch-bg`.
|
|
200
|
+
*/
|
|
201
|
+
labelPosition?: SelectLabelPosition;
|
|
202
|
+
'label-position'?: SelectLabelPosition;
|
|
203
|
+
labelposition?: SelectLabelPosition;
|
|
204
|
+
/**
|
|
205
|
+
* Where the validation message shows. `bottom` (default): the row under the box.
|
|
206
|
+
* `icon`: a state icon inside the box; hover / tap / keyboard focus shows the message in
|
|
207
|
+
* a state-coloured bubble. `float`: the message floats under the box only while the field
|
|
208
|
+
* is hovered or focused. In `icon` / `float` the row under the box keeps the helper text.
|
|
209
|
+
*/
|
|
210
|
+
validationPosition?: SelectValidationPosition;
|
|
211
|
+
'validation-position'?: SelectValidationPosition;
|
|
212
|
+
validationposition?: SelectValidationPosition;
|
|
190
213
|
/** Text label shown above the select. */
|
|
191
214
|
label?: string;
|
|
192
215
|
/** Placeholder text shown when no value is selected. */
|
|
@@ -195,6 +218,14 @@ export interface SelectProps extends VisibilityProps {
|
|
|
195
218
|
helperText?: string;
|
|
196
219
|
'helper-text'?: string;
|
|
197
220
|
helpertext?: string;
|
|
221
|
+
/**
|
|
222
|
+
* Info icon at the end of the label; hovering, focusing or tapping it shows this text.
|
|
223
|
+
* Plain text → a small built-in bubble (no dependency). Full tooltip options
|
|
224
|
+
* (`:tooltip.prop="{ content, placement, color }"`) → a `mono-tooltip`, which needs the
|
|
225
|
+
* optional `@floating-ui/dom` + `@floating-ui/core` peers (without them that form renders
|
|
226
|
+
* no icon). Shown only beside a label.
|
|
227
|
+
*/
|
|
228
|
+
tooltip?: string | MonoTooltipOptions;
|
|
198
229
|
/** Validation state controlling the select's appearance. */
|
|
199
230
|
validationState?: SelectValidationState;
|
|
200
231
|
'validation-state'?: SelectValidationState;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference path="../../../vue.d.ts" />
|
|
2
|
+
import { SliderColor, SliderCssClass, SliderEvents, SliderFill, SliderMark, SliderModelEvent, SliderModelEventDetail, SliderProps, SliderSize, SliderType, SliderValidationState, SliderValue, SliderValueTooltip } from "./slider-types.js";
|
|
3
|
+
import { MonoSlider } from "./mono-slider.js";
|
|
4
|
+
import { SliderMarkPoint, SliderPiece, SliderScale, coerceNumbers, fromRatio, markPoints, moveRun, moveThumb, nearestThumb, normalise, resolveScale, snap, stepFrom, thumbBounds, toPercent, trackPieces } from "./slider-math.js";
|
|
5
|
+
export { MonoSlider, type SliderColor, type SliderCssClass, type SliderEvents, type SliderFill, type SliderMark, type SliderMarkPoint, type SliderModelEvent, type SliderModelEventDetail, type SliderPiece, type SliderProps, type SliderScale, type SliderSize, type SliderType, type SliderValidationState, type SliderValue, type SliderValueTooltip, coerceNumbers, fromRatio, markPoints, moveRun, moveThumb, nearestThumb, normalise, resolveScale, snap, stepFrom, thumbBounds, toPercent, trackPieces };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/// <reference path="../../../vue.d.ts" />
|
|
2
|
+
import { SliderColor, SliderCssClass, SliderEvents, SliderFill, SliderMark, SliderModelEvent, SliderModelEventDetail, SliderProps, SliderSize, SliderType, SliderValidationState, SliderValue, SliderValueTooltip } from "./slider-types.js";
|
|
3
|
+
import { MonoSliderCore } from "./slider-core.js";
|
|
4
|
+
import { SliderMarkPoint, SliderPiece, SliderScale, coerceNumbers, fromRatio, markPoints, moveRun, moveThumb, nearestThumb, normalise, resolveScale, snap, stepFrom, thumbBounds, toPercent, trackPieces } from "./slider-math.js";
|
|
5
|
+
import { MonoSliderShadow } from "./mono-slider.shadow.js";
|
|
6
|
+
export { MonoSliderCore, MonoSliderShadow, type SliderColor, type SliderCssClass, type SliderEvents, type SliderFill, type SliderMark, type SliderMarkPoint, type SliderModelEvent, type SliderModelEventDetail, type SliderPiece, type SliderProps, type SliderScale, type SliderSize, type SliderType, type SliderValidationState, type SliderValue, type SliderValueTooltip, coerceNumbers, fromRatio, markPoints, moveRun, moveThumb, nearestThumb, normalise, resolveScale, snap, stepFrom, thumbBounds, toPercent, trackPieces };
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { Constructor } from "../../composables/hybird-prop.js";
|
|
2
|
+
import { MonoSliderCoreInterface } from "./slider-core.js";
|
|
3
|
+
import { LitElement } from "lit";
|
|
4
|
+
//#region src/components/slider/mono-slider.d.ts
|
|
5
|
+
declare const MonoSlider_base: Constructor<MonoSliderCoreInterface> & typeof LitElement;
|
|
6
|
+
/**
|
|
7
|
+
* Light-DOM `mono-slider` (default build, `@mono-lit/helper/ui/slider`).
|
|
8
|
+
*
|
|
9
|
+
* Renders into the host (styled by the global `dist/ui/index.css`). `slot="label"` /
|
|
10
|
+
* `slot="helper"` children are captured on connect and re-placed into `[data-mono-slot]`
|
|
11
|
+
* placeholders after each render — the same strategy as mono-input. Everything else lives in
|
|
12
|
+
* `MonoSliderCore`; the shadow build (`mono-shadow-slider`) shares it with native `<slot>`s.
|
|
13
|
+
*/
|
|
14
|
+
export declare class MonoSlider extends MonoSlider_base {
|
|
15
|
+
static styles: import("lit").CSSResult[];
|
|
16
|
+
protected createRenderRoot(): HTMLElement;
|
|
17
|
+
private _slotLabel;
|
|
18
|
+
private _slotHelper;
|
|
19
|
+
private _slotObserver?;
|
|
20
|
+
/** Capture `slot="label|helper"` children. Safe to re-run: captured nodes lose `slot` and leave the host. */
|
|
21
|
+
private _captureSlots;
|
|
22
|
+
connectedCallback(): void;
|
|
23
|
+
disconnectedCallback(): void;
|
|
24
|
+
protected updated(changed: Map<string, unknown>): void;
|
|
25
|
+
private _placeSlot;
|
|
26
|
+
}
|
|
27
|
+
declare global {
|
|
28
|
+
interface HTMLElementTagNameMap {
|
|
29
|
+
'mono-slider': MonoSlider;
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
//#endregion
|
|
33
|
+
export {};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { Constructor } from "../../composables/hybird-prop.js";
|
|
2
|
+
import { MonoSliderCoreInterface } from "./slider-core.js";
|
|
3
|
+
import { LitElement, TemplateResult } from "lit";
|
|
4
|
+
//#region src/components/slider/mono-slider.shadow.d.ts
|
|
5
|
+
declare const MonoSliderShadow_base: Constructor<MonoSliderCoreInterface> & typeof LitElement;
|
|
6
|
+
/**
|
|
7
|
+
* Shadow-DOM `mono-slider` (SSR build, `@mono-lit/helper/ui/shadow/slider`, tag
|
|
8
|
+
* `mono-shadow-slider`).
|
|
9
|
+
*
|
|
10
|
+
* Shares every behaviour with the light build through `MonoSliderCore`; only the label and helper
|
|
11
|
+
* regions differ: native `<slot name="label|helper">` with the prop text as fallback. Slot
|
|
12
|
+
* presence is unknown during SSR, so both sides default to "empty" and `firstUpdated()` scans the
|
|
13
|
+
* assigned nodes (Declarative Shadow DOM assigns slotted content at parse time, so `slotchange`
|
|
14
|
+
* never fires after hydration — same as mono-input / mono-switch).
|
|
15
|
+
*/
|
|
16
|
+
export declare class MonoSliderShadow extends MonoSliderShadow_base {
|
|
17
|
+
static styles: import("lit").CSSResult[];
|
|
18
|
+
connectedCallback(): void;
|
|
19
|
+
firstUpdated(changed: Map<string, unknown>): void;
|
|
20
|
+
private _slotHasContent;
|
|
21
|
+
private _setSlotState;
|
|
22
|
+
private _onSlotChange;
|
|
23
|
+
protected _renderLabelText(): TemplateResult;
|
|
24
|
+
/** Always rendered (the slot must exist to be scanned); hidden with `mono-empty` when empty. */
|
|
25
|
+
protected _renderLabel(): TemplateResult;
|
|
26
|
+
protected _renderMessage(): TemplateResult;
|
|
27
|
+
}
|
|
28
|
+
//#endregion
|
|
29
|
+
export {};
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
import { Constructor } from "../../composables/hybird-prop.js";
|
|
2
|
+
import { CssSizeValue } from "../../composables/css-size.js";
|
|
3
|
+
import { FieldTooltipController, FieldTooltipValue } from "../../composables/field-tooltip.js";
|
|
4
|
+
import { InputFormat } from "../input/input-format.js";
|
|
5
|
+
import { SliderColor, SliderCssClass, SliderFill, SliderSize, SliderType, SliderValidationState, SliderValue, SliderValueTooltip } from "./slider-types.js";
|
|
6
|
+
import { LitElement, TemplateResult, nothing } from "lit";
|
|
7
|
+
//#region src/components/slider/slider-core.d.ts
|
|
8
|
+
export type SliderSlotName = 'label' | 'helper';
|
|
9
|
+
/** A model that holds the same numbers in the same shape is not a change (Vue re-sends arrays). */
|
|
10
|
+
export declare function sliderValueHasChanged(value: unknown, old: unknown): boolean;
|
|
11
|
+
/** Public surface added by the core mixin (for typing the wrappers + tag map). */
|
|
12
|
+
export declare class MonoSliderCoreInterface {
|
|
13
|
+
modelValue: SliderValue | string;
|
|
14
|
+
value: SliderValue | string;
|
|
15
|
+
min: number | string;
|
|
16
|
+
max: number | string;
|
|
17
|
+
step: number | string;
|
|
18
|
+
stops?: number[] | string;
|
|
19
|
+
minGap: number | string;
|
|
20
|
+
type: SliderType;
|
|
21
|
+
marks: boolean | unknown[] | string;
|
|
22
|
+
fill: SliderFill;
|
|
23
|
+
trackGap: number | string;
|
|
24
|
+
valueTooltip: SliderValueTooltip;
|
|
25
|
+
showValue: boolean;
|
|
26
|
+
valueSeparator: string;
|
|
27
|
+
formatDisplay?: InputFormat;
|
|
28
|
+
formatLocale?: string;
|
|
29
|
+
size: SliderSize;
|
|
30
|
+
color: SliderColor;
|
|
31
|
+
label: string;
|
|
32
|
+
helperText: string;
|
|
33
|
+
tooltip: FieldTooltipValue;
|
|
34
|
+
validationState: SliderValidationState;
|
|
35
|
+
validationMessage: string;
|
|
36
|
+
error: boolean;
|
|
37
|
+
errorMessage: string;
|
|
38
|
+
success: boolean;
|
|
39
|
+
successMessage: string;
|
|
40
|
+
disabled: boolean;
|
|
41
|
+
readonly: boolean;
|
|
42
|
+
required: boolean;
|
|
43
|
+
name: string;
|
|
44
|
+
ariaLabelText?: string;
|
|
45
|
+
width?: CssSizeValue;
|
|
46
|
+
height?: CssSizeValue;
|
|
47
|
+
cssClass: SliderCssClass;
|
|
48
|
+
cssClassName: string;
|
|
49
|
+
/** The thumb positions, always as a sorted array. */
|
|
50
|
+
readonly values: number[];
|
|
51
|
+
focus(options?: FocusOptions): void;
|
|
52
|
+
blur(): void;
|
|
53
|
+
protected _hasLabelSlotState: boolean;
|
|
54
|
+
protected _hasHelperSlotState: boolean;
|
|
55
|
+
protected readonly _sliderId: string;
|
|
56
|
+
protected readonly _messageId: string;
|
|
57
|
+
protected readonly _tooltip: FieldTooltipController;
|
|
58
|
+
protected readonly _resolvedValidationState: SliderValidationState;
|
|
59
|
+
protected readonly _hasLabel: boolean;
|
|
60
|
+
protected _cls(base: string, key: keyof SliderCssClass): string;
|
|
61
|
+
protected _renderLabel(): TemplateResult | typeof nothing;
|
|
62
|
+
protected _renderLabelText(): TemplateResult | string;
|
|
63
|
+
protected _renderMessage(): TemplateResult | typeof nothing;
|
|
64
|
+
protected _renderReadout(): TemplateResult;
|
|
65
|
+
}
|
|
66
|
+
/**
|
|
67
|
+
* `MonoSliderCore` — everything `mono-slider` does that does not depend on light vs shadow DOM:
|
|
68
|
+
* props + hybrid aliases, the value maths (slider-math.ts), pointer + keyboard interaction,
|
|
69
|
+
* events, form binding, and the shared `render()`. The label / message regions are hooks the
|
|
70
|
+
* shadow build overrides with native `<slot>`s (the light build captures `slot="label|helper"`
|
|
71
|
+
* children and drops them into `[data-mono-slot]` placeholders, like mono-input).
|
|
72
|
+
*
|
|
73
|
+
* Thumbs are `role="slider"` elements, not native range inputs: N thumbs on one track, blocking,
|
|
74
|
+
* stops, gaps and segment drags are all beyond `<input type="range">`.
|
|
75
|
+
*/
|
|
76
|
+
export declare const MonoSliderCore: <T extends Constructor<LitElement>>(superClass: T) => Constructor<MonoSliderCoreInterface> & T;
|
|
77
|
+
//#endregion
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
import { SliderFill } from "./slider-types.js";
|
|
2
|
+
//#region src/components/slider/slider-math.d.ts
|
|
3
|
+
export interface SliderScale {
|
|
4
|
+
min: number;
|
|
5
|
+
max: number;
|
|
6
|
+
/** Snap interval; 0 = continuous. Ignored when `stops` is set. */
|
|
7
|
+
step: number;
|
|
8
|
+
/** Sorted, de-duplicated, inside [min, max]; null when the slider snaps to `step`. */
|
|
9
|
+
stops: number[] | null;
|
|
10
|
+
minGap: number;
|
|
11
|
+
}
|
|
12
|
+
export interface SliderScaleInput {
|
|
13
|
+
min?: unknown;
|
|
14
|
+
max?: unknown;
|
|
15
|
+
step?: unknown;
|
|
16
|
+
stops?: unknown;
|
|
17
|
+
minGap?: unknown;
|
|
18
|
+
}
|
|
19
|
+
/** One stretch of track between two boundaries (the ends, or a thumb). */
|
|
20
|
+
export interface SliderPiece {
|
|
21
|
+
/** Start / end along the track, 0–100. */
|
|
22
|
+
from: number;
|
|
23
|
+
to: number;
|
|
24
|
+
/** True when that end is a THUMB (so a `track-gap` cuts it back), false at the track's ends. */
|
|
25
|
+
cutStart: boolean;
|
|
26
|
+
cutEnd: boolean;
|
|
27
|
+
filled: boolean;
|
|
28
|
+
}
|
|
29
|
+
export interface SliderMarkPoint {
|
|
30
|
+
value: number;
|
|
31
|
+
/** 0–100 along the track. */
|
|
32
|
+
pct: number;
|
|
33
|
+
/** The mark's own label; undefined means "format the value" (when labels are shown at all). */
|
|
34
|
+
label?: string;
|
|
35
|
+
/** True when the mark carried a label (or was given as an object). */
|
|
36
|
+
labelled: boolean;
|
|
37
|
+
}
|
|
38
|
+
/** Strip float noise (0.1 + 0.2) without losing a fractional step. */
|
|
39
|
+
export declare function stripNoise(n: number): number;
|
|
40
|
+
/**
|
|
41
|
+
* Anything a consumer (or a framework) might hand over as a value — a number, an array, a JSON
|
|
42
|
+
* string (`"[20,80]"`, what an SSR attribute carries), a comma list (`"20,80"`), a numeric string —
|
|
43
|
+
* as a list of finite numbers. Non-numbers are dropped. `null` when nothing usable is left.
|
|
44
|
+
*/
|
|
45
|
+
export declare function coerceNumbers(value: unknown): number[] | null;
|
|
46
|
+
/** The scale from raw props: defaults 0 / 100 / 1, `max` never below `min`, stops cleaned. */
|
|
47
|
+
export declare function resolveScale(input: SliderScaleInput): SliderScale;
|
|
48
|
+
/** The allowed value nearest to `v` (a stop, a grid point, or `v` itself when continuous). */
|
|
49
|
+
export declare function snap(v: number, scale: SliderScale): number;
|
|
50
|
+
/** The smallest allowed value ≥ x (or `max` when none is). */
|
|
51
|
+
export declare function ceilTo(x: number, scale: SliderScale): number;
|
|
52
|
+
/** The largest allowed value ≤ x (or `min` when none is). */
|
|
53
|
+
export declare function floorTo(x: number, scale: SliderScale): number;
|
|
54
|
+
/**
|
|
55
|
+
* The values, made valid: each clamped and snapped, sorted, then spread so neighbours are at least
|
|
56
|
+
* `minGap` apart. Thumbs are never dropped — when the gap cannot fit every thumb, they pack
|
|
57
|
+
* against the ends (the forward pass pushes right, the backward pass pulls back under `max`).
|
|
58
|
+
*/
|
|
59
|
+
export declare function normalise(values: number[], scale: SliderScale): number[];
|
|
60
|
+
/** The range thumb `i` may move in: its neighbours ± `minGap` (the BLOCK rule). */
|
|
61
|
+
export declare function thumbBounds(values: number[], i: number, scale: SliderScale): {
|
|
62
|
+
lo: number;
|
|
63
|
+
hi: number;
|
|
64
|
+
};
|
|
65
|
+
/**
|
|
66
|
+
* Move thumb `i` toward `v`: snap, then stop at the neighbours (± gap). Returns a NEW array when
|
|
67
|
+
* the thumb actually moved, the SAME array otherwise — callers use identity to skip no-op events.
|
|
68
|
+
*/
|
|
69
|
+
export declare function moveThumb(values: number[], i: number, v: number, scale: SliderScale): number[];
|
|
70
|
+
/**
|
|
71
|
+
* Shift a whole run of thumbs `[from..to]` by `delta`, keeping their spacing — the drag of a filled
|
|
72
|
+
* segment between two thumbs. The run stops at the track ends and at the thumbs outside it.
|
|
73
|
+
*/
|
|
74
|
+
export declare function moveRun(values: number[], from: number, to: number, delta: number, scale: SliderScale): number[];
|
|
75
|
+
/**
|
|
76
|
+
* The thumb a press at `v` should grab: the nearest one. Thumbs sitting on the same spot (`[2, 2,
|
|
77
|
+
* 3]`) tie — then the press picks by SIDE: a press above the stack takes its LAST thumb, below it
|
|
78
|
+
* the FIRST, so stacked thumbs can always be pulled apart. `dir` (+1 / -1) breaks an exact hit,
|
|
79
|
+
* once the drag has shown which way it is heading.
|
|
80
|
+
*/
|
|
81
|
+
export declare function nearestThumb(values: number[], v: number, dir?: number): number;
|
|
82
|
+
/** True when several thumbs share position `values[i]` (a stack the next drag must split). */
|
|
83
|
+
export declare function isStacked(values: number[], i: number): boolean;
|
|
84
|
+
/** `v` as a 0–100 position along the track. */
|
|
85
|
+
export declare function toPercent(v: number, scale: SliderScale): number;
|
|
86
|
+
/** A 0–1 position along the track as a raw (unsnapped) value. */
|
|
87
|
+
export declare function fromRatio(ratio: number, scale: SliderScale): number;
|
|
88
|
+
/**
|
|
89
|
+
* The track as pieces between its boundaries (the two ends and every thumb), each flagged filled
|
|
90
|
+
* or not by the `fill` mode. Rendering every stretch as its own piece is what lets `track-gap` cut
|
|
91
|
+
* the track back around each thumb, and lets a consumer colour segments one by one.
|
|
92
|
+
*/
|
|
93
|
+
export declare function trackPieces(values: number[], scale: SliderScale, fill: SliderFill): SliderPiece[];
|
|
94
|
+
/** The marks to draw. `true` = one per stop, or per step (only the two ends past ~26 — denser is a texture, not ticks). */
|
|
95
|
+
export declare function markPoints(marks: unknown, scale: SliderScale): SliderMarkPoint[];
|
|
96
|
+
/**
|
|
97
|
+
* One keyboard step from `v`: `dir` ±1, `big` for PageUp/PageDown. With stops it walks the list
|
|
98
|
+
* (big = a tenth of it, at least one); with a grid it moves a step (big = ten); continuous moves
|
|
99
|
+
* 1% (big = 10%).
|
|
100
|
+
*/
|
|
101
|
+
export declare function stepFrom(v: number, dir: 1 | -1, big: boolean, scale: SliderScale): number;
|
|
102
|
+
//#endregion
|