revotech-ui-kit 0.0.0 → 0.0.1

package/dist/src/components/atoms/command-empty/command-empty.atom.js

@@ -0,0 +1,53 @@
+var CommandEmpty_1;
+import { __decorate } from "tslib";
+import { LitElement, html, css, nothing } from 'lit';
+import { property, customElement } from 'lit/decorators.js';
+import { cn } from '../../../helpers';
+import { TWStyles } from '../../../styles';
+let CommandEmpty = CommandEmpty_1 = class CommandEmpty extends LitElement {
+    constructor() {
+        super(...arguments);
+        this._id = '';
+        this._hidden = 'true';
+    }
+    get identifier() {
+        if (this._id !== '') {
+            return this._id;
+        }
+        const parent = this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');
+        if (parent) {
+            this._id = `${parent.getAttribute('id')}e${CommandEmpty_1._counter++}`;
+        }
+        else {
+            this._id = `rtgcmdrxlxe${CommandEmpty_1._counter++}`;
+        }
+        return this._id;
+    }
+    render() {
+        return html `${this._hidden === 'true'
+            ? nothing
+            : html `
+          <div
+            class="${cn('py-6 text-center text-sm', this.className)}"
+            rtgcmd-empty
+            role="presentation"
+            id="${this.identifier}"
+          >
+            <slot></slot>
+          </div>
+        `}`;
+    }
+};
+CommandEmpty._counter = 0;
+CommandEmpty.styles = [css ``, TWStyles];
+__decorate([
+    property({ type: String })
+], CommandEmpty.prototype, "_id", void 0);
+__decorate([
+    property({ attribute: 'aria-hidden', type: String })
+], CommandEmpty.prototype, "_hidden", void 0);
+CommandEmpty = CommandEmpty_1 = __decorate([
+    customElement('rtg-command-empty')
+], CommandEmpty);
+export { CommandEmpty };
+//# sourceMappingURL=command-empty.atom.js.map

package/dist/src/components/atoms/command-empty/command-empty.atom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-empty.atom.js","sourceRoot":"","sources":["../../../../../src/components/atoms/command-empty/command-empty.atom.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGpC,IAAM,YAAY,oBAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QACuB,QAAG,GAAG,EAAE,CAAC;QAEiB,YAAO,GAAG,MAAM,CAAC;IAkCzE,CAAC;IA5BC,IAAY,UAAU;QACpB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC,GAAG,CAAC;QAClB,CAAC;QACD,MAAM,MAAM,GACV,IAAI,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACpE,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,cAAY,CAAC,QAAQ,EAAE,EAAE,CAAC;QACvE,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,GAAG,GAAG,cAAc,cAAY,CAAC,QAAQ,EAAE,EAAE,CAAC;QACrD,CAAC;QACD,OAAO,IAAI,CAAC,GAAG,CAAC;IAClB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,OAAO,KAAK,MAAM;YACnC,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CAAA;;qBAES,EAAE,CAAC,0BAA0B,EAAE,IAAI,CAAC,SAAS,CAAC;;;kBAGjD,IAAI,CAAC,UAAU;;;;SAIxB,EAAE,CAAC;IACV,CAAC;;AA/Bc,qBAAQ,GAAG,CAAC,AAAJ,CAAK;AAErB,mBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AANN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCAAU;AAEiB;IAArD,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAkB;AAH5D,YAAY;IADxB,aAAa,CAAC,mBAAmB,CAAC;GACtB,YAAY,CAqCxB","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-command-empty')\nexport class CommandEmpty extends LitElement {\n  @property({ type: String }) _id = '';\n\n  @property({ attribute: 'aria-hidden', type: String }) _hidden = 'true';\n\n  private static _counter = 0;\n\n  static styles = [css``, TWStyles];\n\n  private get identifier() {\n    if (this._id !== '') {\n      return this._id;\n    }\n    const parent =\n      this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');\n    if (parent) {\n      this._id = `${parent.getAttribute('id')}e${CommandEmpty._counter++}`;\n    } else {\n      this._id = `rtgcmdrxlxe${CommandEmpty._counter++}`;\n    }\n    return this._id;\n  }\n\n  render() {\n    return html`${this._hidden === 'true'\n      ? nothing\n      : html`\n          <div\n            class=\"${cn('py-6 text-center text-sm', this.className)}\"\n            rtgcmd-empty\n            role=\"presentation\"\n            id=\"${this.identifier}\"\n          >\n            <slot></slot>\n          </div>\n        `}`;\n  }\n}\n"]}

package/dist/src/components/atoms/command-group/command-group.atom.d.ts

@@ -0,0 +1,10 @@
+import { LitElement } from 'lit';
+export declare class CommandGroup extends LitElement {
+    heading: string;
+    _id: string;
+    _hidden: string;
+    private static _counter;
+    static styles: import("lit").CSSResult[];
+    private get identifier();
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/components/atoms/command-group/command-group.atom.js

@@ -0,0 +1,70 @@
+var CommandGroup_1;
+import { __decorate } from "tslib";
+import { LitElement, html, css, nothing } from 'lit';
+import { property, customElement } from 'lit/decorators.js';
+import { TWStyles } from '../../../styles';
+let CommandGroup = CommandGroup_1 = class CommandGroup extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.heading = '';
+        this._id = '';
+        this._hidden = '';
+    }
+    get identifier() {
+        if (this._id !== '') {
+            return this._id;
+        }
+        const parent = this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');
+        if (parent) {
+            this._id = `${parent.getAttribute('id')}g${CommandGroup_1._counter++}`;
+        }
+        else {
+            this._id = `rtgcmdrxlxg${CommandGroup_1._counter++}`;
+        }
+        return this._id;
+    }
+    render() {
+        const className = 'overflow-hidden p-1 text-foreground [&_[rtgcmd-group-heading]]:px-2 [&_[rtgcmd-group-heading]]:py-1.5 [&_[rtgcmd-group-heading]]:text-xs [&_[rtgcmd-group-heading]]:font-medium [&_[rtgcmd-group-heading]]:text-muted-foreground';
+        return html `${this._hidden === 'true'
+            ? nothing
+            : html `
+          <div
+            class="${className}"
+            rtgcmd-group
+            role="presentation"
+            id="${this.identifier}"
+          >
+            <div
+              rtgcmd-group-heading
+              aria-hidden="true"
+              id="${this.identifier}h"
+            >
+              ${this.heading}
+            </div>
+            <div
+              rtgcmd-group-items
+              role="group"
+              aria-labelledby="${this.identifier}h"
+            >
+              <slot></slot>
+            </div>
+          </div>
+        `}`;
+    }
+};
+CommandGroup._counter = 0;
+CommandGroup.styles = [css ``, TWStyles];
+__decorate([
+    property({ type: String })
+], CommandGroup.prototype, "heading", void 0);
+__decorate([
+    property({ attribute: 'id', type: String })
+], CommandGroup.prototype, "_id", void 0);
+__decorate([
+    property({ attribute: 'aria-hidden', type: String })
+], CommandGroup.prototype, "_hidden", void 0);
+CommandGroup = CommandGroup_1 = __decorate([
+    customElement('rtg-command-group')
+], CommandGroup);
+export { CommandGroup };
+//# sourceMappingURL=command-group.atom.js.map

package/dist/src/components/atoms/command-group/command-group.atom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-group.atom.js","sourceRoot":"","sources":["../../../../../src/components/atoms/command-group/command-group.atom.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGpC,IAAM,YAAY,oBAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QACuB,YAAO,GAAG,EAAE,CAAC;QAEI,QAAG,GAAG,EAAE,CAAC;QAEA,YAAO,GAAG,EAAE,CAAC;IAiDrE,CAAC;IA3CC,IAAY,UAAU;QACpB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC,GAAG,CAAC;QAClB,CAAC;QACD,MAAM,MAAM,GACV,IAAI,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACpE,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,cAAY,CAAC,QAAQ,EAAE,EAAE,CAAC;QACvE,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,GAAG,GAAG,cAAc,cAAY,CAAC,QAAQ,EAAE,EAAE,CAAC;QACrD,CAAC;QACD,OAAO,IAAI,CAAC,GAAG,CAAC;IAClB,CAAC;IAED,MAAM;QACJ,MAAM,SAAS,GACb,kOAAkO,CAAC;QACrO,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,OAAO,KAAK,MAAM;YACnC,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CAAA;;qBAES,SAAS;;;kBAGZ,IAAI,CAAC,UAAU;;;;;oBAKb,IAAI,CAAC,UAAU;;gBAEnB,IAAI,CAAC,OAAO;;;;;iCAKK,IAAI,CAAC,UAAU;;;;;SAKvC,EAAE,CAAC;IACV,CAAC;;AA9Cc,qBAAQ,GAAG,CAAC,AAAJ,CAAK;AAErB,mBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AARN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAc;AAEI;IAA5C,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCAAU;AAEA;IAArD,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAc;AALxD,YAAY;IADxB,aAAa,CAAC,mBAAmB,CAAC;GACtB,YAAY,CAsDxB","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-command-group')\nexport class CommandGroup extends LitElement {\n  @property({ type: String }) heading = '';\n\n  @property({ attribute: 'id', type: String }) _id = '';\n\n  @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n  private static _counter = 0;\n\n  static styles = [css``, TWStyles];\n\n  private get identifier() {\n    if (this._id !== '') {\n      return this._id;\n    }\n    const parent =\n      this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');\n    if (parent) {\n      this._id = `${parent.getAttribute('id')}g${CommandGroup._counter++}`;\n    } else {\n      this._id = `rtgcmdrxlxg${CommandGroup._counter++}`;\n    }\n    return this._id;\n  }\n\n  render() {\n    const className =\n      'overflow-hidden p-1 text-foreground [&_[rtgcmd-group-heading]]:px-2 [&_[rtgcmd-group-heading]]:py-1.5 [&_[rtgcmd-group-heading]]:text-xs [&_[rtgcmd-group-heading]]:font-medium [&_[rtgcmd-group-heading]]:text-muted-foreground';\n    return html`${this._hidden === 'true'\n      ? nothing\n      : html`\n          <div\n            class=\"${className}\"\n            rtgcmd-group\n            role=\"presentation\"\n            id=\"${this.identifier}\"\n          >\n            <div\n              rtgcmd-group-heading\n              aria-hidden=\"true\"\n              id=\"${this.identifier}h\"\n            >\n              ${this.heading}\n            </div>\n            <div\n              rtgcmd-group-items\n              role=\"group\"\n              aria-labelledby=\"${this.identifier}h\"\n            >\n              <slot></slot>\n            </div>\n          </div>\n        `}`;\n  }\n}\n"]}

package/dist/src/components/atoms/command-item/command-item.atom.d.ts

@@ -0,0 +1,12 @@
+import { LitElement } from 'lit';
+export declare class CommandItem extends LitElement {
+    _id: string;
+    _hidden: string;
+    private static _counter;
+    static styles: import("lit").CSSResult[];
+    private get identifier();
+    get value(): string;
+    selected: boolean;
+    private handleMouseEvent;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/components/atoms/command-item/command-item.atom.js

@@ -0,0 +1,78 @@
+var CommandItem_1;
+import { __decorate } from "tslib";
+import { LitElement, html, css, nothing } from 'lit';
+import { property, customElement, } from 'lit/decorators.js';
+import { cn } from '../../../helpers';
+import { TWStyles } from '../../../styles';
+let CommandItem = CommandItem_1 = class CommandItem extends LitElement {
+    constructor() {
+        super(...arguments);
+        this._id = '';
+        this._hidden = '';
+        this.selected = false;
+    }
+    get identifier() {
+        if (this._id !== '') {
+            return this._id;
+        }
+        const parent = this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-group]');
+        if (parent) {
+            this._id = `${parent.getAttribute('id')}li${CommandItem_1._counter++}`;
+        }
+        else {
+            this._id = `rtgcmdrxgxli${CommandItem_1._counter++}`;
+        }
+        return this._id;
+    }
+    get value() {
+        return this.textContent?.trim() || '';
+    }
+    handleMouseEvent(e) {
+        if (e.type === 'mouseover' || e.type === 'focus') {
+            this.selected = true;
+        }
+        if (e.type === 'mouseleave') {
+            this.selected = false;
+        }
+    }
+    render() {
+        return html ` ${this._hidden === 'true'
+            ? nothing
+            : html `
+          <div
+            class="${cn('relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', this.className)}"
+            @mouseover="${this.handleMouseEvent}"
+            @mouseleave="${this.handleMouseEvent}"
+            @focus="${this.handleMouseEvent}"
+            rtgcmd-item
+            role="option"
+            aria-selected="${this.selected}"
+            data-selected="${this.selected}"
+            data-value="${this.value}"
+            id="${this.identifier}"
+            aria-hidden="${this.hidden}"
+          >
+            <slot></slot>
+          </div>
+        `}`;
+    }
+};
+CommandItem._counter = 0;
+CommandItem.styles = [css ``, TWStyles];
+__decorate([
+    property({ type: String })
+], CommandItem.prototype, "_id", void 0);
+__decorate([
+    property({ attribute: 'aria-hidden', type: String })
+], CommandItem.prototype, "_hidden", void 0);
+__decorate([
+    property({ attribute: 'data-value', type: String })
+], CommandItem.prototype, "value", null);
+__decorate([
+    property({ type: Boolean })
+], CommandItem.prototype, "selected", void 0);
+CommandItem = CommandItem_1 = __decorate([
+    customElement('rtg-command-item')
+], CommandItem);
+export { CommandItem };
+//# sourceMappingURL=command-item.atom.js.map

package/dist/src/components/atoms/command-item/command-item.atom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-item.atom.js","sourceRoot":"","sources":["../../../../../src/components/atoms/command-item/command-item.atom.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EACL,QAAQ,EACR,aAAa,GAEd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGpC,IAAM,WAAW,mBAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QACuB,QAAG,GAAG,EAAE,CAAC;QAEiB,YAAO,GAAG,EAAE,CAAC;QAyBtC,aAAQ,GAAG,KAAK,CAAC;IAmChD,CAAC;IAtDC,IAAY,UAAU;QACpB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC,GAAG,CAAC;QAClB,CAAC;QACD,MAAM,MAAM,GACV,IAAI,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,mBAAmB,CAAC,CAAC;QACrE,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,aAAW,CAAC,QAAQ,EAAE,EAAE,CAAC;QACvE,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,GAAG,GAAG,eAAe,aAAW,CAAC,QAAQ,EAAE,EAAE,CAAC;QACrD,CAAC;QACD,OAAO,IAAI,CAAC,GAAG,CAAC;IAClB,CAAC;IAGD,IAAW,KAAK;QACd,OAAO,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;IACxC,CAAC;IAIO,gBAAgB,CAAC,CAAQ;QAC/B,IAAI,CAAC,CAAC,IAAI,KAAK,WAAW,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YACjD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACvB,CAAC;QACD,IAAI,CAAC,CAAC,IAAI,KAAK,YAAY,EAAE,CAAC;YAC5B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QACxB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,IAAI,IAAI,CAAC,OAAO,KAAK,MAAM;YACpC,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CAAA;;qBAES,EAAE,CACT,+NAA+N,EAC/N,IAAI,CAAC,SAAS,CACf;0BACa,IAAI,CAAC,gBAAgB;2BACpB,IAAI,CAAC,gBAAgB;sBAC1B,IAAI,CAAC,gBAAgB;;;6BAGd,IAAI,CAAC,QAAQ;6BACb,IAAI,CAAC,QAAQ;0BAChB,IAAI,CAAC,KAAK;kBAClB,IAAI,CAAC,UAAU;2BACN,IAAI,CAAC,MAAM;;;;SAI7B,EAAE,CAAC;IACV,CAAC;;AAzDc,oBAAQ,GAAG,CAAC,AAAJ,CAAK;AAErB,kBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AANN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAU;AAEiB;IAArD,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAc;AAqBnE;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAGnD;AAE4B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAkB;AA5BnC,WAAW;IADvB,aAAa,CAAC,kBAAkB,CAAC;GACrB,WAAW,CA+DvB","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport {\n  property,\n  customElement,\n  queryAssignedElements,\n} from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-command-item')\nexport class CommandItem extends LitElement {\n  @property({ type: String }) _id = '';\n\n  @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n  private static _counter = 0;\n\n  static styles = [css``, TWStyles];\n\n  private get identifier() {\n    if (this._id !== '') {\n      return this._id;\n    }\n    const parent =\n      this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-group]');\n    if (parent) {\n      this._id = `${parent.getAttribute('id')}li${CommandItem._counter++}`;\n    } else {\n      this._id = `rtgcmdrxgxli${CommandItem._counter++}`;\n    }\n    return this._id;\n  }\n\n  @property({ attribute: 'data-value', type: String })\n  public get value() {\n    return this.textContent?.trim() || '';\n  }\n\n  @property({ type: Boolean }) selected = false;\n\n  private handleMouseEvent(e: Event) {\n    if (e.type === 'mouseover' || e.type === 'focus') {\n      this.selected = true;\n    }\n    if (e.type === 'mouseleave') {\n      this.selected = false;\n    }\n  }\n\n  render() {\n    return html` ${this._hidden === 'true'\n      ? nothing\n      : html`\n          <div\n            class=\"${cn(\n              'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',\n              this.className\n            )}\"\n            @mouseover=\"${this.handleMouseEvent}\"\n            @mouseleave=\"${this.handleMouseEvent}\"\n            @focus=\"${this.handleMouseEvent}\"\n            rtgcmd-item\n            role=\"option\"\n            aria-selected=\"${this.selected}\"\n            data-selected=\"${this.selected}\"\n            data-value=\"${this.value}\"\n            id=\"${this.identifier}\"\n            aria-hidden=\"${this.hidden}\"\n          >\n            <slot></slot>\n          </div>\n        `}`;\n  }\n}\n"]}

package/dist/src/components/atoms/command-list/command-list.atom.d.ts

@@ -0,0 +1,6 @@
+import { LitElement } from 'lit';
+export declare class CommandList extends LitElement {
+    static styles: import("lit").CSSResult[];
+    private get identifier();
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/components/atoms/command-list/command-list.atom.js

@@ -0,0 +1,35 @@
+import { __decorate } from "tslib";
+import { LitElement, html, css } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { cn } from '../../../helpers';
+import { TWStyles } from '../../../styles';
+let CommandList = class CommandList extends LitElement {
+    get identifier() {
+        const parent = this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-root]');
+        if (parent) {
+            return `${parent.getAttribute('id')}l`;
+        }
+        return `rtgcmdrxl`;
+    }
+    render() {
+        return html `
+      <div
+        class="${cn('max-h-[300px] overflow-y-auto overflow-x-hidden', this.className)}"
+        role="listbox"
+        id="${this.identifier}"
+        style="--rtgcmd-list-height: 265.0px;"
+        rtgcmd-list
+      >
+        <div>
+          <slot></slot>
+        </div>
+      </div>
+    `;
+    }
+};
+CommandList.styles = [css ``, TWStyles];
+CommandList = __decorate([
+    customElement('rtg-command-list')
+], CommandList);
+export { CommandList };
+//# sourceMappingURL=command-list.atom.js.map

package/dist/src/components/atoms/command-list/command-list.atom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-list.atom.js","sourceRoot":"","sources":["../../../../../src/components/atoms/command-list/command-list.atom.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGpC,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAGzC,IAAY,UAAU;QACpB,MAAM,MAAM,GACV,IAAI,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACpE,IAAI,MAAM,EAAE,CAAC;YACX,OAAO,GAAG,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC;QACzC,CAAC;QACD,OAAO,WAAW,CAAC;IACrB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;iBAEE,EAAE,CACT,iDAAiD,EACjD,IAAI,CAAC,SAAS,CACf;;cAEK,IAAI,CAAC,UAAU;;;;;;;;KAQxB,CAAC;IACJ,CAAC;;AA5BM,kBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AADvB,WAAW;IADvB,aAAa,CAAC,kBAAkB,CAAC;GACrB,WAAW,CA8BvB","sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-command-list')\nexport class CommandList extends LitElement {\n  static styles = [css``, TWStyles];\n\n  private get identifier() {\n    const parent =\n      this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-root]');\n    if (parent) {\n      return `${parent.getAttribute('id')}l`;\n    }\n    return `rtgcmdrxl`;\n  }\n\n  render() {\n    return html`\n      <div\n        class=\"${cn(\n          'max-h-[300px] overflow-y-auto overflow-x-hidden',\n          this.className\n        )}\"\n        role=\"listbox\"\n        id=\"${this.identifier}\"\n        style=\"--rtgcmd-list-height: 265.0px;\"\n        rtgcmd-list\n      >\n        <div>\n          <slot></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/src/components/atoms/command-separator/command-separator.atom.d.ts

@@ -0,0 +1,9 @@
+import { LitElement } from 'lit';
+export declare class CommandSeparator extends LitElement {
+    _id: string;
+    _hidden: string;
+    private static _counter;
+    static styles: import("lit").CSSResult[];
+    private get identifier();
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/components/atoms/command-separator/command-separator.atom.js

@@ -0,0 +1,51 @@
+var CommandSeparator_1;
+import { __decorate } from "tslib";
+import { LitElement, html, css, nothing } from 'lit';
+import { property, customElement } from 'lit/decorators.js';
+import { cn } from '../../../helpers';
+import { TWStyles } from '../../../styles';
+let CommandSeparator = CommandSeparator_1 = class CommandSeparator extends LitElement {
+    constructor() {
+        super(...arguments);
+        this._id = '';
+        this._hidden = '';
+    }
+    get identifier() {
+        if (this._id !== '') {
+            return this._id;
+        }
+        const parent = this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');
+        if (parent) {
+            this._id = `${parent.getAttribute('id')}s${CommandSeparator_1._counter++}`;
+        }
+        else {
+            this._id = `rtgcmdrxlxs${CommandSeparator_1._counter++}`;
+        }
+        return this._id;
+    }
+    render() {
+        return html `${this._hidden === 'true'
+            ? nothing
+            : html `
+          <div
+            class="${cn('-mx-1 h-px bg-border', this.className)}"
+            rtgcmd-separator
+            role="separator"
+            id="${this.identifier}"
+          ></div>
+        `}`;
+    }
+};
+CommandSeparator._counter = 0;
+CommandSeparator.styles = [css ``, TWStyles];
+__decorate([
+    property({ type: String })
+], CommandSeparator.prototype, "_id", void 0);
+__decorate([
+    property({ attribute: 'aria-hidden', type: String })
+], CommandSeparator.prototype, "_hidden", void 0);
+CommandSeparator = CommandSeparator_1 = __decorate([
+    customElement('rtg-command-separator')
+], CommandSeparator);
+export { CommandSeparator };
+//# sourceMappingURL=command-separator.atom.js.map

package/dist/src/components/atoms/command-separator/command-separator.atom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-separator.atom.js","sourceRoot":"","sources":["../../../../../src/components/atoms/command-separator/command-separator.atom.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAGpC,IAAM,gBAAgB,wBAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAAzC;;QACuB,QAAG,GAAG,EAAE,CAAC;QAEiB,YAAO,GAAG,EAAE,CAAC;IAgCrE,CAAC;IA1BC,IAAY,UAAU;QACpB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,OAAO,IAAI,CAAC,GAAG,CAAC;QAClB,CAAC;QACD,MAAM,MAAM,GACV,IAAI,CAAC,aAAa,EAAE,UAAU,EAAE,aAAa,CAAC,kBAAkB,CAAC,CAAC;QACpE,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,kBAAgB,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC3E,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,GAAG,GAAG,cAAc,kBAAgB,CAAC,QAAQ,EAAE,EAAE,CAAC;QACzD,CAAC;QACD,OAAO,IAAI,CAAC,GAAG,CAAC;IAClB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,OAAO,KAAK,MAAM;YACnC,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CAAA;;qBAES,EAAE,CAAC,sBAAsB,EAAE,IAAI,CAAC,SAAS,CAAC;;;kBAG7C,IAAI,CAAC,UAAU;;SAExB,EAAE,CAAC;IACV,CAAC;;AA7Bc,yBAAQ,GAAG,CAAC,AAAJ,CAAK;AAErB,uBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AANN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAU;AAEiB;IAArD,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDAAc;AAHxD,gBAAgB;IAD5B,aAAa,CAAC,uBAAuB,CAAC;GAC1B,gBAAgB,CAmC5B","sourcesContent":["import { LitElement, html, css, nothing } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\n\n@customElement('rtg-command-separator')\nexport class CommandSeparator extends LitElement {\n  @property({ type: String }) _id = '';\n\n  @property({ attribute: 'aria-hidden', type: String }) _hidden = '';\n\n  private static _counter = 0;\n\n  static styles = [css``, TWStyles];\n\n  private get identifier() {\n    if (this._id !== '') {\n      return this._id;\n    }\n    const parent =\n      this.parentElement?.shadowRoot?.querySelector('div[rtgcmd-list]');\n    if (parent) {\n      this._id = `${parent.getAttribute('id')}s${CommandSeparator._counter++}`;\n    } else {\n      this._id = `rtgcmdrxlxs${CommandSeparator._counter++}`;\n    }\n    return this._id;\n  }\n\n  render() {\n    return html`${this._hidden === 'true'\n      ? nothing\n      : html`\n          <div\n            class=\"${cn('-mx-1 h-px bg-border', this.className)}\"\n            rtgcmd-separator\n            role=\"separator\"\n            id=\"${this.identifier}\"\n          ></div>\n        `}`;\n  }\n}\n"]}

package/dist/src/components/atoms/dialog/dialog-close.d.ts

@@ -0,0 +1,7 @@
+import { LitElement, PropertyValueMap } from 'lit';
+export declare class DialogClose extends LitElement {
+    static styles: import("lit").CSSResult[];
+    private get _dialog();
+    protected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/components/atoms/dialog/dialog-close.js

@@ -0,0 +1,46 @@
+import { __decorate } from "tslib";
+import { TWStyles } from '../../../styles';
+import { css, html, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { Dialog } from './dialog.atom';
+const STATE_OPEN = 'open';
+const STATE_CLOSED = 'closed';
+let DialogClose = class DialogClose extends LitElement {
+    get _dialog() {
+        let parent = this.parentElement;
+        while (parent) {
+            if (parent instanceof Dialog) {
+                return parent;
+            }
+            parent = parent.parentElement;
+        }
+        return parent;
+    }
+    firstUpdated(_changedProperties) {
+        super.firstUpdated(_changedProperties);
+        const slot = this.shadowRoot?.querySelector('slot');
+        const children = slot?.assignedElements();
+        if (children && children.length > 0) {
+            const button = children[0];
+            button.addEventListener('click', () => {
+                const dialog = this._dialog;
+                if (dialog) {
+                    dialog.dataset.state = STATE_CLOSED;
+                }
+            });
+        }
+    }
+    render() {
+        return html `
+      <div>
+        <slot></slot>
+      </div>
+    `;
+    }
+};
+DialogClose.styles = [css ``, TWStyles];
+DialogClose = __decorate([
+    customElement('rtg-dialog-close')
+], DialogClose);
+export { DialogClose };
+//# sourceMappingURL=dialog-close.js.map

package/dist/src/components/atoms/dialog/dialog-close.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-close.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-close.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAoB,MAAM,KAAK,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAEvC,MAAM,UAAU,GAAG,MAAM,CAAC;AAC1B,MAAM,YAAY,GAAG,QAAQ,CAAC;AAGvB,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAGzC,IAAY,OAAO;QACjB,IAAI,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC;QAEhC,OAAO,MAAM,EAAE,CAAC;YACd,IAAI,MAAM,YAAY,MAAM,EAAE,CAAC;gBAC7B,OAAO,MAAM,CAAC;YAChB,CAAC;YACD,MAAM,GAAG,MAAM,CAAC,aAAa,CAAC;QAChC,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IAES,YAAY,CACpB,kBAAqE;QAErE,KAAK,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC;QACvC,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;QACpD,MAAM,QAAQ,GAAG,IAAI,EAAE,gBAAgB,EAAE,CAAC;QAC1C,IAAI,QAAQ,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACpC,MAAM,MAAM,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;YAE3B,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;gBACpC,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC;gBAC5B,IAAI,MAAM,EAAE,CAAC;oBACX,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,YAAY,CAAC;gBACtC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;;AAtCM,kBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AADvB,WAAW;IADvB,aAAa,CAAC,kBAAkB,CAAC;GACrB,WAAW,CAwCvB","sourcesContent":["import { TWStyles } from '../../../styles';\nimport { css, html, LitElement, PropertyValueMap } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { Dialog } from './dialog.atom';\n\nconst STATE_OPEN = 'open';\nconst STATE_CLOSED = 'closed';\n\n@customElement('rtg-dialog-close')\nexport class DialogClose extends LitElement {\n  static styles = [css``, TWStyles];\n\n  private get _dialog(): Dialog | null {\n    let parent = this.parentElement;\n\n    while (parent) {\n      if (parent instanceof Dialog) {\n        return parent;\n      }\n      parent = parent.parentElement;\n    }\n    return parent;\n  }\n\n  protected firstUpdated(\n    _changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>\n  ): void {\n    super.firstUpdated(_changedProperties);\n    const slot = this.shadowRoot?.querySelector('slot');\n    const children = slot?.assignedElements();\n    if (children && children.length > 0) {\n      const button = children[0];\n\n      button.addEventListener('click', () => {\n        const dialog = this._dialog;\n        if (dialog) {\n          dialog.dataset.state = STATE_CLOSED;\n        }\n      });\n    }\n  }\n\n  render() {\n    return html`\n      <div>\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/src/components/atoms/dialog/dialog-content.d.ts

@@ -0,0 +1,8 @@
+import { LitElement } from 'lit';
+export declare class DialogContent extends LitElement {
+    static styles: import("lit").CSSResult[];
+    state: string;
+    private get _dialog();
+    private handleCloseButtonClick;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/components/atoms/dialog/dialog-content.js

@@ -0,0 +1,72 @@
+import { __decorate } from "tslib";
+import { TWStyles } from '../../../styles';
+import { cn } from '../../../helpers';
+import { css, html, LitElement, nothing } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { Dialog } from './dialog.atom';
+const STATE_OPEN = 'open';
+const STATE_CLOSED = 'closed';
+let DialogContent = class DialogContent extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.state = STATE_CLOSED;
+        this.handleCloseButtonClick = () => {
+            const dialog = this._dialog;
+            if (dialog) {
+                dialog.dataset.state = STATE_CLOSED;
+            }
+        };
+    }
+    get _dialog() {
+        let parent = this.parentElement;
+        while (parent) {
+            if (parent instanceof Dialog) {
+                return parent;
+            }
+            parent = parent.parentElement;
+        }
+        return parent;
+    }
+    render() {
+        return html `${this.state === STATE_OPEN
+            ? html `
+          <div
+            class="${cn('fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg', this.className)}"
+            rtgdlg-content
+          >
+            <slot></slot>
+            <button
+              type="button"
+              @click="${this.handleCloseButtonClick}"
+              class="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground"
+            >
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                class="h-4 w-4"
+              >
+                <path d="M18 6 6 18"></path>
+                <path d="m6 6 12 12"></path></svg
+              ><span class="sr-only">Close</span>
+            </button>
+          </div>
+        `
+            : nothing}`;
+    }
+};
+DialogContent.styles = [css ``, TWStyles];
+__decorate([
+    property({ attribute: 'data-state', type: String })
+], DialogContent.prototype, "state", void 0);
+DialogContent = __decorate([
+    customElement('rtg-dialog-content')
+], DialogContent);
+export { DialogContent };
+//# sourceMappingURL=dialog-content.js.map

package/dist/src/components/atoms/dialog/dialog-content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-content.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-content.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAEvC,MAAM,UAAU,GAAG,MAAM,CAAC;AAC1B,MAAM,YAAY,GAAG,QAAQ,CAAC;AAGvB,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAAtC;;QAGgD,UAAK,GAAG,YAAY,CAAC;QAclE,2BAAsB,GAAG,GAAG,EAAE;YACpC,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC;YAC5B,IAAI,MAAM,EAAE,CAAC;gBACX,MAAM,CAAC,OAAO,CAAC,KAAK,GAAG,YAAY,CAAC;YACtC,CAAC;QACH,CAAC,CAAC;IAsCJ,CAAC;IAvDC,IAAY,OAAO;QACjB,IAAI,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC;QAEhC,OAAO,MAAM,EAAE,CAAC;YACd,IAAI,MAAM,YAAY,MAAM,EAAE,CAAC;gBAC7B,OAAO,MAAM,CAAC;YAChB,CAAC;YACD,MAAM,GAAG,MAAM,CAAC,aAAa,CAAC;QAChC,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IASD,MAAM;QACJ,OAAO,IAAI,CAAA,GAAG,IAAI,CAAC,KAAK,KAAK,UAAU;YACrC,CAAC,CAAC,IAAI,CAAA;;qBAES,EAAE,CACT,6fAA6f,EAC7f,IAAI,CAAC,SAAS,CACf;;;;;;wBAMW,IAAI,CAAC,sBAAsB;;;;;;;;;;;;;;;;;;;;SAoB1C;YACH,CAAC,CAAC,OAAO,EAAE,CAAC;IAChB,CAAC;;AA1DM,oBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AAEmB;IAApD,QAAQ,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAsB;AAH/D,aAAa;IADzB,aAAa,CAAC,oBAAoB,CAAC;GACvB,aAAa,CA4DzB","sourcesContent":["import { TWStyles } from '../../../styles';\nimport { cn } from '../../../helpers';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { Dialog } from './dialog.atom';\n\nconst STATE_OPEN = 'open';\nconst STATE_CLOSED = 'closed';\n\n@customElement('rtg-dialog-content')\nexport class DialogContent extends LitElement {\n  static styles = [css``, TWStyles];\n\n  @property({ attribute: 'data-state', type: String }) state = STATE_CLOSED;\n\n  private get _dialog(): Dialog | null {\n    let parent = this.parentElement;\n\n    while (parent) {\n      if (parent instanceof Dialog) {\n        return parent;\n      }\n      parent = parent.parentElement;\n    }\n    return parent;\n  }\n\n  private handleCloseButtonClick = () => {\n    const dialog = this._dialog;\n    if (dialog) {\n      dialog.dataset.state = STATE_CLOSED;\n    }\n  };\n\n  render() {\n    return html`${this.state === STATE_OPEN\n      ? html`\n          <div\n            class=\"${cn(\n              'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',\n              this.className\n            )}\"\n            rtgdlg-content\n          >\n            <slot></slot>\n            <button\n              type=\"button\"\n              @click=\"${this.handleCloseButtonClick}\"\n              class=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground\"\n            >\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                width=\"24\"\n                height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                class=\"h-4 w-4\"\n              >\n                <path d=\"M18 6 6 18\"></path>\n                <path d=\"m6 6 12 12\"></path></svg\n              ><span class=\"sr-only\">Close</span>\n            </button>\n          </div>\n        `\n      : nothing}`;\n  }\n}\n"]}

package/dist/src/components/atoms/dialog/dialog-footer.d.ts

@@ -0,0 +1,5 @@
+import { LitElement } from 'lit';
+export declare class DialogFooter extends LitElement {
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/components/atoms/dialog/dialog-footer.js

@@ -0,0 +1,22 @@
+import { __decorate } from "tslib";
+import { cn } from '../../../helpers';
+import { TWStyles } from '../../../styles';
+import { css, html, LitElement } from 'lit';
+import { customElement } from 'lit/decorators.js';
+let DialogFooter = class DialogFooter extends LitElement {
+    render() {
+        return html `
+      <div
+        class="${cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', this.className)}"
+      >
+        <slot></slot>
+      </div>
+    `;
+    }
+};
+DialogFooter.styles = [css ``, TWStyles];
+DialogFooter = __decorate([
+    customElement('rtg-dialog-footer')
+], DialogFooter);
+export { DialogFooter };
+//# sourceMappingURL=dialog-footer.js.map

package/dist/src/components/atoms/dialog/dialog-footer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-footer.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-footer.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAG3C,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAG1C,MAAM;QACJ,OAAO,IAAI,CAAA;;iBAEE,EAAE,CACT,+DAA+D,EAC/D,IAAI,CAAC,SAAS,CACf;;;;KAIJ,CAAC;IACJ,CAAC;;AAbM,mBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AADvB,YAAY;IADxB,aAAa,CAAC,mBAAmB,CAAC;GACtB,YAAY,CAexB","sourcesContent":["import { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\nimport { css, html, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\n@customElement('rtg-dialog-footer')\nexport class DialogFooter extends LitElement {\n  static styles = [css``, TWStyles];\n\n  render() {\n    return html`\n      <div\n        class=\"${cn(\n          'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',\n          this.className\n        )}\"\n      >\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/src/components/atoms/dialog/dialog-header.d.ts

@@ -0,0 +1,7 @@
+import { LitElement } from 'lit';
+export declare class DialogHeader extends LitElement {
+    static styles: import("lit").CSSResult[];
+    _title: string;
+    description: string;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/components/atoms/dialog/dialog-header.js

@@ -0,0 +1,40 @@
+import { __decorate } from "tslib";
+import { cn } from '../../../helpers';
+import { TWStyles } from '../../../styles';
+import { css, html, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+let DialogHeader = class DialogHeader extends LitElement {
+    constructor() {
+        super(...arguments);
+        this._title = '';
+        this.description = '';
+    }
+    render() {
+        return html `
+      <div
+        class="${cn('flex flex-col space-y-1.5 text-center sm:text-left', this.className)}"
+      >
+        <h2
+          class="${cn('text-lg font-semibold leading-none tracking-tight', this.className)}"
+        >
+          ${this._title}
+        </h2>
+        <p class="${cn('text-sm text-muted-foreground', this.className)}">
+          ${this.description}
+        </p>
+      </div>
+    `;
+    }
+};
+DialogHeader.styles = [css ``, TWStyles];
+__decorate([
+    property({ attribute: 'title', type: String })
+], DialogHeader.prototype, "_title", void 0);
+__decorate([
+    property({ type: String })
+], DialogHeader.prototype, "description", void 0);
+DialogHeader = __decorate([
+    customElement('rtg-dialog-header')
+], DialogHeader);
+export { DialogHeader };
+//# sourceMappingURL=dialog-header.js.map

package/dist/src/components/atoms/dialog/dialog-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-header.js","sourceRoot":"","sources":["../../../../../src/components/atoms/dialog/dialog-header.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAGrD,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAG2C,WAAM,GAAG,EAAE,CAAC;QAEhC,gBAAW,GAAG,EAAE,CAAC;IAwB/C,CAAC;IAtBC,MAAM;QACJ,OAAO,IAAI,CAAA;;iBAEE,EAAE,CACT,oDAAoD,EACpD,IAAI,CAAC,SAAS,CACf;;;mBAGU,EAAE,CACT,mDAAmD,EACnD,IAAI,CAAC,SAAS,CACf;;YAEC,IAAI,CAAC,MAAM;;oBAEH,EAAE,CAAC,+BAA+B,EAAE,IAAI,CAAC,SAAS,CAAC;YAC3D,IAAI,CAAC,WAAW;;;KAGvB,CAAC;IACJ,CAAC;;AA3BM,mBAAM,GAAG,CAAC,GAAG,CAAA,EAAE,EAAE,QAAQ,CAAC,AAApB,CAAqB;AAEc;IAA/C,QAAQ,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAa;AAEhC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDAAkB;AALlC,YAAY;IADxB,aAAa,CAAC,mBAAmB,CAAC;GACtB,YAAY,CA6BxB","sourcesContent":["import { cn } from '../../../helpers';\nimport { TWStyles } from '../../../styles';\nimport { css, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\n@customElement('rtg-dialog-header')\nexport class DialogHeader extends LitElement {\n  static styles = [css``, TWStyles];\n\n  @property({ attribute: 'title', type: String }) _title = '';\n\n  @property({ type: String }) description = '';\n\n  render() {\n    return html`\n      <div\n        class=\"${cn(\n          'flex flex-col space-y-1.5 text-center sm:text-left',\n          this.className\n        )}\"\n      >\n        <h2\n          class=\"${cn(\n            'text-lg font-semibold leading-none tracking-tight',\n            this.className\n          )}\"\n        >\n          ${this._title}\n        </h2>\n        <p class=\"${cn('text-sm text-muted-foreground', this.className)}\">\n          ${this.description}\n        </p>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/src/components/atoms/dialog/dialog-overly.d.ts

@@ -0,0 +1,5 @@
+import { LitElement } from 'lit';
+export declare class DialogOverlay extends LitElement {
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}