@signalwire/web-components 1.0.0-dev-20260504184154 → 1.0.0-dev-20260508182243
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/components/UI/controls/sw-ui-dialpad.d.ts +1 -1
- package/dist/components/UI/controls/sw-ui-dialpad.d.ts.map +1 -1
- package/dist/components/UI/controls/sw-ui-dialpad.js +9 -8
- package/dist/components/UI/controls/sw-ui-dialpad.js.map +1 -1
- package/dist/components/UI/controls/sw-ui-dropup.d.ts +1 -1
- package/dist/components/UI/controls/sw-ui-dropup.d.ts.map +1 -1
- package/dist/components/UI/controls/sw-ui-dropup.js +9 -8
- package/dist/components/UI/controls/sw-ui-dropup.js.map +1 -1
- package/dist/components/UI/controls/sw-ui-split-button.d.ts +1 -1
- package/dist/components/UI/controls/sw-ui-split-button.d.ts.map +1 -1
- package/dist/components/UI/controls/sw-ui-split-button.js +13 -12
- package/dist/components/UI/controls/sw-ui-split-button.js.map +1 -1
- package/dist/components/UI/host-reset.d.ts +16 -0
- package/dist/components/UI/host-reset.d.ts.map +1 -0
- package/dist/components/UI/host-reset.js +20 -0
- package/dist/components/UI/host-reset.js.map +1 -0
- package/dist/components/UI/sw-ui-alert.d.ts +1 -1
- package/dist/components/UI/sw-ui-alert.d.ts.map +1 -1
- package/dist/components/UI/sw-ui-alert.js +14 -13
- package/dist/components/UI/sw-ui-alert.js.map +1 -1
- package/dist/components/UI/sw-ui-transcript-view.d.ts +1 -1
- package/dist/components/UI/sw-ui-transcript-view.d.ts.map +1 -1
- package/dist/components/UI/sw-ui-transcript-view.js +6 -5
- package/dist/components/UI/sw-ui-transcript-view.js.map +1 -1
- package/dist/components/sw-call-status.d.ts +1 -1
- package/dist/components/sw-call-status.d.ts.map +1 -1
- package/dist/components/sw-call-status.js +6 -5
- package/dist/components/sw-call-status.js.map +1 -1
- package/dist/components/sw-call-widget/sw-call-widget.d.ts +1 -1
- package/dist/components/sw-call-widget/sw-call-widget.d.ts.map +1 -1
- package/dist/components/sw-call-widget/sw-call-widget.js +14 -13
- package/dist/components/sw-call-widget/sw-call-widget.js.map +1 -1
- package/dist/components/sw-click-to-call.d.ts +1 -1
- package/dist/components/sw-click-to-call.d.ts.map +1 -1
- package/dist/components/sw-click-to-call.js +9 -8
- package/dist/components/sw-click-to-call.js.map +1 -1
- package/dist/components/sw-device-selector/sw-device-selector.d.ts +1 -1
- package/dist/components/sw-device-selector/sw-device-selector.d.ts.map +1 -1
- package/dist/components/sw-device-selector/sw-device-selector.js +5 -4
- package/dist/components/sw-device-selector/sw-device-selector.js.map +1 -1
- package/dist/components/sw-directory.d.ts +1 -1
- package/dist/components/sw-directory.d.ts.map +1 -1
- package/dist/components/sw-directory.js +6 -5
- package/dist/components/sw-directory.js.map +1 -1
- package/dist/components/sw-participant-controls.d.ts +1 -1
- package/dist/components/sw-participant-controls.d.ts.map +1 -1
- package/dist/components/sw-participant-controls.js +6 -5
- package/dist/components/sw-participant-controls.js.map +1 -1
- package/dist/components/sw-participants.d.ts +1 -1
- package/dist/components/sw-participants.d.ts.map +1 -1
- package/dist/components/sw-participants.js +20 -19
- package/dist/components/sw-participants.js.map +1 -1
- package/dist/embed/signalwire-web-components-embed.iife.js +109 -95
- package/dist/embed/signalwire-web-components-embed.iife.js.map +1 -1
- package/dist/embed/signalwire-web-components-embed.umd.cjs +109 -95
- package/dist/embed/signalwire-web-components-embed.umd.cjs.map +1 -1
- package/package.json +2 -2
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
import { LitElement } from 'lit';
|
|
33
33
|
import '../icons/sw-ui-icon.js';
|
|
34
34
|
export declare class SwUiDialpad extends LitElement {
|
|
35
|
-
static styles: import("lit").CSSResult;
|
|
35
|
+
static styles: import("lit").CSSResult[];
|
|
36
36
|
/** Whether to display the call button below the keypad. */
|
|
37
37
|
showCallButton: boolean;
|
|
38
38
|
/** Allow free-text input in the display field (e.g., SIP URIs, vanity letters). Keypad buttons still append DTMF digits. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sw-ui-dialpad.d.ts","sourceRoot":"","sources":["../../../../src/components/UI/controls/sw-ui-dialpad.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AAEH,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"sw-ui-dialpad.d.ts","sourceRoot":"","sources":["../../../../src/components/UI/controls/sw-ui-dialpad.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AAEH,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,wBAAwB,CAAC;AAwBhC,qBACa,WAAY,SAAQ,UAAU;IACzC,MAAM,CAAC,MAAM,4BAoKV;IAEH,2DAA2D;IAE3D,cAAc,EAAE,OAAO,CAAS;IAEhC,4HAA4H;IAE5H,SAAS,EAAE,OAAO,CAAS;IAE3B,yDAAyD;IAEzD,WAAW,EAAE,MAAM,CAAkB;IAE5B,OAAO,CAAC,MAAM,CAAc;IAC5B,OAAO,CAAC,UAAU,CAAuB;IAElD,OAAO,CAAC,eAAe,CAA8C;IACrE,OAAO,CAAC,eAAe,CAAS;IAEhC,OAAO,CAAC,eAAe;IAUvB,OAAO,CAAC,gBAAgB;IAOf,oBAAoB;IAK7B,OAAO,CAAC,SAAS;IAYjB,OAAO,CAAC,WAAW;IAiBnB,OAAO,CAAC,UAAU;IAYlB,OAAO,CAAC,KAAK;IAWb;;;;OAIG;IACH,OAAO,CAAC,UAAU;IA0BlB,OAAO,CAAC,QAAQ;IAahB,MAAM;CAyEP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { LitElement as u, html as d, css as g } from "lit";
|
|
2
2
|
import { property as c, state as p, customElement as h } from "lit/decorators.js";
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
import { hostReset as b } from "../host-reset.js";
|
|
4
|
+
var f = Object.defineProperty, v = Object.getOwnPropertyDescriptor, r = (t, e, l, a) => {
|
|
5
|
+
for (var i = a > 1 ? void 0 : a ? v(e, l) : e, n = t.length - 1, o; n >= 0; n--)
|
|
5
6
|
(o = t[n]) && (i = (a ? o(e, l, i) : o(i)) || i);
|
|
6
|
-
return a && i &&
|
|
7
|
+
return a && i && f(e, l, i), i;
|
|
7
8
|
};
|
|
8
|
-
const
|
|
9
|
+
const m = /^[0-9*#]$/, y = 500, w = [
|
|
9
10
|
{ digit: "1", letters: "" },
|
|
10
11
|
{ digit: "2", letters: "ABC" },
|
|
11
12
|
{ digit: "3", letters: "DEF" },
|
|
@@ -83,7 +84,7 @@ let s = class extends u {
|
|
|
83
84
|
e === "Enter" && this.showCallButton && (t.preventDefault(), this._dial());
|
|
84
85
|
return;
|
|
85
86
|
}
|
|
86
|
-
|
|
87
|
+
m.test(e) ? (t.preventDefault(), this._pressDigit(e)) : e === "Backspace" ? (t.preventDefault(), this._backspace()) : e === "Enter" && this.showCallButton ? (t.preventDefault(), this._dial()) : e !== "Tab" && !t.ctrlKey && !t.metaKey && t.preventDefault();
|
|
87
88
|
}
|
|
88
89
|
_onInput(t) {
|
|
89
90
|
if (!this.allowText) return;
|
|
@@ -130,7 +131,7 @@ let s = class extends u {
|
|
|
130
131
|
</div>
|
|
131
132
|
|
|
132
133
|
<div class="keypad" part="keypad" role="group" aria-label="Telephone keypad">
|
|
133
|
-
${
|
|
134
|
+
${w.map(
|
|
134
135
|
(t) => d`
|
|
135
136
|
<button
|
|
136
137
|
class="key ${this.pressedKey === t.digit ? "pressed" : ""}"
|
|
@@ -170,7 +171,7 @@ let s = class extends u {
|
|
|
170
171
|
`;
|
|
171
172
|
}
|
|
172
173
|
};
|
|
173
|
-
s.styles = g`
|
|
174
|
+
s.styles = [b, g`
|
|
174
175
|
:host {
|
|
175
176
|
--sw-dialpad-display-size: 32px;
|
|
176
177
|
--sw-dialpad-key-size: 24px;
|
|
@@ -334,7 +335,7 @@ s.styles = g`
|
|
|
334
335
|
.call-button sw-ui-icon {
|
|
335
336
|
pointer-events: none;
|
|
336
337
|
}
|
|
337
|
-
|
|
338
|
+
`];
|
|
338
339
|
r([
|
|
339
340
|
c({ type: Boolean, reflect: !0, attribute: "show-call-button" })
|
|
340
341
|
], s.prototype, "showCallButton", 2);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sw-ui-dialpad.js","sources":["../../../../src/components/UI/controls/sw-ui-dialpad.ts"],"sourcesContent":["/**\n * Dialpad Component\n *\n * A 12-key telephone keypad (0-9, *, #) for entering phone numbers\n * and sending DTMF tones during active calls. Pure UI component — no\n * call logic. Use `sw-call-dialpad` for a version that integrates with\n * a call context.\n *\n * @example\n * ```html\n * <sw-dialpad show-call-button></sw-dialpad>\n * ```\n *\n * Long-press behavior:\n * - Long-press the `0` key → inserts `+` (international prefix).\n * - Long-press the backspace button → clears the entire buffer.\n *\n * @fires sw-digit-press - Fired when a digit button is pressed. Detail: `{ digit: string, digits: string }`\n * @fires sw-dialpad-backspace - Fired when the backspace button is pressed (or long-pressed to clear). Detail: `{ digits: string }`\n * @fires sw-dial - Fired when the call button is pressed. Detail: `{ digits: string }`\n * @fires sw-dialpad-input - Fired when free-text input changes (only when `allow-text` is set). Detail: `{ digits: string }`\n *\n * @cssprop [--interactive-button-primary-bg=#044ef4] - Primary accent color.\n * @cssprop [--interactive-button-primary-hover=#0342cf] - Primary color on hover.\n * @cssprop [--interactive-status-success=#22c55e] - Success/call button color.\n * @cssprop [--interactive-button-destructive-bg=#dc2626] - Danger/hangup button color.\n * @cssprop [--bg-surface=#181a28] - Component background.\n * @cssprop [--fg-default=#f0f0f4] - Text color.\n * @cssprop [--fg-muted=#a0a0aa] - Muted text color.\n * @cssprop [--border-default=rgba(255,255,255,0.12)] - Border color.\n */\n\nimport { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport '../icons/sw-ui-icon.js';\n\nconst DTMF_PATTERN = /^[0-9*#]$/;\nconst LONG_PRESS_MS = 500;\n\n/**\n * Key layout for standard telephone keypad\n */\nconst KEYS = [\n { digit: '1', letters: '' },\n { digit: '2', letters: 'ABC' },\n { digit: '3', letters: 'DEF' },\n { digit: '4', letters: 'GHI' },\n { digit: '5', letters: 'JKL' },\n { digit: '6', letters: 'MNO' },\n { digit: '7', letters: 'PQRS' },\n { digit: '8', letters: 'TUV' },\n { digit: '9', letters: 'WXYZ' },\n { digit: '*', letters: '' },\n { digit: '0', letters: '+' },\n { digit: '#', letters: '' }\n] as const;\n\n@customElement('sw-ui-dialpad')\nexport class SwUiDialpad extends LitElement {\n static styles = css`\n :host {\n --sw-dialpad-display-size: 32px;\n --sw-dialpad-key-size: 24px;\n display: block;\n font-family: var(--type-family-body);\n }\n\n .container {\n display: flex;\n flex-direction: column;\n gap: var(--sp-3);\n padding: var(--sp-4);\n max-width: 280px;\n background: var(--bg-surface);\n border-radius: var(--radius-md);\n }\n\n .display {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: var(--sp-3) var(--sp-4);\n background: var(--bg-surface-raised);\n border-radius: var(--radius-md);\n min-height: 48px;\n }\n\n .display-input {\n flex: 1;\n font-size: var(--sw-dialpad-display-size);\n font-weight: 500;\n font-family: var(--type-family-body);\n color: var(--fg-default);\n background: transparent;\n border: none;\n outline: none;\n letter-spacing: 2px;\n text-align: center;\n width: 100%;\n }\n\n .display-input::placeholder {\n color: var(--fg-muted);\n font-size: var(--type-size-body);\n letter-spacing: normal;\n }\n\n .backspace-button {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n background: transparent;\n border: none;\n border-radius: var(--radius-md);\n cursor: pointer;\n color: var(--fg-muted);\n transition:\n background-color 0.15s ease,\n color 0.15s ease;\n }\n\n .backspace-button:hover {\n background: var(--interactive-dropdown-hover);\n color: var(--fg-default);\n }\n\n .backspace-button:disabled {\n opacity: 0.3;\n cursor: not-allowed;\n }\n\n .backspace-button sw-ui-icon {\n pointer-events: none;\n }\n\n .keypad {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 72px));\n justify-content: center;\n gap: var(--sp-2);\n }\n\n .key {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-width: 0;\n aspect-ratio: 1;\n background: var(--bg-surface);\n border: 1px solid var(--border-default);\n border-radius: var(--radius-full);\n cursor: pointer;\n transition:\n background-color 0.1s ease,\n transform 0.1s ease;\n user-select: none;\n -webkit-user-select: none;\n -webkit-tap-highlight-color: transparent;\n }\n\n .key:hover {\n background: var(--bg-surface-raised);\n }\n\n .key:active,\n .key.pressed {\n background: var(--interactive-dropdown-hover);\n transform: scale(0.95);\n }\n\n .key-digit {\n font-size: var(--sw-dialpad-key-size);\n font-weight: 500;\n color: var(--fg-default);\n line-height: 1;\n }\n\n .key-letters {\n font-size: var(--type-size-caption);\n color: var(--fg-muted);\n text-transform: uppercase;\n letter-spacing: 1px;\n margin-top: 2px;\n min-height: 14px;\n }\n\n .call-button {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 56px;\n background: var(--interactive-status-success);\n border: none;\n border-radius: var(--radius-md);\n cursor: pointer;\n color: white;\n font-size: var(--type-size-body);\n font-weight: 600;\n font-family: var(--type-family-body);\n transition: background-color 0.15s ease;\n gap: var(--sp-2);\n }\n\n .call-button:hover {\n background: #0ea472;\n }\n\n .call-button:active {\n background: #0d9668;\n }\n\n .call-button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .call-button sw-ui-icon {\n pointer-events: none;\n }\n `;\n\n /** Whether to display the call button below the keypad. */\n @property({ type: Boolean, reflect: true, attribute: 'show-call-button' })\n showCallButton: boolean = false;\n\n /** Allow free-text input in the display field (e.g., SIP URIs, vanity letters). Keypad buttons still append DTMF digits. */\n @property({ type: Boolean, reflect: true, attribute: 'allow-text' })\n allowText: boolean = false;\n\n /** Placeholder text shown in the digit display input. */\n @property({ type: String })\n placeholder: string = 'Enter number';\n\n @state() private digits: string = '';\n @state() private pressedKey: string | null = null;\n\n private _longPressTimer: ReturnType<typeof setTimeout> | null = null;\n private _longPressFired = false;\n\n private _startLongPress(action: () => void) {\n this._cancelLongPress();\n this._longPressFired = false;\n this._longPressTimer = setTimeout(() => {\n this._longPressFired = true;\n this._longPressTimer = null;\n action();\n }, LONG_PRESS_MS);\n }\n\n private _cancelLongPress() {\n if (this._longPressTimer !== null) {\n clearTimeout(this._longPressTimer);\n this._longPressTimer = null;\n }\n }\n\n override disconnectedCallback() {\n this._cancelLongPress();\n super.disconnectedCallback();\n }\n\n private _clearAll() {\n if (this.digits.length === 0) return;\n this.digits = '';\n this.dispatchEvent(\n new CustomEvent('sw-dialpad-backspace', {\n detail: { digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n }\n\n private _pressDigit(digit: string) {\n this.digits += digit;\n this.pressedKey = digit;\n\n this.dispatchEvent(\n new CustomEvent('sw-digit-press', {\n detail: { digit, digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n\n setTimeout(() => {\n this.pressedKey = null;\n }, 100);\n }\n\n private _backspace() {\n if (this.digits.length === 0) return;\n this.digits = this.digits.slice(0, -1);\n this.dispatchEvent(\n new CustomEvent('sw-dialpad-backspace', {\n detail: { digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n }\n\n private _dial() {\n if (this.digits.length === 0) return;\n this.dispatchEvent(\n new CustomEvent('sw-dial', {\n detail: { digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n }\n\n /**\n * Handle keyboard input on the display field.\n * We intercept all keys and manage state ourselves to prevent the browser\n * from accumulating non-DTMF characters in the input value.\n */\n private _onKeyDown(e: KeyboardEvent) {\n const { key } = e;\n\n if (this.allowText) {\n if (key === 'Enter' && this.showCallButton) {\n e.preventDefault();\n this._dial();\n }\n return;\n }\n\n if (DTMF_PATTERN.test(key)) {\n e.preventDefault();\n this._pressDigit(key);\n } else if (key === 'Backspace') {\n e.preventDefault();\n this._backspace();\n } else if (key === 'Enter' && this.showCallButton) {\n e.preventDefault();\n this._dial();\n } else if (key !== 'Tab' && !e.ctrlKey && !e.metaKey) {\n // Block all other printable characters\n e.preventDefault();\n }\n }\n\n private _onInput(e: Event) {\n if (!this.allowText) return;\n const value = (e.target as HTMLInputElement).value;\n this.digits = value;\n this.dispatchEvent(\n new CustomEvent('sw-dialpad-input', {\n detail: { digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n }\n\n render() {\n return html`\n <div class=\"container\" part=\"container\">\n <div class=\"display\" part=\"display\">\n <input\n type=${this.allowText ? 'text' : 'tel'}\n class=\"display-input\"\n .value=${this.digits}\n placeholder=${this.placeholder}\n @keydown=${this._onKeyDown}\n @input=${this._onInput}\n aria-label=\"Phone number input\"\n />\n <button\n class=\"backspace-button\"\n @click=${() => {\n if (this._longPressFired) { this._longPressFired = false; return; }\n this._backspace();\n }}\n @pointerdown=${() => this._startLongPress(() => this._clearAll())}\n @pointerup=${() => this._cancelLongPress()}\n @pointerleave=${() => this._cancelLongPress()}\n @pointercancel=${() => this._cancelLongPress()}\n ?disabled=${this.digits.length === 0}\n aria-label=\"Delete last digit (long-press to clear)\"\n >\n <sw-ui-icon name=\"backspace\" size=\"24\"></sw-ui-icon>\n </button>\n </div>\n\n <div class=\"keypad\" part=\"keypad\" role=\"group\" aria-label=\"Telephone keypad\">\n ${KEYS.map(\n (key) => html`\n <button\n class=\"key ${this.pressedKey === key.digit ? 'pressed' : ''}\"\n part=\"key ${this.pressedKey === key.digit ? 'key-pressed' : ''}\"\n @click=${() => {\n if (this._longPressFired) { this._longPressFired = false; return; }\n this._pressDigit(key.digit);\n }}\n @pointerdown=${key.digit === '0'\n ? () => this._startLongPress(() => this._pressDigit('+'))\n : undefined}\n @pointerup=${key.digit === '0' ? () => this._cancelLongPress() : undefined}\n @pointerleave=${key.digit === '0' ? () => this._cancelLongPress() : undefined}\n @pointercancel=${key.digit === '0' ? () => this._cancelLongPress() : undefined}\n aria-label=\"${key.digit}${key.letters ? `, ${key.letters}` : ''}${\n key.digit === '0' ? ' (long-press for +)' : ''\n }\"\n >\n <span class=\"key-digit\">${key.digit}</span>\n <span class=\"key-letters\">${key.letters}</span>\n </button>\n `\n )}\n </div>\n\n ${this.showCallButton\n ? html`\n <button\n class=\"call-button\"\n part=\"call-button\"\n @click=${this._dial}\n ?disabled=${this.digits.length === 0}\n aria-label=\"Call ${this.digits}\"\n >\n <sw-ui-icon name=\"phone-call\" size=\"20\"></sw-ui-icon> Call\n </button>\n `\n : null}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sw-ui-dialpad': SwUiDialpad;\n }\n}\n"],"names":["DTMF_PATTERN","LONG_PRESS_MS","KEYS","SwUiDialpad","LitElement","action","digit","e","key","value","html","css","__decorateClass","property","state","customElement"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"sw-ui-dialpad.js","sources":["../../../../src/components/UI/controls/sw-ui-dialpad.ts"],"sourcesContent":["/**\n * Dialpad Component\n *\n * A 12-key telephone keypad (0-9, *, #) for entering phone numbers\n * and sending DTMF tones during active calls. Pure UI component — no\n * call logic. Use `sw-call-dialpad` for a version that integrates with\n * a call context.\n *\n * @example\n * ```html\n * <sw-dialpad show-call-button></sw-dialpad>\n * ```\n *\n * Long-press behavior:\n * - Long-press the `0` key → inserts `+` (international prefix).\n * - Long-press the backspace button → clears the entire buffer.\n *\n * @fires sw-digit-press - Fired when a digit button is pressed. Detail: `{ digit: string, digits: string }`\n * @fires sw-dialpad-backspace - Fired when the backspace button is pressed (or long-pressed to clear). Detail: `{ digits: string }`\n * @fires sw-dial - Fired when the call button is pressed. Detail: `{ digits: string }`\n * @fires sw-dialpad-input - Fired when free-text input changes (only when `allow-text` is set). Detail: `{ digits: string }`\n *\n * @cssprop [--interactive-button-primary-bg=#044ef4] - Primary accent color.\n * @cssprop [--interactive-button-primary-hover=#0342cf] - Primary color on hover.\n * @cssprop [--interactive-status-success=#22c55e] - Success/call button color.\n * @cssprop [--interactive-button-destructive-bg=#dc2626] - Danger/hangup button color.\n * @cssprop [--bg-surface=#181a28] - Component background.\n * @cssprop [--fg-default=#f0f0f4] - Text color.\n * @cssprop [--fg-muted=#a0a0aa] - Muted text color.\n * @cssprop [--border-default=rgba(255,255,255,0.12)] - Border color.\n */\n\nimport { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport '../icons/sw-ui-icon.js';\nimport { hostReset } from '../host-reset.js';\n\nconst DTMF_PATTERN = /^[0-9*#]$/;\nconst LONG_PRESS_MS = 500;\n\n/**\n * Key layout for standard telephone keypad\n */\nconst KEYS = [\n { digit: '1', letters: '' },\n { digit: '2', letters: 'ABC' },\n { digit: '3', letters: 'DEF' },\n { digit: '4', letters: 'GHI' },\n { digit: '5', letters: 'JKL' },\n { digit: '6', letters: 'MNO' },\n { digit: '7', letters: 'PQRS' },\n { digit: '8', letters: 'TUV' },\n { digit: '9', letters: 'WXYZ' },\n { digit: '*', letters: '' },\n { digit: '0', letters: '+' },\n { digit: '#', letters: '' }\n] as const;\n\n@customElement('sw-ui-dialpad')\nexport class SwUiDialpad extends LitElement {\n static styles = [hostReset, css`\n :host {\n --sw-dialpad-display-size: 32px;\n --sw-dialpad-key-size: 24px;\n display: block;\n font-family: var(--type-family-body);\n }\n\n .container {\n display: flex;\n flex-direction: column;\n gap: var(--sp-3);\n padding: var(--sp-4);\n max-width: 280px;\n background: var(--bg-surface);\n border-radius: var(--radius-md);\n }\n\n .display {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: var(--sp-3) var(--sp-4);\n background: var(--bg-surface-raised);\n border-radius: var(--radius-md);\n min-height: 48px;\n }\n\n .display-input {\n flex: 1;\n font-size: var(--sw-dialpad-display-size);\n font-weight: 500;\n font-family: var(--type-family-body);\n color: var(--fg-default);\n background: transparent;\n border: none;\n outline: none;\n letter-spacing: 2px;\n text-align: center;\n width: 100%;\n }\n\n .display-input::placeholder {\n color: var(--fg-muted);\n font-size: var(--type-size-body);\n letter-spacing: normal;\n }\n\n .backspace-button {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n background: transparent;\n border: none;\n border-radius: var(--radius-md);\n cursor: pointer;\n color: var(--fg-muted);\n transition:\n background-color 0.15s ease,\n color 0.15s ease;\n }\n\n .backspace-button:hover {\n background: var(--interactive-dropdown-hover);\n color: var(--fg-default);\n }\n\n .backspace-button:disabled {\n opacity: 0.3;\n cursor: not-allowed;\n }\n\n .backspace-button sw-ui-icon {\n pointer-events: none;\n }\n\n .keypad {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 72px));\n justify-content: center;\n gap: var(--sp-2);\n }\n\n .key {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-width: 0;\n aspect-ratio: 1;\n background: var(--bg-surface);\n border: 1px solid var(--border-default);\n border-radius: var(--radius-full);\n cursor: pointer;\n transition:\n background-color 0.1s ease,\n transform 0.1s ease;\n user-select: none;\n -webkit-user-select: none;\n -webkit-tap-highlight-color: transparent;\n }\n\n .key:hover {\n background: var(--bg-surface-raised);\n }\n\n .key:active,\n .key.pressed {\n background: var(--interactive-dropdown-hover);\n transform: scale(0.95);\n }\n\n .key-digit {\n font-size: var(--sw-dialpad-key-size);\n font-weight: 500;\n color: var(--fg-default);\n line-height: 1;\n }\n\n .key-letters {\n font-size: var(--type-size-caption);\n color: var(--fg-muted);\n text-transform: uppercase;\n letter-spacing: 1px;\n margin-top: 2px;\n min-height: 14px;\n }\n\n .call-button {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 56px;\n background: var(--interactive-status-success);\n border: none;\n border-radius: var(--radius-md);\n cursor: pointer;\n color: white;\n font-size: var(--type-size-body);\n font-weight: 600;\n font-family: var(--type-family-body);\n transition: background-color 0.15s ease;\n gap: var(--sp-2);\n }\n\n .call-button:hover {\n background: #0ea472;\n }\n\n .call-button:active {\n background: #0d9668;\n }\n\n .call-button:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .call-button sw-ui-icon {\n pointer-events: none;\n }\n `];\n\n /** Whether to display the call button below the keypad. */\n @property({ type: Boolean, reflect: true, attribute: 'show-call-button' })\n showCallButton: boolean = false;\n\n /** Allow free-text input in the display field (e.g., SIP URIs, vanity letters). Keypad buttons still append DTMF digits. */\n @property({ type: Boolean, reflect: true, attribute: 'allow-text' })\n allowText: boolean = false;\n\n /** Placeholder text shown in the digit display input. */\n @property({ type: String })\n placeholder: string = 'Enter number';\n\n @state() private digits: string = '';\n @state() private pressedKey: string | null = null;\n\n private _longPressTimer: ReturnType<typeof setTimeout> | null = null;\n private _longPressFired = false;\n\n private _startLongPress(action: () => void) {\n this._cancelLongPress();\n this._longPressFired = false;\n this._longPressTimer = setTimeout(() => {\n this._longPressFired = true;\n this._longPressTimer = null;\n action();\n }, LONG_PRESS_MS);\n }\n\n private _cancelLongPress() {\n if (this._longPressTimer !== null) {\n clearTimeout(this._longPressTimer);\n this._longPressTimer = null;\n }\n }\n\n override disconnectedCallback() {\n this._cancelLongPress();\n super.disconnectedCallback();\n }\n\n private _clearAll() {\n if (this.digits.length === 0) return;\n this.digits = '';\n this.dispatchEvent(\n new CustomEvent('sw-dialpad-backspace', {\n detail: { digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n }\n\n private _pressDigit(digit: string) {\n this.digits += digit;\n this.pressedKey = digit;\n\n this.dispatchEvent(\n new CustomEvent('sw-digit-press', {\n detail: { digit, digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n\n setTimeout(() => {\n this.pressedKey = null;\n }, 100);\n }\n\n private _backspace() {\n if (this.digits.length === 0) return;\n this.digits = this.digits.slice(0, -1);\n this.dispatchEvent(\n new CustomEvent('sw-dialpad-backspace', {\n detail: { digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n }\n\n private _dial() {\n if (this.digits.length === 0) return;\n this.dispatchEvent(\n new CustomEvent('sw-dial', {\n detail: { digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n }\n\n /**\n * Handle keyboard input on the display field.\n * We intercept all keys and manage state ourselves to prevent the browser\n * from accumulating non-DTMF characters in the input value.\n */\n private _onKeyDown(e: KeyboardEvent) {\n const { key } = e;\n\n if (this.allowText) {\n if (key === 'Enter' && this.showCallButton) {\n e.preventDefault();\n this._dial();\n }\n return;\n }\n\n if (DTMF_PATTERN.test(key)) {\n e.preventDefault();\n this._pressDigit(key);\n } else if (key === 'Backspace') {\n e.preventDefault();\n this._backspace();\n } else if (key === 'Enter' && this.showCallButton) {\n e.preventDefault();\n this._dial();\n } else if (key !== 'Tab' && !e.ctrlKey && !e.metaKey) {\n // Block all other printable characters\n e.preventDefault();\n }\n }\n\n private _onInput(e: Event) {\n if (!this.allowText) return;\n const value = (e.target as HTMLInputElement).value;\n this.digits = value;\n this.dispatchEvent(\n new CustomEvent('sw-dialpad-input', {\n detail: { digits: this.digits },\n bubbles: true,\n composed: true\n })\n );\n }\n\n render() {\n return html`\n <div class=\"container\" part=\"container\">\n <div class=\"display\" part=\"display\">\n <input\n type=${this.allowText ? 'text' : 'tel'}\n class=\"display-input\"\n .value=${this.digits}\n placeholder=${this.placeholder}\n @keydown=${this._onKeyDown}\n @input=${this._onInput}\n aria-label=\"Phone number input\"\n />\n <button\n class=\"backspace-button\"\n @click=${() => {\n if (this._longPressFired) { this._longPressFired = false; return; }\n this._backspace();\n }}\n @pointerdown=${() => this._startLongPress(() => this._clearAll())}\n @pointerup=${() => this._cancelLongPress()}\n @pointerleave=${() => this._cancelLongPress()}\n @pointercancel=${() => this._cancelLongPress()}\n ?disabled=${this.digits.length === 0}\n aria-label=\"Delete last digit (long-press to clear)\"\n >\n <sw-ui-icon name=\"backspace\" size=\"24\"></sw-ui-icon>\n </button>\n </div>\n\n <div class=\"keypad\" part=\"keypad\" role=\"group\" aria-label=\"Telephone keypad\">\n ${KEYS.map(\n (key) => html`\n <button\n class=\"key ${this.pressedKey === key.digit ? 'pressed' : ''}\"\n part=\"key ${this.pressedKey === key.digit ? 'key-pressed' : ''}\"\n @click=${() => {\n if (this._longPressFired) { this._longPressFired = false; return; }\n this._pressDigit(key.digit);\n }}\n @pointerdown=${key.digit === '0'\n ? () => this._startLongPress(() => this._pressDigit('+'))\n : undefined}\n @pointerup=${key.digit === '0' ? () => this._cancelLongPress() : undefined}\n @pointerleave=${key.digit === '0' ? () => this._cancelLongPress() : undefined}\n @pointercancel=${key.digit === '0' ? () => this._cancelLongPress() : undefined}\n aria-label=\"${key.digit}${key.letters ? `, ${key.letters}` : ''}${\n key.digit === '0' ? ' (long-press for +)' : ''\n }\"\n >\n <span class=\"key-digit\">${key.digit}</span>\n <span class=\"key-letters\">${key.letters}</span>\n </button>\n `\n )}\n </div>\n\n ${this.showCallButton\n ? html`\n <button\n class=\"call-button\"\n part=\"call-button\"\n @click=${this._dial}\n ?disabled=${this.digits.length === 0}\n aria-label=\"Call ${this.digits}\"\n >\n <sw-ui-icon name=\"phone-call\" size=\"20\"></sw-ui-icon> Call\n </button>\n `\n : null}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sw-ui-dialpad': SwUiDialpad;\n }\n}\n"],"names":["DTMF_PATTERN","LONG_PRESS_MS","KEYS","SwUiDialpad","LitElement","action","digit","e","key","value","html","hostReset","css","__decorateClass","property","state","customElement"],"mappings":"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"}
|
|
@@ -21,7 +21,7 @@ export type DropUpItem = {
|
|
|
21
21
|
* @cssprop --sw-dropup-item-active [rgba(255,255,255,0.15)] - selected item background
|
|
22
22
|
*/
|
|
23
23
|
export declare class SwUiDropup extends LitElement {
|
|
24
|
-
static styles: import("lit").CSSResult;
|
|
24
|
+
static styles: import("lit").CSSResult[];
|
|
25
25
|
items: Array<DropUpItem | string>;
|
|
26
26
|
open: boolean;
|
|
27
27
|
anchor?: Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sw-ui-dropup.d.ts","sourceRoot":"","sources":["../../../../src/components/UI/controls/sw-ui-dropup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"sw-ui-dropup.d.ts","sourceRoot":"","sources":["../../../../src/components/UI/controls/sw-ui-dropup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAIrD,MAAM,MAAM,UAAU,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAE3E;;;;;;;;;;;;;;;GAeG;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,MAAM,CAAC,MAAM,4BA2CV;IAmBH,KAAK,EAAE,KAAK,CAAC,UAAU,GAAG,MAAM,CAAC,CAAM;IAGvC,IAAI,UAAS;IAIb,MAAM,CAAC,EAAE,OAAO,CAAC;IAGjB,OAAO,CAAC,KAAK,CAAe;IAE5B,OAAO,CAAC,oBAAoB,CAK1B;IAEF,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAarC,OAAO,CAAC,iBAAiB;IAWzB,oBAAoB;IAKpB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,QAAQ;IAehB,MAAM;CAkBP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,UAAU,CAAC;KAC5B;CACF"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
import { LitElement as
|
|
1
|
+
import { LitElement as p, html as d, nothing as c, css as m } from "lit";
|
|
2
2
|
import { property as u, query as h, customElement as f } from "lit/decorators.js";
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
import { hostReset as b } from "../host-reset.js";
|
|
4
|
+
var v = Object.defineProperty, y = Object.getOwnPropertyDescriptor, i = (e, t, s, o) => {
|
|
5
|
+
for (var r = o > 1 ? void 0 : o ? y(t, s) : t, a = e.length - 1, l; a >= 0; a--)
|
|
5
6
|
(l = e[a]) && (r = (o ? l(t, s, r) : l(r)) || r);
|
|
6
|
-
return o && r &&
|
|
7
|
+
return o && r && v(t, s, r), r;
|
|
7
8
|
};
|
|
8
|
-
let n = class extends
|
|
9
|
+
let n = class extends p {
|
|
9
10
|
constructor() {
|
|
10
11
|
super(...arguments), this.items = [], this.open = !1, this._outsideClickHandler = (e) => {
|
|
11
12
|
const t = e.composedPath();
|
|
@@ -52,11 +53,11 @@ let n = class extends c {
|
|
|
52
53
|
`;
|
|
53
54
|
});
|
|
54
55
|
return d`
|
|
55
|
-
<div part="menu" class="menu ${this.open ? "open" : ""}">${e.length ? e :
|
|
56
|
+
<div part="menu" class="menu ${this.open ? "open" : ""}">${e.length ? e : c}</div>
|
|
56
57
|
`;
|
|
57
58
|
}
|
|
58
59
|
};
|
|
59
|
-
n.styles = m`
|
|
60
|
+
n.styles = [b, m`
|
|
60
61
|
:host {
|
|
61
62
|
display: inline-block;
|
|
62
63
|
position: relative;
|
|
@@ -99,7 +100,7 @@ n.styles = m`
|
|
|
99
100
|
button:hover {
|
|
100
101
|
background: var(--bg-surface);
|
|
101
102
|
}
|
|
102
|
-
|
|
103
|
+
`];
|
|
103
104
|
i([
|
|
104
105
|
u({
|
|
105
106
|
reflect: !0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sw-ui-dropup.js","sources":["../../../../src/components/UI/controls/sw-ui-dropup.ts"],"sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\n\nexport type DropUpItem = { label: string; id: string; selected?: boolean };\n\n/**\n * Dropdown (opens upward) menu anchored to a trigger element.\n *\n * @fires sw-dropup-select - User picked an item. `detail` is the selected `DropUpItem`.\n * @fires sw-dropup-close - Outside click closed the menu.\n *\n * @cssprop --sw-dropup-offset [4px] - gap between anchor and menu\n * @cssprop --sw-dropup-max-width [200px] - maximum menu width\n * @cssprop --sw-dropup-bg [#1f2937] - menu background\n * @cssprop --sw-dropup-border [1px solid rgba(255,255,255,0.1)] - menu border\n * @cssprop --sw-dropup-radius [8px] - menu border-radius\n * @cssprop --sw-dropup-shadow [0 4px 12px rgba(0,0,0,0.4)] - menu box-shadow\n * @cssprop --sw-dropup-color [#e5e7eb] - item text colour\n * @cssprop --sw-dropup-item-hover [rgba(255,255,255,0.08)] - item hover background\n * @cssprop --sw-dropup-item-active [rgba(255,255,255,0.15)] - selected item background\n */\n@customElement('sw-ui-dropup')\nexport class SwUiDropup extends LitElement {\n static styles = css`\n :host {\n display: inline-block;\n position: relative;\n }\n\n .menu {\n position: absolute;\n bottom: calc(100% + var(--sw-dropup-offset, 4px));\n left: 0;\n display: none;\n flex-direction: column;\n border: 1px solid var(--border-default);\n background: var(--bg-page);\n color: var(--fg-default);\n font-family: var(--type-family-body);\n font-size: var(--type-size-small);\n min-width: 120px;\n max-width: var(--sw-dropup-max-width, 200px);\n border-radius: var(--radius-md);\n box-shadow: var(--shadow-md);\n overflow: hidden;\n }\n\n .menu.open {\n display: flex;\n }\n\n button {\n all: unset;\n padding: 8px 12px;\n cursor: pointer;\n font-size: 0.8125rem;\n transition: background var(--transition-fast);\n }\n\n button.selected {\n background: var(--bg-surface-raised);\n }\n\n button:hover {\n background: var(--bg-surface);\n }\n
|
|
1
|
+
{"version":3,"file":"sw-ui-dropup.js","sources":["../../../../src/components/UI/controls/sw-ui-dropup.ts"],"sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { hostReset } from '../host-reset.js';\n\nexport type DropUpItem = { label: string; id: string; selected?: boolean };\n\n/**\n * Dropdown (opens upward) menu anchored to a trigger element.\n *\n * @fires sw-dropup-select - User picked an item. `detail` is the selected `DropUpItem`.\n * @fires sw-dropup-close - Outside click closed the menu.\n *\n * @cssprop --sw-dropup-offset [4px] - gap between anchor and menu\n * @cssprop --sw-dropup-max-width [200px] - maximum menu width\n * @cssprop --sw-dropup-bg [#1f2937] - menu background\n * @cssprop --sw-dropup-border [1px solid rgba(255,255,255,0.1)] - menu border\n * @cssprop --sw-dropup-radius [8px] - menu border-radius\n * @cssprop --sw-dropup-shadow [0 4px 12px rgba(0,0,0,0.4)] - menu box-shadow\n * @cssprop --sw-dropup-color [#e5e7eb] - item text colour\n * @cssprop --sw-dropup-item-hover [rgba(255,255,255,0.08)] - item hover background\n * @cssprop --sw-dropup-item-active [rgba(255,255,255,0.15)] - selected item background\n */\n@customElement('sw-ui-dropup')\nexport class SwUiDropup extends LitElement {\n static styles = [hostReset, css`\n :host {\n display: inline-block;\n position: relative;\n }\n\n .menu {\n position: absolute;\n bottom: calc(100% + var(--sw-dropup-offset, 4px));\n left: 0;\n display: none;\n flex-direction: column;\n border: 1px solid var(--border-default);\n background: var(--bg-page);\n color: var(--fg-default);\n font-family: var(--type-family-body);\n font-size: var(--type-size-small);\n min-width: 120px;\n max-width: var(--sw-dropup-max-width, 200px);\n border-radius: var(--radius-md);\n box-shadow: var(--shadow-md);\n overflow: hidden;\n }\n\n .menu.open {\n display: flex;\n }\n\n button {\n all: unset;\n padding: 8px 12px;\n cursor: pointer;\n font-size: 0.8125rem;\n transition: background var(--transition-fast);\n }\n\n button.selected {\n background: var(--bg-surface-raised);\n }\n\n button:hover {\n background: var(--bg-surface);\n }\n `];\n\n @property({\n reflect: true,\n converter: {\n fromAttribute(value: string | null): Array<DropUpItem | string> {\n if (!value) return [];\n try {\n const parsed: unknown = JSON.parse(value);\n return Array.isArray(parsed) ? (parsed as Array<DropUpItem | string>) : [];\n } catch {\n return [];\n }\n },\n toAttribute(value: Array<DropUpItem | string>): string {\n return JSON.stringify(value);\n }\n }\n })\n items: Array<DropUpItem | string> = [];\n\n @property({ type: Boolean, reflect: true })\n open = false;\n\n // Optional element treated as \"inside\" for outside-click AND used as the position anchor\n @property({ attribute: false })\n anchor?: Element;\n\n @query('.menu')\n private _menu!: HTMLElement;\n\n private _outsideClickHandler = (e: MouseEvent) => {\n const path = e.composedPath();\n if (!path.includes(this) && (!this.anchor || !path.includes(this.anchor))) {\n this.dispatchEvent(new CustomEvent('sw-dropup-close', { bubbles: true, composed: true }));\n }\n };\n\n updated(changed: Map<string, unknown>) {\n if (!changed.has('open')) return;\n\n if (this.open) {\n document.addEventListener('mousedown', this._outsideClickHandler);\n if (this.anchor) {\n this._positionToAnchor();\n }\n } else {\n document.removeEventListener('mousedown', this._outsideClickHandler);\n }\n }\n\n private _positionToAnchor() {\n const rect = this.anchor!.getBoundingClientRect();\n const offset = 4;\n this._menu.style.position = 'fixed';\n this._menu.style.top = `${rect.top - offset}px`;\n this._menu.style.bottom = 'auto';\n this._menu.style.left = `${rect.left + rect.width / 2}px`;\n this._menu.style.right = 'auto';\n this._menu.style.transform = 'translateX(-50%) translateY(-100%)';\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener('mousedown', this._outsideClickHandler);\n }\n\n private normalizeItem(item: DropUpItem | string): DropUpItem {\n if (typeof item === 'string') {\n return { label: item, id: item, selected: false };\n }\n return item;\n }\n\n private onSelect(item: DropUpItem) {\n const selectedItem = { ...item, selected: true };\n this.items = (this.items ?? []).map((i) => {\n const normalized = this.normalizeItem(i);\n return { ...normalized, selected: normalized.id === item.id };\n });\n this.dispatchEvent(\n new CustomEvent('sw-dropup-select', {\n detail: selectedItem,\n bubbles: true,\n composed: true\n })\n );\n }\n\n render() {\n const list = (this.items ?? []).map((i) => {\n const item = this.normalizeItem(i);\n return html`\n <button\n part=\"item\"\n @click=${() => this.onSelect(item)}\n class=${item.selected === true ? 'selected' : ''}\n >\n ${item.label}\n </button>\n `;\n });\n\n return html`\n <div part=\"menu\" class=\"menu ${this.open ? 'open' : ''}\">${list.length ? list : nothing}</div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sw-ui-dropup': SwUiDropup;\n }\n}\n"],"names":["SwUiDropup","LitElement","path","changed","rect","offset","item","selectedItem","i","normalized","list","html","nothing","hostReset","css","__decorateClass","property","value","parsed","query","customElement"],"mappings":"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"}
|
|
@@ -25,7 +25,7 @@ import type { DropUpItem } from './sw-ui-dropup';
|
|
|
25
25
|
* @cssprop --sw-split-button-radius - border-radius (falls back to --radius-full)
|
|
26
26
|
*/
|
|
27
27
|
export declare class SwUiSplitButton extends LitElement {
|
|
28
|
-
static styles: import("lit").CSSResult;
|
|
28
|
+
static styles: import("lit").CSSResult[];
|
|
29
29
|
items: Array<DropUpItem | string>;
|
|
30
30
|
active: boolean;
|
|
31
31
|
private _dropupOpen;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sw-ui-split-button.d.ts","sourceRoot":"","sources":["../../../../src/components/UI/controls/sw-ui-split-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAErD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"sw-ui-split-button.d.ts","sourceRoot":"","sources":["../../../../src/components/UI/controls/sw-ui-split-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAErD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAGjD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,MAAM,CAAC,MAAM,4BAwEV;IAkBH,KAAK,EAAE,KAAK,CAAC,UAAU,GAAG,MAAM,CAAC,CAAM;IAGvC,MAAM,EAAE,OAAO,CAAS;IAGxB,OAAO,CAAC,WAAW,CAAkB;IAGrC,OAAO,CAAC,cAAc,CAAS;IAG/B,OAAO,CAAC,WAAW,CAAqB;IAExC,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,iBAAiB;IAUzB,OAAO,CAAC,YAAY;IAepB,MAAM;CAsCP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,eAAe,CAAC;KACvC;CACF"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { LitElement as d, nothing as h, html as a, css as v } from "lit";
|
|
2
2
|
import { property as c, state as u, query as b, customElement as m } from "lit/decorators.js";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
import { hostReset as g } from "../host-reset.js";
|
|
4
|
+
var f = Object.defineProperty, w = Object.getOwnPropertyDescriptor, n = (e, t, s, i) => {
|
|
5
|
+
for (var r = i > 1 ? void 0 : i ? w(t, s) : t, l = e.length - 1, p; l >= 0; l--)
|
|
6
|
+
(p = e[l]) && (r = (i ? p(t, s, r) : p(r)) || r);
|
|
7
|
+
return i && r && f(t, s, r), r;
|
|
7
8
|
};
|
|
8
9
|
let o = class extends d {
|
|
9
10
|
constructor() {
|
|
@@ -65,7 +66,7 @@ let o = class extends d {
|
|
|
65
66
|
`;
|
|
66
67
|
}
|
|
67
68
|
};
|
|
68
|
-
o.styles = v`
|
|
69
|
+
o.styles = [g, v`
|
|
69
70
|
:host {
|
|
70
71
|
display: inline-flex;
|
|
71
72
|
align-items: center;
|
|
@@ -137,8 +138,8 @@ o.styles = v`
|
|
|
137
138
|
.solo:hover {
|
|
138
139
|
background: var(--sw-split-button-bg-hover, var(--bg-surface-raised));
|
|
139
140
|
}
|
|
140
|
-
|
|
141
|
-
|
|
141
|
+
`];
|
|
142
|
+
n([
|
|
142
143
|
c({
|
|
143
144
|
converter: {
|
|
144
145
|
fromAttribute(e) {
|
|
@@ -156,19 +157,19 @@ r([
|
|
|
156
157
|
}
|
|
157
158
|
})
|
|
158
159
|
], o.prototype, "items", 2);
|
|
159
|
-
|
|
160
|
+
n([
|
|
160
161
|
c({ reflect: !0 })
|
|
161
162
|
], o.prototype, "active", 2);
|
|
162
|
-
|
|
163
|
+
n([
|
|
163
164
|
u()
|
|
164
165
|
], o.prototype, "_dropupOpen", 2);
|
|
165
|
-
|
|
166
|
+
n([
|
|
166
167
|
u()
|
|
167
168
|
], o.prototype, "_hasNamedSlots", 2);
|
|
168
|
-
|
|
169
|
+
n([
|
|
169
170
|
b("#chevron-zone")
|
|
170
171
|
], o.prototype, "_chevronBtn", 2);
|
|
171
|
-
o =
|
|
172
|
+
o = n([
|
|
172
173
|
m("sw-ui-split-button")
|
|
173
174
|
], o);
|
|
174
175
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sw-ui-split-button.js","sources":["../../../../src/components/UI/controls/sw-ui-split-button.ts"],"sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport type { DropUpItem } from './sw-ui-dropup';\n\n/**\n * Pill-shaped split button: main action + optional chevron dropdown.\n *\n * When `items` is non-empty, renders as a unified pill with a subtle\n * divider between the icon area and the chevron: `[ 🎤 | ▲ ]`\n *\n * When `items` is empty, renders as a single pill button.\n *\n * - **active/inactive** slots → toggle button, dispatches `sw-split-button-toggle`\n * - **default** slot only → push button, dispatches `sw-split-button-click`\n *\n * @slot active - icon shown when active\n * @slot inactive - icon shown when inactive\n * @slot (default)- icon for a non-toggle button\n *\n * @fires sw-split-button-toggle - Fired on toggle-mode click. `detail` is the new active state (boolean).\n * @fires sw-split-button-click - Fired on push-mode click. No detail.\n *\n * @cssprop --sw-split-button-size [44px] - height (width auto-fits content)\n * @cssprop --sw-split-button-bg - button background (falls back to --bg-surface)\n * @cssprop --sw-split-button-bg-hover - hover background (falls back to --bg-surface-raised)\n * @cssprop --sw-split-button-color - icon colour (falls back to --fg-default)\n * @cssprop --sw-split-button-radius - border-radius (falls back to --radius-full)\n */\n@customElement('sw-ui-split-button')\nexport class SwUiSplitButton extends LitElement {\n static styles = css`\n :host {\n display: inline-flex;\n align-items: center;\n }\n\n /* Hide named slots by default; shown based on active state */\n slot[name='active'] { display: none; }\n :host([active='true']) slot[name='active'] { display: contents; }\n :host([active='true']) slot[name='inactive'] { display: none; }\n\n /* ── Unified pill container ─────────────────────────────────── */\n .pill {\n display: inline-flex;\n align-items: center;\n border-radius: var(--sw-split-button-radius, var(--radius-full));\n background: var(--sw-split-button-bg, var(--bg-surface));\n overflow: hidden;\n transition: background var(--transition-fast);\n }\n\n .pill:hover {\n background: var(--sw-split-button-bg-hover, var(--bg-surface-raised));\n }\n\n /* ── Click zones inside the pill ────────────────────────────── */\n .main, .chevron {\n all: unset;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n color: var(--sw-split-button-color, var(--fg-default));\n height: var(--sw-split-button-height, var(--sw-split-button-size, 40px));\n }\n\n .main {\n padding: 0 12px;\n }\n\n .chevron {\n padding: 0 6px;\n border-left: 1px solid var(--border-default);\n }\n\n .chevron sw-ui-icon {\n opacity: 0.7;\n }\n\n /* Hover highlights individual zones within the pill */\n .main:hover, .chevron:hover {\n background: rgba(255, 255, 255, 0.08);\n }\n\n /* ── Solo button (no items → no chevron) ────────────────────── */\n .solo {\n all: unset;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n height: var(--sw-split-button-height, var(--sw-split-button-size, 40px));\n padding: 0 14px;\n border-radius: var(--sw-split-button-radius, var(--radius-full));\n background: var(--sw-split-button-bg, var(--bg-surface));\n color: var(--sw-split-button-color, var(--fg-default));\n transition: background var(--transition-fast);\n }\n\n .solo:hover {\n background: var(--sw-split-button-bg-hover, var(--bg-surface-raised));\n }\n
|
|
1
|
+
{"version":3,"file":"sw-ui-split-button.js","sources":["../../../../src/components/UI/controls/sw-ui-split-button.ts"],"sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport type { DropUpItem } from './sw-ui-dropup';\nimport { hostReset } from '../host-reset.js';\n\n/**\n * Pill-shaped split button: main action + optional chevron dropdown.\n *\n * When `items` is non-empty, renders as a unified pill with a subtle\n * divider between the icon area and the chevron: `[ 🎤 | ▲ ]`\n *\n * When `items` is empty, renders as a single pill button.\n *\n * - **active/inactive** slots → toggle button, dispatches `sw-split-button-toggle`\n * - **default** slot only → push button, dispatches `sw-split-button-click`\n *\n * @slot active - icon shown when active\n * @slot inactive - icon shown when inactive\n * @slot (default)- icon for a non-toggle button\n *\n * @fires sw-split-button-toggle - Fired on toggle-mode click. `detail` is the new active state (boolean).\n * @fires sw-split-button-click - Fired on push-mode click. No detail.\n *\n * @cssprop --sw-split-button-size [44px] - height (width auto-fits content)\n * @cssprop --sw-split-button-bg - button background (falls back to --bg-surface)\n * @cssprop --sw-split-button-bg-hover - hover background (falls back to --bg-surface-raised)\n * @cssprop --sw-split-button-color - icon colour (falls back to --fg-default)\n * @cssprop --sw-split-button-radius - border-radius (falls back to --radius-full)\n */\n@customElement('sw-ui-split-button')\nexport class SwUiSplitButton extends LitElement {\n static styles = [hostReset, css`\n :host {\n display: inline-flex;\n align-items: center;\n }\n\n /* Hide named slots by default; shown based on active state */\n slot[name='active'] { display: none; }\n :host([active='true']) slot[name='active'] { display: contents; }\n :host([active='true']) slot[name='inactive'] { display: none; }\n\n /* ── Unified pill container ─────────────────────────────────── */\n .pill {\n display: inline-flex;\n align-items: center;\n border-radius: var(--sw-split-button-radius, var(--radius-full));\n background: var(--sw-split-button-bg, var(--bg-surface));\n overflow: hidden;\n transition: background var(--transition-fast);\n }\n\n .pill:hover {\n background: var(--sw-split-button-bg-hover, var(--bg-surface-raised));\n }\n\n /* ── Click zones inside the pill ────────────────────────────── */\n .main, .chevron {\n all: unset;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n color: var(--sw-split-button-color, var(--fg-default));\n height: var(--sw-split-button-height, var(--sw-split-button-size, 40px));\n }\n\n .main {\n padding: 0 12px;\n }\n\n .chevron {\n padding: 0 6px;\n border-left: 1px solid var(--border-default);\n }\n\n .chevron sw-ui-icon {\n opacity: 0.7;\n }\n\n /* Hover highlights individual zones within the pill */\n .main:hover, .chevron:hover {\n background: rgba(255, 255, 255, 0.08);\n }\n\n /* ── Solo button (no items → no chevron) ────────────────────── */\n .solo {\n all: unset;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n height: var(--sw-split-button-height, var(--sw-split-button-size, 40px));\n padding: 0 14px;\n border-radius: var(--sw-split-button-radius, var(--radius-full));\n background: var(--sw-split-button-bg, var(--bg-surface));\n color: var(--sw-split-button-color, var(--fg-default));\n transition: background var(--transition-fast);\n }\n\n .solo:hover {\n background: var(--sw-split-button-bg-hover, var(--bg-surface-raised));\n }\n `];\n\n @property({\n converter: {\n fromAttribute(value: string | null): Array<DropUpItem | string> {\n if (!value) return [];\n try {\n const parsed: unknown = JSON.parse(value);\n return Array.isArray(parsed) ? (parsed as Array<DropUpItem | string>) : [];\n } catch {\n return [];\n }\n },\n toAttribute(value: Array<DropUpItem | string>): string {\n return JSON.stringify(value);\n }\n }\n })\n items: Array<DropUpItem | string> = [];\n\n @property({ reflect: true })\n active: boolean = false;\n\n @state()\n private _dropupOpen: boolean = false;\n\n @state()\n private _hasNamedSlots = false;\n\n @query('#chevron-zone')\n private _chevronBtn!: HTMLButtonElement;\n\n private _onDropupSelect(e: CustomEvent<DropUpItem>) {\n this.items = this.items.map((i) => {\n const id = typeof i === 'string' ? i : i.id;\n return typeof i === 'string'\n ? { label: i, id: i, selected: i === e.detail.id }\n : { ...i, selected: id === e.detail.id };\n });\n }\n\n private _updateNamedSlots() {\n const active = this.shadowRoot?.querySelector('slot[name=\"active\"]') as HTMLSlotElement | null;\n const inactive = this.shadowRoot?.querySelector(\n 'slot[name=\"inactive\"]'\n ) as HTMLSlotElement | null;\n this._hasNamedSlots =\n (active?.assignedElements().length ?? 0) > 0 ||\n (inactive?.assignedElements().length ?? 0) > 0;\n }\n\n private _onMainClick() {\n if (!this._hasNamedSlots) {\n this.dispatchEvent(new CustomEvent('sw-split-button-click', { bubbles: true, composed: true }));\n return;\n }\n this.active = !this.active;\n this.dispatchEvent(\n new CustomEvent('sw-split-button-toggle', {\n detail: this.active,\n bubbles: true,\n composed: true\n })\n );\n }\n\n render() {\n const hasItems = this.items.length > 0;\n\n const iconSlots = html`\n <slot name=\"active\" @slotchange=${this._updateNamedSlots}></slot>\n <slot name=\"inactive\" @slotchange=${this._updateNamedSlots}></slot>\n ${!this._hasNamedSlots ? html`<slot></slot>` : nothing}\n `;\n\n if (!hasItems) {\n // Solo pill — no chevron\n return html`\n <button class=\"solo\" part=\"button\" @click=${this._onMainClick}>\n ${iconSlots}\n </button>\n `;\n }\n\n // Split pill — icon zone | divider | chevron zone\n return html`\n <div class=\"pill\" part=\"button\">\n <button class=\"main\" @click=${this._onMainClick}>\n ${iconSlots}\n </button>\n <button class=\"chevron\" part=\"chevron\" id=\"chevron-zone\"\n @click=${() => (this._dropupOpen = !this._dropupOpen)}>\n <sw-ui-icon name=\"chevron-up\" size=\"14\"></sw-ui-icon>\n </button>\n </div>\n <sw-ui-dropup\n .items=${this.items}\n .open=${this._dropupOpen}\n .anchor=${this._chevronBtn}\n @sw-dropup-close=${() => (this._dropupOpen = false)}\n @sw-dropup-select=${this._onDropupSelect}\n />\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sw-ui-split-button': SwUiSplitButton;\n }\n}\n"],"names":["SwUiSplitButton","LitElement","i","id","active","_a","inactive","_b","hasItems","iconSlots","html","nothing","hostReset","css","__decorateClass","property","value","parsed","state","query","customElement"],"mappings":"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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Defensive reset for inheritable CSS properties that cross the shadow
|
|
3
|
+
* boundary. Host pages frequently set these on `body` or layout wrappers
|
|
4
|
+
* (`text-align: center`, `text-transform: uppercase`, etc.) and they would
|
|
5
|
+
* otherwise inherit into our shadow trees and distort component rendering.
|
|
6
|
+
*
|
|
7
|
+
* Properties intentionally NOT reset: `color`, `font-family`, `font-size`.
|
|
8
|
+
* Those are how design tokens flow into components — consumers legitimately
|
|
9
|
+
* theme by inheriting these from an ancestor.
|
|
10
|
+
*
|
|
11
|
+
* Slotted content is unaffected: slotted nodes inherit from their flat-tree
|
|
12
|
+
* parent (the host's tree), not from `:host`, which is the desired behavior
|
|
13
|
+
* for user-provided slot content.
|
|
14
|
+
*/
|
|
15
|
+
export declare const hostReset: import("lit").CSSResult;
|
|
16
|
+
//# sourceMappingURL=host-reset.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"host-reset.d.ts","sourceRoot":"","sources":["../../../src/components/UI/host-reset.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,SAAS,yBAcrB,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { css as t } from "lit";
|
|
2
|
+
const o = t`
|
|
3
|
+
:host {
|
|
4
|
+
text-align: start;
|
|
5
|
+
letter-spacing: normal;
|
|
6
|
+
word-spacing: normal;
|
|
7
|
+
text-transform: none;
|
|
8
|
+
text-indent: 0;
|
|
9
|
+
line-height: normal;
|
|
10
|
+
font-style: normal;
|
|
11
|
+
font-weight: normal;
|
|
12
|
+
font-variant: normal;
|
|
13
|
+
white-space: normal;
|
|
14
|
+
text-shadow: none;
|
|
15
|
+
}
|
|
16
|
+
`;
|
|
17
|
+
export {
|
|
18
|
+
o as hostReset
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=host-reset.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"host-reset.js","sources":["../../../src/components/UI/host-reset.ts"],"sourcesContent":["import { css } from 'lit';\n\n/**\n * Defensive reset for inheritable CSS properties that cross the shadow\n * boundary. Host pages frequently set these on `body` or layout wrappers\n * (`text-align: center`, `text-transform: uppercase`, etc.) and they would\n * otherwise inherit into our shadow trees and distort component rendering.\n *\n * Properties intentionally NOT reset: `color`, `font-family`, `font-size`.\n * Those are how design tokens flow into components — consumers legitimately\n * theme by inheriting these from an ancestor.\n *\n * Slotted content is unaffected: slotted nodes inherit from their flat-tree\n * parent (the host's tree), not from `:host`, which is the desired behavior\n * for user-provided slot content.\n */\nexport const hostReset = css`\n :host {\n text-align: start;\n letter-spacing: normal;\n word-spacing: normal;\n text-transform: none;\n text-indent: 0;\n line-height: normal;\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n white-space: normal;\n text-shadow: none;\n }\n`;\n"],"names":["hostReset","css"],"mappings":";AAgBO,MAAMA,IAAYC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
|
|
@@ -6,7 +6,7 @@ export type PromptType = 'confirm' | 'alert';
|
|
|
6
6
|
* @slot description content (falls back to the `description` property)
|
|
7
7
|
*/
|
|
8
8
|
export declare class SwUiAlert extends LitElement {
|
|
9
|
-
static styles: import("lit").CSSResult;
|
|
9
|
+
static styles: import("lit").CSSResult[];
|
|
10
10
|
title: string;
|
|
11
11
|
description: string;
|
|
12
12
|
type: PromptType;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sw-ui-alert.d.ts","sourceRoot":"","sources":["../../../src/components/UI/sw-ui-alert.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"sw-ui-alert.d.ts","sourceRoot":"","sources":["../../../src/components/UI/sw-ui-alert.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAI5C,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,CAAC;AAE7C;;;;GAIG;AACH,qBACa,SAAU,SAAQ,UAAU;IACvC,MAAM,CAAC,MAAM,4BA6DV;IAEiB,KAAK,EAAE,MAAM,CAAC;IACtB,WAAW,SAAM;IACA,IAAI,EAAE,UAAU,CAAa;IAEzC,OAAO,CAAC,OAAO,CAAqB;IAErD,OAAO,CAAC,QAAQ,CAA2C;IAE3D,mFAAmF;IACnF,IAAI,IAAI,OAAO,CAAC,OAAO,CAAC;IAOxB,OAAO,CAAC,MAAM;IAMd,MAAM;CAkBP;AAED;;;;;;GAMG;AACH,wBAAsB,UAAU,CAAC,OAAO,EAAE;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,GAAG,OAAO,CAAC,OAAO,CAAC,CAUnB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,SAAS,CAAC;KAC1B;CACF"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
import { LitElement as
|
|
2
|
-
import { property as
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
import { LitElement as d, html as n, css as u } from "lit";
|
|
2
|
+
import { property as p, query as h, customElement as m } from "lit/decorators.js";
|
|
3
|
+
import { hostReset as b } from "./host-reset.js";
|
|
4
|
+
var f = Object.defineProperty, v = Object.getOwnPropertyDescriptor, s = (e, t, i, c) => {
|
|
5
|
+
for (var r = c > 1 ? void 0 : c ? v(t, i) : t, l = e.length - 1, a; l >= 0; l--)
|
|
5
6
|
(a = e[l]) && (r = (c ? a(t, i, r) : a(r)) || r);
|
|
6
|
-
return c && r &&
|
|
7
|
+
return c && r && f(t, i, r), r;
|
|
7
8
|
};
|
|
8
|
-
let o = class extends
|
|
9
|
+
let o = class extends d {
|
|
9
10
|
constructor() {
|
|
10
11
|
super(...arguments), this.description = "", this.type = "confirm", this._resolve = null;
|
|
11
12
|
}
|
|
@@ -36,7 +37,7 @@ let o = class extends p {
|
|
|
36
37
|
`;
|
|
37
38
|
}
|
|
38
39
|
};
|
|
39
|
-
o.styles = u`
|
|
40
|
+
o.styles = [b, u`
|
|
40
41
|
:host {
|
|
41
42
|
font-family: var(--type-family-body);
|
|
42
43
|
}
|
|
@@ -97,15 +98,15 @@ o.styles = u`
|
|
|
97
98
|
.reject:hover {
|
|
98
99
|
background: #e5e7eb;
|
|
99
100
|
}
|
|
100
|
-
|
|
101
|
+
`];
|
|
101
102
|
s([
|
|
102
|
-
|
|
103
|
+
p()
|
|
103
104
|
], o.prototype, "title", 2);
|
|
104
105
|
s([
|
|
105
|
-
|
|
106
|
+
p()
|
|
106
107
|
], o.prototype, "description", 2);
|
|
107
108
|
s([
|
|
108
|
-
|
|
109
|
+
p({ reflect: !0 })
|
|
109
110
|
], o.prototype, "type", 2);
|
|
110
111
|
s([
|
|
111
112
|
h("dialog")
|
|
@@ -113,7 +114,7 @@ s([
|
|
|
113
114
|
o = s([
|
|
114
115
|
m("sw-ui-alert")
|
|
115
116
|
], o);
|
|
116
|
-
async function
|
|
117
|
+
async function _(e) {
|
|
117
118
|
const t = document.createElement("sw-ui-alert");
|
|
118
119
|
t.title = e.title, e.description !== void 0 && (t.description = e.description), e.type !== void 0 && (t.type = e.type), document.body.appendChild(t), await t.updateComplete;
|
|
119
120
|
const i = await t.show();
|
|
@@ -121,6 +122,6 @@ async function g(e) {
|
|
|
121
122
|
}
|
|
122
123
|
export {
|
|
123
124
|
o as SwUiAlert,
|
|
124
|
-
|
|
125
|
+
_ as showPrompt
|
|
125
126
|
};
|
|
126
127
|
//# sourceMappingURL=sw-ui-alert.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sw-ui-alert.js","sources":["../../../src/components/UI/sw-ui-alert.ts"],"sourcesContent":["import { LitElement, css, html } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\n\nexport type PromptType = 'confirm' | 'alert';\n\n/**\n * Confirmation/alert prompt dialog\n *\n * @slot description content (falls back to the `description` property)\n */\n@customElement('sw-ui-alert')\nexport class SwUiAlert extends LitElement {\n static styles = css`\n :host {\n font-family: var(--type-family-body);\n }\n\n dialog {\n border: none;\n border-radius: var(--radius-md);\n padding: 24px;\n min-width: 280px;\n max-width: 400px;\n box-shadow: var(--shadow-md);\n }\n\n dialog::backdrop {\n background: rgba(0, 0, 0, 0.4);\n }\n\n .title {\n margin: 0 0 12px;\n font-size: 1.125rem;\n font-weight: 600;\n }\n\n .body {\n margin: 0 0 20px;\n line-height: 1.5;\n }\n\n .actions {\n display: flex;\n gap: 8px;\n justify-content: flex-end;\n }\n\n button {\n padding: 8px 16px;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 0.875rem;\n font-family: inherit;\n }\n\n .accept {\n background: var(--interactive-button-primary-bg);\n color: white;\n }\n\n .accept:hover {\n background: var(--interactive-button-primary-hover);\n }\n\n .reject {\n background: #f3f4f6;\n color: #374151;\n }\n\n .reject:hover {\n background: #e5e7eb;\n }\n
|
|
1
|
+
{"version":3,"file":"sw-ui-alert.js","sources":["../../../src/components/UI/sw-ui-alert.ts"],"sourcesContent":["import { LitElement, css, html } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { hostReset } from './host-reset.js';\n\nexport type PromptType = 'confirm' | 'alert';\n\n/**\n * Confirmation/alert prompt dialog\n *\n * @slot description content (falls back to the `description` property)\n */\n@customElement('sw-ui-alert')\nexport class SwUiAlert extends LitElement {\n static styles = [hostReset, css`\n :host {\n font-family: var(--type-family-body);\n }\n\n dialog {\n border: none;\n border-radius: var(--radius-md);\n padding: 24px;\n min-width: 280px;\n max-width: 400px;\n box-shadow: var(--shadow-md);\n }\n\n dialog::backdrop {\n background: rgba(0, 0, 0, 0.4);\n }\n\n .title {\n margin: 0 0 12px;\n font-size: 1.125rem;\n font-weight: 600;\n }\n\n .body {\n margin: 0 0 20px;\n line-height: 1.5;\n }\n\n .actions {\n display: flex;\n gap: 8px;\n justify-content: flex-end;\n }\n\n button {\n padding: 8px 16px;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n font-size: 0.875rem;\n font-family: inherit;\n }\n\n .accept {\n background: var(--interactive-button-primary-bg);\n color: white;\n }\n\n .accept:hover {\n background: var(--interactive-button-primary-hover);\n }\n\n .reject {\n background: #f3f4f6;\n color: #374151;\n }\n\n .reject:hover {\n background: #e5e7eb;\n }\n `];\n\n @property() declare title: string;\n @property() description = '';\n @property({ reflect: true }) type: PromptType = 'confirm';\n\n @query('dialog') private _dialog!: HTMLDialogElement;\n\n private _resolve: ((value: boolean) => void) | null = null;\n\n /** Opens the prompt and returns a promise that resolves with the user's choice. */\n show(): Promise<boolean> {\n this._dialog.showModal();\n return new Promise((resolve) => {\n this._resolve = resolve;\n });\n }\n\n private _close(value: boolean) {\n this._resolve?.(value);\n this._resolve = null;\n this._dialog.close();\n }\n\n render() {\n return html`\n <dialog>\n <h2 class=\"title\">${this.title}</h2>\n <div class=\"body\">\n <slot>${this.description}</slot>\n </div>\n <div class=\"actions\">\n ${this.type === 'confirm'\n ? html`\n <button class=\"reject\" @click=${() => this._close(false)}>Reject</button>\n <button class=\"accept\" @click=${() => this._close(true)}>Accept</button>\n `\n : html` <button class=\"accept\" @click=${() => this._close(true)}>OK</button> `}\n </div>\n </dialog>\n `;\n }\n}\n\n/**\n * Programmatically show a prompt and await the user's response.\n *\n * @example\n * const confirmed = await showPrompt({ title: \"Delete item?\", type: \"confirm\" });\n * const ack = await showPrompt({ title: \"Done!\", type: \"alert\" });\n */\nexport async function showPrompt(options: {\n title: string;\n description?: string;\n type?: PromptType;\n}): Promise<boolean> {\n const el = document.createElement('sw-ui-alert') as SwUiAlert;\n el.title = options.title;\n if (options.description !== undefined) el.description = options.description;\n if (options.type !== undefined) el.type = options.type;\n document.body.appendChild(el);\n await el.updateComplete;\n const result = await el.show();\n el.remove();\n return result;\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sw-ui-alert': SwUiAlert;\n }\n}\n"],"names":["SwUiAlert","LitElement","resolve","value","_a","html","hostReset","css","__decorateClass","property","query","customElement","showPrompt","options","el","result"],"mappings":";;;;;;;;AAYO,IAAMA,IAAN,cAAwBC,EAAW;AAAA,EAAnC,cAAA;AAAA,UAAA,GAAA,SAAA,GAiEO,KAAA,cAAc,IACG,KAAA,OAAmB,WAIhD,KAAQ,WAA8C;AAAA,EAAA;AAAA;AAAA,EAGtD,OAAyB;AACvB,gBAAK,QAAQ,UAAA,GACN,IAAI,QAAQ,CAACC,MAAY;AAC9B,WAAK,WAAWA;AAAA,IAClB,CAAC;AAAA,EACH;AAAA,EAEQ,OAAOC,GAAgB;;AAC7B,KAAAC,IAAA,KAAK,aAAL,QAAAA,EAAA,WAAgBD,IAChB,KAAK,WAAW,MAChB,KAAK,QAAQ,MAAA;AAAA,EACf;AAAA,EAEA,SAAS;AACP,WAAOE;AAAA;AAAA,4BAEiB,KAAK,KAAK;AAAA;AAAA,kBAEpB,KAAK,WAAW;AAAA;AAAA;AAAA,YAGtB,KAAK,SAAS,YACZA;AAAA,gDACkC,MAAM,KAAK,OAAO,EAAK,CAAC;AAAA,gDACxB,MAAM,KAAK,OAAO,EAAI,CAAC;AAAA,kBAEzDA,mCAAsC,MAAM,KAAK,OAAO,EAAI,CAAC,eAAe;AAAA;AAAA;AAAA;AAAA,EAIxF;AACF;AAxGaL,EACJ,SAAS,CAACM,GAAWC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA6D3B;AAEmBC,EAAA;AAAA,EAAnBC,EAAA;AAAS,GAhECT,EAgES,WAAA,SAAA,CAAA;AACRQ,EAAA;AAAA,EAAXC,EAAA;AAAS,GAjECT,EAiEC,WAAA,eAAA,CAAA;AACiBQ,EAAA;AAAA,EAA5BC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GAlEhBT,EAkEkB,WAAA,QAAA,CAAA;AAEJQ,EAAA;AAAA,EAAxBE,EAAM,QAAQ;AAAA,GApEJV,EAoEc,WAAA,WAAA,CAAA;AApEdA,IAANQ,EAAA;AAAA,EADNG,EAAc,aAAa;AAAA,GACfX,CAAA;AAiHb,eAAsBY,EAAWC,GAIZ;AACnB,QAAMC,IAAK,SAAS,cAAc,aAAa;AAC/C,EAAAA,EAAG,QAAQD,EAAQ,OACfA,EAAQ,gBAAgB,WAAWC,EAAG,cAAcD,EAAQ,cAC5DA,EAAQ,SAAS,WAAWC,EAAG,OAAOD,EAAQ,OAClD,SAAS,KAAK,YAAYC,CAAE,GAC5B,MAAMA,EAAG;AACT,QAAMC,IAAS,MAAMD,EAAG,KAAA;AACxB,SAAAA,EAAG,OAAA,GACIC;AACT;"}
|
|
@@ -35,7 +35,7 @@ export interface TranscriptEntryMeta {
|
|
|
35
35
|
};
|
|
36
36
|
}
|
|
37
37
|
export declare class SwUiTranscriptView extends LitElement {
|
|
38
|
-
static styles: import("lit").CSSResult;
|
|
38
|
+
static styles: import("lit").CSSResult[];
|
|
39
39
|
entries: TranscriptEntry[];
|
|
40
40
|
header: string;
|
|
41
41
|
emptyText: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sw-ui-transcript-view.d.ts","sourceRoot":"","sources":["../../../src/components/UI/sw-ui-transcript-view.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"sw-ui-transcript-view.d.ts","sourceRoot":"","sources":["../../../src/components/UI/sw-ui-transcript-view.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAsB,MAAM,KAAK,CAAC;AAOrD;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;IAClC,KAAK,EAAE,SAAS,GAAG,UAAU,CAAC;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,mBAAmB,CAAC;CAC5B;AAED,mDAAmD;AACnD,MAAM,WAAW,mBAAmB;IAClC,uBAAuB;IACvB,KAAK,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACzC,oBAAoB;IACpB,IAAI,CAAC,EAAE;QAAE,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9C;;;OAGG;IACH,cAAc,CAAC,EAAE;QACf,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,OAAO,EAAE,MAAM,CAAC;QAChB,MAAM,EAAE,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;QAC9C,QAAQ,CAAC,EAAE,MAAM,CAAC;KACnB,CAAC;CACH;AAED,qBACa,kBAAmB,SAAQ,UAAU;IAChD,MAAM,CAAC,MAAM,4BAqOR;IAE2B,OAAO,EAAE,eAAe,EAAE,CAAM;IACpC,MAAM,SAAgB;IACG,SAAS,SAAM;IAG3D,OAAO,CAAC,UAAU,CAA6B;IAExD,OAAO,CAAC,eAAe,CAAK;IAE5B,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;YAWxC,oBAAoB;IAkBlC,OAAO,CAAC,mBAAmB;IAW3B,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,WAAW;IAWnB,MAAM;CA4CP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,kBAAkB,CAAC;KAC7C;CACF"}
|