@scania/tegel 1.0.0 → 1.0.1

package/dist/types/components.d.ts

@@ -1132,7 +1132,7 @@ export namespace Components {
          */
         "name": string;
         /**
-          * With setting
+          * Unset minimum width of 208px.
          */
         "noMinWidth": boolean;
         /**
@@ -2024,8 +2024,8 @@ declare namespace LocalJSX {
         /**
           * Fires when the Accordion Item is clicked, but before it is closed or opened.
          */
-        "onTdsToggle"?: (event: TdsAccordionItemCustomEvent<{
-    expanded: boolean;
+        "onTdsToggle"?: (event: TdsAccordionItemCustomEvent<{
+    expanded: boolean;
   }>) => void;
         /**
           * When true, 16px on right padding instead of 64px
@@ -2066,14 +2066,8 @@ declare namespace LocalJSX {
         /**
           * Sends a unique Banner identifier when the close button is pressed.
          */
-        "onTdsClose"?: (event: TdsBannerCustomEvent<{
-    bannerId: string;
-  }>) => void;
-        /**
-          * Sends the unique Banner identifier when the close button is pressed.
-         */
-        "onTdsShow"?: (event: TdsBannerCustomEvent<{
-    bannerId: string;
+        "onTdsClose"?: (event: TdsBannerCustomEvent<{
+    bannerId: string;
   }>) => void;
         /**
           * Subheader text.
@@ -2178,8 +2172,8 @@ declare namespace LocalJSX {
         /**
           * Sends unique Card identifier when the Card is clicked, if clickable=true
          */
-        "onTdsClick"?: (event: TdsCardCustomEvent<{
-    cardId: string;
+        "onTdsClick"?: (event: TdsCardCustomEvent<{
+    cardId: string;
   }>) => void;
         /**
           * Subheader text in the header
@@ -2210,10 +2204,10 @@ declare namespace LocalJSX {
         /**
           * Sends unique Checkbox identifier and checked status when it is checked/unchecked.
          */
-        "onTdsChange"?: (event: TdsCheckboxCustomEvent<{
-    checkboxId: string;
-    checked: boolean;
-    value?: string;
+        "onTdsChange"?: (event: TdsCheckboxCustomEvent<{
+    checkboxId: string;
+    checked: boolean;
+    value?: string;
   }>) => void;
         /**
           * Focus event for the Checkbox
@@ -2244,16 +2238,16 @@ declare namespace LocalJSX {
         /**
           * Sends unique Chip identifier and value when it is changed (checked/unchecked). Valid only for type checkbox and radio. If no ID is specified, a random one will be generated. To use this listener, don't use the randomized ID, use a specific one of your choosing.
          */
-        "onTdsChange"?: (event: TdsChipCustomEvent<{
-    chipId: string;
-    value: string;
-    checked?: boolean;
+        "onTdsChange"?: (event: TdsChipCustomEvent<{
+    chipId: string;
+    value: string;
+    checked?: boolean;
   }>) => void;
         /**
           * Sends unique Chip identifier when Chip is clicked. Valid only for type button. If no ID is specified, a random one will be generated. To use this listener, don't use the randomized ID, use a specific one of your choosing.
          */
-        "onTdsClick"?: (event: TdsChipCustomEvent<{
-    chipId: string;
+        "onTdsClick"?: (event: TdsChipCustomEvent<{
+    chipId: string;
   }>) => void;
         /**
           * Size of the Chip component
@@ -2398,9 +2392,9 @@ declare namespace LocalJSX {
         /**
           * Change event for the Dropdown.
          */
-        "onTdsChange"?: (event: TdsDropdownCustomEvent<{
-    name: string;
-    value: string;
+        "onTdsChange"?: (event: TdsDropdownCustomEvent<{
+    name: string;
+    value: string;
   }>) => void;
         /**
           * Focus event for the Dropdown.
@@ -2439,9 +2433,9 @@ declare namespace LocalJSX {
         /**
           * Click event for the Dropdown option.
          */
-        "onTdsSelect"?: (event: TdsDropdownOptionCustomEvent<{
-    selected: boolean;
-    value: string;
+        "onTdsSelect"?: (event: TdsDropdownOptionCustomEvent<{
+    selected: boolean;
+    value: string;
   }>) => void;
         /**
           * Value for the Dropdown option.
@@ -2466,8 +2460,8 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the selected Tab is changed.
          */
-        "onTdsChange"?: (event: TdsFolderTabsCustomEvent<{
-    selectedTabIndex: number;
+        "onTdsChange"?: (event: TdsFolderTabsCustomEvent<{
+    selectedTabIndex: number;
   }>) => void;
         /**
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
@@ -2508,10 +2502,10 @@ declare namespace LocalJSX {
         /**
           * Sends unique Table identifier, column key and sorting direction to the tds-table-body component, can also be listened to in order to implement custom-sorting logic.
          */
-        "onTdsSort"?: (event: TdsHeaderCellCustomEvent<{
-    tableId: string;
-    columnKey: string;
-    sortingDirection: 'asc' | 'desc';
+        "onTdsSort"?: (event: TdsHeaderCellCustomEvent<{
+    tableId: string;
+    columnKey: string;
+    sortingDirection: 'asc' | 'desc';
   }>) => void;
         /**
           * Enables sorting on that column
@@ -2632,8 +2626,8 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the selected Tab is changed.
          */
-        "onTdsChange"?: (event: TdsInlineTabsCustomEvent<{
-    selectedTabIndex: number;
+        "onTdsChange"?: (event: TdsInlineTabsCustomEvent<{
+    selectedTabIndex: number;
   }>) => void;
         /**
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
@@ -2724,8 +2718,8 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the selected Tab is changed.
          */
-        "onTdsChange"?: (event: TdsNavigationTabsCustomEvent<{
-    selectedTabIndex: number;
+        "onTdsChange"?: (event: TdsNavigationTabsCustomEvent<{
+    selectedTabIndex: number;
   }>) => void;
         /**
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
@@ -2852,9 +2846,9 @@ declare namespace LocalJSX {
         /**
           * Sends unique Radio Button identifier and status when it is checked. If no ID is specified, a random one will be generated. To use this listener, don't use the randomized ID, use a specific one of your choosing.
          */
-        "onTdsChange"?: (event: TdsRadioButtonCustomEvent<{
-    radioId: string;
-    value: string;
+        "onTdsChange"?: (event: TdsRadioButtonCustomEvent<{
+    radioId: string;
+    value: string;
   }>) => void;
         /**
           * Unique Radio Button identifier.
@@ -2999,8 +2993,8 @@ declare namespace LocalJSX {
         /**
           * Sends the value of the slider when changed.
          */
-        "onTdsChange"?: (event: TdsSliderCustomEvent<{
-    value: string;
+        "onTdsChange"?: (event: TdsSliderCustomEvent<{
+    value: string;
   }>) => void;
         /**
           * Sets the read only state for the whole component
@@ -3122,10 +3116,10 @@ declare namespace LocalJSX {
         /**
           * Event emitted when a row is selected/deselected.
          */
-        "onTdsSelect"?: (event: TdsTableBodyRowCustomEvent<{
-    tableId: string;
-    checked: boolean;
-    selectedRows: any[];
+        "onTdsSelect"?: (event: TdsTableBodyRowCustomEvent<{
+    tableId: string;
+    checked: boolean;
+    selectedRows: any[];
   }>) => void;
         /**
           * Marks the row as selected, used for multiselect table.
@@ -3146,9 +3140,9 @@ declare namespace LocalJSX {
         /**
           * Event to send current page value to tds-table-body component, can also be listened to in order to implement custom pagination logic.
          */
-        "onTdsPagination"?: (event: TdsTableFooterCustomEvent<{
-    tableId: string;
-    paginationValue: number;
+        "onTdsPagination"?: (event: TdsTableFooterCustomEvent<{
+    tableId: string;
+    paginationValue: number;
   }>) => void;
         /**
           * Sets the number of pages.
@@ -3171,10 +3165,10 @@ declare namespace LocalJSX {
         /**
           * Event emitted when the status of the select all checkbox changes.
          */
-        "onTdsSelectAll"?: (event: TdsTableHeaderCustomEvent<{
-    tableId: string;
-    checked: boolean;
-    selectedRows: any[];
+        "onTdsSelectAll"?: (event: TdsTableHeaderCustomEvent<{
+    tableId: string;
+    checked: boolean;
+    selectedRows: any[];
   }>) => void;
     }
     interface TdsTableToolbar {
@@ -3185,9 +3179,9 @@ declare namespace LocalJSX {
         /**
           * Used for sending users' input to the main parent tds-table the component, can also be listened to in order to implement custom sorting logic.
          */
-        "onTdsFilter"?: (event: TdsTableToolbarCustomEvent<{
-    tableId: string;
-    query: string;
+        "onTdsFilter"?: (event: TdsTableToolbarCustomEvent<{
+    tableId: string;
+    query: string;
   }>) => void;
         /**
           * Adds title to the Table
@@ -3228,7 +3222,7 @@ declare namespace LocalJSX {
          */
         "name"?: string;
         /**
-          * With setting
+          * Unset minimum width of 208px.
          */
         "noMinWidth"?: boolean;
         /**
@@ -3362,8 +3356,8 @@ declare namespace LocalJSX {
         /**
           * Sends unique Toast identifier when component is closed.
          */
-        "onTdsClose"?: (event: TdsToastCustomEvent<{
-    toastId: string;
+        "onTdsClose"?: (event: TdsToastCustomEvent<{
+    toastId: string;
   }>) => void;
         /**
           * Subheader text for the component.
@@ -3402,9 +3396,9 @@ declare namespace LocalJSX {
         /**
           * Sends unique Toggle identifier and status when it is toggled.
          */
-        "onTdsToggle"?: (event: TdsToggleCustomEvent<{
-    toggleId: string;
-    checked: boolean;
+        "onTdsToggle"?: (event: TdsToggleCustomEvent<{
+    toggleId: string;
+    checked: boolean;
   }>) => void;
         /**
           * Make the Toggle required

package/dist/types/global.d.ts

@@ -1,2 +1,2 @@
-declare module '*.md';
-declare module '*.png';
+declare module '*.md';
+declare module '*.png';

package/package.json

@@ -1,80 +1,81 @@
-{
-  "name": "@scania/tegel",
-  "version": "1.0.0",
-  "description": "Tegel Design System",
-  "keywords": [
-    "tegel",
-    "scania",
-    "design",
-    "system"
-  ],
-  "homepage": "https://tegel.scania.com",
-  "bugs": {
-    "url": "https://github.com/scania-digital-design-system/tegel/issues"
-  },
-  "main": "dist/index.cjs.js",
-  "module": "dist/index.js",
-  "es2015": "dist/esm/index.mjs",
-  "es2017": "dist/esm/index.mjs",
-  "types": "dist/types/components.d.ts",
-  "collection": "dist/collection/collection-manifest.json",
-  "collection:main": "dist/collection/index.js",
-  "unpkg": "dist/components/components.esm.js",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/scania-digital-design-system/tegel.git"
-  },
-  "files": [
-    "dist/",
-    "loader/"
-  ],
-  "publishConfig": {
-    "access": "public"
-  },
-  "scripts": {
-    "build": "stencil build --docs",
-    "start": "stencil build --dev --watch --serve",
-    "test": "stencil test --spec --e2e",
-    "test.watch": "stencil test --spec --e2e --watchAll",
-    "generate": "stencil generate",
-    "build-stencil:watch": "stencil build --docs-readme --watch",
-    "commit": "npm run --prefix ../ commit",
-    "tegel-release": "./tegel-release.sh",
-    "build-storybook": "build-storybook --quiet",
-    "build-stencil-storybook": "npm run build && npm run build-storybook",
-    "start-storybook": "start-storybook -p 6006",
-    "storybook": "concurrently --raw 'npm:build-stencil:watch' 'npm:start-storybook'"
-  },
-  "dependencies": {
-    "@popperjs/core": "^2.11.8",
-    "@stencil/core": "^4.1.0",
-    "dotenv": "^16.0.3",
-    "prettier": "^2.7.1"
-  },
-  "devDependencies": {
-    "@babel/core": "^7.19.1",
-    "@stencil/sass": "^3.0.4",
-    "@storybook/addon-a11y": "^6.5.16",
-    "@storybook/addon-actions": "^6.5.16",
-    "@storybook/addon-docs": "^6.5.16",
-    "@storybook/addon-essentials": "^6.5.16",
-    "@storybook/addon-interactions": "^6.5.16",
-    "@storybook/addon-links": "^6.5.16",
-    "@storybook/addon-notes": "^5.3.21",
-    "@storybook/addons": "^6.5.15",
-    "@storybook/builder-webpack4": "^6.5.16",
-    "@storybook/html": "^6.5.15",
-    "@types/jest": "^27.0.3",
-    "addon-screen-reader": "^1.8.6",
-    "babel-loader": "^8.2.5",
-    "concurrently": "^8.0.1",
-    "highlight.js": "^11.8.0",
-    "jest": "^27.4.5",
-    "jest-cli": "^27.4.5",
-    "puppeteer": "^20.8.0",
-    "storybook-addon-designs": "^6.3.1",
-    "storybook-dark-mode": "^3.0.0",
-    "storybook-version": "^0.1.1"
-  },
-  "license": "MIT"
-}
+{
+  "name": "@scania/tegel",
+  "version": "1.0.1",
+  "description": "Tegel Design System",
+  "keywords": [
+    "tegel",
+    "scania",
+    "design",
+    "system"
+  ],
+  "homepage": "https://tegel.scania.com",
+  "bugs": {
+    "url": "https://github.com/scania-digital-design-system/tegel/issues"
+  },
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.js",
+  "es2015": "dist/esm/index.mjs",
+  "es2017": "dist/esm/index.mjs",
+  "types": "dist/types/components.d.ts",
+  "collection": "dist/collection/collection-manifest.json",
+  "collection:main": "dist/collection/index.js",
+  "unpkg": "dist/components/components.esm.js",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/scania-digital-design-system/tegel.git"
+  },
+  "files": [
+    "dist/",
+    "loader/",
+    "components/"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "stencil build --docs",
+    "start": "stencil build --dev --watch --serve",
+    "test": "stencil test --spec --e2e",
+    "test.watch": "stencil test --spec --e2e --watchAll",
+    "generate": "stencil generate",
+    "build-stencil:watch": "stencil build --docs-readme --watch",
+    "commit": "npm run --prefix ../ commit",
+    "tegel-release": "./tegel-release.sh",
+    "build-storybook": "build-storybook --quiet",
+    "build-stencil-storybook": "npm run build && npm run build-storybook",
+    "start-storybook": "start-storybook -p 6006",
+    "storybook": "concurrently --raw 'npm:build-stencil:watch' 'npm:start-storybook'"
+  },
+  "dependencies": {
+    "@popperjs/core": "^2.11.8",
+    "@stencil/core": "^4.1.0",
+    "dotenv": "^16.0.3",
+    "prettier": "^2.7.1"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.19.1",
+    "@stencil/sass": "^3.0.4",
+    "@storybook/addon-a11y": "^6.5.16",
+    "@storybook/addon-actions": "^6.5.16",
+    "@storybook/addon-docs": "^6.5.16",
+    "@storybook/addon-essentials": "^6.5.16",
+    "@storybook/addon-interactions": "^6.5.16",
+    "@storybook/addon-links": "^6.5.16",
+    "@storybook/addon-notes": "^5.3.21",
+    "@storybook/addons": "^6.5.15",
+    "@storybook/builder-webpack4": "^6.5.16",
+    "@storybook/html": "^6.5.15",
+    "@types/jest": "^27.0.3",
+    "addon-screen-reader": "^1.8.6",
+    "babel-loader": "^8.2.5",
+    "concurrently": "^8.0.1",
+    "highlight.js": "^11.8.0",
+    "jest": "^27.4.5",
+    "jest-cli": "^27.4.5",
+    "puppeteer": "^20.8.0",
+    "storybook-addon-designs": "^6.3.1",
+    "storybook-dark-mode": "^3.0.0",
+    "storybook-version": "^0.1.1"
+  },
+  "license": "MIT"
+}

package/dist/components/checkbox.js

@@ -1,74 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { g as generateUniqueId } from './utils.js';
-
-const checkboxCss = ".tds-checkbox.sc-tds-checkbox{box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-checkbox-text);display:flex;align-items:center;margin-left:-4px}.tds-checkbox.sc-tds-checkbox *.sc-tds-checkbox{box-sizing:border-box}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox{appearance:none;outline:none;margin:0;border:0;border-radius:2px;width:24px;height:24px;position:relative;cursor:pointer;flex-shrink:0;align-self:flex-start}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox+label.sc-tds-checkbox{color:var(--tds-checkbox-color);padding-left:var(--tds-spacing-element-4);padding-top:var(--tds-spacing-element-4);padding-bottom:var(--tds-spacing-element-4);cursor:pointer;display:flex;align-items:center}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::after{content:\"\";position:absolute;box-sizing:border-box}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::before{width:24px;height:24px;left:0;top:0;border-radius:4px}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::after{border:1px solid var(--tds-checkbox-interaction-01);background-color:var(--tds-checkbox-interaction-02);width:16px;height:16px;left:4px;top:4px;border-radius:2px}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:hover::before{background-color:var(--tds-checkbox-background-hover);opacity:var(--tds-checkbox-background-opacity-hover)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:focus::before{background-color:var(--tds-checkbox-background-focus);opacity:var(--tds-checkbox-background-opacity-focus);transition:opacity 0.2s ease-in-out}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox{cursor:not-allowed}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled::after,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox::after{border-color:var(--tds-checkbox-border-color-disabled-after)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled+label.sc-tds-checkbox,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox+label.sc-tds-checkbox{color:var(--tds-grey-600);cursor:not-allowed}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox:hover::before{display:none}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked::after{background-image:var(--tds-checkbox-background-img);background-color:var(--tds-checkbox-interaction-01);background-repeat:no-repeat;background-position:center}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:hover::before{background-color:var(--tds-checkbox-background-hover);opacity:var(--tds-checkbox-background-opacity-hover)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled::before{display:block;width:16px;height:16px;left:4px;top:4px;border:1px solid #b0b7c4}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled::after,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled::after{background-image:var(--tds-checkbox-background-img-disabled);background-color:var(--tds-checkbox-interaction-02);color:var(--tds-checkbox-color-disabled-after)}";
-
-const TdsCheckbox = /*@__PURE__*/ proxyCustomElement(class TdsCheckbox extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.tdsChange = createEvent(this, "tdsChange", 6);
-    this.tdsFocus = createEvent(this, "tdsFocus", 6);
-    this.tdsBlur = createEvent(this, "tdsBlur", 6);
-    this.handleChange = () => {
-      this.checked = !this.checked;
-      this.tdsChange.emit({
-        checkboxId: this.checkboxId,
-        checked: this.checked,
-        value: this.value,
-      });
-    };
-    this.name = undefined;
-    this.checkboxId = generateUniqueId();
-    this.disabled = false;
-    this.required = false;
-    this.checked = false;
-    this.value = undefined;
-  }
-  /** Toggles the checked value of the component. */
-  async toggleCheckbox() {
-    this.checked = !this.checked;
-    return {
-      checkboxId: this.checkboxId,
-      checked: this.checked,
-    };
-  }
-  /** Set the input as focus when clicking the component */
-  handleFocus(event) {
-    this.tdsFocus.emit(event);
-  }
-  /** Set the input as blur when clicking outside the component */
-  handleBlur(event) {
-    this.tdsBlur.emit(event);
-  }
-  render() {
-    return (h("div", { class: "tds-checkbox" }, h("input", { "aria-checked": this.checked, "aria-required": this.required, "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), required: this.required, type: "checkbox", name: this.name, value: this.value, id: this.checkboxId, checked: this.checked, disabled: this.disabled, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), onChange: () => {
-        this.handleChange();
-      } }), h("label", { htmlFor: this.checkboxId }, h("slot", { name: "label" }))));
-  }
-  get host() { return this; }
-  static get style() { return checkboxCss; }
-}, [6, "tds-checkbox", {
-    "name": [1],
-    "checkboxId": [1, "checkbox-id"],
-    "disabled": [4],
-    "required": [4],
-    "checked": [516],
-    "value": [1],
-    "toggleCheckbox": [64]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["tds-checkbox"];
-  components.forEach(tagName => { switch (tagName) {
-    case "tds-checkbox":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, TdsCheckbox);
-      }
-      break;
-  } });
-}
-
-export { TdsCheckbox as T, defineCustomElement as d };

package/dist/tegel/p-cf75e7c1.entry.js

@@ -1 +0,0 @@
-import{r as c,c as e,h as t,g as o}from"./p-43fe6507.js";import{g as s}from"./p-8fea52fe.js";const d=class{constructor(t){c(this,t),this.tdsChange=e(this,"tdsChange",6),this.tdsFocus=e(this,"tdsFocus",6),this.tdsBlur=e(this,"tdsBlur",6),this.handleChange=()=>{this.checked=!this.checked,this.tdsChange.emit({checkboxId:this.checkboxId,checked:this.checked,value:this.value})},this.name=void 0,this.checkboxId=s(),this.disabled=!1,this.required=!1,this.checked=!1,this.value=void 0}async toggleCheckbox(){return this.checked=!this.checked,{checkboxId:this.checkboxId,checked:this.checked}}handleFocus(c){this.tdsFocus.emit(c)}handleBlur(c){this.tdsBlur.emit(c)}render(){return t("div",{class:"tds-checkbox"},t("input",{"aria-checked":this.checked,"aria-required":this.required,"aria-describedby":this.host.getAttribute("aria-describedby"),"aria-labelledby":this.host.getAttribute("aria-labelledby"),required:this.required,type:"checkbox",name:this.name,value:this.value,id:this.checkboxId,checked:this.checked,disabled:this.disabled,onFocus:c=>this.handleFocus(c),onBlur:c=>this.handleBlur(c),onChange:()=>{this.handleChange()}}),t("label",{htmlFor:this.checkboxId},t("slot",{name:"label"})))}get host(){return o(this)}};d.style='.tds-checkbox.sc-tds-checkbox{box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-checkbox-text);display:flex;align-items:center;margin-left:-4px}.tds-checkbox.sc-tds-checkbox *.sc-tds-checkbox{box-sizing:border-box}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox{appearance:none;outline:none;margin:0;border:0;border-radius:2px;width:24px;height:24px;position:relative;cursor:pointer;flex-shrink:0;align-self:flex-start}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox+label.sc-tds-checkbox{color:var(--tds-checkbox-color);padding-left:var(--tds-spacing-element-4);padding-top:var(--tds-spacing-element-4);padding-bottom:var(--tds-spacing-element-4);cursor:pointer;display:flex;align-items:center}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::after{content:"";position:absolute;box-sizing:border-box}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::before{width:24px;height:24px;left:0;top:0;border-radius:4px}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::after{border:1px solid var(--tds-checkbox-interaction-01);background-color:var(--tds-checkbox-interaction-02);width:16px;height:16px;left:4px;top:4px;border-radius:2px}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:hover::before{background-color:var(--tds-checkbox-background-hover);opacity:var(--tds-checkbox-background-opacity-hover)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:focus::before{background-color:var(--tds-checkbox-background-focus);opacity:var(--tds-checkbox-background-opacity-focus);transition:opacity 0.2s ease-in-out}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox{cursor:not-allowed}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled::after,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox::after{border-color:var(--tds-checkbox-border-color-disabled-after)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled+label.sc-tds-checkbox,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox+label.sc-tds-checkbox{color:var(--tds-grey-600);cursor:not-allowed}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox:hover::before{display:none}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked::after{background-image:var(--tds-checkbox-background-img);background-color:var(--tds-checkbox-interaction-01);background-repeat:no-repeat;background-position:center}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:hover::before{background-color:var(--tds-checkbox-background-hover);opacity:var(--tds-checkbox-background-opacity-hover)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled::before{display:block;width:16px;height:16px;left:4px;top:4px;border:1px solid #b0b7c4}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled::after,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled::after{background-image:var(--tds-checkbox-background-img-disabled);background-color:var(--tds-checkbox-interaction-02);color:var(--tds-checkbox-color-disabled-after)}';export{d as tds_checkbox}

package/dist/tegel/p-faaa50c2.entry.js

@@ -1 +0,0 @@
-import{r as s,c as t,h as e,H as o,g as i}from"./p-43fe6507.js";import{g as r,h as a}from"./p-8fea52fe.js";const n=class{constructor(e){s(this,e),this.tdsClose=t(this,"tdsClose",7),this.tdsShow=t(this,"tdsShow",7),this.handleClose=()=>{this.tdsClose.emit({bannerId:this.bannerId}).defaultPrevented||(this.hidden=!0)},this.handleShow=()=>{this.tdsShow.emit({bannerId:this.bannerId}).defaultPrevented||(this.hidden=!1)},this.icon=void 0,this.header=void 0,this.subheader=void 0,this.variant="default",this.bannerId=r(),this.hidden=!1}async hideBanner(){this.hidden=!0}async showBanner(){this.hidden=!1}connectedCallback(){"error"===this.variant?this.icon="error":"information"===this.variant&&(this.icon="info")}render(){const s=a("subheader",this.host),t=a("subheader",this.host),i=a("actions",this.host);return e(o,{role:"banner","aria-hidden":`${this.hidden}`,"aria-live":this.host.getAttribute("aria-live")?this.host.getAttribute("aria-live"):"polite","aria-atomic":this.host.getAttribute("aria-atomic"),class:`${this.variant} ${this.hidden?"hide":"show"}`},this.icon&&e("div",{class:`banner-icon ${this.variant}`},e("tds-icon",{name:this.icon,size:"20px"})),e("div",{class:"content"},e("div",{class:"header-subheader"},this.header&&e("div",{class:"header"},this.header),s&&e("slot",{name:"header"}),this.subheader&&e("div",{class:"subheader"},this.subheader),t&&e("slot",{name:"subheader"})),i&&e("slot",{name:"actions"})),e("div",{class:"banner-close"},e("button",{onClick:()=>{this.handleClose()}},e("tds-icon",{name:"cross",size:"20px"}))))}get host(){return i(this)}};n.style=":root,.tds-mode-light{--tds-link:var(--tds-blue-500);--tds-link-hover:var(--tds-blue-400);--tds-link-focus:var(--tds-blue-400);--tds-link-visited:var(--tds-grey-900);--tds-link-disabled:var(--tds-grey-400)}:root tds-toast,.tds-mode-light tds-toast{--tds-link:var(--tds-blue-300);--tds-link-hover:var(--tds-blue-400);--tds-link-focus:var(--tds-blue-400);--tds-link-visited:var(--tds-blue-100);--tds-link-disabled:var(--tds-grey-800)}.tds-mode-dark{--tds-link:var(--tds-blue-300);--tds-link-hover:var(--tds-blue-400);--tds-link-focus:var(--tds-blue-400);--tds-link-visited:var(--tds-blue-100);--tds-link-disabled:var(--tds-grey-800)}.tds-mode-dark tds-toast{--tds-link:var(--tds-blue-500);--tds-link-hover:var(--tds-blue-400);--tds-link-focus:var(--tds-blue-400);--tds-link-visited:var(--tds-grey-900);--tds-link-disabled:var(--tds-grey-400)}:host(.hide){display:none;visibility:hidden}:host(.error){background-color:var(--tds-banner-background-error)}:host(.information){background-color:var(--tds-banner-background-info)}:host{display:flex;background-color:var(--tds-banner-background-default);z-index:400}:host .banner-icon{padding-left:20px;padding-top:14px;padding-right:12px;color:var(--tds-banner-prefix-default-color)}:host .banner-icon.error{color:var(--tds-banner-prefix-error-color)}:host .banner-icon.information{color:var(--tds-banner-prefix-info-color)}:host .content{color:var(--tds-banner-text-color);display:flex;flex-direction:column;flex-grow:1;padding:16px 0}:host .content.no-icon{padding-left:16px}:host .header-subheader{display:flex;flex-direction:column;gap:4px}:host .header,:host slot[name=header]{font:var(--tds-headline-06);letter-spacing:var(--tds-headline-06-ls)}:host .subheader,:host slot[name=subheader]{display:block;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls)}:host slot[name=actions]::slotted(*){display:block;width:fit-content;margin-top:16px}:host .banner-close{color:var(--tds-banner-x-color)}:host .banner-close button{padding-right:16px;padding-top:14px;background-color:transparent;border:none;color:var(--tds-banner-x-color)}:host .banner-close button:hover{cursor:pointer}:host .banner-close button:focus-visible{outline:none}:host .banner-close button:focus-visible tds-icon{outline:2px solid var(--tds-blue-400);outline-offset:-2px}";export{n as tds_banner}