@tmorrow/cre8-wc 1.1.2 → 1.1.4

package/lib/components/table-row/table-row.js

@@ -1,31 +1,50 @@
-import { a as s } from "../../icon-D22g8aWB.js";
-import { css as c, html as n } from "lit";
-import { property as r } from "lit/decorators.js";
-import { Cre8Element as g } from "../cre8-element.js";
-import "../button/button.js";
-import "../table-cell/table-cell.js";
-const h = c`.cre8-u-content-knockout-brand{color:var(----cre8-color-content-knockout-brand)}.cre8-u-is-hidden{display:none !important;visibility:hidden !important}.cre8-u-is-vishidden{position:absolute !important;overflow:hidden;width:1px;height:1px;padding:0;border:0;clip:rect(1px, 1px, 1px, 1px)}@media all and (min-width: 23.4375rem){.cre8-u-hide-sm{display:none !important}}@media all and (min-width: 35rem){.cre8-u-hide-sm-2{display:none !important}}@media all and (min-width: 48rem){.cre8-u-hide-md{display:none !important}}@media all and (min-width: 60rem){.cre8-u-hide-lg{display:none !important}}@media all and (min-width: 75rem){.cre8-u-hide-xl{display:none !important}}@media all and (max-width: 23.4375rem){.cre8-u-show-sm{display:none !important}}@media all and (max-width: 35rem){.cre8-u-show-sm-2{display:none !important}}@media all and (max-width: 48rem){.cre8-u-show-md{display:none !important}}@media all and (max-width: 60rem){.cre8-u-show-lg{display:none !important}}@media all and (max-width: 75rem){.cre8-u-show-xl{display:none !important}}.cre8-u-margin-none{margin:0 !important}.cre8-u-margin-sm{margin:size(1) !important}.cre8-u-margin-md{margin:size(2) !important}.cre8-u-margin-lg{margin:size(3) !important}.cre8-u-margin-xl{margin:size(4) !important}.cre8-u-margin-xxl{margin:size(8) !important}.cre8-u-margin-top-none{margin-top:0 !important}.cre8-u-margin-top-sm{margin-top:size(1) !important}.cre8-u-margin-top-md{margin-top:size(2) !important}.cre8-u-margin-top-lg{margin-top:size(3) !important}.cre8-u-margin-top-xl{margin-top:size(4) !important}.cre8-u-margin-top-xxl{margin-top:size(8) !important}.cre8-u-margin-right-none{margin-right:0 !important}.cre8-u-margin-right-sm{margin-right:size(1) !important}.cre8-u-margin-right-md{margin-right:size(2) !important}.cre8-u-margin-right-lg{margin-right:size(3) !important}.cre8-u-margin-right-xl{margin-right:size(4) !important}.cre8-u-margin-right-xxl{margin-right:size(8) !important}.cre8-u-margin-bottom-none{margin-bottom:0 !important}.cre8-u-margin-bottom-sm{margin-bottom:size(1) !important}.cre8-u-margin-bottom-md{margin-bottom:size(2) !important}.cre8-u-margin-bottom-lg{margin-bottom:size(3) !important}.cre8-u-margin-bottom-xl{margin-bottom:size(4) !important}.cre8-u-margin-bottom-xxl{margin-bottom:size(8) !important}.cre8-u-margin-bottom-xl-xxl{margin-bottom:size(4) !important}@media all and (min-width: 768px){.cre8-u-margin-bottom-xl-xxl{margin-bottom:size(8) !important}}.cre8-u-margin-left-none{margin-left:0 !important}.cre8-u-margin-left-sm{margin-left:size(1) !important}.cre8-u-margin-left-md{margin-left:size(2) !important}.cre8-u-margin-left-lg{margin-left:size(3) !important}.cre8-u-margin-left-xl{margin-left:size(4) !important}.cre8-u-margin-left-xxl{margin-left:size(8) !important}.cre8-u-padding-none{padding:0 !important}.cre8-u-padding-sm{padding:size(1) !important}.cre8-u-padding-md{padding:size(2) !important}.cre8-u-padding-lg{padding:size(3) !important}.cre8-u-padding-xl{padding:size(4) !important}.cre8-u-padding-xxl{padding:size(8) !important}.cre8-u-padding-top-none{padding-top:0 !important}.cre8-u-padding-top-sm{padding-top:size(1) !important}.cre8-u-padding-top-md{padding-top:size(2) !important}.cre8-u-padding-top-lg{padding-top:size(3) !important}.cre8-u-padding-top-xl{padding-top:size(4) !important}.cre8-u-padding-top-xxl{padding-top:size(8) !important}.cre8-u-padding-right-none{padding-right:0 !important}.cre8-u-padding-right-sm{padding-right:size(1) !important}.cre8-u-padding-right-md{padding-right:size(2) !important}.cre8-u-padding-right-lg{padding-right:size(3) !important}.cre8-u-padding-right-xl{padding-right:size(4) !important}.cre8-u-padding-right-xxl{padding-right:size(8) !important}.cre8-u-padding-bottom-none{padding-bottom:0 !important}.cre8-u-padding-bottom-sm{padding-bottom:size(1) !important}.cre8-u-padding-bottom-md{padding-bottom:size(2) !important}.cre8-u-padding-bottom-lg{padding-bottom:size(3) !important}.cre8-u-padding-bottom-xl{padding-bottom:size(4) !important}.cre8-u-padding-bottom-xxl{padding-bottom:size(8) !important}.cre8-u-padding-left-none{padding-left:0 !important}.cre8-u-padding-left-sm{padding-left:size(1) !important}.cre8-u-padding-left-md{padding-left:size(2) !important}.cre8-u-padding-left-lg{padding-left:size(3) !important}.cre8-u-padding-left-xl{padding-left:size(4) !important}.cre8-u-padding-left-xxl{padding-left:size(8) !important}.cre8-u-display-flex{display:flex !important}.cre8-u-display-block{display:block !important}body{font-family:var(--cre8-typography-body-default-font-family);font-size:var(--cre8-typography-body-default-font-size);font-weight:var(--cre8-typography-body-default-font-weight);line-height:var(--cre8-typography-body-default-line-height);text-decoration:var(--cre8-typography-body-default-text-decoration);text-transform:var(--cre8-typography-body-default-text-transform);display:flex;flex-direction:column;padding:0;margin:0;color:var(--cre8-color-content-default);background:var(--background-default)}@media all and (min-width: 60rem){.page-container{background:linear-gradient(90deg, #fff 0, #fff 66.66%, #f8f8f9 0, #f8f8f9 0)}}.band__inner{margin-left:2rem;margin-right:2rem}@media all and (min-width: 60rem){.band__inner{margin-right:0}}img{max-width:100%;height:auto}*,::slotted(*),*:before,*:after{box-sizing:border-box}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{--cre8-z-index-1: 1;--cre8-z-index-50: 50;--cre8-z-index-100: 100;--cre8-z-index-200: 200;--cre8-z-index-1030: 1030;--cre8-anim-fade-quick: 0.35s;--cre8-anim-ease: ease}@keyframes fadeIn{100%{opacity:1}}@keyframes slideIn{100%{transform:translateX(0)}}@keyframes slideInFwd{100%{width:272px;height:272px}}@keyframes slideOutRight{100%{width:272px;height:272px}}@keyframes slideUp{100%{transform:translateY(0)}}@media(width >= 481px){@keyframes slideInFwd{100%{width:417px;height:417px}}@keyframes slideOutRight{100%{width:417px;height:417px}}}@media(width >= 48rem){@keyframes slideInFwd{100%{width:330px;height:330px}}@keyframes slideOutRight{100%{width:330px;height:330px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 60rem){@keyframes slideInFwd{100%{width:460px;height:460px}}@keyframes slideOutRight{100%{width:460px;height:460px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 75rem){@keyframes slideInFwd{100%{width:592px;height:591px}}@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 87.5rem){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 120px))}}}@media(width >= 2200px){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 592px))}}}span.ripple{position:absolute;border-radius:50%;transform:scale(0);animation:ripple 600ms linear;background-color:var(--ripple-bg-color)}@keyframes ripple{to{transform:scale(4);opacity:1}}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{display:contents}.cre8-c-table__row{display:var(--cre8-table-row-display, table-row);border-bottom:var(--cre8-table-row-border-bottom)}.cre8-c-table__row:hover{background:var(--cre8-table-row-hover-background)}:host(:nth-child(odd)) .cre8-c-table__row{background:var(--cre8-table-row-odd-background, none)}:host(:nth-child(odd)) .cre8-c-table__row:hover{background:var(--cre8-table-row-odd-hover-background, inherit)}@media all and (min-width: 768px){.cre8-c-table__row{border-bottom:inherit;display:table-row}}.cre8-c-table__row--bare{--cre8-table-cell-border-bottom-color: transparent}.cre8-c-table__row--expandable+::slotted(cre8-table-row){display:none}.cre8-c-table__row--expandable.cre8-is-expanded{--cre8-table-cell-border-bottom-color: transparent}.cre8-c-table__row--expandable.cre8-is-expanded+::slotted(cre8-table-row){display:contents}.cre8-c-table__expand-button{background-color:var(--cre8-color-bg-transparent);border-width:var(--cre8-border-width-none)}.cre8-c-table__expand-button-text{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.cre8-c-table__expand-button-icon{display:block;transition:transform .2s ease}.cre8-is-expanded .cre8-c-table__expand-button-icon{transform:rotate(90deg)}`;
-var x = Object.defineProperty, i = (p, a, m, u) => {
-  for (var e = void 0, o = p.length - 1, l; o >= 0; o--)
-    (l = p[o]) && (e = l(a, m, e) || e);
-  return e && x(a, m, e), e;
+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;
 };
-const d = class d extends g {
-  constructor() {
-    super(...arguments), this.expandedButtonText = "Collapse Table Row", this.collapsedButtonText = "Expand Table Row";
-  }
-  toggleIsExpanded() {
-    this.isExpanded = !this.isExpanded, this.classList.contains("cre8-is-expanded") ? this.classList.remove("cre8-is-expanded") : this.classList.add("cre8-is-expanded");
-  }
-  render() {
-    const a = this.componentClassNames("cre8-c-table__row", {
-      "cre8-c-table__row--expandable": this.isExpandable,
-      "cre8-c-table__row--bare": this.variant === "bare",
-      "cre8-is-expanded": this.isExpanded
-    });
-    return n`
-      <tr role="row" class="${a}">
-        ${this.isExpandable ? n`<cre8-table-cell>
+import svgCaretUp from '../../icons/System/Regular/Caret_Up.svg?raw';
+import { html, } from 'lit';
+import { property } from 'lit/decorators.js';
+import { Cre8Element } from '../cre8-element';
+import styles from './table-row.styles.js';
+import '../button/button';
+import '../table-cell/table-cell';
+/**
+ * @slot - The component content
+ */
+export class Cre8TableRow extends Cre8Element {
+    constructor() {
+        super(...arguments);
+        /**
+         * Expanded button text
+         */
+        this.expandedButtonText = 'Collapse Table Row';
+        /**
+         * Expand button text
+         */
+        this.collapsedButtonText = 'Expand Table Row';
+    }
+    toggleIsExpanded() {
+        this.isExpanded = !this.isExpanded;
+        if (this.classList.contains('cre8-is-expanded')) {
+            this.classList.remove('cre8-is-expanded');
+        }
+        else {
+            this.classList.add('cre8-is-expanded');
+        }
+    }
+    render() {
+        const componentClassNames = this.componentClassNames('cre8-c-table__row', {
+            'cre8-c-table__row--expandable': this.isExpandable,
+            'cre8-c-table__row--bare': this.variant === 'bare',
+            'cre8-is-expanded': this.isExpanded,
+        });
+        return html `
+      <tr role="row" class="${componentClassNames}">
+        ${this.isExpandable
+            ? html `<cre8-table-cell>
               <button
                 class="cre8-c-table__expand-button" 
                 aria-expanded=${!!this.isExpanded}
@@ -34,34 +53,36 @@ const d = class d extends g {
                 <span class="cre8-c-table__expand-button-text">
                   ${this.isExpanded ? this.expandedButtonText : this.collapsedButtonText}
                 </span>
-                <cre8-icon svg='${s}' rotate="90" class="cre8-c-table__expand-button-icon"></cre8-icon>
+                <cre8-icon svg='${svgCaretUp}' rotate="90" class="cre8-c-table__expand-button-icon"></cre8-icon>
               </button>
-            </cre8-table-cell>` : ""}
-        ${n`<slot></slot>`}
+            </cre8-table-cell>`
+            : ''}
+        ${html `<slot></slot>`}
       </tr>
-      ${this.isExpandable ? n` <slot class="cre8-c-table__expandable-content" name="expandableContent"><slot></slot></slot>` : ""}
+      ${this.isExpandable
+            ? html ` <slot class="cre8-c-table__expandable-content" name="expandableContent"><slot></slot></slot>`
+            : ''}
     `;
-  }
-};
-d.styles = [h];
-let t = d;
-i([
-  r({ type: Boolean, reflect: !0 })
-], t.prototype, "isExpanded");
-i([
-  r({ type: Boolean, reflect: !0 })
-], t.prototype, "isExpandable");
-i([
-  r()
-], t.prototype, "variant");
-i([
-  r()
-], t.prototype, "expandedButtonText");
-i([
-  r()
-], t.prototype, "collapsedButtonText");
-customElements.get("cre8-table-row") === void 0 && customElements.define("cre8-table-row", t);
-export {
-  t as Cre8TableRow,
-  t as default
-};
+    }
+}
+Cre8TableRow.styles = [styles];
+__decorate([
+    property({ type: Boolean, reflect: true })
+], Cre8TableRow.prototype, "isExpanded", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], Cre8TableRow.prototype, "isExpandable", void 0);
+__decorate([
+    property()
+], Cre8TableRow.prototype, "variant", void 0);
+__decorate([
+    property()
+], Cre8TableRow.prototype, "expandedButtonText", void 0);
+__decorate([
+    property()
+], Cre8TableRow.prototype, "collapsedButtonText", void 0);
+if (customElements.get('cre8-table-row') === undefined) {
+    customElements.define('cre8-table-row', Cre8TableRow);
+}
+export default Cre8TableRow;
+//# sourceMappingURL=table-row.js.map

package/lib/components/table-row/table-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-row.js","sourceRoot":"","sources":["../../../components/table-row/table-row.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,6CAA6C,CAAC;AACrE,OAAO,EAAE,IAAI,GAAI,MAAM,KAAK,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,MAAM,MAAM,uBAAuB,CAAC;AAC3C,OAAO,kBAAkB,CAAC;AAC1B,OAAO,0BAA0B,CAAC;AAElC;;GAEG;AAEH,MAAM,OAAO,YAAa,SAAQ,WAAW;IAA7C;;QAmCE;;WAEG;QAEC,uBAAkB,GAAW,oBAAoB,CAAC;QAEtD;;WAEG;QAEC,wBAAmB,GAAW,kBAAkB,CAAC;IAgCvD,CAAC;IA1EG,gBAAgB;QACZ,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;QACnC,IAAI,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAAE,CAAC;YAC9C,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC;QAC9C,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;QAC3C,CAAC;IACL,CAAC;IAqCH,MAAM;QACF,MAAM,mBAAmB,GAAG,IAAI,CAAC,mBAAmB,CAAC,mBAAmB,EAAE;YACtE,+BAA+B,EAAE,IAAI,CAAC,YAAY;YAClD,yBAAyB,EAAE,IAAI,CAAC,OAAO,KAAK,MAAM;YAClD,kBAAkB,EAAE,IAAI,CAAC,UAAU;SACtC,CAAC,CAAC;QAEH,OAAO,IAAI,CAAA;8BACa,mBAAmB;UACvC,IAAI,CAAC,YAAY;YACnB,CAAC,CAAC,IAAI,CAAA;;;gCAGkB,CAAC,CAAC,IAAI,CAAC,UAAU;yBACxB,IAAI,CAAC,gBAAgB;;;oBAG1B,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAC,mBAAmB;;kCAEtD,UAAU;;+BAEb;YACvB,CAAC,CAAC,EAAE;UACF,IAAI,CAAA,eAAe;;QAErB,IAAI,CAAC,YAAY;YACjB,CAAC,CAAC,IAAI,CAAA,+FAA+F;YACrG,CAAC,CAAC,EAAE;KACP,CAAC;IACJ,CAAC;;AA3EQ,mBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAevB;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDAClB;AAMrB;IADH,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;kDAChB;AAWvB;IADH,QAAQ,EAAE;6CACU;AAMjB;IADH,QAAQ,EAAE;wDAC2C;AAMlD;IADH,QAAQ,EAAE;yDAC0C;AAkCvD,IAAI,cAAc,CAAC,GAAG,CAAC,gBAAgB,CAAC,KAAK,SAAS,EAAE,CAAC;IACrD,cAAc,CAAC,MAAM,CAAC,gBAAgB,EAAE,YAAY,CAAC,CAAC;AAC1D,CAAC;AAQD,eAAe,YAAY,CAAC","sourcesContent":["import svgCaretUp from '../../icons/System/Regular/Caret_Up.svg?raw';\nimport { html,  } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Cre8Element } from '../cre8-element';\nimport styles from './table-row.styles.js';\nimport '../button/button';\nimport '../table-cell/table-cell';\n\n/**\n * @slot - The component content\n */\n\nexport class Cre8TableRow extends Cre8Element {\n    static styles = [styles];\n\n    toggleIsExpanded() {\n        this.isExpanded = !this.isExpanded;\n        if (this.classList.contains('cre8-is-expanded')) {\n            this.classList.remove('cre8-is-expanded');\n        } else {\n            this.classList.add('cre8-is-expanded');\n        }\n    }\n\n  /**\n   * Visually show additional expandable content\n   */\n  @property({ type: Boolean, reflect: true })\n      isExpanded?: boolean;\n\n  /**\n   * Indicates row has additional visually hidden related content\n   */\n  @property({ type: Boolean, reflect: true })\n      isExpandable?: boolean;\n\n  /**\n   * Style variants\n   * <cre8-text-passage size=\"sm\">\n   * <ul>\n   * <li>**bare** renders a table row without a border</li>\n   * </ul>\n   * </cre8-text-passage>\n   */\n  @property()\n      variant?: 'bare';\n\n  /**\n   * Expanded button text\n   */\n  @property()\n      expandedButtonText: string = 'Collapse Table Row';\n\n  /**\n   * Expand button text\n   */\n  @property()\n      collapsedButtonText: string = 'Expand Table Row';\n\n  render() {\n      const componentClassNames = this.componentClassNames('cre8-c-table__row', {\n          'cre8-c-table__row--expandable': this.isExpandable,\n          'cre8-c-table__row--bare': this.variant === 'bare',\n          'cre8-is-expanded': this.isExpanded,\n      });\n\n      return html`\n      <tr role=\"row\" class=\"${componentClassNames}\">\n        ${this.isExpandable\n        ? html`<cre8-table-cell>\n              <button\n                class=\"cre8-c-table__expand-button\" \n                aria-expanded=${!!this.isExpanded}\n                @click=${this.toggleIsExpanded}\n              >\n                <span class=\"cre8-c-table__expand-button-text\">\n                  ${this.isExpanded ? this.expandedButtonText : this.collapsedButtonText}\n                </span>\n                <cre8-icon svg='${svgCaretUp}' rotate=\"90\" class=\"cre8-c-table__expand-button-icon\"></cre8-icon>\n              </button>\n            </cre8-table-cell>`\n        : ''}\n        ${html`<slot></slot>`}\n      </tr>\n      ${this.isExpandable\n        ? html` <slot class=\"cre8-c-table__expandable-content\" name=\"expandableContent\"><slot></slot></slot>`\n        : ''}\n    `;\n  }\n}\n\nif (customElements.get('cre8-table-row') === undefined) {\n    customElements.define('cre8-table-row', Cre8TableRow);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'cre8-table-row': Cre8TableRow;\n  }\n}\n\nexport default Cre8TableRow;\n"]}

package/lib/components/table-row/table-row.styles.js

@@ -0,0 +1,4 @@
+import { css } from 'lit';
+const styles = css `.cre8-u-content-knockout-brand{color:var(----cre8-color-content-knockout-brand)}.cre8-u-is-hidden{display:none !important;visibility:hidden !important}.cre8-u-is-vishidden{position:absolute !important;overflow:hidden;width:1px;height:1px;padding:0;border:0;clip:rect(1px, 1px, 1px, 1px)}@media all and (min-width: 23.4375rem){.cre8-u-hide-sm{display:none !important}}@media all and (min-width: 35rem){.cre8-u-hide-sm-2{display:none !important}}@media all and (min-width: 48rem){.cre8-u-hide-md{display:none !important}}@media all and (min-width: 60rem){.cre8-u-hide-lg{display:none !important}}@media all and (min-width: 75rem){.cre8-u-hide-xl{display:none !important}}@media all and (max-width: 23.4375rem){.cre8-u-show-sm{display:none !important}}@media all and (max-width: 35rem){.cre8-u-show-sm-2{display:none !important}}@media all and (max-width: 48rem){.cre8-u-show-md{display:none !important}}@media all and (max-width: 60rem){.cre8-u-show-lg{display:none !important}}@media all and (max-width: 75rem){.cre8-u-show-xl{display:none !important}}.cre8-u-margin-none{margin:0 !important}.cre8-u-margin-sm{margin:size(1) !important}.cre8-u-margin-md{margin:size(2) !important}.cre8-u-margin-lg{margin:size(3) !important}.cre8-u-margin-xl{margin:size(4) !important}.cre8-u-margin-xxl{margin:size(8) !important}.cre8-u-margin-top-none{margin-top:0 !important}.cre8-u-margin-top-sm{margin-top:size(1) !important}.cre8-u-margin-top-md{margin-top:size(2) !important}.cre8-u-margin-top-lg{margin-top:size(3) !important}.cre8-u-margin-top-xl{margin-top:size(4) !important}.cre8-u-margin-top-xxl{margin-top:size(8) !important}.cre8-u-margin-right-none{margin-right:0 !important}.cre8-u-margin-right-sm{margin-right:size(1) !important}.cre8-u-margin-right-md{margin-right:size(2) !important}.cre8-u-margin-right-lg{margin-right:size(3) !important}.cre8-u-margin-right-xl{margin-right:size(4) !important}.cre8-u-margin-right-xxl{margin-right:size(8) !important}.cre8-u-margin-bottom-none{margin-bottom:0 !important}.cre8-u-margin-bottom-sm{margin-bottom:size(1) !important}.cre8-u-margin-bottom-md{margin-bottom:size(2) !important}.cre8-u-margin-bottom-lg{margin-bottom:size(3) !important}.cre8-u-margin-bottom-xl{margin-bottom:size(4) !important}.cre8-u-margin-bottom-xxl{margin-bottom:size(8) !important}.cre8-u-margin-bottom-xl-xxl{margin-bottom:size(4) !important}@media all and (min-width: 768px){.cre8-u-margin-bottom-xl-xxl{margin-bottom:size(8) !important}}.cre8-u-margin-left-none{margin-left:0 !important}.cre8-u-margin-left-sm{margin-left:size(1) !important}.cre8-u-margin-left-md{margin-left:size(2) !important}.cre8-u-margin-left-lg{margin-left:size(3) !important}.cre8-u-margin-left-xl{margin-left:size(4) !important}.cre8-u-margin-left-xxl{margin-left:size(8) !important}.cre8-u-padding-none{padding:0 !important}.cre8-u-padding-sm{padding:size(1) !important}.cre8-u-padding-md{padding:size(2) !important}.cre8-u-padding-lg{padding:size(3) !important}.cre8-u-padding-xl{padding:size(4) !important}.cre8-u-padding-xxl{padding:size(8) !important}.cre8-u-padding-top-none{padding-top:0 !important}.cre8-u-padding-top-sm{padding-top:size(1) !important}.cre8-u-padding-top-md{padding-top:size(2) !important}.cre8-u-padding-top-lg{padding-top:size(3) !important}.cre8-u-padding-top-xl{padding-top:size(4) !important}.cre8-u-padding-top-xxl{padding-top:size(8) !important}.cre8-u-padding-right-none{padding-right:0 !important}.cre8-u-padding-right-sm{padding-right:size(1) !important}.cre8-u-padding-right-md{padding-right:size(2) !important}.cre8-u-padding-right-lg{padding-right:size(3) !important}.cre8-u-padding-right-xl{padding-right:size(4) !important}.cre8-u-padding-right-xxl{padding-right:size(8) !important}.cre8-u-padding-bottom-none{padding-bottom:0 !important}.cre8-u-padding-bottom-sm{padding-bottom:size(1) !important}.cre8-u-padding-bottom-md{padding-bottom:size(2) !important}.cre8-u-padding-bottom-lg{padding-bottom:size(3) !important}.cre8-u-padding-bottom-xl{padding-bottom:size(4) !important}.cre8-u-padding-bottom-xxl{padding-bottom:size(8) !important}.cre8-u-padding-left-none{padding-left:0 !important}.cre8-u-padding-left-sm{padding-left:size(1) !important}.cre8-u-padding-left-md{padding-left:size(2) !important}.cre8-u-padding-left-lg{padding-left:size(3) !important}.cre8-u-padding-left-xl{padding-left:size(4) !important}.cre8-u-padding-left-xxl{padding-left:size(8) !important}.cre8-u-display-flex{display:flex !important}.cre8-u-display-block{display:block !important}body{font-family:var(--cre8-typography-body-default-font-family);font-size:var(--cre8-typography-body-default-font-size);font-weight:var(--cre8-typography-body-default-font-weight);line-height:var(--cre8-typography-body-default-line-height);text-decoration:var(--cre8-typography-body-default-text-decoration);text-transform:var(--cre8-typography-body-default-text-transform);display:flex;flex-direction:column;padding:0;margin:0;color:var(--cre8-color-content-default);background:var(--background-default)}@media all and (min-width: 60rem){.page-container{background:linear-gradient(90deg, #fff 0, #fff 66.66%, #f8f8f9 0, #f8f8f9 0)}}.band__inner{margin-left:2rem;margin-right:2rem}@media all and (min-width: 60rem){.band__inner{margin-right:0}}img{max-width:100%;height:auto}*,::slotted(*),*:before,*:after{box-sizing:border-box}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{--cre8-z-index-1: 1;--cre8-z-index-50: 50;--cre8-z-index-100: 100;--cre8-z-index-200: 200;--cre8-z-index-1030: 1030;--cre8-anim-fade-quick: 0.35s;--cre8-anim-ease: ease}@keyframes fadeIn{100%{opacity:1}}@keyframes slideIn{100%{transform:translateX(0)}}@keyframes slideInFwd{100%{width:272px;height:272px}}@keyframes slideOutRight{100%{width:272px;height:272px}}@keyframes slideUp{100%{transform:translateY(0)}}@media(width >= 481px){@keyframes slideInFwd{100%{width:417px;height:417px}}@keyframes slideOutRight{100%{width:417px;height:417px}}}@media(width >= 48rem){@keyframes slideInFwd{100%{width:330px;height:330px}}@keyframes slideOutRight{100%{width:330px;height:330px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 60rem){@keyframes slideInFwd{100%{width:460px;height:460px}}@keyframes slideOutRight{100%{width:460px;height:460px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 75rem){@keyframes slideInFwd{100%{width:592px;height:591px}}@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 87.5rem){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 120px))}}}@media(width >= 2200px){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 592px))}}}span.ripple{position:absolute;border-radius:50%;transform:scale(0);animation:ripple 600ms linear;background-color:var(--ripple-bg-color)}@keyframes ripple{to{transform:scale(4);opacity:1}}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{display:contents}.cre8-c-table__row{display:var(--cre8-table-row-display, table-row);border-bottom:var(--cre8-table-row-border-bottom)}.cre8-c-table__row:hover{background:var(--cre8-table-row-hover-background)}:host(:nth-child(odd)) .cre8-c-table__row{background:var(--cre8-table-row-odd-background, none)}:host(:nth-child(odd)) .cre8-c-table__row:hover{background:var(--cre8-table-row-odd-hover-background, inherit)}@media all and (min-width: 768px){.cre8-c-table__row{border-bottom:inherit;display:table-row}}.cre8-c-table__row--bare{--cre8-table-cell-border-bottom-color: transparent}.cre8-c-table__row--expandable+::slotted(cre8-table-row){display:none}.cre8-c-table__row--expandable.cre8-is-expanded{--cre8-table-cell-border-bottom-color: transparent}.cre8-c-table__row--expandable.cre8-is-expanded+::slotted(cre8-table-row){display:contents}.cre8-c-table__expand-button{background-color:var(--cre8-color-bg-transparent);border-width:var(--cre8-border-width-none)}.cre8-c-table__expand-button-text{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.cre8-c-table__expand-button-icon{display:block;transition:transform .2s ease}.cre8-is-expanded .cre8-c-table__expand-button-icon{transform:rotate(90deg)}`;
+export default styles;
+//# sourceMappingURL=table-row.styles.js.map

package/lib/components/table-row/table-row.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-row.styles.js","sourceRoot":"","sources":["../../../components/table-row/table-row.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,MAAM,GAAG,GAAG,CAAA,0pQAA0pQ,CAAC;AAC7qQ,eAAe,MAAM,CAAC","sourcesContent":["import { css } from 'lit';\nconst styles = css`.cre8-u-content-knockout-brand{color:var(----cre8-color-content-knockout-brand)}.cre8-u-is-hidden{display:none !important;visibility:hidden !important}.cre8-u-is-vishidden{position:absolute !important;overflow:hidden;width:1px;height:1px;padding:0;border:0;clip:rect(1px, 1px, 1px, 1px)}@media all and (min-width: 23.4375rem){.cre8-u-hide-sm{display:none !important}}@media all and (min-width: 35rem){.cre8-u-hide-sm-2{display:none !important}}@media all and (min-width: 48rem){.cre8-u-hide-md{display:none !important}}@media all and (min-width: 60rem){.cre8-u-hide-lg{display:none !important}}@media all and (min-width: 75rem){.cre8-u-hide-xl{display:none !important}}@media all and (max-width: 23.4375rem){.cre8-u-show-sm{display:none !important}}@media all and (max-width: 35rem){.cre8-u-show-sm-2{display:none !important}}@media all and (max-width: 48rem){.cre8-u-show-md{display:none !important}}@media all and (max-width: 60rem){.cre8-u-show-lg{display:none !important}}@media all and (max-width: 75rem){.cre8-u-show-xl{display:none !important}}.cre8-u-margin-none{margin:0 !important}.cre8-u-margin-sm{margin:size(1) !important}.cre8-u-margin-md{margin:size(2) !important}.cre8-u-margin-lg{margin:size(3) !important}.cre8-u-margin-xl{margin:size(4) !important}.cre8-u-margin-xxl{margin:size(8) !important}.cre8-u-margin-top-none{margin-top:0 !important}.cre8-u-margin-top-sm{margin-top:size(1) !important}.cre8-u-margin-top-md{margin-top:size(2) !important}.cre8-u-margin-top-lg{margin-top:size(3) !important}.cre8-u-margin-top-xl{margin-top:size(4) !important}.cre8-u-margin-top-xxl{margin-top:size(8) !important}.cre8-u-margin-right-none{margin-right:0 !important}.cre8-u-margin-right-sm{margin-right:size(1) !important}.cre8-u-margin-right-md{margin-right:size(2) !important}.cre8-u-margin-right-lg{margin-right:size(3) !important}.cre8-u-margin-right-xl{margin-right:size(4) !important}.cre8-u-margin-right-xxl{margin-right:size(8) !important}.cre8-u-margin-bottom-none{margin-bottom:0 !important}.cre8-u-margin-bottom-sm{margin-bottom:size(1) !important}.cre8-u-margin-bottom-md{margin-bottom:size(2) !important}.cre8-u-margin-bottom-lg{margin-bottom:size(3) !important}.cre8-u-margin-bottom-xl{margin-bottom:size(4) !important}.cre8-u-margin-bottom-xxl{margin-bottom:size(8) !important}.cre8-u-margin-bottom-xl-xxl{margin-bottom:size(4) !important}@media all and (min-width: 768px){.cre8-u-margin-bottom-xl-xxl{margin-bottom:size(8) !important}}.cre8-u-margin-left-none{margin-left:0 !important}.cre8-u-margin-left-sm{margin-left:size(1) !important}.cre8-u-margin-left-md{margin-left:size(2) !important}.cre8-u-margin-left-lg{margin-left:size(3) !important}.cre8-u-margin-left-xl{margin-left:size(4) !important}.cre8-u-margin-left-xxl{margin-left:size(8) !important}.cre8-u-padding-none{padding:0 !important}.cre8-u-padding-sm{padding:size(1) !important}.cre8-u-padding-md{padding:size(2) !important}.cre8-u-padding-lg{padding:size(3) !important}.cre8-u-padding-xl{padding:size(4) !important}.cre8-u-padding-xxl{padding:size(8) !important}.cre8-u-padding-top-none{padding-top:0 !important}.cre8-u-padding-top-sm{padding-top:size(1) !important}.cre8-u-padding-top-md{padding-top:size(2) !important}.cre8-u-padding-top-lg{padding-top:size(3) !important}.cre8-u-padding-top-xl{padding-top:size(4) !important}.cre8-u-padding-top-xxl{padding-top:size(8) !important}.cre8-u-padding-right-none{padding-right:0 !important}.cre8-u-padding-right-sm{padding-right:size(1) !important}.cre8-u-padding-right-md{padding-right:size(2) !important}.cre8-u-padding-right-lg{padding-right:size(3) !important}.cre8-u-padding-right-xl{padding-right:size(4) !important}.cre8-u-padding-right-xxl{padding-right:size(8) !important}.cre8-u-padding-bottom-none{padding-bottom:0 !important}.cre8-u-padding-bottom-sm{padding-bottom:size(1) !important}.cre8-u-padding-bottom-md{padding-bottom:size(2) !important}.cre8-u-padding-bottom-lg{padding-bottom:size(3) !important}.cre8-u-padding-bottom-xl{padding-bottom:size(4) !important}.cre8-u-padding-bottom-xxl{padding-bottom:size(8) !important}.cre8-u-padding-left-none{padding-left:0 !important}.cre8-u-padding-left-sm{padding-left:size(1) !important}.cre8-u-padding-left-md{padding-left:size(2) !important}.cre8-u-padding-left-lg{padding-left:size(3) !important}.cre8-u-padding-left-xl{padding-left:size(4) !important}.cre8-u-padding-left-xxl{padding-left:size(8) !important}.cre8-u-display-flex{display:flex !important}.cre8-u-display-block{display:block !important}body{font-family:var(--cre8-typography-body-default-font-family);font-size:var(--cre8-typography-body-default-font-size);font-weight:var(--cre8-typography-body-default-font-weight);line-height:var(--cre8-typography-body-default-line-height);text-decoration:var(--cre8-typography-body-default-text-decoration);text-transform:var(--cre8-typography-body-default-text-transform);display:flex;flex-direction:column;padding:0;margin:0;color:var(--cre8-color-content-default);background:var(--background-default)}@media all and (min-width: 60rem){.page-container{background:linear-gradient(90deg, #fff 0, #fff 66.66%, #f8f8f9 0, #f8f8f9 0)}}.band__inner{margin-left:2rem;margin-right:2rem}@media all and (min-width: 60rem){.band__inner{margin-right:0}}img{max-width:100%;height:auto}*,::slotted(*),*:before,*:after{box-sizing:border-box}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{--cre8-z-index-1: 1;--cre8-z-index-50: 50;--cre8-z-index-100: 100;--cre8-z-index-200: 200;--cre8-z-index-1030: 1030;--cre8-anim-fade-quick: 0.35s;--cre8-anim-ease: ease}@keyframes fadeIn{100%{opacity:1}}@keyframes slideIn{100%{transform:translateX(0)}}@keyframes slideInFwd{100%{width:272px;height:272px}}@keyframes slideOutRight{100%{width:272px;height:272px}}@keyframes slideUp{100%{transform:translateY(0)}}@media(width >= 481px){@keyframes slideInFwd{100%{width:417px;height:417px}}@keyframes slideOutRight{100%{width:417px;height:417px}}}@media(width >= 48rem){@keyframes slideInFwd{100%{width:330px;height:330px}}@keyframes slideOutRight{100%{width:330px;height:330px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 60rem){@keyframes slideInFwd{100%{width:460px;height:460px}}@keyframes slideOutRight{100%{width:460px;height:460px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 75rem){@keyframes slideInFwd{100%{width:592px;height:591px}}@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 45px))}}}@media(width >= 87.5rem){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 120px))}}}@media(width >= 2200px){@keyframes slideOutRight{100%{width:592px;height:591px;transform:translateX(calc(100vw - 592px))}}}span.ripple{position:absolute;border-radius:50%;transform:scale(0);animation:ripple 600ms linear;background-color:var(--ripple-bg-color)}@keyframes ripple{to{transform:scale(4);opacity:1}}:root{--size-base-unit: 0.5rem}[dir=rtl]{--rtlTranslateX: 50%;--rtlGradientToRight: 270deg;--rtlRotate45Inverse: -45deg}:host{display:contents}.cre8-c-table__row{display:var(--cre8-table-row-display, table-row);border-bottom:var(--cre8-table-row-border-bottom)}.cre8-c-table__row:hover{background:var(--cre8-table-row-hover-background)}:host(:nth-child(odd)) .cre8-c-table__row{background:var(--cre8-table-row-odd-background, none)}:host(:nth-child(odd)) .cre8-c-table__row:hover{background:var(--cre8-table-row-odd-hover-background, inherit)}@media all and (min-width: 768px){.cre8-c-table__row{border-bottom:inherit;display:table-row}}.cre8-c-table__row--bare{--cre8-table-cell-border-bottom-color: transparent}.cre8-c-table__row--expandable+::slotted(cre8-table-row){display:none}.cre8-c-table__row--expandable.cre8-is-expanded{--cre8-table-cell-border-bottom-color: transparent}.cre8-c-table__row--expandable.cre8-is-expanded+::slotted(cre8-table-row){display:contents}.cre8-c-table__expand-button{background-color:var(--cre8-color-bg-transparent);border-width:var(--cre8-border-width-none)}.cre8-c-table__expand-button-text{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.cre8-c-table__expand-button-icon{display:block;transition:transform .2s ease}.cre8-is-expanded .cre8-c-table__expand-button-icon{transform:rotate(90deg)}`;\nexport default styles;\n"]}