@deepfuture/dui-components 0.0.21 → 1.0.1
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/README.md +56 -65
- package/_install.js +11 -0
- package/accordion/accordion-item.d.ts +3 -20
- package/accordion/accordion-item.js +92 -292
- package/accordion/accordion.d.ts +3 -18
- package/accordion/accordion.js +9 -247
- package/accordion/index.d.ts +6 -6
- package/accordion/index.js +5 -5
- package/alert-dialog/alert-dialog-close.d.ts +3 -14
- package/alert-dialog/alert-dialog-close.js +4 -34
- package/alert-dialog/alert-dialog-popup.d.ts +3 -32
- package/alert-dialog/alert-dialog-popup.js +68 -317
- package/alert-dialog/alert-dialog-trigger.d.ts +3 -14
- package/alert-dialog/alert-dialog-trigger.js +4 -51
- package/alert-dialog/alert-dialog.d.ts +3 -30
- package/alert-dialog/alert-dialog.js +8 -158
- package/alert-dialog/index.d.ts +11 -11
- package/alert-dialog/index.js +9 -9
- package/all.d.ts +159 -123
- package/all.js +134 -231
- package/avatar/avatar.d.ts +3 -39
- package/avatar/avatar.js +18 -238
- package/avatar/index.d.ts +4 -4
- package/avatar/index.js +3 -3
- package/badge/badge.d.ts +3 -10
- package/badge/badge.js +87 -22
- package/badge/index.d.ts +2 -3
- package/badge/index.js +2 -3
- package/breadcrumb/breadcrumb-ellipsis.d.ts +3 -12
- package/breadcrumb/breadcrumb-ellipsis.js +8 -34
- package/breadcrumb/breadcrumb-item.d.ts +3 -11
- package/breadcrumb/breadcrumb-item.js +7 -26
- package/breadcrumb/breadcrumb-link.d.ts +3 -12
- package/breadcrumb/breadcrumb-link.js +16 -26
- package/breadcrumb/breadcrumb-page.d.ts +3 -11
- package/breadcrumb/breadcrumb-page.js +8 -31
- package/breadcrumb/breadcrumb-separator.d.ts +3 -12
- package/breadcrumb/breadcrumb-separator.js +8 -31
- package/breadcrumb/breadcrumb.d.ts +3 -12
- package/breadcrumb/breadcrumb.js +10 -33
- package/breadcrumb/index.d.ts +12 -13
- package/breadcrumb/index.js +12 -13
- package/button/button.d.ts +3 -32
- package/button/button.js +220 -165
- package/button/index.d.ts +3 -3
- package/button/index.js +3 -3
- package/calendar/calendar.d.ts +3 -31
- package/calendar/calendar.js +71 -481
- package/calendar/index.d.ts +3 -3
- package/calendar/index.js +3 -3
- package/card/card.d.ts +3 -27
- package/card/card.js +80 -163
- package/card/index.d.ts +2 -3
- package/card/index.js +2 -3
- package/card-grid/card-grid.d.ts +3 -15
- package/card-grid/card-grid.js +8 -106
- package/card-grid/index.d.ts +2 -3
- package/card-grid/index.js +2 -3
- package/checkbox/checkbox-group.d.ts +3 -34
- package/checkbox/checkbox-group.js +11 -188
- package/checkbox/checkbox.d.ts +3 -47
- package/checkbox/checkbox.js +43 -341
- package/checkbox/index.d.ts +6 -6
- package/checkbox/index.js +5 -5
- package/collapsible/collapsible.d.ts +3 -20
- package/collapsible/collapsible.js +82 -277
- package/collapsible/index.d.ts +3 -3
- package/collapsible/index.js +3 -3
- package/combobox/combobox.d.ts +3 -47
- package/combobox/combobox.js +136 -538
- package/combobox/index.d.ts +4 -4
- package/combobox/index.js +3 -3
- package/command/command-empty.d.ts +3 -8
- package/command/command-empty.js +10 -88
- package/command/command-group.d.ts +3 -13
- package/command/command-group.js +14 -114
- package/command/command-input.d.ts +3 -11
- package/command/command-input.js +20 -136
- package/command/command-item.d.ts +3 -18
- package/command/command-item.js +23 -212
- package/command/command-list.d.ts +3 -7
- package/command/command-list.js +11 -79
- package/command/command-separator.d.ts +3 -5
- package/command/command-separator.js +10 -11
- package/command/command-shortcut.d.ts +3 -5
- package/command/command-shortcut.js +9 -12
- package/command/command.d.ts +3 -23
- package/command/command.js +10 -339
- package/command/index.d.ts +17 -19
- package/command/index.js +16 -18
- package/data-table/data-table.d.ts +3 -57
- package/data-table/data-table.js +85 -449
- package/data-table/index.d.ts +3 -4
- package/data-table/index.js +2 -3
- package/dialog/dialog-close.d.ts +3 -14
- package/dialog/dialog-close.js +4 -34
- package/dialog/dialog-popup.d.ts +3 -34
- package/dialog/dialog-popup.js +70 -336
- package/dialog/dialog-trigger.d.ts +3 -14
- package/dialog/dialog-trigger.js +4 -51
- package/dialog/dialog.d.ts +3 -30
- package/dialog/dialog.js +8 -158
- package/dialog/index.d.ts +11 -11
- package/dialog/index.js +9 -9
- package/dropzone/dropzone.d.ts +3 -72
- package/dropzone/dropzone.js +29 -407
- package/dropzone/index.d.ts +4 -4
- package/dropzone/index.js +3 -3
- package/field/field.d.ts +3 -30
- package/field/field.js +34 -353
- package/field/index.d.ts +1 -0
- package/field/index.js +1 -0
- package/fieldset/fieldset.d.ts +3 -18
- package/fieldset/fieldset.js +21 -110
- package/fieldset/index.d.ts +1 -0
- package/fieldset/index.js +1 -0
- package/icon/icon.d.ts +3 -15
- package/icon/icon.js +4 -33
- package/icon/index.d.ts +2 -3
- package/icon/index.js +2 -3
- package/input/index.d.ts +3 -3
- package/input/index.js +3 -3
- package/input/input.d.ts +3 -49
- package/input/input.js +57 -238
- package/menu/index.d.ts +4 -5
- package/menu/index.js +4 -5
- package/menu/menu-item.d.ts +3 -13
- package/menu/menu-item.js +40 -91
- package/menu/menu.d.ts +3 -15
- package/menu/menu.js +27 -277
- package/menubar/index.d.ts +3 -4
- package/menubar/index.js +2 -3
- package/menubar/menubar.d.ts +3 -19
- package/menubar/menubar.js +12 -183
- package/number-field/index.d.ts +3 -3
- package/number-field/index.js +3 -3
- package/number-field/number-field.d.ts +3 -55
- package/number-field/number-field.js +205 -698
- package/package.json +125 -113
- package/popover/index.d.ts +11 -11
- package/popover/index.js +9 -9
- package/popover/popover-close.d.ts +3 -12
- package/popover/popover-close.js +4 -32
- package/popover/popover-popup.d.ts +3 -18
- package/popover/popover-popup.js +28 -205
- package/popover/popover-trigger.d.ts +3 -13
- package/popover/popover-trigger.js +4 -73
- package/popover/popover.d.ts +3 -29
- package/popover/popover.js +8 -207
- package/portal/index.d.ts +3 -4
- package/portal/index.js +2 -3
- package/portal/portal.d.ts +3 -27
- package/portal/portal.js +8 -157
- package/preview-card/index.d.ts +9 -9
- package/preview-card/index.js +7 -7
- package/preview-card/preview-card-popup.d.ts +3 -14
- package/preview-card/preview-card-popup.js +29 -194
- package/preview-card/preview-card-trigger.d.ts +3 -12
- package/preview-card/preview-card-trigger.js +4 -74
- package/preview-card/preview-card.d.ts +3 -33
- package/preview-card/preview-card.js +8 -239
- package/progress/index.d.ts +2 -3
- package/progress/index.js +2 -3
- package/progress/progress.d.ts +3 -17
- package/progress/progress.js +28 -130
- package/radio/index.d.ts +6 -6
- package/radio/index.js +5 -5
- package/radio/radio-group.d.ts +3 -37
- package/radio/radio-group.js +8 -200
- package/radio/radio.d.ts +3 -28
- package/radio/radio.js +38 -213
- package/scroll-area/index.d.ts +2 -3
- package/scroll-area/index.js +2 -3
- package/scroll-area/scroll-area.d.ts +3 -36
- package/scroll-area/scroll-area.js +25 -535
- package/select/index.d.ts +3 -4
- package/select/index.js +2 -3
- package/select/select.d.ts +3 -39
- package/select/select.js +115 -425
- package/separator/index.d.ts +2 -3
- package/separator/index.js +2 -3
- package/separator/separator.d.ts +3 -10
- package/separator/separator.js +23 -85
- package/sidebar/index.d.ts +29 -29
- package/sidebar/index.js +27 -32
- package/sidebar/sidebar-content.d.ts +3 -12
- package/sidebar/sidebar-content.js +7 -29
- package/sidebar/sidebar-footer.d.ts +3 -10
- package/sidebar/sidebar-footer.js +7 -20
- package/sidebar/sidebar-group-label.d.ts +3 -15
- package/sidebar/sidebar-group-label.js +16 -41
- package/sidebar/sidebar-group.d.ts +3 -13
- package/sidebar/sidebar-group.js +7 -24
- package/sidebar/sidebar-header.d.ts +3 -10
- package/sidebar/sidebar-header.js +7 -16
- package/sidebar/sidebar-inset.d.ts +3 -13
- package/sidebar/sidebar-inset.js +7 -28
- package/sidebar/sidebar-menu-button.d.ts +3 -26
- package/sidebar/sidebar-menu-button.js +59 -217
- package/sidebar/sidebar-menu-item.d.ts +3 -10
- package/sidebar/sidebar-menu-item.js +7 -19
- package/sidebar/sidebar-menu.d.ts +3 -12
- package/sidebar/sidebar-menu.js +7 -25
- package/sidebar/sidebar-provider.d.ts +3 -34
- package/sidebar/sidebar-provider.js +22 -232
- package/sidebar/sidebar-separator.d.ts +3 -10
- package/sidebar/sidebar-separator.js +9 -19
- package/sidebar/sidebar-trigger.d.ts +3 -14
- package/sidebar/sidebar-trigger.js +10 -46
- package/sidebar/sidebar.d.ts +3 -19
- package/sidebar/sidebar.js +65 -262
- package/slider/index.d.ts +3 -3
- package/slider/index.js +3 -3
- package/slider/slider.d.ts +3 -45
- package/slider/slider.js +97 -382
- package/spinner/index.d.ts +2 -3
- package/spinner/index.js +2 -3
- package/spinner/spinner.d.ts +3 -11
- package/spinner/spinner.js +20 -163
- package/split-button/index.d.ts +3 -1
- package/split-button/index.js +3 -1
- package/split-button/split-button.d.ts +3 -33
- package/split-button/split-button.js +306 -394
- package/stepper/index.d.ts +3 -3
- package/stepper/index.js +3 -3
- package/stepper/stepper.d.ts +3 -41
- package/stepper/stepper.js +57 -381
- package/switch/index.d.ts +3 -3
- package/switch/index.js +3 -3
- package/switch/switch.d.ts +3 -30
- package/switch/switch.js +63 -228
- package/tabs/index.d.ts +12 -12
- package/tabs/index.js +11 -11
- package/tabs/tab.d.ts +3 -14
- package/tabs/tab.js +32 -131
- package/tabs/tabs-indicator.d.ts +3 -9
- package/tabs/tabs-indicator.js +17 -22
- package/tabs/tabs-list.d.ts +3 -15
- package/tabs/tabs-list.js +14 -113
- package/tabs/tabs-panel.d.ts +3 -16
- package/tabs/tabs-panel.js +32 -114
- package/tabs/tabs.d.ts +3 -22
- package/tabs/tabs.js +8 -170
- package/textarea/index.d.ts +4 -4
- package/textarea/index.js +3 -3
- package/textarea/textarea.d.ts +3 -36
- package/textarea/textarea.js +63 -220
- package/toggle/index.d.ts +6 -6
- package/toggle/index.js +5 -5
- package/toggle/toggle-group.d.ts +3 -27
- package/toggle/toggle-group.js +9 -224
- package/toggle/toggle.d.ts +3 -26
- package/toggle/toggle.js +93 -178
- package/tokens/properties.css +361 -0
- package/tokens/prose.css +250 -0
- package/tokens/prose.d.ts +2 -0
- package/tokens/prose.js +4 -0
- package/tokens/tokens-raw.d.ts +2 -0
- package/tokens/tokens-raw.js +2 -0
- package/tokens/tokens.css +409 -0
- package/tokens/tokens.d.ts +2 -0
- package/tokens/tokens.js +5 -0
- package/toolbar/index.d.ts +2 -3
- package/toolbar/index.js +2 -3
- package/toolbar/toolbar.d.ts +3 -11
- package/toolbar/toolbar.js +25 -116
- package/tooltip/index.d.ts +9 -9
- package/tooltip/index.js +7 -7
- package/tooltip/tooltip-popup.d.ts +3 -14
- package/tooltip/tooltip-popup.js +31 -185
- package/tooltip/tooltip-trigger.d.ts +3 -14
- package/tooltip/tooltip-trigger.js +5 -148
- package/tooltip/tooltip.d.ts +3 -35
- package/tooltip/tooltip.js +8 -253
- package/trunc/index.d.ts +2 -3
- package/trunc/index.js +2 -3
- package/trunc/trunc.d.ts +3 -17
- package/trunc/trunc.js +10 -108
- package/_deprecated/center/center.d.ts +0 -14
- package/_deprecated/center/center.js +0 -37
- package/_deprecated/center/index.d.ts +0 -3
- package/_deprecated/center/index.js +0 -3
- package/_deprecated/center/register.js +0 -4
- package/_deprecated/hstack/hstack.d.ts +0 -25
- package/_deprecated/hstack/hstack.js +0 -187
- package/_deprecated/hstack/index.d.ts +0 -4
- package/_deprecated/hstack/index.js +0 -3
- package/_deprecated/hstack/register.d.ts +0 -1
- package/_deprecated/hstack/register.js +0 -4
- package/_deprecated/page-inset/index.d.ts +0 -3
- package/_deprecated/page-inset/index.js +0 -3
- package/_deprecated/page-inset/page-inset.d.ts +0 -28
- package/_deprecated/page-inset/page-inset.js +0 -151
- package/_deprecated/page-inset/register.d.ts +0 -1
- package/_deprecated/page-inset/register.js +0 -4
- package/_deprecated/vstack/index.d.ts +0 -3
- package/_deprecated/vstack/index.js +0 -3
- package/_deprecated/vstack/register.d.ts +0 -1
- package/_deprecated/vstack/register.js +0 -4
- package/_deprecated/vstack/vstack.d.ts +0 -17
- package/_deprecated/vstack/vstack.js +0 -125
- package/accordion/accordion-context.d.ts +0 -15
- package/accordion/accordion-context.js +0 -3
- package/alert-dialog/alert-dialog-context.d.ts +0 -13
- package/alert-dialog/alert-dialog-context.js +0 -3
- package/checkbox/checkbox-group-context.d.ts +0 -11
- package/checkbox/checkbox-group-context.js +0 -3
- package/command/command-context.d.ts +0 -30
- package/command/command-context.js +0 -3
- package/command/command-score.d.ts +0 -6
- package/command/command-score.js +0 -31
- package/dialog/dialog-context.d.ts +0 -13
- package/dialog/dialog-context.js +0 -3
- package/global.d.ts +0 -179
- package/menubar/menubar-context.d.ts +0 -9
- package/menubar/menubar-context.js +0 -2
- package/popover/popover-context.d.ts +0 -17
- package/popover/popover-context.js +0 -3
- package/preview-card/preview-card-context.d.ts +0 -16
- package/preview-card/preview-card-context.js +0 -3
- package/radio/radio-group-context.d.ts +0 -11
- package/radio/radio-group-context.js +0 -2
- package/sidebar/sidebar-context.d.ts +0 -15
- package/sidebar/sidebar-context.js +0 -3
- package/split-button/register.d.ts +0 -1
- package/split-button/register.js +0 -4
- package/tabs/tabs-context.d.ts +0 -8
- package/tabs/tabs-context.js +0 -2
- package/toggle/toggle-group-context.d.ts +0 -9
- package/toggle/toggle-group-context.js +0 -2
- package/tooltip/tooltip-context.d.ts +0 -17
- package/tooltip/tooltip-context.js +0 -3
- /package/{_deprecated/center/register.d.ts → _install.d.ts} +0 -0
package/stepper/index.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
export { DuiStepper
|
|
3
|
-
export
|
|
1
|
+
import "./stepper.js";
|
|
2
|
+
export { DuiStepper } from "./stepper.js";
|
|
3
|
+
export { valueChangeEvent, valueCommittedEvent } from "@deepfuture/dui-primitives/stepper";
|
package/stepper/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
export { DuiStepper
|
|
3
|
-
export
|
|
1
|
+
import "./stepper.js";
|
|
2
|
+
export { DuiStepper } from "./stepper.js";
|
|
3
|
+
export { valueChangeEvent, valueCommittedEvent } from "@deepfuture/dui-primitives/stepper";
|
package/stepper/stepper.d.ts
CHANGED
|
@@ -1,43 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
}) => CustomEvent<{
|
|
5
|
-
value: number;
|
|
6
|
-
}>;
|
|
7
|
-
export declare const valueCommittedEvent: (detail: {
|
|
8
|
-
value: number;
|
|
9
|
-
}) => CustomEvent<{
|
|
10
|
-
value: number;
|
|
11
|
-
}>;
|
|
12
|
-
/**
|
|
13
|
-
* `<dui-stepper>` — A numeric input with increment/decrement buttons.
|
|
14
|
-
*
|
|
15
|
-
* Simple component for stepping values up and down via buttons, keyboard,
|
|
16
|
-
* or manual text entry. No labels, icons, scrubbing, or other extras.
|
|
17
|
-
*
|
|
18
|
-
* @csspart root - The outer container.
|
|
19
|
-
* @csspart input - The text input element.
|
|
20
|
-
* @csspart decrement - The decrement button.
|
|
21
|
-
* @csspart increment - The increment button.
|
|
22
|
-
* @fires value-change - Fired when value changes. Detail: { value: number }
|
|
23
|
-
* @fires value-committed - Fired on blur or Enter. Detail: { value: number }
|
|
24
|
-
*/
|
|
25
|
-
export declare class DuiStepper extends LitElement {
|
|
26
|
-
#private;
|
|
27
|
-
static tagName: "dui-stepper";
|
|
28
|
-
static shadowRootOptions: ShadowRootInit;
|
|
1
|
+
import { DuiStepperPrimitive } from "@deepfuture/dui-primitives/stepper";
|
|
2
|
+
import "../_install.js";
|
|
3
|
+
export declare class DuiStepper extends DuiStepperPrimitive {
|
|
29
4
|
static styles: import("lit").CSSResult[];
|
|
30
|
-
accessor value: number | undefined;
|
|
31
|
-
accessor defaultValue: number | undefined;
|
|
32
|
-
accessor min: number | undefined;
|
|
33
|
-
accessor max: number | undefined;
|
|
34
|
-
accessor step: number;
|
|
35
|
-
accessor largeStep: number;
|
|
36
|
-
accessor disabled: boolean;
|
|
37
|
-
accessor readOnly: boolean;
|
|
38
|
-
accessor required: boolean;
|
|
39
|
-
accessor name: string | undefined;
|
|
40
|
-
connectedCallback(): void;
|
|
41
|
-
willUpdate(): void;
|
|
42
|
-
render(): TemplateResult;
|
|
43
5
|
}
|
package/stepper/stepper.js
CHANGED
|
@@ -1,399 +1,75 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
|
|
5
|
-
var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
|
|
6
|
-
var _, done = false;
|
|
7
|
-
for (var i = decorators.length - 1; i >= 0; i--) {
|
|
8
|
-
var context = {};
|
|
9
|
-
for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
|
|
10
|
-
for (var p in contextIn.access) context.access[p] = contextIn.access[p];
|
|
11
|
-
context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
|
|
12
|
-
var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
|
|
13
|
-
if (kind === "accessor") {
|
|
14
|
-
if (result === void 0) continue;
|
|
15
|
-
if (result === null || typeof result !== "object") throw new TypeError("Object expected");
|
|
16
|
-
if (_ = accept(result.get)) descriptor.get = _;
|
|
17
|
-
if (_ = accept(result.set)) descriptor.set = _;
|
|
18
|
-
if (_ = accept(result.init)) initializers.unshift(_);
|
|
19
|
-
}
|
|
20
|
-
else if (_ = accept(result)) {
|
|
21
|
-
if (kind === "field") initializers.unshift(_);
|
|
22
|
-
else descriptor[key] = _;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
if (target) Object.defineProperty(target, contextIn.name, descriptor);
|
|
26
|
-
done = true;
|
|
27
|
-
};
|
|
28
|
-
var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
|
|
29
|
-
var useValue = arguments.length > 2;
|
|
30
|
-
for (var i = 0; i < initializers.length; i++) {
|
|
31
|
-
value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
|
|
32
|
-
}
|
|
33
|
-
return useValue ? value : void 0;
|
|
34
|
-
};
|
|
35
|
-
var __setFunctionName = (this && this.__setFunctionName) || function (f, name, prefix) {
|
|
36
|
-
if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
|
|
37
|
-
return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
|
|
38
|
-
};
|
|
39
|
-
import { css, html, LitElement, nothing } from "lit";
|
|
40
|
-
import { property, state } from "lit/decorators.js";
|
|
41
|
-
import { live } from "lit/directives/live.js";
|
|
42
|
-
import { base } from "@deepfuture/dui-core/base";
|
|
43
|
-
import { customEvent } from "@deepfuture/dui-core/event";
|
|
44
|
-
export const valueChangeEvent = customEvent("value-change", { bubbles: true, composed: true });
|
|
45
|
-
export const valueCommittedEvent = customEvent("value-committed", { bubbles: true, composed: true });
|
|
46
|
-
/** Structural styles only — layout CSS. */
|
|
1
|
+
import { css } from "lit";
|
|
2
|
+
import { DuiStepperPrimitive } from "@deepfuture/dui-primitives/stepper";
|
|
3
|
+
import "../_install.js";
|
|
47
4
|
const styles = css `
|
|
48
|
-
|
|
49
|
-
|
|
5
|
+
[part="root"] {
|
|
6
|
+
border: var(--border-width-thin) solid var(--border);
|
|
7
|
+
border-radius: var(--radius-md);
|
|
8
|
+
background: transparent;
|
|
9
|
+
transition-property: border-color, box-shadow;
|
|
10
|
+
transition-duration: var(--duration-fast);
|
|
50
11
|
}
|
|
51
12
|
|
|
52
|
-
[part="root"] {
|
|
53
|
-
|
|
54
|
-
|
|
13
|
+
[part="root"]:focus-within {
|
|
14
|
+
box-shadow:
|
|
15
|
+
0 0 0 var(--focus-ring-offset) var(--background),
|
|
16
|
+
0 0 0 calc(var(--focus-ring-offset) + var(--focus-ring-width)) var(--focus-ring-color);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
[part="root"][data-disabled] {
|
|
20
|
+
opacity: 0.4;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
:host([aria-invalid="true"]) [part="root"] {
|
|
24
|
+
border-color: var(--destructive);
|
|
55
25
|
}
|
|
56
26
|
|
|
57
27
|
[part="input"] {
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
font:
|
|
63
|
-
color:
|
|
64
|
-
text-align: center;
|
|
65
|
-
min-width: 0;
|
|
28
|
+
height: var(--component-height-md);
|
|
29
|
+
width: var(--space-16);
|
|
30
|
+
font-family: var(--font-sans);
|
|
31
|
+
font-size: var(--text-sm);
|
|
32
|
+
font-weight: var(--font-weight-medium);
|
|
33
|
+
color: var(--text-1);
|
|
66
34
|
}
|
|
67
35
|
|
|
68
|
-
[part="input"]
|
|
69
|
-
|
|
36
|
+
:host([size="sm"]) [part="input"] {
|
|
37
|
+
height: var(--component-height-sm);
|
|
38
|
+
width: var(--space-14);
|
|
39
|
+
font-size: var(--text-xs);
|
|
70
40
|
}
|
|
71
41
|
|
|
72
42
|
[part="decrement"],
|
|
73
43
|
[part="increment"] {
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
margin: 0;
|
|
82
|
-
font: inherit;
|
|
83
|
-
color: inherit;
|
|
84
|
-
flex-shrink: 0;
|
|
44
|
+
width: var(--component-height-md);
|
|
45
|
+
height: var(--component-height-md);
|
|
46
|
+
color: var(--text-2);
|
|
47
|
+
border-radius: var(--radius-sm);
|
|
48
|
+
font-size: var(--text-lg);
|
|
49
|
+
transition-property: background, color;
|
|
50
|
+
transition-duration: var(--duration-fast);
|
|
85
51
|
}
|
|
86
52
|
|
|
87
|
-
[part="decrement"]
|
|
88
|
-
[part="increment"]
|
|
89
|
-
|
|
53
|
+
:host([size="sm"]) [part="decrement"],
|
|
54
|
+
:host([size="sm"]) [part="increment"] {
|
|
55
|
+
width: var(--component-height-sm);
|
|
56
|
+
height: var(--component-height-sm);
|
|
90
57
|
}
|
|
91
58
|
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
59
|
+
@media (hover: hover) {
|
|
60
|
+
[part="decrement"]:hover:not(:disabled),
|
|
61
|
+
[part="increment"]:hover:not(:disabled) {
|
|
62
|
+
background: var(--surface-1);
|
|
63
|
+
color: var(--text-1);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
[part="decrement"]:disabled,
|
|
68
|
+
[part="increment"]:disabled {
|
|
69
|
+
opacity: 0.4;
|
|
99
70
|
}
|
|
100
71
|
`;
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
* or manual text entry. No labels, icons, scrubbing, or other extras.
|
|
106
|
-
*
|
|
107
|
-
* @csspart root - The outer container.
|
|
108
|
-
* @csspart input - The text input element.
|
|
109
|
-
* @csspart decrement - The decrement button.
|
|
110
|
-
* @csspart increment - The increment button.
|
|
111
|
-
* @fires value-change - Fired when value changes. Detail: { value: number }
|
|
112
|
-
* @fires value-committed - Fired on blur or Enter. Detail: { value: number }
|
|
113
|
-
*/
|
|
114
|
-
let DuiStepper = (() => {
|
|
115
|
-
let _classSuper = LitElement;
|
|
116
|
-
let _value_decorators;
|
|
117
|
-
let _value_initializers = [];
|
|
118
|
-
let _value_extraInitializers = [];
|
|
119
|
-
let _defaultValue_decorators;
|
|
120
|
-
let _defaultValue_initializers = [];
|
|
121
|
-
let _defaultValue_extraInitializers = [];
|
|
122
|
-
let _min_decorators;
|
|
123
|
-
let _min_initializers = [];
|
|
124
|
-
let _min_extraInitializers = [];
|
|
125
|
-
let _max_decorators;
|
|
126
|
-
let _max_initializers = [];
|
|
127
|
-
let _max_extraInitializers = [];
|
|
128
|
-
let _step_decorators;
|
|
129
|
-
let _step_initializers = [];
|
|
130
|
-
let _step_extraInitializers = [];
|
|
131
|
-
let _largeStep_decorators;
|
|
132
|
-
let _largeStep_initializers = [];
|
|
133
|
-
let _largeStep_extraInitializers = [];
|
|
134
|
-
let _disabled_decorators;
|
|
135
|
-
let _disabled_initializers = [];
|
|
136
|
-
let _disabled_extraInitializers = [];
|
|
137
|
-
let _readOnly_decorators;
|
|
138
|
-
let _readOnly_initializers = [];
|
|
139
|
-
let _readOnly_extraInitializers = [];
|
|
140
|
-
let _required_decorators;
|
|
141
|
-
let _required_initializers = [];
|
|
142
|
-
let _required_extraInitializers = [];
|
|
143
|
-
let _name_decorators;
|
|
144
|
-
let _name_initializers = [];
|
|
145
|
-
let _name_extraInitializers = [];
|
|
146
|
-
let _private_internalValue_decorators;
|
|
147
|
-
let _private_internalValue_initializers = [];
|
|
148
|
-
let _private_internalValue_extraInitializers = [];
|
|
149
|
-
let _private_internalValue_descriptor;
|
|
150
|
-
let _private_inputText_decorators;
|
|
151
|
-
let _private_inputText_initializers = [];
|
|
152
|
-
let _private_inputText_extraInitializers = [];
|
|
153
|
-
let _private_inputText_descriptor;
|
|
154
|
-
return class DuiStepper extends _classSuper {
|
|
155
|
-
static {
|
|
156
|
-
const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
|
|
157
|
-
_value_decorators = [property({ type: Number })];
|
|
158
|
-
_defaultValue_decorators = [property({ type: Number, attribute: "default-value" })];
|
|
159
|
-
_min_decorators = [property({ type: Number })];
|
|
160
|
-
_max_decorators = [property({ type: Number })];
|
|
161
|
-
_step_decorators = [property({ type: Number })];
|
|
162
|
-
_largeStep_decorators = [property({ type: Number, attribute: "large-step" })];
|
|
163
|
-
_disabled_decorators = [property({ type: Boolean, reflect: true })];
|
|
164
|
-
_readOnly_decorators = [property({ type: Boolean, reflect: true, attribute: "read-only" })];
|
|
165
|
-
_required_decorators = [property({ type: Boolean })];
|
|
166
|
-
_name_decorators = [property()];
|
|
167
|
-
_private_internalValue_decorators = [state()];
|
|
168
|
-
_private_inputText_decorators = [state()];
|
|
169
|
-
__esDecorate(this, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
|
|
170
|
-
__esDecorate(this, null, _defaultValue_decorators, { kind: "accessor", name: "defaultValue", static: false, private: false, access: { has: obj => "defaultValue" in obj, get: obj => obj.defaultValue, set: (obj, value) => { obj.defaultValue = value; } }, metadata: _metadata }, _defaultValue_initializers, _defaultValue_extraInitializers);
|
|
171
|
-
__esDecorate(this, null, _min_decorators, { kind: "accessor", name: "min", static: false, private: false, access: { has: obj => "min" in obj, get: obj => obj.min, set: (obj, value) => { obj.min = value; } }, metadata: _metadata }, _min_initializers, _min_extraInitializers);
|
|
172
|
-
__esDecorate(this, null, _max_decorators, { kind: "accessor", name: "max", static: false, private: false, access: { has: obj => "max" in obj, get: obj => obj.max, set: (obj, value) => { obj.max = value; } }, metadata: _metadata }, _max_initializers, _max_extraInitializers);
|
|
173
|
-
__esDecorate(this, null, _step_decorators, { kind: "accessor", name: "step", static: false, private: false, access: { has: obj => "step" in obj, get: obj => obj.step, set: (obj, value) => { obj.step = value; } }, metadata: _metadata }, _step_initializers, _step_extraInitializers);
|
|
174
|
-
__esDecorate(this, null, _largeStep_decorators, { kind: "accessor", name: "largeStep", static: false, private: false, access: { has: obj => "largeStep" in obj, get: obj => obj.largeStep, set: (obj, value) => { obj.largeStep = value; } }, metadata: _metadata }, _largeStep_initializers, _largeStep_extraInitializers);
|
|
175
|
-
__esDecorate(this, null, _disabled_decorators, { kind: "accessor", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_extraInitializers);
|
|
176
|
-
__esDecorate(this, null, _readOnly_decorators, { kind: "accessor", name: "readOnly", static: false, private: false, access: { has: obj => "readOnly" in obj, get: obj => obj.readOnly, set: (obj, value) => { obj.readOnly = value; } }, metadata: _metadata }, _readOnly_initializers, _readOnly_extraInitializers);
|
|
177
|
-
__esDecorate(this, null, _required_decorators, { kind: "accessor", name: "required", static: false, private: false, access: { has: obj => "required" in obj, get: obj => obj.required, set: (obj, value) => { obj.required = value; } }, metadata: _metadata }, _required_initializers, _required_extraInitializers);
|
|
178
|
-
__esDecorate(this, null, _name_decorators, { kind: "accessor", name: "name", static: false, private: false, access: { has: obj => "name" in obj, get: obj => obj.name, set: (obj, value) => { obj.name = value; } }, metadata: _metadata }, _name_initializers, _name_extraInitializers);
|
|
179
|
-
__esDecorate(this, _private_internalValue_descriptor = { get: __setFunctionName(function () { return this.#internalValue_accessor_storage; }, "#internalValue", "get"), set: __setFunctionName(function (value) { this.#internalValue_accessor_storage = value; }, "#internalValue", "set") }, _private_internalValue_decorators, { kind: "accessor", name: "#internalValue", static: false, private: true, access: { has: obj => #internalValue in obj, get: obj => obj.#internalValue, set: (obj, value) => { obj.#internalValue = value; } }, metadata: _metadata }, _private_internalValue_initializers, _private_internalValue_extraInitializers);
|
|
180
|
-
__esDecorate(this, _private_inputText_descriptor = { get: __setFunctionName(function () { return this.#inputText_accessor_storage; }, "#inputText", "get"), set: __setFunctionName(function (value) { this.#inputText_accessor_storage = value; }, "#inputText", "set") }, _private_inputText_decorators, { kind: "accessor", name: "#inputText", static: false, private: true, access: { has: obj => #inputText in obj, get: obj => obj.#inputText, set: (obj, value) => { obj.#inputText = value; } }, metadata: _metadata }, _private_inputText_initializers, _private_inputText_extraInitializers);
|
|
181
|
-
if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
|
|
182
|
-
}
|
|
183
|
-
static tagName = "dui-stepper";
|
|
184
|
-
static shadowRootOptions = {
|
|
185
|
-
...LitElement.shadowRootOptions,
|
|
186
|
-
delegatesFocus: true,
|
|
187
|
-
};
|
|
188
|
-
static styles = [base, styles];
|
|
189
|
-
#value_accessor_storage = __runInitializers(this, _value_initializers, undefined);
|
|
190
|
-
get value() { return this.#value_accessor_storage; }
|
|
191
|
-
set value(value) { this.#value_accessor_storage = value; }
|
|
192
|
-
#defaultValue_accessor_storage = (__runInitializers(this, _value_extraInitializers), __runInitializers(this, _defaultValue_initializers, undefined));
|
|
193
|
-
get defaultValue() { return this.#defaultValue_accessor_storage; }
|
|
194
|
-
set defaultValue(value) { this.#defaultValue_accessor_storage = value; }
|
|
195
|
-
#min_accessor_storage = (__runInitializers(this, _defaultValue_extraInitializers), __runInitializers(this, _min_initializers, undefined));
|
|
196
|
-
get min() { return this.#min_accessor_storage; }
|
|
197
|
-
set min(value) { this.#min_accessor_storage = value; }
|
|
198
|
-
#max_accessor_storage = (__runInitializers(this, _min_extraInitializers), __runInitializers(this, _max_initializers, undefined));
|
|
199
|
-
get max() { return this.#max_accessor_storage; }
|
|
200
|
-
set max(value) { this.#max_accessor_storage = value; }
|
|
201
|
-
#step_accessor_storage = (__runInitializers(this, _max_extraInitializers), __runInitializers(this, _step_initializers, 1));
|
|
202
|
-
get step() { return this.#step_accessor_storage; }
|
|
203
|
-
set step(value) { this.#step_accessor_storage = value; }
|
|
204
|
-
#largeStep_accessor_storage = (__runInitializers(this, _step_extraInitializers), __runInitializers(this, _largeStep_initializers, 10));
|
|
205
|
-
get largeStep() { return this.#largeStep_accessor_storage; }
|
|
206
|
-
set largeStep(value) { this.#largeStep_accessor_storage = value; }
|
|
207
|
-
#disabled_accessor_storage = (__runInitializers(this, _largeStep_extraInitializers), __runInitializers(this, _disabled_initializers, false));
|
|
208
|
-
get disabled() { return this.#disabled_accessor_storage; }
|
|
209
|
-
set disabled(value) { this.#disabled_accessor_storage = value; }
|
|
210
|
-
#readOnly_accessor_storage = (__runInitializers(this, _disabled_extraInitializers), __runInitializers(this, _readOnly_initializers, false));
|
|
211
|
-
get readOnly() { return this.#readOnly_accessor_storage; }
|
|
212
|
-
set readOnly(value) { this.#readOnly_accessor_storage = value; }
|
|
213
|
-
#required_accessor_storage = (__runInitializers(this, _readOnly_extraInitializers), __runInitializers(this, _required_initializers, false));
|
|
214
|
-
get required() { return this.#required_accessor_storage; }
|
|
215
|
-
set required(value) { this.#required_accessor_storage = value; }
|
|
216
|
-
#name_accessor_storage = (__runInitializers(this, _required_extraInitializers), __runInitializers(this, _name_initializers, undefined));
|
|
217
|
-
get name() { return this.#name_accessor_storage; }
|
|
218
|
-
set name(value) { this.#name_accessor_storage = value; }
|
|
219
|
-
#internalValue_accessor_storage = (__runInitializers(this, _name_extraInitializers), __runInitializers(this, _private_internalValue_initializers, undefined));
|
|
220
|
-
// ── Internal state ─────────────────────────────────────────────────
|
|
221
|
-
get #internalValue() { return _private_internalValue_descriptor.get.call(this); }
|
|
222
|
-
set #internalValue(value) { return _private_internalValue_descriptor.set.call(this, value); }
|
|
223
|
-
#inputText_accessor_storage = (__runInitializers(this, _private_internalValue_extraInitializers), __runInitializers(this, _private_inputText_initializers, ""));
|
|
224
|
-
get #inputText() { return _private_inputText_descriptor.get.call(this); }
|
|
225
|
-
set #inputText(value) { return _private_inputText_descriptor.set.call(this, value); }
|
|
226
|
-
// ── Computed getters ───────────────────────────────────────────────
|
|
227
|
-
get #currentValue() {
|
|
228
|
-
return this.value ?? this.#internalValue;
|
|
229
|
-
}
|
|
230
|
-
get #canDecrement() {
|
|
231
|
-
const v = this.#currentValue;
|
|
232
|
-
if (v === undefined)
|
|
233
|
-
return true;
|
|
234
|
-
return this.min === undefined || v > this.min;
|
|
235
|
-
}
|
|
236
|
-
get #canIncrement() {
|
|
237
|
-
const v = this.#currentValue;
|
|
238
|
-
if (v === undefined)
|
|
239
|
-
return true;
|
|
240
|
-
return this.max === undefined || v < this.max;
|
|
241
|
-
}
|
|
242
|
-
// ── Lifecycle ──────────────────────────────────────────────────────
|
|
243
|
-
connectedCallback() {
|
|
244
|
-
super.connectedCallback();
|
|
245
|
-
if (this.value === undefined && this.defaultValue !== undefined) {
|
|
246
|
-
this.#internalValue = this.#clamp(this.defaultValue);
|
|
247
|
-
}
|
|
248
|
-
this.#syncInputText();
|
|
249
|
-
}
|
|
250
|
-
willUpdate() {
|
|
251
|
-
this.#syncInputText();
|
|
252
|
-
}
|
|
253
|
-
// ── Value helpers ──────────────────────────────────────────────────
|
|
254
|
-
#syncInputText() {
|
|
255
|
-
const v = this.#currentValue;
|
|
256
|
-
this.#inputText = v !== undefined ? String(v) : "";
|
|
257
|
-
}
|
|
258
|
-
#clamp(val) {
|
|
259
|
-
if (this.min !== undefined)
|
|
260
|
-
val = Math.max(this.min, val);
|
|
261
|
-
if (this.max !== undefined)
|
|
262
|
-
val = Math.min(this.max, val);
|
|
263
|
-
return val;
|
|
264
|
-
}
|
|
265
|
-
#setValue(val) {
|
|
266
|
-
const clamped = this.#clamp(val);
|
|
267
|
-
if (this.value === undefined) {
|
|
268
|
-
this.#internalValue = clamped;
|
|
269
|
-
}
|
|
270
|
-
this.dispatchEvent(valueChangeEvent({ value: clamped }));
|
|
271
|
-
}
|
|
272
|
-
#increment = (__runInitializers(this, _private_inputText_extraInitializers), (amount) => {
|
|
273
|
-
if (this.disabled || this.readOnly)
|
|
274
|
-
return;
|
|
275
|
-
const current = this.#currentValue ?? this.min ?? 0;
|
|
276
|
-
this.#setValue(current + amount);
|
|
277
|
-
});
|
|
278
|
-
#decrement = (amount) => {
|
|
279
|
-
if (this.disabled || this.readOnly)
|
|
280
|
-
return;
|
|
281
|
-
const current = this.#currentValue ?? this.max ?? 0;
|
|
282
|
-
this.#setValue(current - amount);
|
|
283
|
-
};
|
|
284
|
-
#commitInput() {
|
|
285
|
-
const parsed = parseFloat(this.#inputText);
|
|
286
|
-
if (Number.isNaN(parsed)) {
|
|
287
|
-
this.#syncInputText();
|
|
288
|
-
}
|
|
289
|
-
else {
|
|
290
|
-
this.#setValue(parsed);
|
|
291
|
-
}
|
|
292
|
-
const v = this.#currentValue;
|
|
293
|
-
if (v !== undefined) {
|
|
294
|
-
this.dispatchEvent(valueCommittedEvent({ value: v }));
|
|
295
|
-
}
|
|
296
|
-
}
|
|
297
|
-
// ── Event handlers ─────────────────────────────────────────────────
|
|
298
|
-
#onInput = (e) => {
|
|
299
|
-
this.#inputText = e.target.value;
|
|
300
|
-
};
|
|
301
|
-
#onBlur = () => {
|
|
302
|
-
this.#commitInput();
|
|
303
|
-
};
|
|
304
|
-
#onKeyDown = (e) => {
|
|
305
|
-
switch (e.key) {
|
|
306
|
-
case "ArrowUp":
|
|
307
|
-
e.preventDefault();
|
|
308
|
-
this.#increment(e.shiftKey ? this.largeStep : this.step);
|
|
309
|
-
this.#syncInputText();
|
|
310
|
-
break;
|
|
311
|
-
case "ArrowDown":
|
|
312
|
-
e.preventDefault();
|
|
313
|
-
this.#decrement(e.shiftKey ? this.largeStep : this.step);
|
|
314
|
-
this.#syncInputText();
|
|
315
|
-
break;
|
|
316
|
-
case "Home":
|
|
317
|
-
if (this.min !== undefined) {
|
|
318
|
-
e.preventDefault();
|
|
319
|
-
this.#setValue(this.min);
|
|
320
|
-
}
|
|
321
|
-
break;
|
|
322
|
-
case "End":
|
|
323
|
-
if (this.max !== undefined) {
|
|
324
|
-
e.preventDefault();
|
|
325
|
-
this.#setValue(this.max);
|
|
326
|
-
}
|
|
327
|
-
break;
|
|
328
|
-
case "Enter":
|
|
329
|
-
this.#commitInput();
|
|
330
|
-
break;
|
|
331
|
-
}
|
|
332
|
-
};
|
|
333
|
-
#onDecrementClick = () => {
|
|
334
|
-
this.#decrement(this.step);
|
|
335
|
-
const v = this.#currentValue;
|
|
336
|
-
if (v !== undefined) {
|
|
337
|
-
this.dispatchEvent(valueCommittedEvent({ value: v }));
|
|
338
|
-
}
|
|
339
|
-
};
|
|
340
|
-
#onIncrementClick = () => {
|
|
341
|
-
this.#increment(this.step);
|
|
342
|
-
const v = this.#currentValue;
|
|
343
|
-
if (v !== undefined) {
|
|
344
|
-
this.dispatchEvent(valueCommittedEvent({ value: v }));
|
|
345
|
-
}
|
|
346
|
-
};
|
|
347
|
-
// ── Render ─────────────────────────────────────────────────────────
|
|
348
|
-
render() {
|
|
349
|
-
const currentValue = this.#currentValue;
|
|
350
|
-
return html `
|
|
351
|
-
<div
|
|
352
|
-
part="root"
|
|
353
|
-
?data-disabled="${this.disabled}"
|
|
354
|
-
>
|
|
355
|
-
<button
|
|
356
|
-
part="decrement"
|
|
357
|
-
type="button"
|
|
358
|
-
tabindex="-1"
|
|
359
|
-
aria-label="Decrease"
|
|
360
|
-
?disabled="${this.disabled || this.readOnly || !this.#canDecrement}"
|
|
361
|
-
@click="${this.#onDecrementClick}"
|
|
362
|
-
>
|
|
363
|
-
<slot name="decrement">−</slot>
|
|
364
|
-
</button>
|
|
365
|
-
<input
|
|
366
|
-
part="input"
|
|
367
|
-
type="text"
|
|
368
|
-
inputmode="decimal"
|
|
369
|
-
.value="${live(this.#inputText)}"
|
|
370
|
-
?disabled="${this.disabled}"
|
|
371
|
-
?readonly="${this.readOnly}"
|
|
372
|
-
?required="${this.required}"
|
|
373
|
-
@input="${this.#onInput}"
|
|
374
|
-
@keydown="${this.#onKeyDown}"
|
|
375
|
-
@blur="${this.#onBlur}"
|
|
376
|
-
/>
|
|
377
|
-
<button
|
|
378
|
-
part="increment"
|
|
379
|
-
type="button"
|
|
380
|
-
tabindex="-1"
|
|
381
|
-
aria-label="Increase"
|
|
382
|
-
?disabled="${this.disabled || this.readOnly || !this.#canIncrement}"
|
|
383
|
-
@click="${this.#onIncrementClick}"
|
|
384
|
-
>
|
|
385
|
-
<slot name="increment">+</slot>
|
|
386
|
-
</button>
|
|
387
|
-
${this.name
|
|
388
|
-
? html `<input
|
|
389
|
-
type="hidden"
|
|
390
|
-
name="${this.name}"
|
|
391
|
-
.value="${String(currentValue ?? "")}"
|
|
392
|
-
/>`
|
|
393
|
-
: nothing}
|
|
394
|
-
</div>
|
|
395
|
-
`;
|
|
396
|
-
}
|
|
397
|
-
};
|
|
398
|
-
})();
|
|
399
|
-
export { DuiStepper };
|
|
72
|
+
export class DuiStepper extends DuiStepperPrimitive {
|
|
73
|
+
static styles = [...DuiStepperPrimitive.styles, styles];
|
|
74
|
+
}
|
|
75
|
+
customElements.define(DuiStepper.tagName, DuiStepper);
|
package/switch/index.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
export { DuiSwitch
|
|
3
|
-
export
|
|
1
|
+
import "./switch.js";
|
|
2
|
+
export { DuiSwitch } from "./switch.js";
|
|
3
|
+
export { checkedChangeEvent } from "@deepfuture/dui-primitives/switch";
|
package/switch/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import
|
|
2
|
-
export { DuiSwitch
|
|
3
|
-
export
|
|
1
|
+
import "./switch.js";
|
|
2
|
+
export { DuiSwitch } from "./switch.js";
|
|
3
|
+
export { checkedChangeEvent } from "@deepfuture/dui-primitives/switch";
|
package/switch/switch.d.ts
CHANGED
|
@@ -1,32 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
}) => CustomEvent<{
|
|
5
|
-
checked: boolean;
|
|
6
|
-
}>;
|
|
7
|
-
/**
|
|
8
|
-
* `<dui-switch>` — A toggle switch for binary on/off settings.
|
|
9
|
-
*
|
|
10
|
-
* @csspart root - The switch track container.
|
|
11
|
-
* @csspart thumb - The movable thumb indicator.
|
|
12
|
-
* @fires checked-change - Fired when toggled. Detail: { checked: boolean }
|
|
13
|
-
*/
|
|
14
|
-
export declare class DuiSwitch extends LitElement {
|
|
15
|
-
#private;
|
|
16
|
-
static tagName: "dui-switch";
|
|
17
|
-
static formAssociated: boolean;
|
|
1
|
+
import { DuiSwitchPrimitive } from "@deepfuture/dui-primitives/switch";
|
|
2
|
+
import "../_install.js";
|
|
3
|
+
export declare class DuiSwitch extends DuiSwitchPrimitive {
|
|
18
4
|
static styles: import("lit").CSSResult[];
|
|
19
|
-
constructor();
|
|
20
|
-
accessor checked: boolean | undefined;
|
|
21
|
-
accessor defaultChecked: boolean;
|
|
22
|
-
accessor disabled: boolean;
|
|
23
|
-
accessor readOnly: boolean;
|
|
24
|
-
accessor required: boolean;
|
|
25
|
-
accessor name: string | undefined;
|
|
26
|
-
accessor value: string;
|
|
27
|
-
accessor uncheckedValue: string;
|
|
28
|
-
connectedCallback(): void;
|
|
29
|
-
willUpdate(): void;
|
|
30
|
-
disconnectedCallback(): void;
|
|
31
|
-
render(): TemplateResult;
|
|
32
5
|
}
|