@transcodes/ui-components 0.4.7 → 0.4.9

package/dist/screens/tc-error-screen.js

@@ -1,20 +1,20 @@
 import { css as m, LitElement as d, html as p } from "lit";
 import { property as a, state as y, customElement as h } from "lit/decorators.js";
 import { styleMap as u } from "lit/directives/style-map.js";
-import { AnimationController as g } from "../controllers/animation.controller.js";
+import { AnimationController as f } from "../controllers/animation.controller.js";
 import "../primitives/tc-icon.js";
 import "../primitives/tc-text.js";
 import "../primitives/tc-button.js";
 import "../primitives/tc-container.js";
 import "../primitives/tc-section.js";
-var f = Object.defineProperty, v = Object.getOwnPropertyDescriptor, e = (r, s, o, n) => {
-  for (var i = n > 1 ? void 0 : n ? v(s, o) : s, c = r.length - 1, l; c >= 0; c--)
-    (l = r[c]) && (i = (n ? l(s, o, i) : l(i)) || i);
-  return n && i && f(s, o, i), i;
+var g = Object.defineProperty, v = Object.getOwnPropertyDescriptor, e = (i, s, o, n) => {
+  for (var r = n > 1 ? void 0 : n ? v(s, o) : s, c = i.length - 1, l; c >= 0; c--)
+    (l = i[c]) && (r = (n ? l(s, o, r) : l(r)) || r);
+  return n && r && g(s, o, r), r;
 };
 let t = class extends d {
   constructor() {
-    super(...arguments), this.title = "Something went wrong", this.message = "An unexpected error occurred. Please try again.", this.retryLabel = "Try Again", this.showRetry = !0, this.autoAnimate = !0, this.sx = {}, this.isAnimated = !1, this.animation = new g(this, {
+    super(...arguments), this.title = "Something went wrong", this.message = "An unexpected error occurred. Please try again.", this.retryLabel = "Try Again", this.showRetry = !0, this.autoAnimate = !0, this.sx = {}, this.isAnimated = !1, this.animation = new f(this, {
       showDuration: 600,
       hideDuration: 300
     });
@@ -36,15 +36,15 @@ let t = class extends d {
     );
   }
   render() {
-    const r = this.isAnimated ? "animated" : "";
+    const i = this.isAnimated ? "animated" : "";
     return p`
       <div part="screen" class="screen" style=${u(this.sx)}>
         <tc-container>
           <div part="content" class="content">
-            <div part="icon" class="icon-container ${r}">
+            <div part="icon" class="icon-container ${i}">
               <tc-icon name="alert-circle" .sx=${{ "--icon-size": "var(--size-icon-xl)" }}></tc-icon>
             </div>
-            <tc-section .sx=${{ gap: "var(--space-sm)" }} class="text-content ${r}">
+            <tc-section .sx=${{ gap: "var(--space-sm)" }} class="text-content ${i}">
               <tc-text part="title" tag="h1" size="xl" weight="600" class="title">
                 ${this.title}
               </tc-text>
@@ -53,7 +53,7 @@ let t = class extends d {
               </tc-text>
             </tc-section>
             ${this.showRetry ? p`
-                  <div part="action" class="action ${r}">
+                  <div part="action" class="action ${i}">
                     <tc-button variant="primary" @tc-click=${this.handleRetry}>
                       ${this.retryLabel}
                     </tc-button>
@@ -149,19 +149,19 @@ t.styles = m`
     }
   `;
 e([
-  a({ type: String })
+  a({ type: String, reflect: !0 })
 ], t.prototype, "title", 2);
 e([
-  a({ type: String })
+  a({ type: String, reflect: !0 })
 ], t.prototype, "message", 2);
 e([
-  a({ type: String, attribute: "retry-label" })
+  a({ type: String, reflect: !0, attribute: "retry-label" })
 ], t.prototype, "retryLabel", 2);
 e([
-  a({ type: Boolean, attribute: "show-retry" })
+  a({ type: Boolean, reflect: !0, attribute: "show-retry" })
 ], t.prototype, "showRetry", 2);
 e([
-  a({ type: Boolean, attribute: "auto-animate" })
+  a({ type: Boolean, reflect: !0, attribute: "auto-animate" })
 ], t.prototype, "autoAnimate", 2);
 e([
   a({ type: Object })

package/dist/screens/tc-loading-screen.d.ts

@@ -10,6 +10,7 @@ import { SxProps } from '../types.js';
  */
 export declare class TcLoadingScreen extends LitElement {
     message: string;
+    submessage: string;
     spinnerSize: 'sm' | 'md' | 'lg' | 'auto';
     sx: SxProps;
     private loading;

package/dist/screens/tc-loading-screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tc-loading-screen.d.ts","sourceRoot":"","sources":["../../src/screens/tc-loading-screen.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAE,MAAM,KAAK,CAAC;AAI5C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAC3C,OAAO,6BAA6B,CAAC;AACrC,OAAO,0BAA0B,CAAC;AAClC,OAAO,+BAA+B,CAAC;AAEvC;;;;;;;GAOG;AACH,qBACa,eAAgB,SAAQ,UAAU;IACjB,OAAO,SAAM;IACc,WAAW,EAC9D,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,MAAM,CAAQ;IACU,EAAE,EAAE,OAAO,CAAM;IAE7C,OAAO,CAAC,OAAO,CAA+B;IAE9C,OAAgB,MAAM,0BAiCpB;IAEO,iBAAiB;IAKjB,MAAM;CAoBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,eAAe,CAAC;KACtC;CACF"}
+{"version":3,"file":"tc-loading-screen.d.ts","sourceRoot":"","sources":["../../src/screens/tc-loading-screen.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAE,MAAM,KAAK,CAAC;AAI5C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAC3C,OAAO,6BAA6B,CAAC;AACrC,OAAO,0BAA0B,CAAC;AAClC,OAAO,+BAA+B,CAAC;AAEvC;;;;;;;GAOG;AACH,qBACa,eAAgB,SAAQ,UAAU;IACF,OAAO,SAAM;IACb,UAAU,SAAM;IAE3D,WAAW,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAQ;IACpB,EAAE,EAAE,OAAO,CAAM;IAE7C,OAAO,CAAC,OAAO,CAA+B;IAE9C,OAAgB,MAAM,0BAiCpB;IAEO,iBAAiB;IAKjB,MAAM;CAoBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,eAAe,CAAC;KACtC;CACF"}

package/dist/screens/tc-loading-screen.js

@@ -1,18 +1,18 @@
 import { css as m, LitElement as g, html as l } from "lit";
-import { property as a, customElement as h } from "lit/decorators.js";
+import { property as n, customElement as h } from "lit/decorators.js";
 import { styleMap as d } from "lit/directives/style-map.js";
-import { LoadingController as y } from "../controllers/loading.controller.js";
+import { LoadingController as f } from "../controllers/loading.controller.js";
 import "../primitives/tc-spinner.js";
 import "../primitives/tc-text.js";
 import "../primitives/tc-container.js";
-var f = Object.defineProperty, x = Object.getOwnPropertyDescriptor, r = (p, s, n, i) => {
-  for (var e = i > 1 ? void 0 : i ? x(s, n) : s, o = p.length - 1, c; o >= 0; o--)
-    (c = p[o]) && (e = (i ? c(s, n, e) : c(e)) || e);
-  return i && e && f(s, n, e), e;
+var u = Object.defineProperty, y = Object.getOwnPropertyDescriptor, r = (p, s, c, i) => {
+  for (var e = i > 1 ? void 0 : i ? y(s, c) : s, o = p.length - 1, a; o >= 0; o--)
+    (a = p[o]) && (e = (i ? a(s, c, e) : a(e)) || e);
+  return i && e && u(s, c, e), e;
 };
 let t = class extends g {
   constructor() {
-    super(...arguments), this.message = "", this.spinnerSize = "md", this.sx = {}, this.loading = new y(this);
+    super(...arguments), this.message = "", this.submessage = "", this.spinnerSize = "md", this.sx = {}, this.loading = new f(this);
   }
   connectedCallback() {
     super.connectedCallback(), this.loading.start();
@@ -69,13 +69,16 @@ t.styles = m`
     }
   `;
 r([
-  a({ type: String })
+  n({ type: String, reflect: !0 })
 ], t.prototype, "message", 2);
 r([
-  a({ type: String, attribute: "spinner-size" })
+  n({ type: String, reflect: !0 })
+], t.prototype, "submessage", 2);
+r([
+  n({ type: String, reflect: !0, attribute: "spinner-size" })
 ], t.prototype, "spinnerSize", 2);
 r([
-  a({ type: Object })
+  n({ type: Object })
 ], t.prototype, "sx", 2);
 t = r([
   h("tc-loading-screen")

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transcodes/ui-components",
-  "version": "0.4.7",
+  "version": "0.4.9",
   "private": false,
   "description": "Lit 3.x component library with Reactive Controllers",
   "keywords": [
@@ -75,7 +75,7 @@
     "lit": "^3.0.0"
   },
   "dependencies": {
-    "@transcodes/design-tokens": "^0.4.7"
+    "@transcodes/design-tokens": "^0.4.9"
   },
   "devDependencies": {
     "@storybook/addon-a11y": "^10.1.9",