@tartaguti/ui-components 0.0.0-stage → 0.2.0

package/dist/tt-tag-list.js

@@ -0,0 +1,136 @@
+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;
+};
+import { LitElement, html, css } from "lit";
+import { property, state, customElement } from "lit/decorators.js";
+import "./tt-badge.js";
+let TTTagList = class TTTagList extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.tags = [];
+        // How many to show before collapsing the rest. 0 means show all.
+        // A fixed count rather than measuring the container: predictable, and
+        // it cannot flicker or give a different answer on every resize.
+        this.max = 0;
+        // Whether the overflow indicator can be clicked to reveal the rest.
+        this.expandable = false;
+        // Purely visual, nobody outside needs it, so @state not @property.
+        this.expanded = false;
+    }
+    get visibleTags() {
+        if (this.max === 0 || this.expanded) {
+            return this.tags;
+        }
+        // slice returns a new array; it does not modify the original.
+        return this.tags.slice(0, this.max);
+    }
+    get hiddenCount() {
+        return this.tags.length - this.visibleTags.length;
+    }
+    expand() {
+        this.expanded = true;
+    }
+    static { this.styles = css `
+    /* The browser's own [hidden] rule loses to any :host display, so a
+       hidden element would still show. Important, so it always wins. */
+    :host([hidden]) {
+      display: none !important;
+    }
+
+    :host {
+      display: block;
+      font-family: var(--tt-font-sans);
+    }
+
+    .list {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      gap: var(--tt-space-1);
+    }
+
+    /*
+      A button, not a badge, because it is interactive: it has to be
+      focusable and reachable by keyboard. Styled to match a badge so it
+      does not look foreign next to them.
+    */
+    .more {
+      border: none;
+      background: transparent;
+
+      padding: 2px var(--tt-space-2);
+      border-radius: var(--tt-radius-full);
+
+      color: var(--tt-muted-foreground);
+
+      font: inherit;
+      font-size: var(--tt-text-xs);
+      font-weight: var(--tt-weight-semibold);
+      white-space: nowrap;
+
+      cursor: pointer;
+    }
+
+    .more:hover {
+      color: var(--tt-foreground);
+      background: var(--tt-accent);
+    }
+
+    .more:focus-visible {
+      outline: var(--tt-ring-width) solid var(--tt-ring);
+      outline-offset: var(--tt-ring-offset);
+    }
+
+    /* Not interactive, so it renders as plain text rather than a button. */
+    .more-static {
+      padding: 2px var(--tt-space-2);
+      color: var(--tt-muted-foreground);
+      font-size: var(--tt-text-xs);
+      font-weight: var(--tt-weight-semibold);
+      white-space: nowrap;
+    }
+  `; }
+    render() {
+        const hidden = this.hiddenCount;
+        return html `
+      <div class="list" part="list">
+        ${this.visibleTags.map((tag) => html `<tt-badge>${tag}</tt-badge>`)}
+
+        ${hidden > 0
+            ? this.expandable
+                ? html `
+                <button
+                  class="more"
+                  part="more"
+                  @click=${this.expand}
+                  aria-label=${`Show ${hidden} more`}
+                >
+                  +${hidden} more
+                </button>
+              `
+                : html `<span class="more-static" part="more">+${hidden}</span>`
+            : ""}
+      </div>
+    `;
+    }
+};
+__decorate([
+    property({ type: Array })
+], TTTagList.prototype, "tags", void 0);
+__decorate([
+    property({ type: Number })
+], TTTagList.prototype, "max", void 0);
+__decorate([
+    property({ type: Boolean })
+], TTTagList.prototype, "expandable", void 0);
+__decorate([
+    state()
+], TTTagList.prototype, "expanded", void 0);
+TTTagList = __decorate([
+    customElement("tt-tag-list")
+], TTTagList);
+export { TTTagList };
+//# sourceMappingURL=tt-tag-list.js.map

package/dist/tt-tag-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tt-tag-list.js","sourceRoot":"","sources":["../src/tt-tag-list.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,eAAe,CAAC;AAGhB,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAAlC;;QACsB,SAAI,GAAa,EAAE,CAAC;QAE/C,iEAAiE;QACjE,sEAAsE;QACtE,gEAAgE;QACpC,QAAG,GAAG,CAAC,CAAC;QAEpC,oEAAoE;QACvC,eAAU,GAAG,KAAK,CAAC;QAEhD,mEAAmE;QAClD,aAAQ,GAAG,KAAK,CAAC;IAwGpC,CAAC;IAtGC,IAAY,WAAW;QACrB,IAAI,IAAI,CAAC,GAAG,KAAK,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YACpC,OAAO,IAAI,CAAC,IAAI,CAAC;QACnB,CAAC;QAED,8DAA8D;QAC9D,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;IACtC,CAAC;IAED,IAAY,WAAW;QACrB,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC;IACpD,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACvB,CAAC;aAEM,WAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2DlB,AA3DY,CA2DX;IAEF,MAAM;QACJ,MAAM,MAAM,GAAG,IAAI,CAAC,WAAW,CAAC;QAEhC,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAA,aAAa,GAAG,aAAa,CAAC;;UAEhE,MAAM,GAAG,CAAC;YACV,CAAC,CAAC,IAAI,CAAC,UAAU;gBACf,CAAC,CAAC,IAAI,CAAA;;;;2BAIS,IAAI,CAAC,MAAM;+BACP,QAAQ,MAAM,OAAO;;qBAE/B,MAAM;;eAEZ;gBACH,CAAC,CAAC,IAAI,CAAA,0CAA0C,MAAM,SAAS;YACjE,CAAC,CAAC,EAAE;;KAET,CAAC;IACJ,CAAC;;AAlH0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;uCAAqB;AAKnB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sCAAS;AAGP;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAoB;AAG/B;IAAhB,KAAK,EAAE;2CAA0B;AAZvB,SAAS;IADrB,aAAa,CAAC,aAAa,CAAC;GAChB,SAAS,CAoHrB"}

package/dist/tt-text.d.ts

@@ -0,0 +1,52 @@
+import { LitElement } from "lit";
+export type TextAs = "p" | "span" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+export type TextSize = "auto" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+export type TextWeight = "auto" | "regular" | "medium" | "semibold" | "bold";
+export type TextTone = "default" | "muted" | "brand" | "success" | "warning" | "danger";
+export type TextAlign = "start" | "center" | "end" | "justify";
+/**
+ * A heading, a paragraph or a run of text, on the type scale.
+ *
+ * Every component styles its own text, so the library had no general
+ * one, and the apps wrote `<h2 style="font-size: ...">` by hand with a
+ * size that matched no token. This one can only take a step of the
+ * scale, a weight token and a colour token, so it follows the theme,
+ * dark mode included, and never drifts.
+ *
+ * ---------------------------------------------------------------------
+ * TWO SEPARATE QUESTIONS: WHAT IT IS, AND HOW IT LOOKS.
+ *
+ * `as` is meaning. It picks the real element in the shadow root, so an
+ * h2 is an h2 to a screen reader and in the page outline. `size` and
+ * `weight` are looks. They stay separate because the two disagree all
+ * the time: the heading of a small card is an h3 for the outline but
+ * should not be drawn at h3 size.
+ *
+ * Left on "auto", size and weight follow the tag: h1 is 3xl bold down
+ * to h6 at sm semibold, a paragraph is md regular. Setting either one
+ * overrides only that one.
+ *
+ * ---------------------------------------------------------------------
+ * THE TYPE IS SET ON THE HOST.
+ *
+ * Every rule below is a :host rule, and the element inside only
+ * inherits. So a consumer's own `font-size` or `color` on the element
+ * simply wins, because a rule from outside beats :host, the same reason
+ * tt-stack keeps its layout on the host.
+ */
+export declare class TTText extends LitElement {
+    as: TextAs;
+    size: TextSize;
+    weight: TextWeight;
+    tone: TextTone;
+    align: TextAlign;
+    maxLines: number;
+    static styles: import("lit").CSSResult;
+    render(): import("lit-html").TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "tt-text": TTText;
+    }
+}
+//# sourceMappingURL=tt-text.d.ts.map

package/dist/tt-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tt-text.d.ts","sourceRoot":"","sources":["../src/tt-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAgB,MAAM,KAAK,CAAC;AAK/C,MAAM,MAAM,MAAM,GAAG,GAAG,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAC5E,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,CAAC;AACjF,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;AAC7E,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AACxF,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;AAmB/D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,qBACa,MAAO,SAAQ,UAAU;IAKO,EAAE,EAAE,MAAM,CAAO;IAGjB,IAAI,EAAE,QAAQ,CAAU;IAExB,MAAM,EAAE,UAAU,CAAU;IAI5B,IAAI,EAAE,QAAQ,CAAa;IAE3B,KAAK,EAAE,SAAS,CAAW;IAKlB,QAAQ,SAAK;IAEjE,MAAM,CAAC,MAAM,0BA8NX;IAEF,MAAM;CAgBP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}

package/dist/tt-text.js

@@ -0,0 +1,337 @@
+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;
+};
+import { LitElement, css, nothing } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { html as staticHtml, literal } from "lit/static-html.js";
+/*
+  The tags `as` may render. `literal` makes each one a constant written
+  in this file, which is what lets the tag be dynamic without
+  unsafeStatic: nothing a consumer passes ever becomes markup. A value
+  not in the list falls back to a paragraph.
+*/
+const TAGS = {
+    p: literal `p`,
+    span: literal `span`,
+    h1: literal `h1`,
+    h2: literal `h2`,
+    h3: literal `h3`,
+    h4: literal `h4`,
+    h5: literal `h5`,
+    h6: literal `h6`,
+};
+/**
+ * A heading, a paragraph or a run of text, on the type scale.
+ *
+ * Every component styles its own text, so the library had no general
+ * one, and the apps wrote `<h2 style="font-size: ...">` by hand with a
+ * size that matched no token. This one can only take a step of the
+ * scale, a weight token and a colour token, so it follows the theme,
+ * dark mode included, and never drifts.
+ *
+ * ---------------------------------------------------------------------
+ * TWO SEPARATE QUESTIONS: WHAT IT IS, AND HOW IT LOOKS.
+ *
+ * `as` is meaning. It picks the real element in the shadow root, so an
+ * h2 is an h2 to a screen reader and in the page outline. `size` and
+ * `weight` are looks. They stay separate because the two disagree all
+ * the time: the heading of a small card is an h3 for the outline but
+ * should not be drawn at h3 size.
+ *
+ * Left on "auto", size and weight follow the tag: h1 is 3xl bold down
+ * to h6 at sm semibold, a paragraph is md regular. Setting either one
+ * overrides only that one.
+ *
+ * ---------------------------------------------------------------------
+ * THE TYPE IS SET ON THE HOST.
+ *
+ * Every rule below is a :host rule, and the element inside only
+ * inherits. So a consumer's own `font-size` or `color` on the element
+ * simply wins, because a rule from outside beats :host, the same reason
+ * tt-stack keeps its layout on the host.
+ */
+let TTText = class TTText extends LitElement {
+    constructor() {
+        super(...arguments);
+        /*
+          Reflected, all of them. Each style is a :host([attr]) rule, and a
+          selector matches an attribute, never a property.
+        */
+        this.as = "p";
+        // A step of the type scale, named like its token: "2xl" is --tt-text-2xl.
+        this.size = "auto";
+        this.weight = "auto";
+        // Colour from the theme only. "default" is the foreground, or for a
+        // span, the colour of the text around it.
+        this.tone = "default";
+        this.align = "start";
+        // Cuts the text off after this many lines, with an ellipsis. 0 shows
+        // it all. Not reflected: the number reaches the CSS as a custom
+        // property, so no attribute rule needs to see it.
+        this.maxLines = 0;
+    }
+    static { this.styles = css `
+    /*
+      The paragraph, which is also the fallback for a value it does not
+      know.
+    */
+    :host {
+      display: block;
+
+      font-family: var(--tt-font-sans);
+      font-size: var(--tt-text-md);
+      font-weight: var(--tt-weight-regular);
+      line-height: var(--tt-leading-normal);
+      letter-spacing: normal;
+      color: var(--tt-foreground);
+
+      /*
+        align is also an old HTML attribute, and Chrome turns it into a
+        text-align of its own on any element. Setting it here, from the
+        start value up, keeps that leftover rule out.
+      */
+      text-align: start;
+
+      -webkit-font-smoothing: antialiased;
+
+      /* Avoids a single word left alone on the last line. */
+      text-wrap: pretty;
+    }
+
+    /* ---- The tag's own look, used while size and weight are "auto" ----
+
+       These come BEFORE the size and weight rules on purpose. Both sets
+       have the same specificity, so source order decides, and an
+       explicit size has to beat the tag's. */
+
+    :host([as^="h"]) {
+      font-weight: var(--tt-weight-semibold);
+      line-height: var(--tt-leading-snug);
+
+      /* Balanced lines: a two-line heading splits near the middle
+         instead of leaving one word on the second line. */
+      text-wrap: balance;
+    }
+
+    /* Page-level headings take the display face, which a theme can
+       change; h4 and below are component-level and stay in the sans. */
+    :host([as="h1"]),
+    :host([as="h2"]),
+    :host([as="h3"]) {
+      font-family: var(--tt-font-display);
+    }
+
+    :host([as="h1"]) {
+      font-size: var(--tt-text-3xl);
+      font-weight: var(--tt-weight-bold);
+      line-height: var(--tt-leading-tight);
+      letter-spacing: -0.02em;
+    }
+
+    :host([as="h2"]) {
+      font-size: var(--tt-text-2xl);
+      font-weight: var(--tt-weight-bold);
+      line-height: var(--tt-leading-tight);
+      letter-spacing: -0.02em;
+    }
+
+    :host([as="h3"]) {
+      font-size: var(--tt-text-xl);
+      letter-spacing: -0.01em;
+    }
+
+    :host([as="h4"]) {
+      font-size: var(--tt-text-lg);
+    }
+
+    :host([as="h5"]) {
+      font-size: var(--tt-text-md);
+    }
+
+    :host([as="h6"]) {
+      font-size: var(--tt-text-sm);
+    }
+
+    /*
+      A span is a run inside other text, so it takes everything from the
+      text around it: "Total <tt-text as="span" weight="bold">" changes
+      the weight and nothing else.
+    */
+    :host([as="span"]) {
+      display: inline;
+
+      font: inherit;
+      letter-spacing: inherit;
+      color: inherit;
+    }
+
+    /* ---- Explicit size ----
+
+       Each step brings its own line height and tracking, because large
+       text needs less of both. Every rule sets all three, so a step
+       chosen on a heading also undoes the tag's values. */
+
+    :host([size="xs"]) {
+      font-size: var(--tt-text-xs);
+      line-height: var(--tt-leading-normal);
+      letter-spacing: normal;
+    }
+    :host([size="sm"]) {
+      font-size: var(--tt-text-sm);
+      line-height: var(--tt-leading-normal);
+      letter-spacing: normal;
+    }
+    :host([size="md"]) {
+      font-size: var(--tt-text-md);
+      line-height: var(--tt-leading-normal);
+      letter-spacing: normal;
+    }
+    :host([size="lg"]) {
+      font-size: var(--tt-text-lg);
+      line-height: var(--tt-leading-snug);
+      letter-spacing: normal;
+    }
+    :host([size="xl"]) {
+      font-size: var(--tt-text-xl);
+      line-height: var(--tt-leading-snug);
+      letter-spacing: -0.01em;
+    }
+    :host([size="2xl"]) {
+      font-size: var(--tt-text-2xl);
+      line-height: var(--tt-leading-tight);
+      letter-spacing: -0.02em;
+    }
+    :host([size="3xl"]) {
+      font-size: var(--tt-text-3xl);
+      line-height: var(--tt-leading-tight);
+      letter-spacing: -0.02em;
+    }
+
+    /* ---- Explicit weight ---- */
+
+    :host([weight="regular"]) {
+      font-weight: var(--tt-weight-regular);
+    }
+    :host([weight="medium"]) {
+      font-weight: var(--tt-weight-medium);
+    }
+    :host([weight="semibold"]) {
+      font-weight: var(--tt-weight-semibold);
+    }
+    :host([weight="bold"]) {
+      font-weight: var(--tt-weight-bold);
+    }
+
+    /* ---- Tone ----
+
+       Tokens only. Each one is checked by the theme to read at 4.5:1 on
+       the page and on a card, in both themes, so no tone here can fail
+       contrast however it is combined. */
+
+    :host([tone="muted"]) {
+      color: var(--tt-muted-foreground);
+    }
+    :host([tone="brand"]) {
+      color: var(--tt-brand);
+    }
+    :host([tone="success"]) {
+      color: var(--tt-success);
+    }
+    :host([tone="warning"]) {
+      color: var(--tt-warning);
+    }
+    :host([tone="danger"]) {
+      color: var(--tt-destructive);
+    }
+
+    /* ---- Alignment ---- */
+
+    :host([align="center"]) {
+      text-align: center;
+    }
+    :host([align="end"]) {
+      text-align: end;
+    }
+    :host([align="justify"]) {
+      text-align: justify;
+    }
+
+    /*
+      Last, so it beats the display: inline of a span as well. The
+      browser's own [hidden] rule is weaker than any author style.
+    */
+    :host([hidden]) {
+      display: none;
+    }
+
+    /*
+      The real element only inherits: margin 0 and font: inherit undo the
+      browser's own heading and paragraph styles, so the host's rules are
+      the only ones that count. Colour, tracking and alignment inherit
+      on their own.
+
+      break-word, not anywhere: it still breaks a long URL, but leaves
+      the text's minimum width at its longest word, so a flex row cannot
+      squeeze it into a column of single letters.
+    */
+    .text {
+      margin: 0;
+      font: inherit;
+
+      overflow-wrap: break-word;
+    }
+
+    /*
+      The clamp. line-clamp needs the -webkit-box display, which also
+      makes a clamped span behave as a block.
+    */
+    .clamped {
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+      -webkit-line-clamp: var(--_lines);
+      line-clamp: var(--_lines);
+      overflow: hidden;
+    }
+  `; }
+    render() {
+        const tag = TAGS[this.as] ?? TAGS.p;
+        const lines = Math.max(0, Math.floor(this.maxLines || 0));
+        /*
+          The line count goes on the inner element's own style rather than
+          into the stylesheet, which is shared by every instance: two texts
+          with different counts would otherwise share whichever rendered
+          last.
+        */
+        return staticHtml `<${tag}
+      class=${lines > 0 ? "text clamped" : "text"}
+      part="text"
+      style=${lines > 0 ? `--_lines: ${lines}` : nothing}
+    ><slot></slot></${tag}>`;
+    }
+};
+__decorate([
+    property({ type: String, reflect: true })
+], TTText.prototype, "as", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], TTText.prototype, "size", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], TTText.prototype, "weight", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], TTText.prototype, "tone", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], TTText.prototype, "align", void 0);
+__decorate([
+    property({ type: Number, attribute: "max-lines" })
+], TTText.prototype, "maxLines", void 0);
+TTText = __decorate([
+    customElement("tt-text")
+], TTText);
+export { TTText };
+//# sourceMappingURL=tt-text.js.map

package/dist/tt-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tt-text.js","sourceRoot":"","sources":["../src/tt-text.ts"],"names":[],"mappings":"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"}

package/dist/tt-textarea.d.ts

@@ -0,0 +1,43 @@
+import { LitElement } from "lit";
+import type { PropertyValues } from "lit";
+import type { AutoCompleteToken } from "./tt-input.js";
+export declare class TTTextarea extends LitElement {
+    static formAssociated: boolean;
+    private internals;
+    label: string;
+    placeholder: string;
+    value: string;
+    name: string;
+    autocomplete?: AutoCompleteToken;
+    error: string;
+    labelHidden: boolean;
+    rows: number;
+    maxlength: number;
+    disabled: boolean;
+    required: boolean;
+    fullWidth: boolean;
+    autoGrow: boolean;
+    private field;
+    private fieldId;
+    get form(): HTMLFormElement | null;
+    get validity(): ValidityState;
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    connectedCallback(): void;
+    formResetCallback(): void;
+    formStateRestoreCallback(state: string): void;
+    updated(changed: PropertyValues): void;
+    private syncFormState;
+    private resize;
+    private handleInput;
+    private handleChange;
+    focus(options?: FocusOptions): void;
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "tt-textarea": TTTextarea;
+    }
+}
+//# sourceMappingURL=tt-textarea.d.ts.map

package/dist/tt-textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tt-textarea.d.ts","sourceRoot":"","sources":["../src/tt-textarea.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAC5C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAM1C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAIvD,qBACa,UAAW,SAAQ,UAAU;IACxC,MAAM,CAAC,cAAc,UAAQ;IAE7B,OAAO,CAAC,SAAS,CAA0B;IAE/B,KAAK,SAAM;IACX,WAAW,SAAM;IACjB,KAAK,SAAM;IAWoB,IAAI,SAAM;IAOzC,YAAY,CAAC,EAAE,iBAAiB,CAAC;IACjC,KAAK,SAAM;IAKvB,WAAW,UAAS;IAEQ,IAAI,SAAK;IAGT,SAAS,SAAK;IAGE,QAAQ,UAAS;IAChC,QAAQ,UAAS;IACuB,SAAS,UAAS;IAIlC,QAAQ,UAAS;IAEnD,OAAO,CAAC,KAAK,CAAuB;IAEvD,OAAO,CAAC,OAAO,CAA0B;IAEzC,IAAI,IAAI,2BAEP;IAED,IAAI,QAAQ,kBAEX;IACD,aAAa;IAIb,cAAc;IAId,iBAAiB;IAKjB,iBAAiB;IAIjB,wBAAwB,CAAC,KAAK,EAAE,MAAM;IAItC,OAAO,CAAC,OAAO,EAAE,cAAc;IAU/B,OAAO,CAAC,aAAa;IAkBrB,OAAO,CAAC,MAAM;IAOd,OAAO,CAAC,WAAW;IAcnB,OAAO,CAAC,YAAY;IAUpB,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY;IAI5B,MAAM,CAAC,MAAM,4BA2HV;IAEH,MAAM;CA0EP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}