@florid-kit/components 0.0.1-next.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/aria.d.ts +150 -0
- package/behaviors/element-internals.d.ts +41 -0
- package/behaviors/mixin.d.ts +54 -0
- package/components/button.d.ts +48 -0
- package/controllers/form-submitter.d.ts +66 -0
- package/css.d.ts +2 -0
- package/events.d.ts +29 -0
- package/index.d.ts +1 -0
- package/index.js +134 -0
- package/index.mjs +807 -0
- package/package.json +25 -0
- package/single-selection-controller.d.ts +76 -0
package/aria.d.ts
ADDED
|
@@ -0,0 +1,150 @@
|
|
|
1
|
+
import { ReactiveElement } from 'lit';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Accessibility Object Model reflective aria property name types.
|
|
5
|
+
*/
|
|
6
|
+
export type ARIAProperty = Exclude<keyof ARIAMixin, "role">;
|
|
7
|
+
/**
|
|
8
|
+
* Accessibility Object Model reflective aria properties.
|
|
9
|
+
*/
|
|
10
|
+
export declare const ARIA_PROPERTIES: ARIAProperty[];
|
|
11
|
+
/**
|
|
12
|
+
* Accessibility Object Model aria attribute name types.
|
|
13
|
+
*/
|
|
14
|
+
export type ARIAAttribute = ARIAPropertyToAttribute<ARIAProperty>;
|
|
15
|
+
/**
|
|
16
|
+
* Accessibility Object Model aria attributes.
|
|
17
|
+
*/
|
|
18
|
+
export declare const ARIA_ATTRIBUTES: ("aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-current" | "aria-description" | "aria-disabled" | "aria-expanded" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext")[];
|
|
19
|
+
/**
|
|
20
|
+
* Checks if an attribute is one of the AOM aria attributes.
|
|
21
|
+
*
|
|
22
|
+
* @example
|
|
23
|
+
* isAriaAttribute('aria-label'); // true
|
|
24
|
+
*
|
|
25
|
+
* @param attribute The attribute to check.
|
|
26
|
+
* @return True if the attribute is an aria attribute, or false if not.
|
|
27
|
+
*/
|
|
28
|
+
export declare function isAriaAttribute(attribute: string): attribute is ARIAAttribute;
|
|
29
|
+
/**
|
|
30
|
+
* Converts an AOM aria property into its corresponding attribute.
|
|
31
|
+
*
|
|
32
|
+
* @example
|
|
33
|
+
* ariaPropertyToAttribute('ariaLabel'); // 'aria-label'
|
|
34
|
+
*
|
|
35
|
+
* @param property The aria property.
|
|
36
|
+
* @return The aria attribute.
|
|
37
|
+
*/
|
|
38
|
+
export declare function ariaPropertyToAttribute<K extends ARIAProperty | "role">(property: K): ARIAPropertyToAttribute<K>;
|
|
39
|
+
type ARIAPropertyToAttribute<K extends string> = K extends `aria${infer Suffix}Element${infer OptS}` ? `aria-${Lowercase<Suffix>}` : K extends `aria${infer Suffix}` ? `aria-${Lowercase<Suffix>}` : K;
|
|
40
|
+
/**
|
|
41
|
+
* An extension of `ARIAMixin` that enforces strict value types for aria
|
|
42
|
+
* properties.
|
|
43
|
+
*
|
|
44
|
+
* This is needed for correct typing in render functions with lit analyzer.
|
|
45
|
+
*
|
|
46
|
+
* @example
|
|
47
|
+
* render() {
|
|
48
|
+
* const {ariaLabel} = this as ARIAMixinStrict;
|
|
49
|
+
* return html`
|
|
50
|
+
* <button aria-label=${ariaLabel || nothing}>
|
|
51
|
+
* <slot></slot>
|
|
52
|
+
* </button>
|
|
53
|
+
* `;
|
|
54
|
+
* }
|
|
55
|
+
*/
|
|
56
|
+
export interface ARIAMixinStrict extends ARIAMixin {
|
|
57
|
+
ariaAtomic: "true" | "false" | null;
|
|
58
|
+
ariaAutoComplete: "none" | "inline" | "list" | "both" | null;
|
|
59
|
+
ariaBusy: "true" | "false" | null;
|
|
60
|
+
ariaChecked: "true" | "false" | null;
|
|
61
|
+
ariaColCount: `${number}` | null;
|
|
62
|
+
ariaColIndex: `${number}` | null;
|
|
63
|
+
ariaColSpan: `${number}` | null;
|
|
64
|
+
ariaCurrent: "page" | "step" | "location" | "date" | "time" | "true" | "false" | null;
|
|
65
|
+
ariaDisabled: "true" | "false" | null;
|
|
66
|
+
ariaExpanded: "true" | "false" | null;
|
|
67
|
+
ariaHasPopup: "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | null;
|
|
68
|
+
ariaHidden: "true" | "false" | null;
|
|
69
|
+
ariaInvalid: "true" | "false" | null;
|
|
70
|
+
ariaKeyShortcuts: string | null;
|
|
71
|
+
ariaLabel: string | null;
|
|
72
|
+
ariaLevel: `${number}` | null;
|
|
73
|
+
ariaLive: "assertive" | "off" | "polite" | null;
|
|
74
|
+
ariaModal: "true" | "false" | null;
|
|
75
|
+
ariaMultiLine: "true" | "false" | null;
|
|
76
|
+
ariaMultiSelectable: "true" | "false" | null;
|
|
77
|
+
ariaOrientation: "horizontal" | "vertical" | "undefined" | null;
|
|
78
|
+
ariaPlaceholder: string | null;
|
|
79
|
+
ariaPosInSet: `${number}` | null;
|
|
80
|
+
ariaPressed: "true" | "false" | null;
|
|
81
|
+
ariaReadOnly: "true" | "false" | null;
|
|
82
|
+
ariaRequired: "true" | "false" | null;
|
|
83
|
+
ariaRoleDescription: string | null;
|
|
84
|
+
ariaRowCount: `${number}` | null;
|
|
85
|
+
ariaRowIndex: `${number}` | null;
|
|
86
|
+
ariaRowSpan: `${number}` | null;
|
|
87
|
+
ariaSelected: "true" | "false" | null;
|
|
88
|
+
ariaSetSize: `${number}` | null;
|
|
89
|
+
ariaSort: "ascending" | "descending" | "none" | "other" | null;
|
|
90
|
+
ariaValueMax: `${number}` | null;
|
|
91
|
+
ariaValueMin: `${number}` | null;
|
|
92
|
+
ariaValueNow: `${number}` | null;
|
|
93
|
+
ariaValueText: string | null;
|
|
94
|
+
role: ARIARole | null;
|
|
95
|
+
}
|
|
96
|
+
/**
|
|
97
|
+
* Valid values for `role`.
|
|
98
|
+
*/
|
|
99
|
+
export type ARIARole = "alert" | "alertdialog" | "button" | "checkbox" | "dialog" | "gridcell" | "link" | "log" | "marquee" | "menuitem" | "menuitemcheckbox" | "menuitemradio" | "option" | "progressbar" | "radio" | "scrollbar" | "searchbox" | "slider" | "spinbutton" | "status" | "switch" | "tab" | "tabpanel" | "textbox" | "timer" | "tooltip" | "treeitem" | "combobox" | "grid" | "listbox" | "menu" | "menubar" | "radiogroup" | "tablist" | "tree" | "treegrid" | "application" | "article" | "cell" | "columnheader" | "definition" | "directory" | "document" | "feed" | "figure" | "group" | "heading" | "img" | "list" | "listitem" | "math" | "none" | "note" | "presentation" | "region" | "row" | "rowgroup" | "rowheader" | "separator" | "table" | "term" | "text" | "toolbar" | "banner" | "complementary" | "contentinfo" | "form" | "main" | "navigation" | "region" | "search" | "doc-abstract" | "doc-acknowledgments" | "doc-afterword" | "doc-appendix" | "doc-backlink" | "doc-biblioentry" | "doc-bibliography" | "doc-biblioref" | "doc-chapter" | "doc-colophon" | "doc-conclusion" | "doc-cover" | "doc-credit" | "doc-credits" | "doc-dedication" | "doc-endnote" | "doc-endnotes" | "doc-epigraph" | "doc-epilogue" | "doc-errata" | "doc-example" | "doc-footnote" | "doc-foreword" | "doc-glossary" | "doc-glossref" | "doc-index" | "doc-introduction" | "doc-noteref" | "doc-notice" | "doc-pagebreak" | "doc-pagelist" | "doc-part" | "doc-preface" | "doc-prologue" | "doc-pullquote" | "doc-qna" | "doc-subtitle" | "doc-tip" | "doc-toc";
|
|
100
|
+
/**
|
|
101
|
+
* Enables a host custom element to be the target for aria roles and attributes.
|
|
102
|
+
* Components should set the `elementInternals.role` property.
|
|
103
|
+
*
|
|
104
|
+
* By default, aria components are tab focusable. Provide a `focusable: false`
|
|
105
|
+
* option for components that should not be tab focusable, such as
|
|
106
|
+
* `role="listbox"`.
|
|
107
|
+
*
|
|
108
|
+
* This function will also polyfill aria `ElementInternals` properties for
|
|
109
|
+
* Firefox.
|
|
110
|
+
*
|
|
111
|
+
* @param ctor The `ReactiveElement` constructor to set up.
|
|
112
|
+
* @param options Options to configure the element's host aria.
|
|
113
|
+
*/
|
|
114
|
+
export declare function setupHostAria(ctor: typeof ReactiveElement, { focusable }?: SetupHostAriaOptions): void;
|
|
115
|
+
/**
|
|
116
|
+
* Options for setting up a host element as an aria target.
|
|
117
|
+
*/
|
|
118
|
+
export interface SetupHostAriaOptions {
|
|
119
|
+
/**
|
|
120
|
+
* Whether or not the element can be focused with the tab key. Defaults to
|
|
121
|
+
* true.
|
|
122
|
+
*
|
|
123
|
+
* Set this to false for aria roles that should not be tab focusable, such as
|
|
124
|
+
* `role="listbox"`.
|
|
125
|
+
*/
|
|
126
|
+
focusable?: boolean;
|
|
127
|
+
}
|
|
128
|
+
/**
|
|
129
|
+
* Polyfills an element and its `ElementInternals` to support `ARIAMixin`
|
|
130
|
+
* properties on internals. This is needed for Firefox.
|
|
131
|
+
*
|
|
132
|
+
* `setupHostAria()` must be called for the element class.
|
|
133
|
+
*
|
|
134
|
+
* @example
|
|
135
|
+
* class XButton extends LitElement {
|
|
136
|
+
* static {
|
|
137
|
+
* setupHostAria(XButton);
|
|
138
|
+
* }
|
|
139
|
+
*
|
|
140
|
+
* private internals =
|
|
141
|
+
* polyfillElementInternalsAria(this, this.attachInternals());
|
|
142
|
+
*
|
|
143
|
+
* constructor() {
|
|
144
|
+
* super();
|
|
145
|
+
* this.internals.role = 'button';
|
|
146
|
+
* }
|
|
147
|
+
* }
|
|
148
|
+
*/
|
|
149
|
+
export declare function polyfillElementInternalsAria(host: ReactiveElement, internals: ElementInternals): ElementInternals;
|
|
150
|
+
export {};
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
|
+
import { MixinBase, MixinReturn } from './mixin.js';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* A unique symbol used for protected access to an instance's
|
|
6
|
+
* `ElementInternals`.
|
|
7
|
+
*
|
|
8
|
+
* @example
|
|
9
|
+
* ```ts
|
|
10
|
+
* class MyElement extends mixinElementInternals(LitElement) {
|
|
11
|
+
* constructor() {
|
|
12
|
+
* super();
|
|
13
|
+
* this[internals].role = 'button';
|
|
14
|
+
* }
|
|
15
|
+
* }
|
|
16
|
+
* ```
|
|
17
|
+
*/
|
|
18
|
+
export declare const internals: unique symbol;
|
|
19
|
+
/**
|
|
20
|
+
* An instance with an `internals` symbol property for the component's
|
|
21
|
+
* `ElementInternals`.
|
|
22
|
+
*
|
|
23
|
+
* Use this when protected access is needed for an instance's `ElementInternals`
|
|
24
|
+
* from other files. A unique symbol is used to access the internals.
|
|
25
|
+
*/
|
|
26
|
+
export interface WithElementInternals {
|
|
27
|
+
/**
|
|
28
|
+
* An instance's `ElementInternals`.
|
|
29
|
+
*/
|
|
30
|
+
[internals]: ElementInternals;
|
|
31
|
+
}
|
|
32
|
+
/**
|
|
33
|
+
* Mixes in an attached `ElementInternals` instance.
|
|
34
|
+
*
|
|
35
|
+
* This mixin is only needed when other shared code needs access to a
|
|
36
|
+
* component's `ElementInternals`, such as form-associated mixins.
|
|
37
|
+
*
|
|
38
|
+
* @param base The class to mix functionality into.
|
|
39
|
+
* @return The provided class with `WithElementInternals` mixed in.
|
|
40
|
+
*/
|
|
41
|
+
export declare function mixinElementInternals<T extends MixinBase<LitElement>>(base: T): MixinReturn<T, WithElementInternals>;
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2023 Google LLC
|
|
4
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
/**
|
|
7
|
+
* The base class for a mixin with an optional expected base class type.
|
|
8
|
+
*
|
|
9
|
+
* @template ExpectedBase Optional expected base class type, such as
|
|
10
|
+
* `LitElement`.
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```ts
|
|
14
|
+
* interface Foo {
|
|
15
|
+
* isFoo: boolean;
|
|
16
|
+
* }
|
|
17
|
+
*
|
|
18
|
+
* function mixinFoo<T extends MixinBase>(base: T): MixinReturn<T, Foo> {
|
|
19
|
+
* // Mixins must be `abstract`
|
|
20
|
+
* abstract class FooImpl extends base implements Foo {
|
|
21
|
+
* isFoo = true;
|
|
22
|
+
* }
|
|
23
|
+
*
|
|
24
|
+
* return FooImpl;
|
|
25
|
+
* }
|
|
26
|
+
* ```
|
|
27
|
+
*/
|
|
28
|
+
export type MixinBase<ExpectedBase = object> = abstract new (...args: any[]) => ExpectedBase;
|
|
29
|
+
/**
|
|
30
|
+
* The return value of a mixin.
|
|
31
|
+
*
|
|
32
|
+
* @template MixinBase The generic that extends `MixinBase` used for the mixin's
|
|
33
|
+
* base class argument.
|
|
34
|
+
* @template MixinClass Optional interface of fuctionality that was mixed in.
|
|
35
|
+
* Omit if no additional APIs were added (such as purely overriding base
|
|
36
|
+
* class functionality).
|
|
37
|
+
*
|
|
38
|
+
* @example
|
|
39
|
+
* ```ts
|
|
40
|
+
* interface Foo {
|
|
41
|
+
* isFoo: boolean;
|
|
42
|
+
* }
|
|
43
|
+
*
|
|
44
|
+
* // Mixins must be `abstract`
|
|
45
|
+
* function mixinFoo<T extends MixinBase>(base: T): MixinReturn<T, Foo> {
|
|
46
|
+
* abstract class FooImpl extends base implements Foo {
|
|
47
|
+
* isFoo = true;
|
|
48
|
+
* }
|
|
49
|
+
*
|
|
50
|
+
* return FooImpl;
|
|
51
|
+
* }
|
|
52
|
+
* ```
|
|
53
|
+
*/
|
|
54
|
+
export type MixinReturn<MixinBase, MixinClass = object> = (abstract new (...args: any[]) => MixinClass) & MixinBase;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
|
+
import { FormSubmitter, FormSubmitterType } from '../controllers/form-submitter';
|
|
3
|
+
|
|
4
|
+
declare const buttonBaseClass: import('../behaviors/mixin').MixinReturn<typeof LitElement, import('../behaviors/element-internals.js').WithElementInternals>;
|
|
5
|
+
declare const variants: readonly ["primary", "secondary", "tertiary"];
|
|
6
|
+
type ButtonVariant = (typeof variants)[number];
|
|
7
|
+
export declare class OccitaneButton extends buttonBaseClass implements FormSubmitter {
|
|
8
|
+
/** @nocollapse */
|
|
9
|
+
static readonly formAssociated = true;
|
|
10
|
+
static styles: import('lit').CSSResult;
|
|
11
|
+
/**
|
|
12
|
+
* The default behavior of the button. May be "button", "reset", or "submit"
|
|
13
|
+
* (default).
|
|
14
|
+
*/
|
|
15
|
+
type: FormSubmitterType;
|
|
16
|
+
/**
|
|
17
|
+
* The value added to a form with the button's name when the button submits a
|
|
18
|
+
* form.
|
|
19
|
+
*/
|
|
20
|
+
value: string;
|
|
21
|
+
get name(): string;
|
|
22
|
+
set name(name: string);
|
|
23
|
+
/**
|
|
24
|
+
* The associated form element with which this element's value will submit.
|
|
25
|
+
*/
|
|
26
|
+
get form(): HTMLFormElement | null;
|
|
27
|
+
variant: ButtonVariant;
|
|
28
|
+
disabled: boolean;
|
|
29
|
+
/**
|
|
30
|
+
* The URL that the link button points to.
|
|
31
|
+
*/
|
|
32
|
+
href: string;
|
|
33
|
+
/**
|
|
34
|
+
* Where to display the linked `href` URL for a link button. Common options
|
|
35
|
+
* include `_blank` to open in a new tab.
|
|
36
|
+
*/
|
|
37
|
+
target: "_blank" | "_parent" | "_self" | "_top" | "";
|
|
38
|
+
protected willUpdate(): void;
|
|
39
|
+
protected render(): import('lit').TemplateResult<1>;
|
|
40
|
+
private renderLink;
|
|
41
|
+
private renderButton;
|
|
42
|
+
}
|
|
43
|
+
declare global {
|
|
44
|
+
interface HTMLElementTagNameMap {
|
|
45
|
+
"o-button": OccitaneButton;
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
export {};
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import { ReactiveElement } from 'lit';
|
|
2
|
+
import { WithElementInternals } from '../behaviors/element-internals.js';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* A string indicating the form submission behavior of the element.
|
|
6
|
+
*
|
|
7
|
+
* - submit: The element submits the form. This is the default value if the
|
|
8
|
+
* attribute is not specified, or if it is dynamically changed to an empty or
|
|
9
|
+
* invalid value.
|
|
10
|
+
* - reset: The element resets the form.
|
|
11
|
+
* - button: The element does nothing.
|
|
12
|
+
*/
|
|
13
|
+
export type FormSubmitterType = "button" | "submit" | "reset";
|
|
14
|
+
/**
|
|
15
|
+
* An element that can submit or reset a `<form>`, similar to
|
|
16
|
+
* `<button type="submit">`.
|
|
17
|
+
*/
|
|
18
|
+
export interface FormSubmitter extends ReactiveElement, WithElementInternals {
|
|
19
|
+
/**
|
|
20
|
+
* A string indicating the form submission behavior of the element.
|
|
21
|
+
*
|
|
22
|
+
* - submit: The element submits the form. This is the default value if the
|
|
23
|
+
* attribute is not specified, or if it is dynamically changed to an empty or
|
|
24
|
+
* invalid value.
|
|
25
|
+
* - reset: The element resets the form.
|
|
26
|
+
* - button: The element does nothing.
|
|
27
|
+
*/
|
|
28
|
+
type: FormSubmitterType;
|
|
29
|
+
/**
|
|
30
|
+
* The HTML name to use in form submission. When combined with a `value`, the
|
|
31
|
+
* submitting button's name/value will be added to the form.
|
|
32
|
+
*
|
|
33
|
+
* Names must reflect to a `name` attribute for form integration.
|
|
34
|
+
*/
|
|
35
|
+
name: string;
|
|
36
|
+
/**
|
|
37
|
+
* The value of the button. When combined with a `name`, the submitting
|
|
38
|
+
* button's name/value will be added to the form.
|
|
39
|
+
*/
|
|
40
|
+
value: string;
|
|
41
|
+
}
|
|
42
|
+
type FormSubmitterConstructor = (new () => FormSubmitter) | (abstract new () => FormSubmitter);
|
|
43
|
+
/**
|
|
44
|
+
* Sets up an element's constructor to enable form submission. The element
|
|
45
|
+
* instance should be form associated and have a `type` property.
|
|
46
|
+
*
|
|
47
|
+
* A click listener is added to each element instance. If the click is not
|
|
48
|
+
* default prevented, it will submit the element's form, if any.
|
|
49
|
+
*
|
|
50
|
+
* @example
|
|
51
|
+
* ```ts
|
|
52
|
+
* class MyElement extends mixinElementInternals(LitElement) {
|
|
53
|
+
* static {
|
|
54
|
+
* setupFormSubmitter(MyElement);
|
|
55
|
+
* }
|
|
56
|
+
*
|
|
57
|
+
* static formAssociated = true;
|
|
58
|
+
*
|
|
59
|
+
* type: FormSubmitterType = 'submit';
|
|
60
|
+
* }
|
|
61
|
+
* ```
|
|
62
|
+
*
|
|
63
|
+
* @param ctor The form submitter element's constructor.
|
|
64
|
+
*/
|
|
65
|
+
export declare function setupFormSubmitter(ctor: FormSubmitterConstructor): void;
|
|
66
|
+
export {};
|
package/css.d.ts
ADDED
package/events.d.ts
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Returns true if the click event should trigger an activation behavior. The
|
|
3
|
+
* behavior is defined by the element and is whatever it should do when
|
|
4
|
+
* clicked.
|
|
5
|
+
*
|
|
6
|
+
* Typically when an element needs to handle a click, the click is generated
|
|
7
|
+
* from within the element and an event listener within the element implements
|
|
8
|
+
* the needed behavior; however, it's possible to fire a click directly
|
|
9
|
+
* at the element that the element should handle. This method helps
|
|
10
|
+
* distinguish these "external" clicks.
|
|
11
|
+
*
|
|
12
|
+
* An "external" click can be triggered in a number of ways: via a click
|
|
13
|
+
* on an associated label for a form associated element, calling
|
|
14
|
+
* `element.click()`, or calling
|
|
15
|
+
* `element.dispatchEvent(new MouseEvent('click', ...))`.
|
|
16
|
+
*
|
|
17
|
+
* Also works around Firefox issue
|
|
18
|
+
* https://bugzilla.mozilla.org/show_bug.cgi?id=1804576 by squelching
|
|
19
|
+
* events for a microtask after called.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* hostClickListener = (event: MouseEvent) {
|
|
23
|
+
* if (isActivationClick(event)) {
|
|
24
|
+
* this.dispatchActivationClick(this.buttonElement);
|
|
25
|
+
* }
|
|
26
|
+
* }
|
|
27
|
+
*
|
|
28
|
+
*/
|
|
29
|
+
export declare function isActivationClick(event: Event): boolean;
|
package/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
|
package/index.js
ADDED
|
@@ -0,0 +1,134 @@
|
|
|
1
|
+
"use strict";/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2019 Google LLC
|
|
4
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
5
|
+
*/const R=globalThis,F=R.ShadowRoot&&(R.ShadyCSS===void 0||R.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,J=Symbol(),X=new WeakMap;let lt=class{constructor(t,e,s){if(this._$cssResult$=!0,s!==J)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(F&&t===void 0){const s=e!==void 0&&e.length===1;s&&(t=X.get(e)),t===void 0&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),s&&X.set(e,t))}return t}toString(){return this.cssText}};const dt=r=>new lt(typeof r=="string"?r:r+"",void 0,J),K=(r,...t)=>{const e=r.length===1?r[0]:t.reduce((s,i,o)=>s+(n=>{if(n._$cssResult$===!0)return n.cssText;if(typeof n=="number")return n;throw Error("Value passed to 'css' function must be a 'css' function result: "+n+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(i)+r[o+1],r[0]);return new lt(e,r,J)},ft=(r,t)=>{if(F)r.adoptedStyleSheets=t.map(e=>e instanceof CSSStyleSheet?e:e.styleSheet);else for(const e of t){const s=document.createElement("style"),i=R.litNonce;i!==void 0&&s.setAttribute("nonce",i),s.textContent=e.cssText,r.appendChild(s)}},Y=F?r=>r:r=>r instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return dt(e)})(r):r;/**
|
|
6
|
+
* @license
|
|
7
|
+
* Copyright 2017 Google LLC
|
|
8
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
9
|
+
*/const{is:bt,defineProperty:_t,getOwnPropertyDescriptor:mt,getOwnPropertyNames:gt,getOwnPropertySymbols:vt,getPrototypeOf:yt}=Object,_=globalThis,tt=_.trustedTypes,At=tt?tt.emptyScript:"",L=_.reactiveElementPolyfillSupport,P=(r,t)=>r,k={toAttribute(r,t){switch(t){case Boolean:r=r?At:null;break;case Object:case Array:r=r==null?r:JSON.stringify(r)}return r},fromAttribute(r,t){let e=r;switch(t){case Boolean:e=r!==null;break;case Number:e=r===null?null:Number(r);break;case Object:case Array:try{e=JSON.parse(r)}catch{e=null}}return e}},Z=(r,t)=>!bt(r,t),et={attribute:!0,type:String,converter:k,reflect:!1,hasChanged:Z};Symbol.metadata??(Symbol.metadata=Symbol("metadata")),_.litPropertyMetadata??(_.litPropertyMetadata=new WeakMap);class A extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??(this.l=[])).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=et){if(e.state&&(e.attribute=!1),this._$Ei(),this.elementProperties.set(t,e),!e.noAccessor){const s=Symbol(),i=this.getPropertyDescriptor(t,s,e);i!==void 0&&_t(this.prototype,t,i)}}static getPropertyDescriptor(t,e,s){const{get:i,set:o}=mt(this.prototype,t)??{get(){return this[e]},set(n){this[e]=n}};return{get(){return i==null?void 0:i.call(this)},set(n){const h=i==null?void 0:i.call(this);o.call(this,n),this.requestUpdate(t,h,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??et}static _$Ei(){if(this.hasOwnProperty(P("elementProperties")))return;const t=yt(this);t.finalize(),t.l!==void 0&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(P("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(P("properties"))){const e=this.properties,s=[...gt(e),...vt(e)];for(const i of s)this.createProperty(i,e[i])}const t=this[Symbol.metadata];if(t!==null){const e=litPropertyMetadata.get(t);if(e!==void 0)for(const[s,i]of e)this.elementProperties.set(s,i)}this._$Eh=new Map;for(const[e,s]of this.elementProperties){const i=this._$Eu(e,s);i!==void 0&&this._$Eh.set(i,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const i of s)e.unshift(Y(i))}else t!==void 0&&e.push(Y(t));return e}static _$Eu(t,e){const s=e.attribute;return s===!1?void 0:typeof s=="string"?s:typeof t=="string"?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){var t;this._$ES=new Promise(e=>this.enableUpdating=e),this._$AL=new Map,this._$E_(),this.requestUpdate(),(t=this.constructor.l)==null||t.forEach(e=>e(this))}addController(t){var e;(this._$EO??(this._$EO=new Set)).add(t),this.renderRoot!==void 0&&this.isConnected&&((e=t.hostConnected)==null||e.call(t))}removeController(t){var e;(e=this._$EO)==null||e.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const s of e.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return ft(t,this.constructor.elementStyles),t}connectedCallback(){var t;this.renderRoot??(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),(t=this._$EO)==null||t.forEach(e=>{var s;return(s=e.hostConnected)==null?void 0:s.call(e)})}enableUpdating(t){}disconnectedCallback(){var t;(t=this._$EO)==null||t.forEach(e=>{var s;return(s=e.hostDisconnected)==null?void 0:s.call(e)})}attributeChangedCallback(t,e,s){this._$AK(t,s)}_$EC(t,e){var o;const s=this.constructor.elementProperties.get(t),i=this.constructor._$Eu(t,s);if(i!==void 0&&s.reflect===!0){const n=(((o=s.converter)==null?void 0:o.toAttribute)!==void 0?s.converter:k).toAttribute(e,s.type);this._$Em=t,n==null?this.removeAttribute(i):this.setAttribute(i,n),this._$Em=null}}_$AK(t,e){var o;const s=this.constructor,i=s._$Eh.get(t);if(i!==void 0&&this._$Em!==i){const n=s.getPropertyOptions(i),h=typeof n.converter=="function"?{fromAttribute:n.converter}:((o=n.converter)==null?void 0:o.fromAttribute)!==void 0?n.converter:k;this._$Em=i,this[i]=h.fromAttribute(e,n.type),this._$Em=null}}requestUpdate(t,e,s){if(t!==void 0){if(s??(s=this.constructor.getPropertyOptions(t)),!(s.hasChanged??Z)(this[t],e))return;this.P(t,e,s)}this.isUpdatePending===!1&&(this._$ES=this._$ET())}P(t,e,s){this._$AL.has(t)||this._$AL.set(t,e),s.reflect===!0&&this._$Em!==t&&(this._$Ej??(this._$Ej=new Set)).add(t)}async _$ET(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}const t=this.scheduleUpdate();return t!=null&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var s;if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??(this.renderRoot=this.createRenderRoot()),this._$Ep){for(const[o,n]of this._$Ep)this[o]=n;this._$Ep=void 0}const i=this.constructor.elementProperties;if(i.size>0)for(const[o,n]of i)n.wrapped!==!0||this._$AL.has(o)||this[o]===void 0||this.P(o,this[o],n)}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),(s=this._$EO)==null||s.forEach(i=>{var o;return(o=i.hostUpdate)==null?void 0:o.call(i)}),this.update(e)):this._$EU()}catch(i){throw t=!1,this._$EU(),i}t&&this._$AE(e)}willUpdate(t){}_$AE(t){var e;(e=this._$EO)==null||e.forEach(s=>{var i;return(i=s.hostUpdated)==null?void 0:i.call(s)}),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EU(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Ej&&(this._$Ej=this._$Ej.forEach(e=>this._$EC(e,this[e]))),this._$EU()}updated(t){}firstUpdated(t){}}A.elementStyles=[],A.shadowRootOptions={mode:"open"},A[P("elementProperties")]=new Map,A[P("finalized")]=new Map,L==null||L({ReactiveElement:A}),(_.reactiveElementVersions??(_.reactiveElementVersions=[])).push("2.0.4");/**
|
|
10
|
+
* @license
|
|
11
|
+
* Copyright 2017 Google LLC
|
|
12
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
13
|
+
*/const C=globalThis,z=C.trustedTypes,st=z?z.createPolicy("lit-html",{createHTML:r=>r}):void 0,ct="$lit$",b=`lit$${Math.random().toFixed(9).slice(2)}$`,ut="?"+b,Et=`<${ut}>`,v=document,O=()=>v.createComment(""),T=r=>r===null||typeof r!="object"&&typeof r!="function",G=Array.isArray,St=r=>G(r)||typeof(r==null?void 0:r[Symbol.iterator])=="function",j=`[
|
|
14
|
+
\f\r]`,x=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,it=/-->/g,rt=/>/g,m=RegExp(`>|${j}(?:([^\\s"'>=/]+)(${j}*=${j}*(?:[^
|
|
15
|
+
\f\r"'\`<>=]|("|')|))|$)`,"g"),nt=/'/g,ot=/"/g,pt=/^(?:script|style|textarea|title)$/i,wt=r=>(t,...e)=>({_$litType$:r,strings:t,values:e}),B=wt(1),E=Symbol.for("lit-noChange"),d=Symbol.for("lit-nothing"),at=new WeakMap,g=v.createTreeWalker(v,129);function $t(r,t){if(!G(r)||!r.hasOwnProperty("raw"))throw Error("invalid template strings array");return st!==void 0?st.createHTML(t):t}const xt=(r,t)=>{const e=r.length-1,s=[];let i,o=t===2?"<svg>":t===3?"<math>":"",n=x;for(let h=0;h<e;h++){const a=r[h];let c,u,l=-1,$=0;for(;$<a.length&&(n.lastIndex=$,u=n.exec(a),u!==null);)$=n.lastIndex,n===x?u[1]==="!--"?n=it:u[1]!==void 0?n=rt:u[2]!==void 0?(pt.test(u[2])&&(i=RegExp("</"+u[2],"g")),n=m):u[3]!==void 0&&(n=m):n===m?u[0]===">"?(n=i??x,l=-1):u[1]===void 0?l=-2:(l=n.lastIndex-u[2].length,c=u[1],n=u[3]===void 0?m:u[3]==='"'?ot:nt):n===ot||n===nt?n=m:n===it||n===rt?n=x:(n=m,i=void 0);const f=n===m&&r[h+1].startsWith("/>")?" ":"";o+=n===x?a+Et:l>=0?(s.push(c),a.slice(0,l)+ct+a.slice(l)+b+f):a+b+(l===-2?h:f)}return[$t(r,o+(r[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),s]};class H{constructor({strings:t,_$litType$:e},s){let i;this.parts=[];let o=0,n=0;const h=t.length-1,a=this.parts,[c,u]=xt(t,e);if(this.el=H.createElement(c,s),g.currentNode=this.el.content,e===2||e===3){const l=this.el.content.firstChild;l.replaceWith(...l.childNodes)}for(;(i=g.nextNode())!==null&&a.length<h;){if(i.nodeType===1){if(i.hasAttributes())for(const l of i.getAttributeNames())if(l.endsWith(ct)){const $=u[n++],f=i.getAttribute(l).split(b),N=/([.?@])?(.*)/.exec($);a.push({type:1,index:o,name:N[2],strings:f,ctor:N[1]==="."?Ct:N[1]==="?"?Ut:N[1]==="@"?Ot:I}),i.removeAttribute(l)}else l.startsWith(b)&&(a.push({type:6,index:o}),i.removeAttribute(l));if(pt.test(i.tagName)){const l=i.textContent.split(b),$=l.length-1;if($>0){i.textContent=z?z.emptyScript:"";for(let f=0;f<$;f++)i.append(l[f],O()),g.nextNode(),a.push({type:2,index:++o});i.append(l[$],O())}}}else if(i.nodeType===8)if(i.data===ut)a.push({type:2,index:o});else{let l=-1;for(;(l=i.data.indexOf(b,l+1))!==-1;)a.push({type:7,index:o}),l+=b.length-1}o++}}static createElement(t,e){const s=v.createElement("template");return s.innerHTML=t,s}}function S(r,t,e=r,s){var n,h;if(t===E)return t;let i=s!==void 0?(n=e._$Co)==null?void 0:n[s]:e._$Cl;const o=T(t)?void 0:t._$litDirective$;return(i==null?void 0:i.constructor)!==o&&((h=i==null?void 0:i._$AO)==null||h.call(i,!1),o===void 0?i=void 0:(i=new o(r),i._$AT(r,e,s)),s!==void 0?(e._$Co??(e._$Co=[]))[s]=i:e._$Cl=i),i!==void 0&&(t=S(r,i._$AS(r,t.values),i,s)),t}class Pt{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:e},parts:s}=this._$AD,i=((t==null?void 0:t.creationScope)??v).importNode(e,!0);g.currentNode=i;let o=g.nextNode(),n=0,h=0,a=s[0];for(;a!==void 0;){if(n===a.index){let c;a.type===2?c=new M(o,o.nextSibling,this,t):a.type===1?c=new a.ctor(o,a.name,a.strings,this,t):a.type===6&&(c=new Tt(o,this,t)),this._$AV.push(c),a=s[++h]}n!==(a==null?void 0:a.index)&&(o=g.nextNode(),n++)}return g.currentNode=v,i}p(t){let e=0;for(const s of this._$AV)s!==void 0&&(s.strings!==void 0?(s._$AI(t,s,e),e+=s.strings.length-2):s._$AI(t[e])),e++}}class M{get _$AU(){var t;return((t=this._$AM)==null?void 0:t._$AU)??this._$Cv}constructor(t,e,s,i){this.type=2,this._$AH=d,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=s,this.options=i,this._$Cv=(i==null?void 0:i.isConnected)??!0}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return e!==void 0&&(t==null?void 0:t.nodeType)===11&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=S(this,t,e),T(t)?t===d||t==null||t===""?(this._$AH!==d&&this._$AR(),this._$AH=d):t!==this._$AH&&t!==E&&this._(t):t._$litType$!==void 0?this.$(t):t.nodeType!==void 0?this.T(t):St(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==d&&T(this._$AH)?this._$AA.nextSibling.data=t:this.T(v.createTextNode(t)),this._$AH=t}$(t){var o;const{values:e,_$litType$:s}=t,i=typeof s=="number"?this._$AC(t):(s.el===void 0&&(s.el=H.createElement($t(s.h,s.h[0]),this.options)),s);if(((o=this._$AH)==null?void 0:o._$AD)===i)this._$AH.p(e);else{const n=new Pt(i,this),h=n.u(this.options);n.p(e),this.T(h),this._$AH=n}}_$AC(t){let e=at.get(t.strings);return e===void 0&&at.set(t.strings,e=new H(t)),e}k(t){G(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let s,i=0;for(const o of t)i===e.length?e.push(s=new M(this.O(O()),this.O(O()),this,this.options)):s=e[i],s._$AI(o),i++;i<e.length&&(this._$AR(s&&s._$AB.nextSibling,i),e.length=i)}_$AR(t=this._$AA.nextSibling,e){var s;for((s=this._$AP)==null?void 0:s.call(this,!1,!0,e);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var e;this._$AM===void 0&&(this._$Cv=t,(e=this._$AP)==null||e.call(this,t))}}class I{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,s,i,o){this.type=1,this._$AH=d,this._$AN=void 0,this.element=t,this.name=e,this._$AM=i,this.options=o,s.length>2||s[0]!==""||s[1]!==""?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=d}_$AI(t,e=this,s,i){const o=this.strings;let n=!1;if(o===void 0)t=S(this,t,e,0),n=!T(t)||t!==this._$AH&&t!==E,n&&(this._$AH=t);else{const h=t;let a,c;for(t=o[0],a=0;a<o.length-1;a++)c=S(this,h[s+a],e,a),c===E&&(c=this._$AH[a]),n||(n=!T(c)||c!==this._$AH[a]),c===d?t=d:t!==d&&(t+=(c??"")+o[a+1]),this._$AH[a]=c}n&&!i&&this.j(t)}j(t){t===d?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class Ct extends I{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===d?void 0:t}}class Ut extends I{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==d)}}class Ot extends I{constructor(t,e,s,i,o){super(t,e,s,i,o),this.type=5}_$AI(t,e=this){if((t=S(this,t,e,0)??d)===E)return;const s=this._$AH,i=t===d&&s!==d||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,o=t!==d&&(s===d||i);i&&this.element.removeEventListener(this.name,this,s),o&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e;typeof this._$AH=="function"?this._$AH.call(((e=this.options)==null?void 0:e.host)??this.element,t):this._$AH.handleEvent(t)}}class Tt{constructor(t,e,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){S(this,t)}}const D=C.litHtmlPolyfillSupport;D==null||D(H,M),(C.litHtmlVersions??(C.litHtmlVersions=[])).push("3.2.1");const Ht=(r,t,e)=>{const s=(e==null?void 0:e.renderBefore)??t;let i=s._$litPart$;if(i===void 0){const o=(e==null?void 0:e.renderBefore)??null;s._$litPart$=i=new M(t.insertBefore(O(),o),o,void 0,e??{})}return i._$AI(r),i};/**
|
|
16
|
+
* @license
|
|
17
|
+
* Copyright 2017 Google LLC
|
|
18
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
19
|
+
*/let U=class extends A{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var e;const t=super.createRenderRoot();return(e=this.renderOptions).renderBefore??(e.renderBefore=t.firstChild),t}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=Ht(e,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),(t=this._$Do)==null||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this._$Do)==null||t.setConnected(!1)}render(){return E}};var ht;U._$litElement$=!0,U.finalized=!0,(ht=globalThis.litElementHydrateSupport)==null||ht.call(globalThis,{LitElement:U});const V=globalThis.litElementPolyfillSupport;V==null||V({LitElement:U});(globalThis.litElementVersions??(globalThis.litElementVersions=[])).push("4.1.1");/**
|
|
20
|
+
* @license
|
|
21
|
+
* Copyright 2017 Google LLC
|
|
22
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
23
|
+
*/const Mt=r=>(t,e)=>{e!==void 0?e.addInitializer(()=>{customElements.define(r,t)}):customElements.define(r,t)};/**
|
|
24
|
+
* @license
|
|
25
|
+
* Copyright 2017 Google LLC
|
|
26
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
27
|
+
*/const Nt={attribute:!0,type:String,converter:k,reflect:!1,hasChanged:Z},Rt=(r=Nt,t,e)=>{const{kind:s,metadata:i}=e;let o=globalThis.litPropertyMetadata.get(i);if(o===void 0&&globalThis.litPropertyMetadata.set(i,o=new Map),o.set(e.name,r),s==="accessor"){const{name:n}=e;return{set(h){const a=t.get.call(this);t.set.call(this,h),this.requestUpdate(n,a,r)},init(h){return h!==void 0&&this.P(n,void 0,r),h}}}if(s==="setter"){const{name:n}=e;return function(h){const a=this[n];t.call(this,h),this.requestUpdate(n,a,r)}}throw Error("Unsupported decorator location: "+s)};function w(r){return(t,e)=>typeof e=="object"?Rt(r,t,e):((s,i,o)=>{const n=i.hasOwnProperty(o);return i.constructor.createProperty(o,n?{...s,wrapped:!0}:s),n?Object.getOwnPropertyDescriptor(i,o):void 0})(r,t,e)}const kt=K`
|
|
28
|
+
outline: 1px dashed var(--button-border-color);
|
|
29
|
+
outline-offset: 2px;
|
|
30
|
+
outline: dashed black;
|
|
31
|
+
`;K`
|
|
32
|
+
:host * {
|
|
33
|
+
box-sizing: border-box;
|
|
34
|
+
}
|
|
35
|
+
`;/**
|
|
36
|
+
* @license
|
|
37
|
+
* Copyright 2023 Google LLC
|
|
38
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
39
|
+
*/const Q=Symbol("internals"),W=Symbol("privateInternals");function zt(r){var t;class e extends r{get[(t=Q,t)](){return this[W]||(this[W]=this.attachInternals()),this[W]}}return e}/**
|
|
40
|
+
* @license
|
|
41
|
+
* Copyright 2023 Google LLC
|
|
42
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
43
|
+
*/function It(r){r.addInitializer(t=>{const e=t;e.addEventListener("click",async s=>{const{type:i,[Q]:o}=e,{form:n}=o;if(!(!n||i==="button")&&(await new Promise(h=>{setTimeout(h)}),!s.defaultPrevented)){if(i==="reset"){n.reset();return}n.addEventListener("submit",h=>{Object.defineProperty(h,"submitter",{configurable:!0,enumerable:!0,get:()=>e})},{capture:!0,once:!0}),o.setFormValue(e.value),n.requestSubmit()}})})}var Lt=Object.defineProperty,jt=Object.getOwnPropertyDescriptor,y=(r,t,e,s)=>{for(var i=s>1?void 0:s?jt(t,e):t,o=r.length-1,n;o>=0;o--)(n=r[o])&&(i=(s?n(t,e,i):n(i))||i);return s&&i&&Lt(t,e,i),i};const Bt=zt(U),q=r=>{const t=`
|
|
44
|
+
--button-bg-disabled: var(--button-${r}-bg-disabled);
|
|
45
|
+
--button-bg-hover: var(--button-${r}-bg-hover);
|
|
46
|
+
--button-bg: var(--button-${r}-bg-default);
|
|
47
|
+
--button-border-disabled: var(--button-${r}-border-disabled);
|
|
48
|
+
--button-border-hover: var(--button-${r}-border-hover);
|
|
49
|
+
--button-border-width-disabled: var(--button-${r}-border-width-disabled);
|
|
50
|
+
--button-border-width: var(--button-${r}-border-width-default, 1px);
|
|
51
|
+
--button-border: var(--button-${r}-border-default);
|
|
52
|
+
--button-text-disabled: var(--button-${r}-text-disabled);
|
|
53
|
+
--button-text-hover: var(--button-${r}-text-hover);
|
|
54
|
+
--button-text: var(--button-${r}-text-default);
|
|
55
|
+
`;return dt(t)},Dt=["primary","secondary","tertiary"];let p=class extends Bt{constructor(){super(...arguments),this.type="submit",this.value="",this.variant="primary",this.disabled=!1,this.href="",this.target=""}get name(){return this.getAttribute("name")??""}set name(r){this.setAttribute("name",r)}get form(){return this[Q].form}willUpdate(){const r=getComputedStyle(this).getPropertyValue("--button-variant");r&&Dt.some(t=>t===r)&&(this.variant=r)}render(){const r=this.href?this.renderLink():this.renderButton();return B`${r}`}renderLink(){return B`<a
|
|
56
|
+
href=${this.href}
|
|
57
|
+
target=${this.target||d}
|
|
58
|
+
class="button"
|
|
59
|
+
?disabled=${this.disabled}
|
|
60
|
+
>
|
|
61
|
+
<slot />
|
|
62
|
+
</a>`}renderButton(){return B`<button class="button" ?disabled=${this.disabled}>
|
|
63
|
+
<slot />
|
|
64
|
+
</button>`}};It(p);p.formAssociated=!0;p.styles=K`
|
|
65
|
+
:host {
|
|
66
|
+
display: inline-flex;
|
|
67
|
+
cursor: pointer;
|
|
68
|
+
${q("primary")}
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
:host([variant="secondary"]) {
|
|
72
|
+
${q("secondary")}
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
:host([variant="tertiary"]) {
|
|
76
|
+
${q("tertiary")}
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
:host([disabled]) {
|
|
80
|
+
--button-bg: var(--button-bg-disabled);
|
|
81
|
+
--button-text: var(--button-text-disabled);
|
|
82
|
+
--button-border: var(--button-border-disabled);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.button {
|
|
86
|
+
-webkit-appearance: none;
|
|
87
|
+
align-items: center;
|
|
88
|
+
background-color: var(--button-bg);
|
|
89
|
+
border-color: var(--button-border);
|
|
90
|
+
border-radius: var(--button-radius);
|
|
91
|
+
border-width: var(--button-border-width);
|
|
92
|
+
border-style: solid;
|
|
93
|
+
box-sizing: border-box;
|
|
94
|
+
color: var(--button-text);
|
|
95
|
+
cursor: inherit;
|
|
96
|
+
display: inline-flex;
|
|
97
|
+
font-family: var(--font-family-sans);
|
|
98
|
+
font-size: var(--font-size-ui);
|
|
99
|
+
font-weight: var(--font-weight-ui);
|
|
100
|
+
gap: inherit;
|
|
101
|
+
height: 100%;
|
|
102
|
+
justify-content: center;
|
|
103
|
+
line-height: var(--font-line-height-ui);
|
|
104
|
+
min-width: 64px;
|
|
105
|
+
outline: none;
|
|
106
|
+
padding: 0;
|
|
107
|
+
padding: var(--button-padding-block) var(--button-padding-inline);
|
|
108
|
+
text-decoration: none;
|
|
109
|
+
vertical-align: middle;
|
|
110
|
+
width: 100%;
|
|
111
|
+
|
|
112
|
+
&::-moz-focus-inner {
|
|
113
|
+
padding: 0;
|
|
114
|
+
border: 0;
|
|
115
|
+
}
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
.button:disabled {
|
|
119
|
+
cursor: initial;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.button:hover:not([disabled]) {
|
|
123
|
+
background-color: var(--button-bg-hover);
|
|
124
|
+
color: var(--button-text-hover);
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.button:focus-visible {
|
|
128
|
+
${kt}
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
.button:active:not([disabled]) {
|
|
132
|
+
filter: brightness(95%);
|
|
133
|
+
}
|
|
134
|
+
`;y([w()],p.prototype,"type",2);y([w({reflect:!0})],p.prototype,"value",2);y([w({reflect:!0})],p.prototype,"variant",2);y([w({converter:{fromAttribute:r=>r===""||r==="true"}})],p.prototype,"disabled",2);y([w()],p.prototype,"href",2);y([w()],p.prototype,"target",2);p=y([Mt("o-button")],p);
|