@triptease/tt-date-range-picker 6.2.5 → 6.3.1

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @triptease/tt-date-range-picker
 
+## 6.3.1
+
+### Patch Changes
+
+- Updating the prepublish command to use yarn build:node instead of tsc so that it compiles the imports down to use required for common js
+- Updated dependencies
+  - @triptease/tt-date-input@6.1.1
+  - @triptease/tt-calendar@6.1.1
+  - @triptease/tt-dialog@5.2.1
+
+## 6.3.0
+
+### Minor Changes
+
+- Add dual ESM/CJS output
+
+### Patch Changes
+
+- Updated dependencies
+  - @triptease/tt-date-input@6.1.0
+  - @triptease/tt-calendar@6.1.0
+  - @triptease/tt-dialog@5.2.0
+  - @triptease/icons@1.4.0
+
 ## 6.2.5
 
 ### Patch Changes

package/dist/cjs/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "commonjs"
+}

package/dist/cjs/src/DateRangeInput/DateRangeInput.js

@@ -0,0 +1,67 @@
+"use strict";
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateRangeInput = void 0;
+const decorators_js_1 = require("lit/decorators.js");
+const lit_1 = require("lit");
+class DateRangeInput extends lit_1.LitElement {
+    constructor() {
+        super(...arguments);
+        this._onFocus = () => {
+            this.dateInputs[0].focus();
+        };
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.addEventListener('focus', this._onFocus);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.removeEventListener('focus', this._onFocus);
+    }
+    _onInput(e) {
+        const target = e.target;
+        const { value, name } = target;
+        if (!value)
+            return;
+        const field = name === 'start-date' ? 'startDate' : 'endDate';
+        this.value = { ...this.value, [field]: value };
+        this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));
+    }
+    render() {
+        return (0, lit_1.html) `
+      <tt-date-input name="start-date" @change="${this._onInput}" .value="${this.value?.startDate}"></tt-date-input>
+      <span>to</span>
+      <tt-date-input name="end-date" @change="${this._onInput}" .value="${this.value?.endDate}"></tt-date-input>
+    `;
+    }
+}
+exports.DateRangeInput = DateRangeInput;
+DateRangeInput.styles = (0, lit_1.css) `
+    :host {
+      display: flex;
+      align-items: center;
+      padding: var(--space-scale-1) var(--space-scale-1-5);
+      gap: var(--space-scale-1);
+    }
+
+    :user-invalid {
+      outline: 1px solid red;
+    }
+  `;
+DateRangeInput.shadowRootOptions = {
+    ...lit_1.LitElement.shadowRootOptions,
+    delegatesFocus: true,
+};
+__decorate([
+    (0, decorators_js_1.property)({ type: Object })
+], DateRangeInput.prototype, "value", void 0);
+__decorate([
+    (0, decorators_js_1.queryAll)('tt-date-input')
+], DateRangeInput.prototype, "dateInputs", void 0);
+//# sourceMappingURL=DateRangeInput.js.map

package/dist/cjs/src/DateRangeInput/DateRangeInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateRangeInput.js","sourceRoot":"","sources":["../../../../src/DateRangeInput/DateRangeInput.ts"],"names":[],"mappings":";;;;;;;;;AAAA,qDAAuD;AACvD,6BAA4C;AAI5C,MAAa,cAAe,SAAQ,gBAAU;IAA9C;;QA+CU,aAAQ,GAAG,GAAG,EAAE;YACtB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC;QAC7B,CAAC,CAAC;IASJ,CAAC;IAjCQ,iBAAiB;QACtB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAChD,CAAC;IAEM,oBAAoB;QACzB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAE7B,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IACnD,CAAC;IAEO,QAAQ,CAAC,CAAa;QAC5B,MAAM,MAAM,GAAG,CAAC,CAAC,MAAmB,CAAC;QACrC,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,MAAM,CAAC;QAC/B,IAAI,CAAC,KAAK;YAAE,OAAO;QAEnB,MAAM,KAAK,GAAG,IAAI,KAAK,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC;QAC9D,IAAI,CAAC,KAAK,GAAG,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,CAAC;QAC/C,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IAC7E,CAAC;IAMM,MAAM;QACX,OAAO,IAAA,UAAI,EAAA;kDACmC,IAAI,CAAC,QAAQ,aAAa,IAAI,CAAC,KAAK,EAAE,SAAS;;gDAEjD,IAAI,CAAC,QAAQ,aAAa,IAAI,CAAC,KAAK,EAAE,OAAO;KACxF,CAAC;IACJ,CAAC;;AAzDH,wCA0DC;AAzDQ,qBAAM,GAAG,IAAA,SAAG,EAAA;;;;;;;;;;;GAWlB,AAXY,CAWX;AAQK,gCAAiB,GAAG;IACzB,GAAG,gBAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACrB,AAHuB,CAGtB;AARK;IADN,IAAA,wBAAQ,EAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CACF;AAGzB;IADC,IAAA,wBAAQ,EAAC,eAAe,CAAC;kDACI","sourcesContent":["import { property, queryAll } from 'lit/decorators.js';\nimport { css, html, LitElement } from 'lit';\nimport { DateInput } from '@triptease/tt-date-input';\nimport { DateRange } from '@triptease/tt-calendar/date-selection-context.js';\n\nexport class DateRangeInput extends LitElement {\n  static styles = css`\n    :host {\n      display: flex;\n      align-items: center;\n      padding: var(--space-scale-1) var(--space-scale-1-5);\n      gap: var(--space-scale-1);\n    }\n\n    :user-invalid {\n      outline: 1px solid red;\n    }\n  `;\n\n  @property({ type: Object })\n  public value?: DateRange;\n\n  @queryAll('tt-date-input')\n  dateInputs!: Array<DateInput>;\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  public connectedCallback() {\n    super.connectedCallback();\n\n    this.addEventListener('focus', this._onFocus);\n  }\n\n  public disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.removeEventListener('focus', this._onFocus);\n  }\n\n  private _onInput(e: InputEvent) {\n    const target = e.target as DateInput;\n    const { value, name } = target;\n    if (!value) return;\n\n    const field = name === 'start-date' ? 'startDate' : 'endDate';\n    this.value = { ...this.value, [field]: value };\n    this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));\n  }\n\n  private _onFocus = () => {\n    this.dateInputs[0].focus();\n  };\n\n  public render() {\n    return html`\n      <tt-date-input name=\"start-date\" @change=\"${this._onInput}\" .value=\"${this.value?.startDate}\"></tt-date-input>\n      <span>to</span>\n      <tt-date-input name=\"end-date\" @change=\"${this._onInput}\" .value=\"${this.value?.endDate}\"></tt-date-input>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'tt-date-range-input': DateRangeInput;\n  }\n}\n"]}

package/dist/cjs/src/DateRangeInput/tt-date-range-input.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateRangeInput = void 0;
+const tt_date_input_1 = require("@triptease/tt-date-input");
+const DateRangeInput_js_1 = require("./DateRangeInput.js");
+Object.defineProperty(exports, "DateRangeInput", { enumerable: true, get: function () { return DateRangeInput_js_1.DateRangeInput; } });
+if (typeof window !== 'undefined') {
+    if (!window.customElements.get('tt-date-input')) {
+        window.customElements.define('tt-date-input', tt_date_input_1.DateInput);
+    }
+    if (!window.customElements.get('tt-date-range-input')) {
+        window.customElements.define('tt-date-range-input', DateRangeInput_js_1.DateRangeInput);
+    }
+}
+//# sourceMappingURL=tt-date-range-input.js.map

package/dist/cjs/src/DateRangeInput/tt-date-range-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tt-date-range-input.js","sourceRoot":"","sources":["../../../../src/DateRangeInput/tt-date-range-input.ts"],"names":[],"mappings":";;;AAAA,4DAAqD;AACrD,2DAAqD;AAW5C,+FAXA,kCAAc,OAWA;AATvB,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;IAClC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,eAAe,CAAC,EAAE,CAAC;QAChD,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,eAAe,EAAE,yBAAS,CAAC,CAAC;IAC3D,CAAC;IACD,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,qBAAqB,CAAC,EAAE,CAAC;QACtD,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,qBAAqB,EAAE,kCAAc,CAAC,CAAC;IACtE,CAAC;AACH,CAAC","sourcesContent":["import { DateInput } from '@triptease/tt-date-input';\nimport { DateRangeInput } from './DateRangeInput.js';\n\nif (typeof window !== 'undefined') {\n  if (!window.customElements.get('tt-date-input')) {\n    window.customElements.define('tt-date-input', DateInput);\n  }\n  if (!window.customElements.get('tt-date-range-input')) {\n    window.customElements.define('tt-date-range-input', DateRangeInput);\n  }\n}\n\nexport { DateRangeInput };\n"]}

package/dist/cjs/src/SidePanel/PresetButton.js

@@ -0,0 +1,120 @@
+"use strict";
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PresetButton = exports.Preset = void 0;
+const lit_1 = require("lit");
+const decorators_js_1 = require("lit/decorators.js");
+const luxon_1 = require("luxon");
+const date_selection_context_js_1 = require("@triptease/tt-calendar/date-selection-context.js");
+const styles_js_1 = require("./styles.js");
+var Preset;
+(function (Preset) {
+    Preset["ThisWeek"] = "This week";
+    Preset["LastWeek"] = "Last week";
+    Preset["ThisMonth"] = "This month";
+    Preset["LastMonth"] = "Last month";
+    Preset["ThisQuarter"] = "This quarter";
+    Preset["LastQuarter"] = "Last quarter";
+    Preset["YearToDate"] = "Year to date";
+    Preset["LastYear"] = "Last year";
+    Preset["Next1Month"] = "Next 1 month";
+    Preset["Next3Months"] = "Next 3 months";
+    Preset["Next6Months"] = "Next 6 months";
+    Preset["Next12Months"] = "Next 12 months";
+    Preset["AllTime"] = "All time";
+})(Preset || (exports.Preset = Preset = {}));
+const parsePreset = (value) => {
+    if (!value)
+        return undefined;
+    if (Object.values(Preset).includes(value))
+        return value;
+    return undefined;
+};
+class PresetButton extends lit_1.LitElement {
+    constructor() {
+        super(...arguments);
+        this._onClick = (event) => {
+            event.stopPropagation();
+            event.preventDefault();
+            this.dispatchEvent(new date_selection_context_js_1.DateRangeSelectionEvent(this.range));
+        };
+    }
+    get today() {
+        return luxon_1.DateTime.local().startOf('day');
+    }
+    get range() {
+        switch (this.preset) {
+            case Preset.ThisWeek:
+                return { startDate: this.today.startOf('week').toISODate(), endDate: this.today.endOf('week').toISODate() };
+            case Preset.LastWeek:
+                return {
+                    startDate: this.today.startOf('week').minus({ weeks: 1 }).toISODate(),
+                    endDate: this.today.endOf('week').minus({ weeks: 1 }).toISODate(),
+                };
+            case Preset.ThisMonth:
+                return { startDate: this.today.startOf('month').toISODate(), endDate: this.today.endOf('month').toISODate() };
+            case Preset.LastMonth:
+                return {
+                    startDate: this.today.minus({ months: 1 }).startOf('month').toISODate(),
+                    endDate: this.today.minus({ months: 1 }).endOf('month').toISODate(),
+                };
+            case Preset.ThisQuarter:
+                return {
+                    startDate: this.today.startOf('quarter').toISODate(),
+                    endDate: this.today.endOf('quarter').toISODate(),
+                };
+            case Preset.YearToDate:
+                return { startDate: this.today.startOf('year').toISODate(), endDate: this.today.toISODate() };
+            case Preset.Next1Month:
+                return {
+                    startDate: this.today.toISODate(),
+                    endDate: this.today.plus({ months: 1 }).toISODate(),
+                };
+            case Preset.Next3Months:
+                return {
+                    startDate: this.today.toISODate(),
+                    endDate: this.today.plus({ months: 3 }).toISODate(),
+                };
+            case Preset.Next6Months:
+                return {
+                    startDate: this.today.toISODate(),
+                    endDate: this.today.plus({ months: 6 }).toISODate(),
+                };
+            case Preset.Next12Months:
+                return {
+                    startDate: this.today.toISODate(),
+                    endDate: this.today.plus({ months: 12 }).toISODate(),
+                };
+            case Preset.LastQuarter:
+                return {
+                    startDate: this.today.minus({ quarters: 1 }).startOf('quarter').toISODate(),
+                    endDate: this.today.minus({ quarters: 1 }).endOf('quarter').toISODate(),
+                };
+            case Preset.LastYear:
+                return {
+                    startDate: this.today.minus({ years: 1 }).startOf('year').toISODate(),
+                    endDate: this.today.minus({ years: 1 }).endOf('year').toISODate(),
+                };
+            case Preset.AllTime:
+                return { startDate: undefined, endDate: undefined };
+            default:
+                return { startDate: this.today.toISODate(), endDate: this.today.plus({ days: 28 }).toISODate() };
+        }
+    }
+    render() {
+        return (0, lit_1.html) ` <button @click="${this._onClick}">
+      <slot>${this.preset}</slot>
+    </button>`;
+    }
+}
+exports.PresetButton = PresetButton;
+PresetButton.styles = styles_js_1.button;
+__decorate([
+    (0, decorators_js_1.property)({ type: Preset, converter: parsePreset })
+], PresetButton.prototype, "preset", void 0);
+//# sourceMappingURL=PresetButton.js.map

package/dist/cjs/src/SidePanel/PresetButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PresetButton.js","sourceRoot":"","sources":["../../../../src/SidePanel/PresetButton.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { DateTime } from 'luxon';\nimport { DateRange, DateRangeSelectionEvent } from '@triptease/tt-calendar/date-selection-context.js';\nimport { button } from './styles.js';\n\nexport enum Preset {\n  ThisWeek = 'This week',\n  LastWeek = 'Last week',\n  ThisMonth = 'This month',\n  LastMonth = 'Last month',\n  ThisQuarter = 'This quarter',\n  LastQuarter = 'Last quarter',\n  YearToDate = 'Year to date',\n  LastYear = 'Last year',\n  Next1Month = 'Next 1 month',\n  Next3Months = 'Next 3 months',\n  Next6Months = 'Next 6 months',\n  Next12Months = 'Next 12 months',\n  AllTime = 'All time',\n}\n\nconst parsePreset = (value: string | null): Preset | undefined => {\n  if (!value) return undefined;\n  if (Object.values(Preset).includes(<Preset>value)) return <Preset>value;\n  return undefined;\n};\n\nexport class PresetButton extends LitElement {\n  static styles = button;\n\n  @property({ type: Preset, converter: parsePreset })\n  public preset?: Preset;\n\n  private _onClick = (event: MouseEvent) => {\n    event.stopPropagation();\n    event.preventDefault();\n    this.dispatchEvent(new DateRangeSelectionEvent(this.range));\n  };\n\n  private get today(): DateTime {\n    return DateTime.local().startOf('day');\n  }\n\n  private get range(): DateRange {\n    switch (this.preset) {\n      case Preset.ThisWeek:\n        return { startDate: this.today.startOf('week').toISODate()!, endDate: this.today.endOf('week').toISODate()! };\n      case Preset.LastWeek:\n        return {\n          startDate: this.today.startOf('week').minus({ weeks: 1 }).toISODate()!,\n          endDate: this.today.endOf('week').minus({ weeks: 1 }).toISODate()!,\n        };\n      case Preset.ThisMonth:\n        return { startDate: this.today.startOf('month').toISODate()!, endDate: this.today.endOf('month').toISODate()! };\n      case Preset.LastMonth:\n        return {\n          startDate: this.today.minus({ months: 1 }).startOf('month').toISODate()!,\n          endDate: this.today.minus({ months: 1 }).endOf('month').toISODate()!,\n        };\n      case Preset.ThisQuarter:\n        return {\n          startDate: this.today.startOf('quarter').toISODate()!,\n          endDate: this.today.endOf('quarter').toISODate()!,\n        };\n      case Preset.YearToDate:\n        return { startDate: this.today.startOf('year').toISODate()!, endDate: this.today.toISODate()! };\n      case Preset.Next1Month:\n        return {\n          startDate: this.today.toISODate()!,\n          endDate: this.today.plus({ months: 1 }).toISODate()!,\n        };\n      case Preset.Next3Months:\n        return {\n          startDate: this.today.toISODate()!,\n          endDate: this.today.plus({ months: 3 }).toISODate()!,\n        };\n      case Preset.Next6Months:\n        return {\n          startDate: this.today.toISODate()!,\n          endDate: this.today.plus({ months: 6 }).toISODate()!,\n        };\n      case Preset.Next12Months:\n        return {\n          startDate: this.today.toISODate()!,\n          endDate: this.today.plus({ months: 12 }).toISODate()!,\n        };\n      case Preset.LastQuarter:\n        return {\n          startDate: this.today.minus({ quarters: 1 }).startOf('quarter').toISODate()!,\n          endDate: this.today.minus({ quarters: 1 }).endOf('quarter').toISODate()!,\n        };\n      case Preset.LastYear:\n        return {\n          startDate: this.today.minus({ years: 1 }).startOf('year').toISODate()!,\n          endDate: this.today.minus({ years: 1 }).endOf('year').toISODate()!,\n        };\n      case Preset.AllTime:\n        return { startDate: undefined, endDate: undefined };\n      default:\n        return { startDate: this.today.toISODate()!, endDate: this.today.plus({ days: 28 }).toISODate()! };\n    }\n  }\n\n  public render() {\n    return html` <button @click=\"${this._onClick}\">\n      <slot>${this.preset}</slot>\n    </button>`;\n  }\n}\n"]}

package/dist/cjs/src/SidePanel/SidePanel.js

@@ -0,0 +1,43 @@
+"use strict";
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SidePanel = void 0;
+const lit_1 = require("lit");
+const decorators_js_1 = require("lit/decorators.js");
+const class_map_js_1 = require("lit/directives/class-map.js");
+const styles_js_1 = require("./styles.js");
+class SidePanel extends lit_1.LitElement {
+    contains(other) {
+        if (!other)
+            return false;
+        return other === this || this.slottedElements.some((slotted) => slotted === other || slotted.contains(other));
+    }
+    render() {
+        return (0, lit_1.html) `
+      <div
+        class="${(0, class_map_js_1.classMap)({
+            'side-panel': true,
+            empty: this.slottedElements.length === 0,
+        })}"
+        part="side-panel"
+      >
+        <slot name="side-preset" @slotchange="${() => this.requestUpdate()}"></slot>
+      </div>
+    `;
+    }
+}
+exports.SidePanel = SidePanel;
+SidePanel.styles = styles_js_1.styles;
+SidePanel.shadowRootOptions = {
+    ...lit_1.LitElement.shadowRootOptions,
+    delegatesFocus: true,
+};
+__decorate([
+    (0, decorators_js_1.queryAssignedElements)({ flatten: true, slot: 'side-preset' })
+], SidePanel.prototype, "slottedElements", void 0);
+//# sourceMappingURL=SidePanel.js.map

package/dist/cjs/src/SidePanel/SidePanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidePanel.js","sourceRoot":"","sources":["../../../../src/SidePanel/SidePanel.ts"],"names":[],"mappings":";;;;;;;;;AAAA,6BAAuC;AACvC,qDAA0D;AAC1D,8DAAuD;AACvD,2CAAqC;AAErC,MAAa,SAAU,SAAQ,gBAAU;IAWhC,QAAQ,CAAC,KAAkB;QAChC,IAAI,CAAC,KAAK;YAAE,OAAO,KAAK,CAAC;QAEzB,OAAO,KAAK,KAAK,IAAI,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,KAAK,KAAK,IAAI,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;IAChH,CAAC;IAED,MAAM;QACJ,OAAO,IAAA,UAAI,EAAA;;iBAEE,IAAA,uBAAQ,EAAC;YAChB,YAAY,EAAE,IAAI;YAClB,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC;SACzC,CAAC;;;gDAGsC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE;;KAErE,CAAC;IACJ,CAAC;;AA7BH,8BA8BC;AA7BQ,gBAAM,GAAG,kBAAM,CAAC;AAKhB,2BAAiB,GAAG;IACzB,GAAG,gBAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACrB,CAAC;AALM;IADP,IAAA,qCAAqB,EAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,aAAa,EAAE,CAAC;kDACjB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { queryAssignedElements } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './styles.js';\n\nexport class SidePanel extends LitElement {\n  static styles = styles;\n\n  @queryAssignedElements({ flatten: true, slot: 'side-preset' })\n  private slottedElements!: Array<HTMLElement>;\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  public contains(other: Node | null): boolean {\n    if (!other) return false;\n\n    return other === this || this.slottedElements.some((slotted) => slotted === other || slotted.contains(other));\n  }\n\n  render() {\n    return html`\n      <div\n        class=\"${classMap({\n          'side-panel': true,\n          empty: this.slottedElements.length === 0,\n        })}\"\n        part=\"side-panel\"\n      >\n        <slot name=\"side-preset\" @slotchange=\"${() => this.requestUpdate()}\"></slot>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/cjs/src/SidePanel/styles.js

@@ -0,0 +1,85 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.button = exports.styles = void 0;
+const lit_1 = require("lit");
+exports.styles = (0, lit_1.css) `
+  .side-panel {
+    padding: var(--space-scale-3);
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-scale-3);
+    height: 100%;
+    box-sizing: border-box;
+
+    /* Hide the panel when it is empty. Should use :has-slotted once support is widespread */
+
+    &.empty {
+      display: none;
+    }
+  }
+
+  button,
+  ::slotted(tt-preset-button) {
+    appearance: none;
+    padding: 0;
+    border-width: 0;
+    background-color: transparent;
+    border-radius: var(--space-scale-1);
+    padding-block: 0;
+    padding-inline: 0;
+    line-height: var(--space-scale-3);
+    font-size: var(--font-size-200);
+    text-wrap: nowrap;
+
+    &:hover {
+      box-shadow: none;
+      color: var(--color-primary-400);
+    }
+
+    &:focus {
+      outline: 1px solid var(--color-primary-400);
+    }
+
+    &[aria-selected='true'] {
+      color: var(--color-primary-400);
+    }
+
+    slot[name='presets']::slotted(*) {
+      display: none;
+    }
+  }
+`;
+exports.button = (0, lit_1.css) `
+  button {
+    appearance: none;
+    padding: 0;
+    border-width: 0;
+    background-color: transparent;
+    border-radius: var(--space-scale-1);
+    padding-block: 0;
+    padding-inline: 0;
+    line-height: var(--space-scale-3);
+    font-size: var(--font-size-200);
+    text-wrap: nowrap;
+    outline-offset: var(--space-scale-0-5);
+
+    &:hover {
+      box-shadow: none;
+      color: var(--color-primary-400);
+    }
+
+    &:focus {
+      outline: 1px solid var(--color-primary-400);
+    }
+
+    &[aria-selected='true'] {
+      color: var(--color-primary-400);
+      font-weight: var(--font-weight-semibold);
+    }
+
+    slot[name='presets']::slotted(*) {
+      display: none;
+    }
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/cjs/src/SidePanel/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/SidePanel/styles.ts"],"names":[],"mappings":";;;AAAA,6BAA0B;AAEb,QAAA,MAAM,GAAG,IAAA,SAAG,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8CxB,CAAC;AAEW,QAAA,MAAM,GAAG,IAAA,SAAG,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgCxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n  .side-panel {\n    padding: var(--space-scale-3);\n    display: flex;\n    flex-direction: column;\n    gap: var(--space-scale-3);\n    height: 100%;\n    box-sizing: border-box;\n\n    /* Hide the panel when it is empty. Should use :has-slotted once support is widespread */\n\n    &.empty {\n      display: none;\n    }\n  }\n\n  button,\n  ::slotted(tt-preset-button) {\n    appearance: none;\n    padding: 0;\n    border-width: 0;\n    background-color: transparent;\n    border-radius: var(--space-scale-1);\n    padding-block: 0;\n    padding-inline: 0;\n    line-height: var(--space-scale-3);\n    font-size: var(--font-size-200);\n    text-wrap: nowrap;\n\n    &:hover {\n      box-shadow: none;\n      color: var(--color-primary-400);\n    }\n\n    &:focus {\n      outline: 1px solid var(--color-primary-400);\n    }\n\n    &[aria-selected='true'] {\n      color: var(--color-primary-400);\n    }\n\n    slot[name='presets']::slotted(*) {\n      display: none;\n    }\n  }\n`;\n\nexport const button = css`\n  button {\n    appearance: none;\n    padding: 0;\n    border-width: 0;\n    background-color: transparent;\n    border-radius: var(--space-scale-1);\n    padding-block: 0;\n    padding-inline: 0;\n    line-height: var(--space-scale-3);\n    font-size: var(--font-size-200);\n    text-wrap: nowrap;\n    outline-offset: var(--space-scale-0-5);\n\n    &:hover {\n      box-shadow: none;\n      color: var(--color-primary-400);\n    }\n\n    &:focus {\n      outline: 1px solid var(--color-primary-400);\n    }\n\n    &[aria-selected='true'] {\n      color: var(--color-primary-400);\n      font-weight: var(--font-weight-semibold);\n    }\n\n    slot[name='presets']::slotted(*) {\n      display: none;\n    }\n  }\n`;\n"]}

package/dist/cjs/src/SidePanel/tt-side-panel.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Preset = exports.PresetButton = exports.SidePanel = void 0;
+const SidePanel_js_1 = require("./SidePanel.js");
+Object.defineProperty(exports, "SidePanel", { enumerable: true, get: function () { return SidePanel_js_1.SidePanel; } });
+const PresetButton_js_1 = require("./PresetButton.js");
+Object.defineProperty(exports, "Preset", { enumerable: true, get: function () { return PresetButton_js_1.Preset; } });
+Object.defineProperty(exports, "PresetButton", { enumerable: true, get: function () { return PresetButton_js_1.PresetButton; } });
+if (typeof window !== 'undefined') {
+    if (!window.customElements.get('tt-side-panel')) {
+        window.customElements.define('tt-side-panel', SidePanel_js_1.SidePanel);
+    }
+    if (!window.customElements.get('tt-preset-button')) {
+        window.customElements.define('tt-preset-button', PresetButton_js_1.PresetButton);
+    }
+}
+//# sourceMappingURL=tt-side-panel.js.map

package/dist/cjs/src/SidePanel/tt-side-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tt-side-panel.js","sourceRoot":"","sources":["../../../../src/SidePanel/tt-side-panel.ts"],"names":[],"mappings":";;;AAAA,iDAA2C;AAalC,0FAbA,wBAAS,OAaA;AAZlB,uDAAyD;AAYvB,uFAZzB,wBAAM,OAYyB;AAApB,6FAZH,8BAAY,OAYG;AAVhC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;IAClC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,eAAe,CAAC,EAAE,CAAC;QAChD,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,eAAe,EAAE,wBAAS,CAAC,CAAC;IAC3D,CAAC;IAED,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,kBAAkB,CAAC,EAAE,CAAC;QACnD,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,kBAAkB,EAAE,8BAAY,CAAC,CAAC;IACjE,CAAC;AACH,CAAC","sourcesContent":["import { SidePanel } from './SidePanel.js';\nimport { Preset, PresetButton } from './PresetButton.js';\n\nif (typeof window !== 'undefined') {\n  if (!window.customElements.get('tt-side-panel')) {\n    window.customElements.define('tt-side-panel', SidePanel);\n  }\n\n  if (!window.customElements.get('tt-preset-button')) {\n    window.customElements.define('tt-preset-button', PresetButton);\n  }\n}\n\nexport { SidePanel, PresetButton, Preset };\n"]}