@scania/tegel 0.0.1-beta.0 → 0.0.1-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  const index = require('./index-e1c79686.js');
6
6
 
7
7
  /*
8
- Stencil Client Patch Esm v2.19.2 | MIT Licensed | https://stenciljs.com
8
+ Stencil Client Patch Esm v2.20.0 | MIT Licensed | https://stenciljs.com
9
9
  */
10
10
  const patchEsm = () => {
11
11
  return index.promiseResolve();
@@ -3,7 +3,7 @@
3
3
  const index = require('./index-e1c79686.js');
4
4
 
5
5
  /*
6
- Stencil Client Patch Browser v2.19.2 | MIT Licensed | https://stenciljs.com
6
+ Stencil Client Patch Browser v2.20.0 | MIT Licensed | https://stenciljs.com
7
7
  */
8
8
  const patchBrowser = () => {
9
9
  const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('tegel.cjs.js', document.baseURI).href));
@@ -32,8 +32,8 @@
32
32
  ],
33
33
  "compiler": {
34
34
  "name": "@stencil/core",
35
- "version": "2.19.2",
36
- "typescriptVersion": "4.7.4"
35
+ "version": "2.20.0",
36
+ "typescriptVersion": "4.8.4"
37
37
  },
38
38
  "collections": [],
39
39
  "bundles": []
@@ -1,7 +1,7 @@
1
1
  import { p as promiseResolve, b as bootstrapLazy } from './index-b67b15a6.js';
2
2
 
3
3
  /*
4
- Stencil Client Patch Esm v2.19.2 | MIT Licensed | https://stenciljs.com
4
+ Stencil Client Patch Esm v2.20.0 | MIT Licensed | https://stenciljs.com
5
5
  */
6
6
  const patchEsm = () => {
7
7
  return promiseResolve();
package/dist/esm/tegel.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { p as promiseResolve, b as bootstrapLazy } from './index-b67b15a6.js';
2
2
 
3
3
  /*
4
- Stencil Client Patch Browser v2.19.2 | MIT Licensed | https://stenciljs.com
4
+ Stencil Client Patch Browser v2.20.0 | MIT Licensed | https://stenciljs.com
5
5
  */
6
6
  const patchBrowser = () => {
7
7
  const importMeta = import.meta.url;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@scania/tegel",
3
- "version": "0.0.1-beta.0",
3
+ "version": "0.0.1-beta.2",
4
4
  "description": "Tegel - Scania's Digital Design System",
5
5
  "keywords": [
6
6
  "tegel",
@@ -47,7 +47,7 @@
47
47
  },
48
48
  "dependencies": {
49
49
  "@popperjs/core": "^2.11.6",
50
- "@stencil/core": "^2.13.0",
50
+ "@stencil/core": "^2.20.0",
51
51
  "@storybook/addon-google-analytics": "^6.2.9",
52
52
  "concurrently": "^7.4.0",
53
53
  "dotenv": "^16.0.3",
@@ -1 +0,0 @@
1
- import{r as d,h as s}from"./p-157e1618.js";const o=class{constructor(s){d(this,s),this.text="",this.type="primary",this.variant="default",this.size="lg",this.disabled=!1,this.fullbleed=!1,this.onlyIcon=!1}componentWillLoad(){""===this.text&&(this.onlyIcon=!0)}render(){return s("button",{class:`sdds-btn sdds-btn-${this.type}\n sdds-btn-${this.size}\n ${this.disabled?"disabled":""}\n ${this.fullbleed?"sdds-btn-fullbleed":""}\n ${"variant"===this.variant?"sdds-on-white-bg":""}\n ${this.onlyIcon?"sdds-btn-only-icon":""}`},s("span",{class:"sdds-btn-text"},this.text),s("slot",{name:"icon"}))}};o.style=":root,html,.sdds-theme-light{--sdds-btn-primary-background:var(--sdds-blue-600);--sdds-btn-primary-color:var(--sdds-white);--sdds-btn-primary-border-color:transparent;--sdds-btn-primary-background-hover:var(--sdds-blue-500);--sdds-btn-primary-color-hover:var(--sdds-white);--sdds-btn-primary-border-color-hover:transparent;--sdds-btn-primary-background-active:var(--sdds-blue-700);--sdds-btn-primary-color-active:var(--sdds-white);--sdds-btn-primary-border-color-active:transparent;--sdds-btn-primary-background-focus:var(--sdds-blue-400);--sdds-btn-primary-color-focus:var(--sdds-white);--sdds-btn-primary-border-color-focus:var(--sdds-blue-600);--sdds-btn-primary-outline-color-focus:var(--sdds-blue-600);--sdds-btn-primary-background-disabled:var(--sdds-white);--sdds-btn-primary-color-disabled:var(--sdds-grey-400);--sdds-btn-primary-border-color-disabled:transparent;--sdds-btn-icon-primary-fill:var(--sdds-grey-50);--sdds-btn-icon-primary-color:var(--sdds-grey-50);--sdds-btn-primary-on-white-background-disabled:var(--sdds-grey-50);--sdds-btn-danger-on-white-background-disabled:var(--sdds-grey-50);--sdds-btn-secondary-background:transparent;--sdds-btn-secondary-color:var(--sdds-black);--sdds-btn-secondary-border-color:rgb(0 0 0 / 38%);--sdds-btn-secondary-background-hover:var(--sdds-blue-500);--sdds-btn-secondary-color-hover:var(--sdds-white);--sdds-btn-secondary-border-color-hover:var(--sdds-blue-500);--sdds-btn-secondary-background-active:transparent;--sdds-btn-secondary-color-active:var(--sdds-black);--sdds-btn-secondary-border-color-active:rgb(0 0 0 / 87%);--sdds-btn-secondary-background-focus:transparent;--sdds-btn-secondary-color-focus:var(--sdds-black);--sdds-btn-secondary-border-color-focus:var(--sdds-blue-300);--sdds-btn-secondary-outline-color:rgb(0 0 0 / 38%);--sdds-btn-secondary-background-disabled:transparent;--sdds-btn-secondary-color-disabled:rgb(0 0 0 / 38%);--sdds-btn-secondary-border-color-disabled:rgb(0 0 0 / 38%);--sdds-btn-icon-secondary-fill:var(--sdds-black);--sdds-btn-icon-secondary-color:var(--sdds-black);--sdds-btn-icon-secondary-fill-hover:var(--sdds-grey-50);--sdds-btn-icon-secondary-color-hover:var(--sdds-grey-50);--sdds-btn-icon-secondary-fill-focus:var(--sdds-black);--sdds-btn-icon-secondary-color-focus:var(--sdds-black);--sdds-btn-ghost-background:transparent;--sdds-btn-ghost-color:var(--sdds-black);--sdds-btn-ghost-border-color:transparent;--sdds-btn-ghost-background-hover:transparent;--sdds-btn-ghost-color-hover:var(--sdds-black);--sdds-btn-ghost-border-color-hover:rgb(0 0 0 / 60%);--sdds-btn-ghost-outline-color-hover:rgb(0 0 0 / 60%);--sdds-btn-ghost-background-active:transparent;--sdds-btn-ghost-color-active:var(--sdds-black);--sdds-btn-ghost-border-color-active:rgb(0 0 0 / 87%);--sdds-btn-ghost-background-focus:transparent;--sdds-btn-ghost-color-focus:var(--sdds-black);--sdds-btn-ghost-border-color-focus:var(--sdds-blue-300);--sdds-btn-ghost-outline-color-focus:var(--sdds-blue-300);--sdds-btn-ghost-background-disabled:transparent;--sdds-btn-ghost-color-disabled:rgb(0 0 0 / 38%);--sdds-btn-ghost-border-color-disabled:transparent;--sdds-btn-icon-ghost-fill:var(--sdds-black);--sdds-btn-icon-ghost-color:var(--sdds-black);--sdds-btn-danger-background:var(--sdds-red-600);--sdds-btn-danger-color:var(--sdds-white);--sdds-btn-danger-border-color:transparent;--sdds-btn-danger-background-hover:var(--sdds-red-500);--sdds-btn-danger-color-hover:var(--sdds-white);--sdds-btn-danger-border-color-hover:transparent;--sdds-btn-danger-background-active:var(--sdds-red-700);--sdds-btn-danger-color-active:var(--sdds-white);--sdds-btn-danger-border-color-active:transparent;--sdds-btn-danger-background-focus:var(--sdds-red-400);--sdds-btn-danger-color-focus:var(--sdds-white);--sdds-btn-danger-border-color-focus:var(--sdds-red-700);--sdds-btn-danger-outline-color-focus:var(--sdds-red-700);--sdds-btn-danger-background-disabled:var(--sdds-white);--sdds-btn-danger-color-disabled:rgb(0 0 0 / 38%);--sdds-btn-danger-border-color-disabled:transparent;--sdds-btn-icon-danger-fill:var(--sdds-white);--sdds-btn-icon-danger-color:var(--sdds-white)}:root .sdds-theme-dark,html .sdds-theme-dark,.sdds-theme-light .sdds-theme-dark{--sdds-btn-primary-background:var(--sdds-blue-600);--sdds-btn-primary-color:var(--sdds-white);--sdds-btn-primary-border-color:transparent;--sdds-btn-primary-background-hover:var(--sdds-blue-500);--sdds-btn-primary-color-hover:var(--sdds-white);--sdds-btn-primary-border-color-hover:transparent;--sdds-btn-primary-background-active:var(--sdds-blue-700);--sdds-btn-primary-color-active:var(--sdds-white);--sdds-btn-primary-border-color-active:transparent;--sdds-btn-primary-background-focus:var(--sdds-blue-400);--sdds-btn-primary-color-focus:var(--sdds-white);--sdds-btn-primary-border-color-focus:var(--sdds-blue-600);--sdds-btn-primary-outline-color-focus:var(--sdds-blue-600);--sdds-btn-primary-background-disabled:var(--sdds-white);--sdds-btn-primary-color-disabled:var(--sdds-grey-400);--sdds-btn-primary-border-color-disabled:transparent;--sdds-btn-icon-primary-fill:var(--sdds-grey-50);--sdds-btn-icon-primary-color:var(--sdds-grey-50);--sdds-btn-primary-on-white-background-disabled:var(--sdds-grey-50);--sdds-btn-danger-on-white-background-disabled:var(--sdds-grey-50);--sdds-btn-secondary-background:transparent;--sdds-btn-secondary-color:var(--sdds-white);--sdds-btn-secondary-border-color:var(--sdds-white);--sdds-btn-secondary-background-hover:var(--sdds-blue-500);--sdds-btn-secondary-color-hover:var(--sdds-white);--sdds-btn-secondary-border-color-hover:var(--sdds-blue-500);--sdds-btn-secondary-background-active:transparent;--sdds-btn-secondary-color-active:var(--sdds-white);--sdds-btn-secondary-border-color-active:var(--sdds-white);--sdds-btn-secondary-background-focus:transparent;--sdds-btn-secondary-color-focus:var(--sdds-white);--sdds-btn-secondary-border-color-focus:var(--sdds-blue-300);--sdds-btn-secondary-outline-color:var(--sdds-white);--sdds-btn-secondary-outline-color-focus:var(--sdds-blue-300);--sdds-btn-secondary-background-disabled:transparent;--sdds-btn-secondary-color-disabled:rgb(255 255 255 / 38%);--sdds-btn-secondary-border-color-disabled:rgb(255 255 255 / 38%);--sdds-btn-icon-secondary-fill:var(--sdds-black);--sdds-btn-icon-secondary-color:var(--sdds-black);--sdds-btn-ghost-background:transparent;--sdds-btn-ghost-color:var(--sdds-white);--sdds-btn-ghost-border-color:transparent;--sdds-btn-ghost-background-hover:transparent;--sdds-btn-ghost-color-hover:var(--sdds-white);--sdds-btn-ghost-border-color-hover:rgb(255 255 255 / 41%);--sdds-btn-ghost-outline-color-hover:rgb(255 255 255 / 41%);--sdds-btn-ghost-background-active:transparent;--sdds-btn-ghost-color-active:var(--sdds-white);--sdds-btn-ghost-border-color-active:rgb(255 255 255 / 87%);--sdds-btn-ghost-background-focus:transparent;--sdds-btn-ghost-color-focus:var(--sdds-white);--sdds-btn-ghost-border-color-focus:var(--sdds-blue-300);--sdds-btn-ghost-outline-color-focus:var(--sdds-blue-300);--sdds-btn-ghost-background-disabled:transparent;--sdds-btn-ghost-color-disabled:rgb(255 255 255/ 38%);--sdds-btn-ghost-border-color-disabled:transparent;--sdds-btn-icon-ghost-fill:var(--sdds-black);--sdds-btn-icon-ghost-color:var(--sdds-black);--sdds-btn-danger-background:var(--sdds-red-600);--sdds-btn-danger-color:var(--sdds-white);--sdds-btn-danger-border-color:transparent;--sdds-btn-danger-background-hover:var(--sdds-red-500);--sdds-btn-danger-color-hover:var(--sdds-white);--sdds-btn-danger-border-color-hover:transparent;--sdds-btn-danger-background-active:var(--sdds-red-700);--sdds-btn-danger-color-active:var(--sdds-white);--sdds-btn-danger-border-color-active:transparent;--sdds-btn-danger-background-focus:var(--sdds-red-400);--sdds-btn-danger-color-focus:var(--sdds-white);--sdds-btn-danger-border-color-focus:var(--sdds-red-700);--sdds-btn-danger-outline-color-focus:var(--sdds-red-700);--sdds-btn-danger-background-disabled:var(--sdds-grey-868);--sdds-btn-danger-color-disabled:rgb(255 255 255 / 38%);--sdds-btn-danger-border-color-disabled:transparent;--sdds-btn-icon-danger-fill:var(--sdds-black);--sdds-btn-icon-danger-color:var(--sdds-black)}.sdds-on-white-bg{--sdds-btn-primary-background-disabled:var(--sdds-btn-primary-on-white-background-disabled);--sdds-btn-danger-background-disabled:var(--sdds-btn-danger-on-white-background-disabled)}.sdds-btn-lg:not(.sdds-btn-only-icon) i.sdds-btn-icon{position:relative}.sdds-btn-lg:not(.sdds-btn-only-icon) i.sdds-btn-icon::before{font-size:20px;line-height:1;position:absolute;right:0}.sdds-btn-lg.sdds-btn-only-icon i.sdds-btn-icon::before{font-size:20px;line-height:1.25}.sdds-btn-md:not(.sdds-btn-only-icon) i.sdds-btn-icon{position:relative}.sdds-btn-md:not(.sdds-btn-only-icon) i.sdds-btn-icon::before{font-size:20px;line-height:1;position:absolute;right:0}.sdds-btn-md.sdds-btn-only-icon i.sdds-btn-icon::before{font-size:20px;line-height:1.25}.sdds-btn-sm:not(.sdds-btn-only-icon) i.sdds-btn-icon{position:relative}.sdds-btn-sm:not(.sdds-btn-only-icon) i.sdds-btn-icon::before{font-size:16px;line-height:1;position:absolute;right:0}.sdds-btn-sm.sdds-btn-only-icon i.sdds-btn-icon::before{font-size:16px;line-height:1.25}.sdds-btn.sdds-btn-primary .sdds-btn-icon{fill:var(--sdds-btn-primary-icon-fill);color:var(--sdds-btn-primary-icon-color);font-size:16px}.sdds-btn{box-sizing:border-box;font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);display:flex;align-items:center;border-radius:4px;border:none;box-shadow:none;position:relative;text-decoration:none;cursor:pointer;height:56px;padding:var(--sdds-spacing-element-20);border:1px solid}.sdds-btn *{box-sizing:border-box}.sdds-btn:disabled,.sdds-btn.disabled{cursor:unset}.sdds-btn:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn span.sdds-btn-text+.sdds-btn-icon{margin-left:var(--sdds-spacing-element-16);width:20px;height:20px;line-height:0}.sdds-btn.sdds-btn-xs{padding:var(--sdds-spacing-element-4) var(--sdds-spacing-element-8);height:24px;font-size:12px;border-radius:2px}.sdds-btn.sdds-btn-xs:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn.sdds-btn-sm{padding:var(--sdds-spacing-element-12);height:40px}.sdds-btn.sdds-btn-sm.sdds-btn-only-icon{padding:11px}.sdds-btn.sdds-btn-sm:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn.sdds-btn-sm span.sdds-btn-text+.sdds-btn-icon{margin:unset;margin-left:var(--sdds-spacing-element-24);width:16px;height:16px}.sdds-btn.sdds-btn-sm.sdds-btn-fullbleed span.sdds-btn-text+.sdds-btn-icon{margin:unset;margin-left:var(--sdds-spacing-element-12)}.sdds-btn.sdds-btn-md{padding:var(--sdds-spacing-element-16);height:48px}.sdds-btn.sdds-btn-md.sdds-btn-only-icon{padding:13px}.sdds-btn.sdds-btn-md:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn.sdds-btn-md span.sdds-btn-text+.sdds-btn-icon{margin:unset;margin-left:var(--sdds-spacing-element-20)}.sdds-btn.sdds-btn-md.sdds-btn-fullbleed span.sdds-btn-text+.sdds-btn-icon{margin-left:var(--sdds-spacing-element-16)}.sdds-btn.sdds-btn-lg{padding:var(--sdds-spacing-element-20);height:56px}.sdds-btn.sdds-btn-lg.sdds-btn-only-icon{padding:17px}.sdds-btn.sdds-btn-lg:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn.sdds-btn-lg span.sdds-btn-text+.sdds-btn-icon{margin:unset;margin-left:42px}.sdds-btn.sdds-btn-lg.sdds-btn-fullbleed span.sdds-btn-text+.sdds-btn-icon{margin-left:var(--sdds-spacing-element-16)}.sdds-btn.sdds-btn-fullbleed{width:inherit;display:flex;justify-content:center}.sdds-btn.sdds-btn-fullbleed .sdds-btn-icon,.sdds-btn.sdds-btn-fullbleed.sdds-btn-icon{margin-left:var(--sdds-spacing-element-8)}.sdds-btn span.sdds-btn-text{align-self:baseline}.sdds-btn.sdds-btn-primary{background:var(--sdds-btn-primary-background);border-color:var(--sdds-btn-primary-border-color);color:var(--sdds-btn-primary-color);outline-color:var(--sdds-btn-primary-outline-color)}.sdds-btn.sdds-btn-primary .sdds-btn-icon{fill:var(--sdds-btn-icon-primary-fill);color:var(--sdds-btn-icon-primary-fill);fill:var(--sdds-btn-icon-primary-color);color:var(--sdds-btn-icon-primary-color);font-size:16px}.sdds-btn.sdds-btn-primary:hover{background:var(--sdds-btn-primary-background-hover);border-color:var(--sdds-btn-primary-border-color-hover);color:var(--sdds-btn-primary-color-hover);outline-color:var(--sdds-btn-primary-outline-color-hover)}.sdds-btn.sdds-btn-primary:hover .sdds-btn-icon{fill:var(--sdds-btn-icon-primary-fill-hover);color:var(--sdds-btn-icon-primary-fill-hover);fill:var(--sdds-btn-icon-primary-color-hover);color:var(--sdds-btn-icon-primary-color-hover)}.sdds-btn.sdds-btn-primary:focus{background:var(--sdds-btn-primary-background-focus);border-color:var(--sdds-btn-primary-border-color-focus);color:var(--sdds-btn-primary-color-focus);outline-color:var(--sdds-btn-primary-outline-color-focus)}.sdds-btn.sdds-btn-primary:focus .sdds-btn-icon{fill:var(--sdds-btn-icon-primary-fill-focus);color:var(--sdds-btn-icon-primary-fill-focus);fill:var(--sdds-btn-icon-primary-color-focus);color:var(--sdds-btn-icon-primary-color-focus)}.sdds-btn.sdds-btn-primary:active,.sdds-btn.sdds-btn-primary.active{background:var(--sdds-btn-primary-background-active);border-color:var(--sdds-btn-primary-border-color-active);color:var(--sdds-btn-primary-color-active);outline-color:var(--sdds-btn-primary-outline-color-active)}.sdds-btn.sdds-btn-primary.disabled,.sdds-btn.sdds-btn-primary:disabled{cursor:not-allowed;background:var(--sdds-btn-primary-background-disabled);cursor:not-allowed;border-color:var(--sdds-btn-primary-border-color-disabled);cursor:not-allowed;color:var(--sdds-btn-primary-color-disabled);cursor:not-allowed;outline-color:var(--sdds-btn-primary-outline-color-disabled)}.sdds-btn.sdds-btn-primary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-primary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-primary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-primary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-secondary{background:var(--sdds-btn-secondary-background);border-color:var(--sdds-btn-secondary-border-color);color:var(--sdds-btn-secondary-color);outline-color:var(--sdds-btn-secondary-outline-color)}.sdds-btn.sdds-btn-secondary .sdds-btn-icon{fill:var(--sdds-btn-icon-secondary-fill);color:var(--sdds-btn-icon-secondary-fill);fill:var(--sdds-btn-icon-secondary-color);color:var(--sdds-btn-icon-secondary-color);font-size:16px}.sdds-btn.sdds-btn-secondary:hover{background:var(--sdds-btn-secondary-background-hover);border-color:var(--sdds-btn-secondary-border-color-hover);color:var(--sdds-btn-secondary-color-hover);outline-color:var(--sdds-btn-secondary-outline-color-hover)}.sdds-btn.sdds-btn-secondary:hover .sdds-btn-icon{fill:var(--sdds-btn-icon-secondary-fill-hover);color:var(--sdds-btn-icon-secondary-fill-hover);fill:var(--sdds-btn-icon-secondary-color-hover);color:var(--sdds-btn-icon-secondary-color-hover)}.sdds-btn.sdds-btn-secondary:focus{background:var(--sdds-btn-secondary-background-focus);border-color:var(--sdds-btn-secondary-border-color-focus);color:var(--sdds-btn-secondary-color-focus);outline-color:var(--sdds-btn-secondary-outline-color-focus)}.sdds-btn.sdds-btn-secondary:focus .sdds-btn-icon{fill:var(--sdds-btn-icon-secondary-fill-focus);color:var(--sdds-btn-icon-secondary-fill-focus);fill:var(--sdds-btn-icon-secondary-color-focus);color:var(--sdds-btn-icon-secondary-color-focus)}.sdds-btn.sdds-btn-secondary:active,.sdds-btn.sdds-btn-secondary.active{background:var(--sdds-btn-secondary-background-active);border-color:var(--sdds-btn-secondary-border-color-active);color:var(--sdds-btn-secondary-color-active);outline-color:var(--sdds-btn-secondary-outline-color-active)}.sdds-btn.sdds-btn-secondary.disabled,.sdds-btn.sdds-btn-secondary:disabled{cursor:not-allowed;background:var(--sdds-btn-secondary-background-disabled);cursor:not-allowed;border-color:var(--sdds-btn-secondary-border-color-disabled);cursor:not-allowed;color:var(--sdds-btn-secondary-color-disabled);cursor:not-allowed;outline-color:var(--sdds-btn-secondary-outline-color-disabled)}.sdds-btn.sdds-btn-secondary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-secondary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-secondary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-secondary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-ghost{background:var(--sdds-btn-ghost-background);border-color:var(--sdds-btn-ghost-border-color);color:var(--sdds-btn-ghost-color);outline-color:var(--sdds-btn-ghost-outline-color)}.sdds-btn.sdds-btn-ghost .sdds-btn-icon{fill:var(--sdds-btn-icon-ghost-fill);color:var(--sdds-btn-icon-ghost-fill);fill:var(--sdds-btn-icon-ghost-color);color:var(--sdds-btn-icon-ghost-color);font-size:16px}.sdds-btn.sdds-btn-ghost:hover{background:var(--sdds-btn-ghost-background-hover);border-color:var(--sdds-btn-ghost-border-color-hover);color:var(--sdds-btn-ghost-color-hover);outline-color:var(--sdds-btn-ghost-outline-color-hover)}.sdds-btn.sdds-btn-ghost:hover .sdds-btn-icon{fill:var(--sdds-btn-icon-ghost-fill-hover);color:var(--sdds-btn-icon-ghost-fill-hover);fill:var(--sdds-btn-icon-ghost-color-hover);color:var(--sdds-btn-icon-ghost-color-hover)}.sdds-btn.sdds-btn-ghost:focus{background:var(--sdds-btn-ghost-background-focus);border-color:var(--sdds-btn-ghost-border-color-focus);color:var(--sdds-btn-ghost-color-focus);outline-color:var(--sdds-btn-ghost-outline-color-focus)}.sdds-btn.sdds-btn-ghost:focus .sdds-btn-icon{fill:var(--sdds-btn-icon-ghost-fill-focus);color:var(--sdds-btn-icon-ghost-fill-focus);fill:var(--sdds-btn-icon-ghost-color-focus);color:var(--sdds-btn-icon-ghost-color-focus)}.sdds-btn.sdds-btn-ghost:active,.sdds-btn.sdds-btn-ghost.active{background:var(--sdds-btn-ghost-background-active);border-color:var(--sdds-btn-ghost-border-color-active);color:var(--sdds-btn-ghost-color-active);outline-color:var(--sdds-btn-ghost-outline-color-active)}.sdds-btn.sdds-btn-ghost.disabled,.sdds-btn.sdds-btn-ghost:disabled{cursor:not-allowed;background:var(--sdds-btn-ghost-background-disabled);cursor:not-allowed;border-color:var(--sdds-btn-ghost-border-color-disabled);cursor:not-allowed;color:var(--sdds-btn-ghost-color-disabled);cursor:not-allowed;outline-color:var(--sdds-btn-ghost-outline-color-disabled)}.sdds-btn.sdds-btn-ghost.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-ghost.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-ghost.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-ghost.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-danger{background:var(--sdds-btn-danger-background);border-color:var(--sdds-btn-danger-border-color);color:var(--sdds-btn-danger-color);outline-color:var(--sdds-btn-danger-outline-color)}.sdds-btn.sdds-btn-danger .sdds-btn-icon{fill:var(--sdds-btn-icon-danger-fill);color:var(--sdds-btn-icon-danger-fill);fill:var(--sdds-btn-icon-danger-color);color:var(--sdds-btn-icon-danger-color);font-size:16px}.sdds-btn.sdds-btn-danger:hover{background:var(--sdds-btn-danger-background-hover);border-color:var(--sdds-btn-danger-border-color-hover);color:var(--sdds-btn-danger-color-hover);outline-color:var(--sdds-btn-danger-outline-color-hover)}.sdds-btn.sdds-btn-danger:hover .sdds-btn-icon{fill:var(--sdds-btn-icon-danger-fill-hover);color:var(--sdds-btn-icon-danger-fill-hover);fill:var(--sdds-btn-icon-danger-color-hover);color:var(--sdds-btn-icon-danger-color-hover)}.sdds-btn.sdds-btn-danger:focus{background:var(--sdds-btn-danger-background-focus);border-color:var(--sdds-btn-danger-border-color-focus);color:var(--sdds-btn-danger-color-focus);outline-color:var(--sdds-btn-danger-outline-color-focus)}.sdds-btn.sdds-btn-danger:focus .sdds-btn-icon{fill:var(--sdds-btn-icon-danger-fill-focus);color:var(--sdds-btn-icon-danger-fill-focus);fill:var(--sdds-btn-icon-danger-color-focus);color:var(--sdds-btn-icon-danger-color-focus)}.sdds-btn.sdds-btn-danger:active,.sdds-btn.sdds-btn-danger.active{background:var(--sdds-btn-danger-background-active);border-color:var(--sdds-btn-danger-border-color-active);color:var(--sdds-btn-danger-color-active);outline-color:var(--sdds-btn-danger-outline-color-active)}.sdds-btn.sdds-btn-danger.disabled,.sdds-btn.sdds-btn-danger:disabled{cursor:not-allowed;background:var(--sdds-btn-danger-background-disabled);cursor:not-allowed;border-color:var(--sdds-btn-danger-border-color-disabled);cursor:not-allowed;color:var(--sdds-btn-danger-color-disabled);cursor:not-allowed;outline-color:var(--sdds-btn-danger-outline-color-disabled)}.sdds-btn.sdds-btn-danger.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-danger.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-danger.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-danger.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}i.sdds-btn-icon[slot=icon]{line-height:1}:host(sdds-button){display:flex;align-items:center}:host(sdds-button) ::slotted([slot=icon]){width:var(--sdds-spacing-element-20);height:var(--sdds-spacing-element-20)}:host(sdds-button) .sdds-btn-sm ::slotted([slot=icon]){width:var(--sdds-spacing-element-16);height:var(--sdds-spacing-element-16)}:host(sdds-button[fullbleed]){width:inherit;justify-content:center}:host(sdds-button[onlyIcon]) .sdds-btn-sm{padding:11px}:host(sdds-button[onlyIcon]) .sdds-btn-md{padding:13px}:host(sdds-button[onlyIcon]) .sdds-btn-lg{padding:17px}:host(sdds-button:not([onlyIcon])){display:flex;align-items:center}:host(sdds-button:not([onlyIcon])) .sdds-btn-sm ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-24);width:var(--sdds-spacing-element-16);height:var(--sdds-spacing-element-16)}:host(sdds-button:not([onlyIcon])) .sdds-btn-sm.sdds-btn-fullbleed ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-12)}:host(sdds-button:not([onlyIcon])) .sdds-btn-md ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-20);width:var(--sdds-spacing-element-20);height:var(--sdds-spacing-element-20)}:host(sdds-button:not([onlyIcon])) .sdds-btn-md.sdds-btn-fullbleed ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-16)}:host(sdds-button:not([onlyIcon])) .sdds-btn-lg ::slotted([slot=icon]){margin-left:28px;width:var(--sdds-spacing-element-20);height:var(--sdds-spacing-element-20)}:host(sdds-button:not([onlyIcon])) .sdds-btn-lg.sdds-btn-fullbleed ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-16)}";export{o as sdds_button}
@@ -1 +0,0 @@
1
- import{r as d,h as s}from"./p-157e1618.js";const o=class{constructor(s){d(this,s),this.text="",this.type="primary",this.variant="default",this.size="lg",this.disabled=!1,this.fullbleed=!1,this.onlyIcon=!1}componentWillLoad(){""===this.text&&(this.onlyIcon=!0)}render(){return s("button",{class:`sdds-btn sdds-btn-${this.type}\n sdds-btn-${this.size}\n ${this.disabled?"disabled":""}\n ${this.fullbleed?"sdds-btn-fullbleed":""}\n ${"variant"===this.variant?"sdds-on-white-bg":""}\n ${this.onlyIcon?"sdds-btn-only-icon":""}`},s("span",{class:"sdds-btn-text"},this.text),s("slot",{name:"icon"}))}};o.style=":root,html,.sdds-theme-light{--sdds-btn-primary-background:var(--sdds-blue-600);--sdds-btn-primary-color:var(--sdds-white);--sdds-btn-primary-border-color:transparent;--sdds-btn-primary-background-hover:var(--sdds-blue-500);--sdds-btn-primary-color-hover:var(--sdds-white);--sdds-btn-primary-border-color-hover:transparent;--sdds-btn-primary-background-active:var(--sdds-blue-700);--sdds-btn-primary-color-active:var(--sdds-white);--sdds-btn-primary-border-color-active:transparent;--sdds-btn-primary-background-focus:var(--sdds-blue-400);--sdds-btn-primary-color-focus:var(--sdds-white);--sdds-btn-primary-border-color-focus:var(--sdds-blue-600);--sdds-btn-primary-outline-color-focus:var(--sdds-blue-600);--sdds-btn-primary-background-disabled:var(--sdds-white);--sdds-btn-primary-color-disabled:var(--sdds-grey-400);--sdds-btn-primary-border-color-disabled:transparent;--sdds-btn-icon-primary-fill:var(--sdds-grey-50);--sdds-btn-icon-primary-color:var(--sdds-grey-50);--sdds-btn-primary-on-white-background-disabled:var(--sdds-grey-50);--sdds-btn-danger-on-white-background-disabled:var(--sdds-grey-50);--sdds-btn-secondary-background:transparent;--sdds-btn-secondary-color:var(--sdds-black);--sdds-btn-secondary-border-color:rgb(0 0 0 / 38%);--sdds-btn-secondary-background-hover:var(--sdds-blue-500);--sdds-btn-secondary-color-hover:var(--sdds-white);--sdds-btn-secondary-border-color-hover:var(--sdds-blue-500);--sdds-btn-secondary-background-active:transparent;--sdds-btn-secondary-color-active:var(--sdds-black);--sdds-btn-secondary-border-color-active:rgb(0 0 0 / 87%);--sdds-btn-secondary-background-focus:transparent;--sdds-btn-secondary-color-focus:var(--sdds-black);--sdds-btn-secondary-border-color-focus:var(--sdds-blue-300);--sdds-btn-secondary-outline-color:rgb(0 0 0 / 38%);--sdds-btn-secondary-background-disabled:transparent;--sdds-btn-secondary-color-disabled:rgb(0 0 0 / 38%);--sdds-btn-secondary-border-color-disabled:rgb(0 0 0 / 38%);--sdds-btn-icon-secondary-fill:var(--sdds-black);--sdds-btn-icon-secondary-color:var(--sdds-black);--sdds-btn-icon-secondary-fill-hover:var(--sdds-grey-50);--sdds-btn-icon-secondary-color-hover:var(--sdds-grey-50);--sdds-btn-icon-secondary-fill-focus:var(--sdds-black);--sdds-btn-icon-secondary-color-focus:var(--sdds-black);--sdds-btn-ghost-background:transparent;--sdds-btn-ghost-color:var(--sdds-black);--sdds-btn-ghost-border-color:transparent;--sdds-btn-ghost-background-hover:transparent;--sdds-btn-ghost-color-hover:var(--sdds-black);--sdds-btn-ghost-border-color-hover:rgb(0 0 0 / 60%);--sdds-btn-ghost-outline-color-hover:rgb(0 0 0 / 60%);--sdds-btn-ghost-background-active:transparent;--sdds-btn-ghost-color-active:var(--sdds-black);--sdds-btn-ghost-border-color-active:rgb(0 0 0 / 87%);--sdds-btn-ghost-background-focus:transparent;--sdds-btn-ghost-color-focus:var(--sdds-black);--sdds-btn-ghost-border-color-focus:var(--sdds-blue-300);--sdds-btn-ghost-outline-color-focus:var(--sdds-blue-300);--sdds-btn-ghost-background-disabled:transparent;--sdds-btn-ghost-color-disabled:rgb(0 0 0 / 38%);--sdds-btn-ghost-border-color-disabled:transparent;--sdds-btn-icon-ghost-fill:var(--sdds-black);--sdds-btn-icon-ghost-color:var(--sdds-black);--sdds-btn-danger-background:var(--sdds-red-600);--sdds-btn-danger-color:var(--sdds-white);--sdds-btn-danger-border-color:transparent;--sdds-btn-danger-background-hover:var(--sdds-red-500);--sdds-btn-danger-color-hover:var(--sdds-white);--sdds-btn-danger-border-color-hover:transparent;--sdds-btn-danger-background-active:var(--sdds-red-700);--sdds-btn-danger-color-active:var(--sdds-white);--sdds-btn-danger-border-color-active:transparent;--sdds-btn-danger-background-focus:var(--sdds-red-400);--sdds-btn-danger-color-focus:var(--sdds-white);--sdds-btn-danger-border-color-focus:var(--sdds-red-700);--sdds-btn-danger-outline-color-focus:var(--sdds-red-700);--sdds-btn-danger-background-disabled:var(--sdds-white);--sdds-btn-danger-color-disabled:rgb(0 0 0 / 38%);--sdds-btn-danger-border-color-disabled:transparent;--sdds-btn-icon-danger-fill:var(--sdds-white);--sdds-btn-icon-danger-color:var(--sdds-white)}:root .sdds-theme-dark,html .sdds-theme-dark,.sdds-theme-light .sdds-theme-dark{--sdds-btn-primary-background:var(--sdds-blue-600);--sdds-btn-primary-color:var(--sdds-white);--sdds-btn-primary-border-color:transparent;--sdds-btn-primary-background-hover:var(--sdds-blue-500);--sdds-btn-primary-color-hover:var(--sdds-white);--sdds-btn-primary-border-color-hover:transparent;--sdds-btn-primary-background-active:var(--sdds-blue-700);--sdds-btn-primary-color-active:var(--sdds-white);--sdds-btn-primary-border-color-active:transparent;--sdds-btn-primary-background-focus:var(--sdds-blue-400);--sdds-btn-primary-color-focus:var(--sdds-white);--sdds-btn-primary-border-color-focus:var(--sdds-blue-600);--sdds-btn-primary-outline-color-focus:var(--sdds-blue-600);--sdds-btn-primary-background-disabled:var(--sdds-white);--sdds-btn-primary-color-disabled:var(--sdds-grey-400);--sdds-btn-primary-border-color-disabled:transparent;--sdds-btn-icon-primary-fill:var(--sdds-grey-50);--sdds-btn-icon-primary-color:var(--sdds-grey-50);--sdds-btn-primary-on-white-background-disabled:var(--sdds-grey-50);--sdds-btn-danger-on-white-background-disabled:var(--sdds-grey-50);--sdds-btn-secondary-background:transparent;--sdds-btn-secondary-color:var(--sdds-white);--sdds-btn-secondary-border-color:var(--sdds-white);--sdds-btn-secondary-background-hover:var(--sdds-blue-500);--sdds-btn-secondary-color-hover:var(--sdds-white);--sdds-btn-secondary-border-color-hover:var(--sdds-blue-500);--sdds-btn-secondary-background-active:transparent;--sdds-btn-secondary-color-active:var(--sdds-white);--sdds-btn-secondary-border-color-active:var(--sdds-white);--sdds-btn-secondary-background-focus:transparent;--sdds-btn-secondary-color-focus:var(--sdds-white);--sdds-btn-secondary-border-color-focus:var(--sdds-blue-300);--sdds-btn-secondary-outline-color:var(--sdds-white);--sdds-btn-secondary-outline-color-focus:var(--sdds-blue-300);--sdds-btn-secondary-background-disabled:transparent;--sdds-btn-secondary-color-disabled:rgb(255 255 255 / 38%);--sdds-btn-secondary-border-color-disabled:rgb(255 255 255 / 38%);--sdds-btn-icon-secondary-fill:var(--sdds-black);--sdds-btn-icon-secondary-color:var(--sdds-black);--sdds-btn-ghost-background:transparent;--sdds-btn-ghost-color:var(--sdds-white);--sdds-btn-ghost-border-color:transparent;--sdds-btn-ghost-background-hover:transparent;--sdds-btn-ghost-color-hover:var(--sdds-white);--sdds-btn-ghost-border-color-hover:rgb(255 255 255 / 41%);--sdds-btn-ghost-outline-color-hover:rgb(255 255 255 / 41%);--sdds-btn-ghost-background-active:transparent;--sdds-btn-ghost-color-active:var(--sdds-white);--sdds-btn-ghost-border-color-active:rgb(255 255 255 / 87%);--sdds-btn-ghost-background-focus:transparent;--sdds-btn-ghost-color-focus:var(--sdds-white);--sdds-btn-ghost-border-color-focus:var(--sdds-blue-300);--sdds-btn-ghost-outline-color-focus:var(--sdds-blue-300);--sdds-btn-ghost-background-disabled:transparent;--sdds-btn-ghost-color-disabled:rgb(255 255 255/ 38%);--sdds-btn-ghost-border-color-disabled:transparent;--sdds-btn-icon-ghost-fill:var(--sdds-black);--sdds-btn-icon-ghost-color:var(--sdds-black);--sdds-btn-danger-background:var(--sdds-red-600);--sdds-btn-danger-color:var(--sdds-white);--sdds-btn-danger-border-color:transparent;--sdds-btn-danger-background-hover:var(--sdds-red-500);--sdds-btn-danger-color-hover:var(--sdds-white);--sdds-btn-danger-border-color-hover:transparent;--sdds-btn-danger-background-active:var(--sdds-red-700);--sdds-btn-danger-color-active:var(--sdds-white);--sdds-btn-danger-border-color-active:transparent;--sdds-btn-danger-background-focus:var(--sdds-red-400);--sdds-btn-danger-color-focus:var(--sdds-white);--sdds-btn-danger-border-color-focus:var(--sdds-red-700);--sdds-btn-danger-outline-color-focus:var(--sdds-red-700);--sdds-btn-danger-background-disabled:var(--sdds-grey-868);--sdds-btn-danger-color-disabled:rgb(255 255 255 / 38%);--sdds-btn-danger-border-color-disabled:transparent;--sdds-btn-icon-danger-fill:var(--sdds-black);--sdds-btn-icon-danger-color:var(--sdds-black)}.sdds-on-white-bg{--sdds-btn-primary-background-disabled:var(--sdds-btn-primary-on-white-background-disabled);--sdds-btn-danger-background-disabled:var(--sdds-btn-danger-on-white-background-disabled)}.sdds-btn-lg:not(.sdds-btn-only-icon) i.sdds-btn-icon{position:relative}.sdds-btn-lg:not(.sdds-btn-only-icon) i.sdds-btn-icon::before{font-size:20px;line-height:1;position:absolute;right:0}.sdds-btn-lg.sdds-btn-only-icon i.sdds-btn-icon::before{font-size:20px;line-height:1.25}.sdds-btn-md:not(.sdds-btn-only-icon) i.sdds-btn-icon{position:relative}.sdds-btn-md:not(.sdds-btn-only-icon) i.sdds-btn-icon::before{font-size:20px;line-height:1;position:absolute;right:0}.sdds-btn-md.sdds-btn-only-icon i.sdds-btn-icon::before{font-size:20px;line-height:1.25}.sdds-btn-sm:not(.sdds-btn-only-icon) i.sdds-btn-icon{position:relative}.sdds-btn-sm:not(.sdds-btn-only-icon) i.sdds-btn-icon::before{font-size:16px;line-height:1;position:absolute;right:0}.sdds-btn-sm.sdds-btn-only-icon i.sdds-btn-icon::before{font-size:16px;line-height:1.25}.sdds-btn.sdds-btn-primary .sdds-btn-icon{fill:var(--sdds-btn-primary-icon-fill);color:var(--sdds-btn-primary-icon-color);font-size:16px}.sdds-btn{font:var(--sdds-detail-02);letter-spacing:var(--sdds-detail-02-ls);display:flex;align-items:center;border-radius:4px;border:none;box-shadow:none;position:relative;text-decoration:none;cursor:pointer;height:56px;padding:var(--sdds-spacing-element-20);border:1px solid}.sdds-btn:disabled,.sdds-btn.disabled{cursor:unset}.sdds-btn:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn span.sdds-btn-text+.sdds-btn-icon{margin-left:var(--sdds-spacing-element-16);width:20px;height:20px;line-height:0}.sdds-btn.sdds-btn-xs{padding:var(--sdds-spacing-element-4) var(--sdds-spacing-element-8);height:24px;font-size:12px;border-radius:2px}.sdds-btn.sdds-btn-xs:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn.sdds-btn-sm{padding:var(--sdds-spacing-element-12);height:40px}.sdds-btn.sdds-btn-sm.sdds-btn-only-icon{padding:11px}.sdds-btn.sdds-btn-sm:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn.sdds-btn-sm span.sdds-btn-text+.sdds-btn-icon{margin:unset;margin-left:var(--sdds-spacing-element-24);width:16px;height:16px}.sdds-btn.sdds-btn-sm.sdds-btn-fullbleed span.sdds-btn-text+.sdds-btn-icon{margin:unset;margin-left:var(--sdds-spacing-element-12)}.sdds-btn.sdds-btn-md{padding:var(--sdds-spacing-element-16);height:48px}.sdds-btn.sdds-btn-md.sdds-btn-only-icon{padding:13px}.sdds-btn.sdds-btn-md:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn.sdds-btn-md span.sdds-btn-text+.sdds-btn-icon{margin:unset;margin-left:var(--sdds-spacing-element-20)}.sdds-btn.sdds-btn-md.sdds-btn-fullbleed span.sdds-btn-text+.sdds-btn-icon{margin-left:var(--sdds-spacing-element-16)}.sdds-btn.sdds-btn-lg{padding:var(--sdds-spacing-element-20);height:56px}.sdds-btn.sdds-btn-lg.sdds-btn-only-icon{padding:17px}.sdds-btn.sdds-btn-lg:focus{outline:2px solid var(--sdds-blue-400);outline-offset:-2px}.sdds-btn.sdds-btn-lg span.sdds-btn-text+.sdds-btn-icon{margin:unset;margin-left:42px}.sdds-btn.sdds-btn-lg.sdds-btn-fullbleed span.sdds-btn-text+.sdds-btn-icon{margin-left:var(--sdds-spacing-element-16)}.sdds-btn.sdds-btn-fullbleed{width:inherit;display:flex;justify-content:center}.sdds-btn.sdds-btn-fullbleed .sdds-btn-icon,.sdds-btn.sdds-btn-fullbleed.sdds-btn-icon{margin-left:var(--sdds-spacing-element-8)}.sdds-btn span.sdds-btn-text{align-self:baseline}.sdds-btn.sdds-btn-primary{background:var(--sdds-btn-primary-background);border-color:var(--sdds-btn-primary-border-color);color:var(--sdds-btn-primary-color);outline-color:var(--sdds-btn-primary-outline-color)}.sdds-btn.sdds-btn-primary .sdds-btn-icon{fill:var(--sdds-btn-icon-primary-fill);color:var(--sdds-btn-icon-primary-fill);fill:var(--sdds-btn-icon-primary-color);color:var(--sdds-btn-icon-primary-color);font-size:16px}.sdds-btn.sdds-btn-primary:hover{background:var(--sdds-btn-primary-background-hover);border-color:var(--sdds-btn-primary-border-color-hover);color:var(--sdds-btn-primary-color-hover);outline-color:var(--sdds-btn-primary-outline-color-hover)}.sdds-btn.sdds-btn-primary:hover .sdds-btn-icon{fill:var(--sdds-btn-icon-primary-fill-hover);color:var(--sdds-btn-icon-primary-fill-hover);fill:var(--sdds-btn-icon-primary-color-hover);color:var(--sdds-btn-icon-primary-color-hover)}.sdds-btn.sdds-btn-primary:focus{background:var(--sdds-btn-primary-background-focus);border-color:var(--sdds-btn-primary-border-color-focus);color:var(--sdds-btn-primary-color-focus);outline-color:var(--sdds-btn-primary-outline-color-focus)}.sdds-btn.sdds-btn-primary:focus .sdds-btn-icon{fill:var(--sdds-btn-icon-primary-fill-focus);color:var(--sdds-btn-icon-primary-fill-focus);fill:var(--sdds-btn-icon-primary-color-focus);color:var(--sdds-btn-icon-primary-color-focus)}.sdds-btn.sdds-btn-primary:active,.sdds-btn.sdds-btn-primary.active{background:var(--sdds-btn-primary-background-active);border-color:var(--sdds-btn-primary-border-color-active);color:var(--sdds-btn-primary-color-active);outline-color:var(--sdds-btn-primary-outline-color-active)}.sdds-btn.sdds-btn-primary.disabled,.sdds-btn.sdds-btn-primary:disabled{cursor:not-allowed;background:var(--sdds-btn-primary-background-disabled);cursor:not-allowed;border-color:var(--sdds-btn-primary-border-color-disabled);cursor:not-allowed;color:var(--sdds-btn-primary-color-disabled);cursor:not-allowed;outline-color:var(--sdds-btn-primary-outline-color-disabled)}.sdds-btn.sdds-btn-primary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-primary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-primary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-primary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-primary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-secondary{background:var(--sdds-btn-secondary-background);border-color:var(--sdds-btn-secondary-border-color);color:var(--sdds-btn-secondary-color);outline-color:var(--sdds-btn-secondary-outline-color)}.sdds-btn.sdds-btn-secondary .sdds-btn-icon{fill:var(--sdds-btn-icon-secondary-fill);color:var(--sdds-btn-icon-secondary-fill);fill:var(--sdds-btn-icon-secondary-color);color:var(--sdds-btn-icon-secondary-color);font-size:16px}.sdds-btn.sdds-btn-secondary:hover{background:var(--sdds-btn-secondary-background-hover);border-color:var(--sdds-btn-secondary-border-color-hover);color:var(--sdds-btn-secondary-color-hover);outline-color:var(--sdds-btn-secondary-outline-color-hover)}.sdds-btn.sdds-btn-secondary:hover .sdds-btn-icon{fill:var(--sdds-btn-icon-secondary-fill-hover);color:var(--sdds-btn-icon-secondary-fill-hover);fill:var(--sdds-btn-icon-secondary-color-hover);color:var(--sdds-btn-icon-secondary-color-hover)}.sdds-btn.sdds-btn-secondary:focus{background:var(--sdds-btn-secondary-background-focus);border-color:var(--sdds-btn-secondary-border-color-focus);color:var(--sdds-btn-secondary-color-focus);outline-color:var(--sdds-btn-secondary-outline-color-focus)}.sdds-btn.sdds-btn-secondary:focus .sdds-btn-icon{fill:var(--sdds-btn-icon-secondary-fill-focus);color:var(--sdds-btn-icon-secondary-fill-focus);fill:var(--sdds-btn-icon-secondary-color-focus);color:var(--sdds-btn-icon-secondary-color-focus)}.sdds-btn.sdds-btn-secondary:active,.sdds-btn.sdds-btn-secondary.active{background:var(--sdds-btn-secondary-background-active);border-color:var(--sdds-btn-secondary-border-color-active);color:var(--sdds-btn-secondary-color-active);outline-color:var(--sdds-btn-secondary-outline-color-active)}.sdds-btn.sdds-btn-secondary.disabled,.sdds-btn.sdds-btn-secondary:disabled{cursor:not-allowed;background:var(--sdds-btn-secondary-background-disabled);cursor:not-allowed;border-color:var(--sdds-btn-secondary-border-color-disabled);cursor:not-allowed;color:var(--sdds-btn-secondary-color-disabled);cursor:not-allowed;outline-color:var(--sdds-btn-secondary-outline-color-disabled)}.sdds-btn.sdds-btn-secondary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-secondary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-secondary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-secondary.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-secondary:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-ghost{background:var(--sdds-btn-ghost-background);border-color:var(--sdds-btn-ghost-border-color);color:var(--sdds-btn-ghost-color);outline-color:var(--sdds-btn-ghost-outline-color)}.sdds-btn.sdds-btn-ghost .sdds-btn-icon{fill:var(--sdds-btn-icon-ghost-fill);color:var(--sdds-btn-icon-ghost-fill);fill:var(--sdds-btn-icon-ghost-color);color:var(--sdds-btn-icon-ghost-color);font-size:16px}.sdds-btn.sdds-btn-ghost:hover{background:var(--sdds-btn-ghost-background-hover);border-color:var(--sdds-btn-ghost-border-color-hover);color:var(--sdds-btn-ghost-color-hover);outline-color:var(--sdds-btn-ghost-outline-color-hover)}.sdds-btn.sdds-btn-ghost:hover .sdds-btn-icon{fill:var(--sdds-btn-icon-ghost-fill-hover);color:var(--sdds-btn-icon-ghost-fill-hover);fill:var(--sdds-btn-icon-ghost-color-hover);color:var(--sdds-btn-icon-ghost-color-hover)}.sdds-btn.sdds-btn-ghost:focus{background:var(--sdds-btn-ghost-background-focus);border-color:var(--sdds-btn-ghost-border-color-focus);color:var(--sdds-btn-ghost-color-focus);outline-color:var(--sdds-btn-ghost-outline-color-focus)}.sdds-btn.sdds-btn-ghost:focus .sdds-btn-icon{fill:var(--sdds-btn-icon-ghost-fill-focus);color:var(--sdds-btn-icon-ghost-fill-focus);fill:var(--sdds-btn-icon-ghost-color-focus);color:var(--sdds-btn-icon-ghost-color-focus)}.sdds-btn.sdds-btn-ghost:active,.sdds-btn.sdds-btn-ghost.active{background:var(--sdds-btn-ghost-background-active);border-color:var(--sdds-btn-ghost-border-color-active);color:var(--sdds-btn-ghost-color-active);outline-color:var(--sdds-btn-ghost-outline-color-active)}.sdds-btn.sdds-btn-ghost.disabled,.sdds-btn.sdds-btn-ghost:disabled{cursor:not-allowed;background:var(--sdds-btn-ghost-background-disabled);cursor:not-allowed;border-color:var(--sdds-btn-ghost-border-color-disabled);cursor:not-allowed;color:var(--sdds-btn-ghost-color-disabled);cursor:not-allowed;outline-color:var(--sdds-btn-ghost-outline-color-disabled)}.sdds-btn.sdds-btn-ghost.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-ghost.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-ghost.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-ghost.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-ghost:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-danger{background:var(--sdds-btn-danger-background);border-color:var(--sdds-btn-danger-border-color);color:var(--sdds-btn-danger-color);outline-color:var(--sdds-btn-danger-outline-color)}.sdds-btn.sdds-btn-danger .sdds-btn-icon{fill:var(--sdds-btn-icon-danger-fill);color:var(--sdds-btn-icon-danger-fill);fill:var(--sdds-btn-icon-danger-color);color:var(--sdds-btn-icon-danger-color);font-size:16px}.sdds-btn.sdds-btn-danger:hover{background:var(--sdds-btn-danger-background-hover);border-color:var(--sdds-btn-danger-border-color-hover);color:var(--sdds-btn-danger-color-hover);outline-color:var(--sdds-btn-danger-outline-color-hover)}.sdds-btn.sdds-btn-danger:hover .sdds-btn-icon{fill:var(--sdds-btn-icon-danger-fill-hover);color:var(--sdds-btn-icon-danger-fill-hover);fill:var(--sdds-btn-icon-danger-color-hover);color:var(--sdds-btn-icon-danger-color-hover)}.sdds-btn.sdds-btn-danger:focus{background:var(--sdds-btn-danger-background-focus);border-color:var(--sdds-btn-danger-border-color-focus);color:var(--sdds-btn-danger-color-focus);outline-color:var(--sdds-btn-danger-outline-color-focus)}.sdds-btn.sdds-btn-danger:focus .sdds-btn-icon{fill:var(--sdds-btn-icon-danger-fill-focus);color:var(--sdds-btn-icon-danger-fill-focus);fill:var(--sdds-btn-icon-danger-color-focus);color:var(--sdds-btn-icon-danger-color-focus)}.sdds-btn.sdds-btn-danger:active,.sdds-btn.sdds-btn-danger.active{background:var(--sdds-btn-danger-background-active);border-color:var(--sdds-btn-danger-border-color-active);color:var(--sdds-btn-danger-color-active);outline-color:var(--sdds-btn-danger-outline-color-active)}.sdds-btn.sdds-btn-danger.disabled,.sdds-btn.sdds-btn-danger:disabled{cursor:not-allowed;background:var(--sdds-btn-danger-background-disabled);cursor:not-allowed;border-color:var(--sdds-btn-danger-border-color-disabled);cursor:not-allowed;color:var(--sdds-btn-danger-color-disabled);cursor:not-allowed;outline-color:var(--sdds-btn-danger-outline-color-disabled)}.sdds-btn.sdds-btn-danger.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-danger.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-danger.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}.sdds-btn.sdds-btn-danger.disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger.disabled.sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled .sdds-btn-icon,.sdds-btn.sdds-btn-danger:disabled.sdds-btn-icon{color:var(--sdds-grey-300)}i.sdds-btn-icon[slot=icon]{line-height:1}:host(sdds-button){display:flex;align-items:center}:host(sdds-button) ::slotted([slot=icon]){width:var(--sdds-spacing-element-20);height:var(--sdds-spacing-element-20)}:host(sdds-button) .sdds-btn-sm ::slotted([slot=icon]){width:var(--sdds-spacing-element-16);height:var(--sdds-spacing-element-16)}:host(sdds-button[fullbleed]){width:inherit;justify-content:center}:host(sdds-button[onlyIcon]) .sdds-btn-sm{padding:11px}:host(sdds-button[onlyIcon]) .sdds-btn-md{padding:13px}:host(sdds-button[onlyIcon]) .sdds-btn-lg{padding:17px}:host(sdds-button:not([onlyIcon])){display:flex;align-items:center}:host(sdds-button:not([onlyIcon])) .sdds-btn-sm ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-24);width:var(--sdds-spacing-element-16);height:var(--sdds-spacing-element-16)}:host(sdds-button:not([onlyIcon])) .sdds-btn-sm.sdds-btn-fullbleed ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-12)}:host(sdds-button:not([onlyIcon])) .sdds-btn-md ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-20);width:var(--sdds-spacing-element-20);height:var(--sdds-spacing-element-20)}:host(sdds-button:not([onlyIcon])) .sdds-btn-md.sdds-btn-fullbleed ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-16)}:host(sdds-button:not([onlyIcon])) .sdds-btn-lg ::slotted([slot=icon]){margin-left:28px;width:var(--sdds-spacing-element-20);height:var(--sdds-spacing-element-20)}:host(sdds-button:not([onlyIcon])) .sdds-btn-lg.sdds-btn-fullbleed ::slotted([slot=icon]){margin-left:var(--sdds-spacing-element-16)}";export{o as sdds_button}