npm - @aquera/nile-elements - Versions diffs - 0.0.132 → 0.1.0 - Mend

@aquera/nile-elements 0.0.132 → 0.1.0

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.

Files changed (1467) hide show

package/dist/src/nile-breadcrumb-item/nile-breadcrumb-item.css.js CHANGED Viewed

@@ -4,7 +4,7 @@
  * This source code is licensed under the BSD-3-Clause license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { css } from 'lit-element';
+import { css } from 'lit';
 /**
  * Breadcrumb-item CSS
  */

package/dist/src/nile-breadcrumb-item/nile-breadcrumb-item.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-breadcrumb-item.css.js","sourceRoot":"","sources":["../../../src/nile-breadcrumb-item/nile-breadcrumb-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,~~aAAa~~,CAAC;~~AAElC~~;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiCxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/*\n Copyright Aquera Inc 2023\n \n This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { css } from 'lit~~-element~~';\n\n/\n Breadcrumb-item CSS\n */\nexport const styles = css`\n :host {\n display: flex;\n align-items: center;\n text-align: center;\n font-family: var(--nile-font-family-serif);\n font-size: var(--nile-font-size-small);\n font-style: normal;\n font-weight: var(--nile-font-weight-regular);\n line-height: 16.8px;\n letter-spacing: 0.2px;\n }\n\n .nile-breadcrumb-item__arrow {\n margin: 0 8px;\n }\n\n .nile-breadcrumb-item__arrow-hidden {\n display: none;\n }\n\n .nile-breadcrumb-item__slot-text {\n color: var(--nile-colors-dark-500);\n }\n\n .nile-breadcrumb-item__slot-text:hover {\n color: var(--nile-colors-primary-600);\n cursor: pointer;\n }\n\n .nile-breadcrumb-item__last-slot-text {\n color: var(--nile-breadcrumb-color);\n }\n`;\n\nexport default [styles];\n"]}
1	+ {"version":3,"file":"nile-breadcrumb-item.css.js","sourceRoot":"","sources":["../../../src/nile-breadcrumb-item/nile-breadcrumb-item.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiCxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/*\n Copyright Aquera Inc 2023\n \n This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { css } from 'lit';\n\n/\n Breadcrumb-item CSS\n */\nexport const styles = css`\n :host {\n display: flex;\n align-items: center;\n text-align: center;\n font-family: var(--nile-font-family-serif);\n font-size: var(--nile-font-size-small);\n font-style: normal;\n font-weight: var(--nile-font-weight-regular);\n line-height: 16.8px;\n letter-spacing: 0.2px;\n }\n\n .nile-breadcrumb-item__arrow {\n margin: 0 8px;\n }\n\n .nile-breadcrumb-item__arrow-hidden {\n display: none;\n }\n\n .nile-breadcrumb-item__slot-text {\n color: var(--nile-colors-dark-500);\n }\n\n .nile-breadcrumb-item__slot-text:hover {\n color: var(--nile-colors-primary-600);\n cursor: pointer;\n }\n\n .nile-breadcrumb-item__last-slot-text {\n color: var(--nile-breadcrumb-color);\n }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-breadcrumb-item/nile-breadcrumb-item.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@
  * This source code is licensed under the BSD-3-Clause license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { CSSResultArray, TemplateResult } from 'lit-element';
+import { CSSResultArray, TemplateResult } from 'lit';
 import NileElement from '../internal/nile-element';
 /**
  * Nile BreadCrumb Item component.

package/dist/src/nile-breadcrumb-item/nile-breadcrumb-item.js CHANGED Viewed

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { __decorate } from "tslib";
-import { html, } from 'lit-element';
+import { html, } from 'lit';
 import { customElement, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { styles } from './nile-breadcrumb-item.css';

package/dist/src/nile-breadcrumb-item/nile-breadcrumb-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-breadcrumb-item.js","sourceRoot":"","sources":["../../../src/nile-breadcrumb-item/nile-breadcrumb-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,~~GAIL~~,MAAM,~~aAAa~~,CAAC;~~AACrB~~,OAAO,EAAE,aAAa,EAAE,KAAK,~~EAAE~~,MAAM,mBAAmB,CAAC;~~AACzD~~,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD;;;;;GAKG;AAEI,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,WAAW;IAA5C;;QASY,WAAM,GAAG,KAAK,CAAC;QAuChC,gBAAgB;IAClB,CAAC;IAhDC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAID,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACK,WAAW;QACjB,IAAI,IAAI,CAAC,MAAM,EAAE;~~YACf~~,OAAO;~~SACR~~;QACD,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IAC/B,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;gBAEC,QAAQ,CAAC;YACf,iCAAiC,EAAE,CAAC,IAAI,CAAC,MAAM;YAC/C,sCAAsC,EAAE,IAAI,CAAC,MAAM;SACpD,CAAC;iBACO,IAAI,CAAC,WAAW;;;;;;gBAMjB,QAAQ,CAAC;YACf,6BAA6B,EAAE,IAAI;YACnC,oCAAoC,EAAE,IAAI,CAAC,MAAM;SAClD,CAAC;;;KAGL,CAAC;IACJ,CAAC;CAGF,CAAA;~~AAxCU~~;~~IAAR~~,KAAK,EAAE;kDAAwB;AATrB,kBAAkB;IAD9B,aAAa,CAAC,sBAAsB,CAAC;GACzB,kBAAkB,CAiD9B~~;SAjDY~~,~~kBAAkB;AAmD/B,~~eAAe,kBAAkB,CAAC","sourcesContent":["/*\n Copyright Aquera Inc 2023\n \n This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n LitElement,\n html,\n ~~property,\n~~ CSSResultArray,\n TemplateResult,\n} from 'lit~~-element~~';\nimport { customElement, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './nile-breadcrumb-item.css';\nimport NileElement from '../internal/nile-element';\n/\n Nile BreadCrumb Item component.\n \n @tag nile-breadcrumb-item\n \n /\n@customElement('nile-breadcrumb-item')\nexport class NileBreadcrumbItem extends NileElement {\n /*\n The styles for BreadcrumbItem\n * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n /\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n @state() private isLast = false;\n\n / #endregion /\n\n / #region Methods /\n\n /\n Render method\n * @slot This is a slot test\n /\n private handleClick() {\n if (this.isLast) {\n return;\n }\n this.emit('nile-click-item');\n }\n\n public render(): TemplateResult {\n return html`\n <slot\n class=${classMap({\n 'nile-breadcrumb-item__slot-text': !this.isLast,\n 'nile-breadcrumb-item__last-slot-text': this.isLast,\n })}\n @click=${this.handleClick}\n ></slot>\n <nile-icon\n name=\"arrowright\"\n aria-label=\"arrowright\"\n color=\"var(--nile-colors-dark-500)\"\n class=${classMap({\n 'nile-breadcrumb-item__arrow': true,\n 'nile-breadcrumb-item__arrow-hidden': this.isLast,\n })}\n size=\"14\"\n ></nile-icon>\n `;\n }\n\n / #endregion */\n}\n\nexport default NileBreadcrumbItem;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-breadcrumb-item': NileBreadcrumbItem;\n }\n}\n"]}
1	+ {"version":3,"file":"nile-breadcrumb-item.js","sourceRoot":"","sources":["../../../src/nile-breadcrumb-item/nile-breadcrumb-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,EAEL,IAAI,GAGL,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,aAAa,EAAE,KAAK,EAAY,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD;;;;;GAKG;AAEI,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,WAAW;IAA5C;;QASY,WAAM,GAAG,KAAK,CAAC;QAuChC,gBAAgB;IAClB,CAAC;IAhDC;;;OAGG;IACI,MAAM,KAAK,MAAM;QACtB,OAAO,CAAC,MAAM,CAAC,CAAC;IAClB,CAAC;IAID,gBAAgB;IAEhB,qBAAqB;IAErB;;;OAGG;IACK,WAAW;QACjB,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IAC/B,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;;gBAEC,QAAQ,CAAC;YACf,iCAAiC,EAAE,CAAC,IAAI,CAAC,MAAM;YAC/C,sCAAsC,EAAE,IAAI,CAAC,MAAM;SACpD,CAAC;iBACO,IAAI,CAAC,WAAW;;;;;;gBAMjB,QAAQ,CAAC;YACf,6BAA6B,EAAE,IAAI;YACnC,oCAAoC,EAAE,IAAI,CAAC,MAAM;SAClD,CAAC;;;KAGL,CAAC;IACJ,CAAC;CAGF,CAAA;AAxCkB;IAAhB,KAAK,EAAE;kDAAwB;AATrB,kBAAkB;IAD9B,aAAa,CAAC,sBAAsB,CAAC;GACzB,kBAAkB,CAiD9B;;AAED,eAAe,kBAAkB,CAAC","sourcesContent":["/*\n Copyright Aquera Inc 2023\n \n This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n LitElement,\n html,\n CSSResultArray,\n TemplateResult,\n} from 'lit';\nimport { customElement, state, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './nile-breadcrumb-item.css';\nimport NileElement from '../internal/nile-element';\n/\n Nile BreadCrumb Item component.\n \n @tag nile-breadcrumb-item\n \n /\n@customElement('nile-breadcrumb-item')\nexport class NileBreadcrumbItem extends NileElement {\n /*\n The styles for BreadcrumbItem\n * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n /\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n @state() private isLast = false;\n\n / #endregion /\n\n / #region Methods /\n\n /\n Render method\n * @slot This is a slot test\n /\n private handleClick() {\n if (this.isLast) {\n return;\n }\n this.emit('nile-click-item');\n }\n\n public render(): TemplateResult {\n return html`\n <slot\n class=${classMap({\n 'nile-breadcrumb-item__slot-text': !this.isLast,\n 'nile-breadcrumb-item__last-slot-text': this.isLast,\n })}\n @click=${this.handleClick}\n ></slot>\n <nile-icon\n name=\"arrowright\"\n aria-label=\"arrowright\"\n color=\"var(--nile-colors-dark-500)\"\n class=${classMap({\n 'nile-breadcrumb-item__arrow': true,\n 'nile-breadcrumb-item__arrow-hidden': this.isLast,\n })}\n size=\"14\"\n ></nile-icon>\n `;\n }\n\n / #endregion */\n}\n\nexport default NileBreadcrumbItem;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-breadcrumb-item': NileBreadcrumbItem;\n }\n}\n"]}

package/dist/src/nile-button/nile-button.css.d.ts CHANGED Viewed

@@ -7,4 +7,4 @@
 /**
  * Button CSS
  */
-export declare const styles: import("lit-element").CSSResult;
+export declare const styles: import("lit").CSSResult;

package/dist/src/nile-button/nile-button.css.js CHANGED Viewed

@@ -4,7 +4,7 @@
  * This source code is licensed under the BSD-3-Clause license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { css } from 'lit-element';
+import { css } from 'lit';
 /**
  * Button CSS
  */

package/dist/src/nile-button/nile-button.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-button.css.js","sourceRoot":"","sources":["../../../src/nile-button/nile-button.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8rBxB,CAAC","sourcesContent":["/*\n Copyright Aquera Inc 2023\n \n This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { css } from 'lit-element';\n\n/\n Button CSS\n /\nexport const styles = css`\n :host {\n display: inline-block;\n position: relative;\n width: auto;\n cursor: pointer;\n }\n\n .button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-style: solid;\n border-width: 1px;\n font-style: normal;\n font-family: var(--nile-font-family-serif);\n text-align: center;\n letter-spacing: 0.2px;\n text-decoration: none;\n user-select: none;\n white-space: nowrap;\n vertical-align: middle;\n transition: var(--nile-transition-duration-default) background-color,\n var(--nile-transition-duration-default) color,\n var(--nile-transition-duration-default) border,\n var(--nile-transition-duration-default) box-shadow;\n cursor: inherit;\n font-size: 14px;\n font-weight: 500;\n border-radius: var(--nile-radius-base-standard);\n padding: 10px 14px;\n gap: 5px;\n line-height: 20px;\n box-sizing: border-box;\n height: 40px;\n }\n\n .button::-moz-focus-inner {\n border: 0;\n }\n\n .button:focus {\n outline: none;\n }\n\n .button:focus-visible {\n outline: 5px auto -webkit-focus-ring-color;\n outline-offset: 2px;\n }\n\n .button--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .button--disabled {\n pointer-events: none;\n }\n\n /* Primary /\n .button--standard.button--primary {\n background-color: var(--nile-colors-button-primary);\n border-color: var(--nile-colors-button-primary-border);\n color: var(--nile-colors-button-primary-text);\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--primary:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-primary-hover);\n border-color: var(--nile-colors-button-primary-hover);\n color: var(--nile-colors-button-primary-text);\n }\n\n .button--standard.button--primary:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-primary-pressed);\n border-color: var(--nile-colors-button-primary-pressed-border);\n color: var(--nile-colors-button-primary-text);\n box-shadow: 0px 1px 2px 0px rgba(0, 82, 145, 0.1),\n 0px 0px 0px 4px rgba(0, 94, 166, 0.15);\n }\n\n .button--standard.button--primary.button--disabled {\n background-color: var(--nile-colors-button-primary-disabled);\n border-color: var(--nile-colors-button-primary-disabled);\n color: var(--nile-colors-button-primary-disabled-text);\n cursor: not-allowed;\n }\n\n .button--standard.button--primary.button--disabled:hover,\n .button--standard.button--primary.button--disabled:active {\n background-color: var(--nile-colors-button-primary-disabled);\n border-color: var(--nile-colors-button-primary-disabled);\n color: var(--nile-colors-button-primary-disabled-text);\n cursor: not-allowed;\n }\n\n / Secondary /\n .button--standard.button--secondary {\n background-color: var(--nile-colors-button-secondary);\n border-color: var(--nile-colors-button-secondary-border);\n color: var(--nile-colors-button-secondary-text);\n }\n\n .button--standard.button--secondary:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-secondary-hover);\n border-color: var(--nile-colors-button-secondary-border);\n color: var(--nile-colors-button-secondary-text);\n }\n\n .button--standard.button--secondary:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-secondary-pressed);\n border-color: var(--nile-colors-button-secondary-pressed-border);\n color: var(--nile-colors-button-secondary-text);\n }\n\n .button--standard.button--secondary.button--disabled {\n background-color: var(--nile-colors-button-secondary-disabled);\n border-color: var(--nile-colors-button-secondary-disabled-border);\n color: var(--nile-colors-button-secondary-disabled-text);\n cursor: not-allowed;\n }\n\n .button--standard.button--secondary.button--disabled:hover,\n .button--standard.button--secondary.button--disabled:active {\n background-color: var(--nile-colors-button-secondary-disabled);\n border-color: var(--nile-colors-button-secondary-disabled-border);\n color: var(--nile-colors-button-secondary-disabled-text);\n cursor: not-allowed;\n }\n\n / Tertiary /\n .button--standard.button--tertiary {\n background-color: var(--nile-colors-button-tertiary);\n border-color: var(--nile-colors-button-tertiary-border);\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--tertiary:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-tertiary-hover);\n border-color: var(--nile-colors-neutral-500);\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--tertiary:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-tertiary-pressed);\n border-color: var(--nile-colors-button-tertiary-pressed-border);\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--tertiary.button--disabled,\n .button--standard.button--tertiary.button--disabled:hover,\n .button--standard.button--tertiary.button--disabled:active {\n border-color: var(--nile-colors-neutral-500);\n background-color: var(--nile-colors-button-tertiary-disabled);\n color: var(--nile-colors-button-tertiary-disabled-text);\n cursor: not-allowed;\n box-shadow: none;\n }\n\n / ghost /\n .button--standard.button--ghost {\n background-color: var(--nile-colors-button-tertiary);\n border-color: transparent;\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--ghost:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-tertiary-hover);\n border-color: transparent;\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--ghost:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-tertiary-pressed);\n border-color: transparent;\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--ghost.button--disabled,\n .button--standard.button--ghost.button--disabled:hover,\n .button--standard.button--ghost.button--disabled:active {\n border-color: transparent;\n background-color: var(--nile-colors-button-tertiary-disabled);\n color: var(--nile-colors-button-tertiary-disabled-text);\n cursor: not-allowed;\n box-shadow: none;\n }\n\n / caution /\n .button--standard.button--caution {\n background-color: var(--nile-colors-button-caution);\n border-color: var(--nile-colors-button-caution);\n color: var(--nile-colors-button-caution-text);\n }\n\n .button--standard.button--caution:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-caution-hover);\n border-color: var(--nile-colors-button-caution-hover);\n color: var(--nile-colors-button-caution-text);\n }\n\n .button--standard.button--caution:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-caution-pressed);\n border-color: var(--nile-colors-button-caution-pressed-border);\n color: var(--nile-colors-button-caution-text);\n }\n\n .button--standard.button--caution.button--disabled,\n .button--standard.button--caution.button--disabled:hover,\n .button--standard.button--caution.button--disabled:active {\n background-color: var(--nile-colors-button-caution-disabled);\n border-color: var(--nile-colors-button-caution-disabled);\n color: var(--nile-colors-button-caution-disabled-text);\n }\n\n / destructive /\n .button--standard.button--destructive {\n background-color: #d92d20;\n border-color: #d92d20;\n color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--destructive:hover:not(.button--disabled) {\n background-color: #b42318;\n border-color: #b42318;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--destructive:active:not(.button--disabled) {\n background-color: #d92d20;\n border-color: #d92d20;\n color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n .button--standard.button--destructive:focus-visible:not(.button--disabled) {\n background-color: #d92d20;\n border-color: #d92d20;\n color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n\n .button--standard.button--destructive.button--disabled {\n background-color: #f2f4f7;\n border-color: #eaecf0;\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n .button--standard.button--destructive.button--disabled:hover,\n .button--standard.button--destructive.button--disabled:active {\n background-color: #f2f4f7;\n border-color: #eaecf0;\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n / secondary-Grey /\n .button--standard.button--secondary-grey {\n background-color: #fff;\n border-color: #d0d5dd;\n color: #344054;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--secondary-grey:hover:not(.button--disabled) {\n background-color: #f9fafb;\n border-color: #d0d5dd;\n color: #182230;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--secondary-grey:active:not(.button--disabled) {\n background-color: #fff;\n border-color: #d0d5dd;\n color: #344054;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(152, 162, 179, 0.14);\n }\n\n .button--standard.button--secondary-grey.button--disabled {\n background-color: #eaecf0;\n border-color: var(--nile-colors-button-primary-disabled);\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n .button--standard.button--secondary-grey.button--disabled:hover,\n .button--standard.button--secondary-grey.button--disabled:active {\n background-color: #eaecf0;\n border-color: var(--nile-colors-button-primary-disabled);\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n / secondary-blue /\n .button--standard.button--secondary-blue {\n background-color: #fff;\n border-color: #85aad1;\n color: #005291;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--secondary-blue:hover:not(.button--disabled) {\n background-color: #eaf0f8;\n border-color: #85aad1;\n color: #004678;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--secondary-blue:active:not(.button--disabled) {\n background-color: #fff;\n border-color: #85aad1;\n color: #005291;\n box-shadow: 0px 1px 2px 0px rgba(0, 82, 145, 0.1),\n 0px 0px 0px 4px rgba(0, 94, 166, 0.15);\n }\n\n .button--standard.button--secondary-blue.button--disabled {\n background-color: #fff;\n border-color: #eaecf0;\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n .button--standard.button--secondary-blue.button--disabled:hover,\n .button--standard.button--secondary-blue.button--disabled:active {\n background-color: #fff;\n border-color: #eaecf0;\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n / Primary Variant - Nile Icon Fill /\n .button--standard.button--primary ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-primary-text) !important;\n }\n .button--standard.button--primary:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--primary:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-primary-text) !important;\n }\n .button--standard.button--primary.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-primary-disabled-text) !important;\n }\n\n / Secondary Variant /\n .button--standard.button--secondary ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-secondary-text) !important;\n }\n .button--standard.button--secondary:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--secondary:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-secondary-text) !important;\n }\n .button--standard.button--secondary.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(\n --nile-colors-button-secondary-disabled-text\n ) !important;\n }\n\n / Tertiary Variant /\n .button--standard.button--tertiary ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-tertiary-text) !important;\n }\n .button--standard.button--tertiary:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--tertiary:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-tertiary-text) !important;\n }\n .button--standard.button--tertiary.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(\n --nile-colors-button-tertiary-disabled-text\n ) !important;\n }\n\n / Ghost Variant /\n .button--standard.button--ghost ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-tertiary-text) !important;\n }\n .button--standard.button--ghost:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--ghost:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-tertiary-text) !important;\n }\n .button--standard.button--ghost ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(\n --nile-colors-button-tertiary-disabled-text\n ) !important;\n }\n\n / Caution Variant /\n .button--standard.button--caution ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-caution-text) !important;\n }\n .button--standard.button--caution:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--caution:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-caution-text) !important;\n }\n .button--standard.button--caution.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-caution-disabled-text) !important;\n }\n\n / destructive /\n .button--standard.button--destructive ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: #fff !important;\n }\n .button--standard.button--destructive:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--caution:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: #fff !important;\n }\n .button--standard.button--destructive.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: #fff !important;\n }\n\n /\n * Outline buttons\n /\n\n .button--outline {\n background: none;\n border: solid 2px;\n }\n\n / Default /\n .button--outline.button--secondary {\n border-color: var(--nile-colors-neutral-300);\n color: var(--nile-colors-neutral-700);\n }\n\n .button--outline.button--secondary:hover:not(.button--disabled),\n .button--outline.button--secondary.button--checked:not(.button--disabled) {\n border-color: var(--nile-colors-primary-600);\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--secondary:active:not(.button--disabled) {\n border-color: var(--nile-colors-neutral-700);\n color: var(--nile-colors-white-base);\n }\n\n / Primary /\n .button--outline.button--primary {\n border-color: var(--nile-colors-primary-600);\n color: var(--nile-colors-primary-600);\n }\n\n .button--outline.button--primary:hover:not(.button--disabled),\n .button--outline.button--primary.button--checked:not(.button--disabled) {\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--primary:active:not(.button--disabled) {\n border-color: var(--nile-colors-primary-700);\n color: var(--nile-colors-white-base);\n }\n\n / Success /\n .button--outline.button--success {\n border-color: var(--nile-colors-green-600);\n color: var(--nile-colors-green-600);\n }\n\n .button--outline.button--success:hover:not(.button--disabled),\n .button--outline.button--success.button--checked:not(.button--disabled) {\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--success:active:not(.button--disabled) {\n border-color: var(--nile-colors-green-700);\n color: var(--nile-colors-white-base);\n }\n\n / Neutral /\n .button--outline.button--neutral {\n border-color: var(--nile-colors-neutral-600);\n color: var(--nile-colors-neutral-600);\n }\n\n .button--outline.button--neutral:hover:not(.button--disabled),\n .button--outline.button--neutral.button--checked:not(.button--disabled) {\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--neutral:active:not(.button--disabled) {\n border-color: var(--nile-colors-neutral-700);\n color: var(--nile-colors-white-base);\n }\n\n / Warning /\n .button--outline.button--warning {\n border-color: var(--nile-colors-orange-600);\n color: var(--nile-colors-orange-600);\n }\n\n .button--outline.button--warning:hover:not(.button--disabled),\n .button--outline.button--warning.button--checked:not(.button--disabled) {\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--warning:active:not(.button--disabled) {\n border-color: var(--nile-colors-orange-700);\n color: var(--nile-colors-white-base);\n }\n\n / Danger /\n .button--outline.button--danger {\n border-color: var(--nile-colors-red-600);\n color: var(--nile-colors-red-600);\n }\n\n .button--outline.button--danger:hover:not(.button--disabled),\n .button--outline.button--danger.button--checked:not(.button--disabled) {\n background-color: var(--nile-colors-red-600);\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--danger:active:not(.button--disabled) {\n border-color: var(--nile-colors-red-700);\n background-color: var(--nile-colors-red-700);\n color: var(--nile-colors-white-base);\n }\n\n / destructive /\n .button--outline.button--destructive {\n border-color: #fda29b;\n color: #b42318;\n box-shadow: 0px;\n }\n\n .button--outline.button--destructive:hover:not(.button--disabled),\n .button--outline.button--destructive.button--checked:not(.button--disabled) {\n border-color: #fda29b;\n color: #912018;\n background-color: #fef3f2;\n }\n\n .button--outline.button--destructive:active:not(.button--disabled) {\n border-color: #fda29b;\n color: #b42318;\n background-color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n\n / destructive - focus-visible /\n .button--outline.button--destructive:focus-visible:not(.button--disabled) {\n border-color: #fda29b;\n color: #b42318;\n background-color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n\n / secondary-grey /\n .button--outline.button--secondary-grey {\n box-shadow: 0px;\n }\n\n .button--outline.button--secondary-grey:hover:not(.button--disabled),\n .button--outline.button--secondary-grey.button--checked:not(\n .button--disabled\n ) {\n color: #344054;\n background-color: #f9fafb;\n }\n\n .button--outline.button--secondary-grey:active:not(.button--disabled) {\n box-shadow: 0px;\n }\n\n .button--outline.button--secondary-grey:focus-visible:not(.button--disabled) {\n box-shadow: 0px;\n }\n\n / secondary-blue /\n .button--outline.button--secondary-blue {\n box-shadow: 0px;\n }\n\n .button--outline.button--secondary-blue:hover:not(.button--disabled),\n .button--outline.button--secondary-blue.button--checked:not(\n .button--disabled\n ) {\n color: #004678;\n background-color: #eaf0f8;\n }\n\n .button--outline.button--secondary-blue:active:not(.button--disabled) {\n box-shadow: 0px;\n }\n\n .button--outline.button--secondary-blue:focus-visible:not(.button--disabled) {\n box-shadow: 0px;\n }\n\n @media (forced-colors: active) {\n .button.button--outline.button--checked:not(.button--disabled) {\n outline: solid 2px transparent;\n }\n }\n\n /\n * Pill modifier\n /\n\n .button--pill.button--small {\n border-radius: 24px;\n }\n\n .button--pill.button--medium {\n border-radius: 32px;\n }\n\n /\n * Circle modifier\n /\n\n .button--circle {\n padding-left: 0;\n padding-right: 0;\n }\n\n .button--circle.button--small {\n width: 24px;\n height: 24px;\n border-radius: 50%;\n }\n\n .button--circle.button--medium {\n width: 38px;\n height: 38px;\n border-radius: 50%;\n }\n\n .button--circle .button__prefix,\n .button--circle .button__suffix,\n .button--circle .button__caret {\n display: none;\n }\n\n / Caret modifier /\n\n .button--caret .button__suffix {\n display: none;\n }\n\n .button--caret .button__caret {\n height: auto;\n }\n\n /\n * Loading modifier\n /\n\n .button--loading {\n position: relative;\n cursor: wait;\n }\n\n .button--loading .button__prefix,\n .button--loading .button__label,\n .button--loading .button__suffix,\n .button--loading .button__caret {\n visibility: hidden;\n }\n\n .button--loading nile-spinner {\n --indicator-color: currentColor;\n position: absolute;\n font-size: 1em;\n height: 1em;\n width: 1em;\n top: calc(50% - 0.5em);\n left: calc(50% - 0.5em);\n }\n /\n * Badges\n /\n\n .button ::slotted(nile-badge) {\n position: absolute;\n top: 0;\n right: 0;\n translate: 50% -50%;\n pointer-events: none;\n }\n\n / outline with no border */\n .button--outline.button--hideborder {\n border: 0px;\n }\n`;\n"]}
1	+ {"version":3,"file":"nile-button.css.js","sourceRoot":"","sources":["../../../src/nile-button/nile-button.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8rBxB,CAAC","sourcesContent":["/*\n Copyright Aquera Inc 2023\n \n This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { css } from 'lit';\n\n/\n Button CSS\n /\nexport const styles = css`\n :host {\n display: inline-block;\n position: relative;\n width: auto;\n cursor: pointer;\n }\n\n .button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-style: solid;\n border-width: 1px;\n font-style: normal;\n font-family: var(--nile-font-family-serif);\n text-align: center;\n letter-spacing: 0.2px;\n text-decoration: none;\n user-select: none;\n white-space: nowrap;\n vertical-align: middle;\n transition: var(--nile-transition-duration-default) background-color,\n var(--nile-transition-duration-default) color,\n var(--nile-transition-duration-default) border,\n var(--nile-transition-duration-default) box-shadow;\n cursor: inherit;\n font-size: 14px;\n font-weight: 500;\n border-radius: var(--nile-radius-base-standard);\n padding: 10px 14px;\n gap: 5px;\n line-height: 20px;\n box-sizing: border-box;\n height: 40px;\n }\n\n .button::-moz-focus-inner {\n border: 0;\n }\n\n .button:focus {\n outline: none;\n }\n\n .button:focus-visible {\n outline: 5px auto -webkit-focus-ring-color;\n outline-offset: 2px;\n }\n\n .button--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .button--disabled {\n pointer-events: none;\n }\n\n /* Primary /\n .button--standard.button--primary {\n background-color: var(--nile-colors-button-primary);\n border-color: var(--nile-colors-button-primary-border);\n color: var(--nile-colors-button-primary-text);\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--primary:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-primary-hover);\n border-color: var(--nile-colors-button-primary-hover);\n color: var(--nile-colors-button-primary-text);\n }\n\n .button--standard.button--primary:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-primary-pressed);\n border-color: var(--nile-colors-button-primary-pressed-border);\n color: var(--nile-colors-button-primary-text);\n box-shadow: 0px 1px 2px 0px rgba(0, 82, 145, 0.1),\n 0px 0px 0px 4px rgba(0, 94, 166, 0.15);\n }\n\n .button--standard.button--primary.button--disabled {\n background-color: var(--nile-colors-button-primary-disabled);\n border-color: var(--nile-colors-button-primary-disabled);\n color: var(--nile-colors-button-primary-disabled-text);\n cursor: not-allowed;\n }\n\n .button--standard.button--primary.button--disabled:hover,\n .button--standard.button--primary.button--disabled:active {\n background-color: var(--nile-colors-button-primary-disabled);\n border-color: var(--nile-colors-button-primary-disabled);\n color: var(--nile-colors-button-primary-disabled-text);\n cursor: not-allowed;\n }\n\n / Secondary /\n .button--standard.button--secondary {\n background-color: var(--nile-colors-button-secondary);\n border-color: var(--nile-colors-button-secondary-border);\n color: var(--nile-colors-button-secondary-text);\n }\n\n .button--standard.button--secondary:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-secondary-hover);\n border-color: var(--nile-colors-button-secondary-border);\n color: var(--nile-colors-button-secondary-text);\n }\n\n .button--standard.button--secondary:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-secondary-pressed);\n border-color: var(--nile-colors-button-secondary-pressed-border);\n color: var(--nile-colors-button-secondary-text);\n }\n\n .button--standard.button--secondary.button--disabled {\n background-color: var(--nile-colors-button-secondary-disabled);\n border-color: var(--nile-colors-button-secondary-disabled-border);\n color: var(--nile-colors-button-secondary-disabled-text);\n cursor: not-allowed;\n }\n\n .button--standard.button--secondary.button--disabled:hover,\n .button--standard.button--secondary.button--disabled:active {\n background-color: var(--nile-colors-button-secondary-disabled);\n border-color: var(--nile-colors-button-secondary-disabled-border);\n color: var(--nile-colors-button-secondary-disabled-text);\n cursor: not-allowed;\n }\n\n / Tertiary /\n .button--standard.button--tertiary {\n background-color: var(--nile-colors-button-tertiary);\n border-color: var(--nile-colors-button-tertiary-border);\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--tertiary:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-tertiary-hover);\n border-color: var(--nile-colors-neutral-500);\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--tertiary:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-tertiary-pressed);\n border-color: var(--nile-colors-button-tertiary-pressed-border);\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--tertiary.button--disabled,\n .button--standard.button--tertiary.button--disabled:hover,\n .button--standard.button--tertiary.button--disabled:active {\n border-color: var(--nile-colors-neutral-500);\n background-color: var(--nile-colors-button-tertiary-disabled);\n color: var(--nile-colors-button-tertiary-disabled-text);\n cursor: not-allowed;\n box-shadow: none;\n }\n\n / ghost /\n .button--standard.button--ghost {\n background-color: var(--nile-colors-button-tertiary);\n border-color: transparent;\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--ghost:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-tertiary-hover);\n border-color: transparent;\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--ghost:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-tertiary-pressed);\n border-color: transparent;\n color: var(--nile-colors-button-tertiary-text);\n }\n\n .button--standard.button--ghost.button--disabled,\n .button--standard.button--ghost.button--disabled:hover,\n .button--standard.button--ghost.button--disabled:active {\n border-color: transparent;\n background-color: var(--nile-colors-button-tertiary-disabled);\n color: var(--nile-colors-button-tertiary-disabled-text);\n cursor: not-allowed;\n box-shadow: none;\n }\n\n / caution /\n .button--standard.button--caution {\n background-color: var(--nile-colors-button-caution);\n border-color: var(--nile-colors-button-caution);\n color: var(--nile-colors-button-caution-text);\n }\n\n .button--standard.button--caution:hover:not(.button--disabled) {\n background-color: var(--nile-colors-button-caution-hover);\n border-color: var(--nile-colors-button-caution-hover);\n color: var(--nile-colors-button-caution-text);\n }\n\n .button--standard.button--caution:active:not(.button--disabled) {\n background-color: var(--nile-colors-button-caution-pressed);\n border-color: var(--nile-colors-button-caution-pressed-border);\n color: var(--nile-colors-button-caution-text);\n }\n\n .button--standard.button--caution.button--disabled,\n .button--standard.button--caution.button--disabled:hover,\n .button--standard.button--caution.button--disabled:active {\n background-color: var(--nile-colors-button-caution-disabled);\n border-color: var(--nile-colors-button-caution-disabled);\n color: var(--nile-colors-button-caution-disabled-text);\n }\n\n / destructive /\n .button--standard.button--destructive {\n background-color: #d92d20;\n border-color: #d92d20;\n color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--destructive:hover:not(.button--disabled) {\n background-color: #b42318;\n border-color: #b42318;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--destructive:active:not(.button--disabled) {\n background-color: #d92d20;\n border-color: #d92d20;\n color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n .button--standard.button--destructive:focus-visible:not(.button--disabled) {\n background-color: #d92d20;\n border-color: #d92d20;\n color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n\n .button--standard.button--destructive.button--disabled {\n background-color: #f2f4f7;\n border-color: #eaecf0;\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n .button--standard.button--destructive.button--disabled:hover,\n .button--standard.button--destructive.button--disabled:active {\n background-color: #f2f4f7;\n border-color: #eaecf0;\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n / secondary-Grey /\n .button--standard.button--secondary-grey {\n background-color: #fff;\n border-color: #d0d5dd;\n color: #344054;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--secondary-grey:hover:not(.button--disabled) {\n background-color: #f9fafb;\n border-color: #d0d5dd;\n color: #182230;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--secondary-grey:active:not(.button--disabled) {\n background-color: #fff;\n border-color: #d0d5dd;\n color: #344054;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(152, 162, 179, 0.14);\n }\n\n .button--standard.button--secondary-grey.button--disabled {\n background-color: #eaecf0;\n border-color: var(--nile-colors-button-primary-disabled);\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n .button--standard.button--secondary-grey.button--disabled:hover,\n .button--standard.button--secondary-grey.button--disabled:active {\n background-color: #eaecf0;\n border-color: var(--nile-colors-button-primary-disabled);\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n / secondary-blue /\n .button--standard.button--secondary-blue {\n background-color: #fff;\n border-color: #85aad1;\n color: #005291;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--secondary-blue:hover:not(.button--disabled) {\n background-color: #eaf0f8;\n border-color: #85aad1;\n color: #004678;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n }\n\n .button--standard.button--secondary-blue:active:not(.button--disabled) {\n background-color: #fff;\n border-color: #85aad1;\n color: #005291;\n box-shadow: 0px 1px 2px 0px rgba(0, 82, 145, 0.1),\n 0px 0px 0px 4px rgba(0, 94, 166, 0.15);\n }\n\n .button--standard.button--secondary-blue.button--disabled {\n background-color: #fff;\n border-color: #eaecf0;\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n .button--standard.button--secondary-blue.button--disabled:hover,\n .button--standard.button--secondary-blue.button--disabled:active {\n background-color: #fff;\n border-color: #eaecf0;\n color: #98a2b3;\n cursor: not-allowed;\n }\n\n / Primary Variant - Nile Icon Fill /\n .button--standard.button--primary ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-primary-text) !important;\n }\n .button--standard.button--primary:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--primary:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-primary-text) !important;\n }\n .button--standard.button--primary.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-primary-disabled-text) !important;\n }\n\n / Secondary Variant /\n .button--standard.button--secondary ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-secondary-text) !important;\n }\n .button--standard.button--secondary:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--secondary:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-secondary-text) !important;\n }\n .button--standard.button--secondary.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(\n --nile-colors-button-secondary-disabled-text\n ) !important;\n }\n\n / Tertiary Variant /\n .button--standard.button--tertiary ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-tertiary-text) !important;\n }\n .button--standard.button--tertiary:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--tertiary:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-tertiary-text) !important;\n }\n .button--standard.button--tertiary.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(\n --nile-colors-button-tertiary-disabled-text\n ) !important;\n }\n\n / Ghost Variant /\n .button--standard.button--ghost ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-tertiary-text) !important;\n }\n .button--standard.button--ghost:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--ghost:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-tertiary-text) !important;\n }\n .button--standard.button--ghost ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(\n --nile-colors-button-tertiary-disabled-text\n ) !important;\n }\n\n / Caution Variant /\n .button--standard.button--caution ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-caution-text) !important;\n }\n .button--standard.button--caution:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--caution:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-caution-text) !important;\n }\n .button--standard.button--caution.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: var(--nile-colors-button-caution-disabled-text) !important;\n }\n\n / destructive /\n .button--standard.button--destructive ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: #fff !important;\n }\n .button--standard.button--destructive:hover:not(.button--disabled)\n ::slotted(nile-icon:not([color])),\n .button--standard.button--caution:active:not(.button--disabled)\n ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: #fff !important;\n }\n .button--standard.button--destructive.button--disabled ::slotted(nile-icon:not([color])) {\n --nile-svg-fill: #fff !important;\n }\n\n /\n * Outline buttons\n /\n\n .button--outline {\n background: none;\n border: solid 2px;\n }\n\n / Default /\n .button--outline.button--secondary {\n border-color: var(--nile-colors-neutral-300);\n color: var(--nile-colors-neutral-700);\n }\n\n .button--outline.button--secondary:hover:not(.button--disabled),\n .button--outline.button--secondary.button--checked:not(.button--disabled) {\n border-color: var(--nile-colors-primary-600);\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--secondary:active:not(.button--disabled) {\n border-color: var(--nile-colors-neutral-700);\n color: var(--nile-colors-white-base);\n }\n\n / Primary /\n .button--outline.button--primary {\n border-color: var(--nile-colors-primary-600);\n color: var(--nile-colors-primary-600);\n }\n\n .button--outline.button--primary:hover:not(.button--disabled),\n .button--outline.button--primary.button--checked:not(.button--disabled) {\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--primary:active:not(.button--disabled) {\n border-color: var(--nile-colors-primary-700);\n color: var(--nile-colors-white-base);\n }\n\n / Success /\n .button--outline.button--success {\n border-color: var(--nile-colors-green-600);\n color: var(--nile-colors-green-600);\n }\n\n .button--outline.button--success:hover:not(.button--disabled),\n .button--outline.button--success.button--checked:not(.button--disabled) {\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--success:active:not(.button--disabled) {\n border-color: var(--nile-colors-green-700);\n color: var(--nile-colors-white-base);\n }\n\n / Neutral /\n .button--outline.button--neutral {\n border-color: var(--nile-colors-neutral-600);\n color: var(--nile-colors-neutral-600);\n }\n\n .button--outline.button--neutral:hover:not(.button--disabled),\n .button--outline.button--neutral.button--checked:not(.button--disabled) {\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--neutral:active:not(.button--disabled) {\n border-color: var(--nile-colors-neutral-700);\n color: var(--nile-colors-white-base);\n }\n\n / Warning /\n .button--outline.button--warning {\n border-color: var(--nile-colors-orange-600);\n color: var(--nile-colors-orange-600);\n }\n\n .button--outline.button--warning:hover:not(.button--disabled),\n .button--outline.button--warning.button--checked:not(.button--disabled) {\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--warning:active:not(.button--disabled) {\n border-color: var(--nile-colors-orange-700);\n color: var(--nile-colors-white-base);\n }\n\n / Danger /\n .button--outline.button--danger {\n border-color: var(--nile-colors-red-600);\n color: var(--nile-colors-red-600);\n }\n\n .button--outline.button--danger:hover:not(.button--disabled),\n .button--outline.button--danger.button--checked:not(.button--disabled) {\n background-color: var(--nile-colors-red-600);\n color: var(--nile-colors-white-base);\n }\n\n .button--outline.button--danger:active:not(.button--disabled) {\n border-color: var(--nile-colors-red-700);\n background-color: var(--nile-colors-red-700);\n color: var(--nile-colors-white-base);\n }\n\n / destructive /\n .button--outline.button--destructive {\n border-color: #fda29b;\n color: #b42318;\n box-shadow: 0px;\n }\n\n .button--outline.button--destructive:hover:not(.button--disabled),\n .button--outline.button--destructive.button--checked:not(.button--disabled) {\n border-color: #fda29b;\n color: #912018;\n background-color: #fef3f2;\n }\n\n .button--outline.button--destructive:active:not(.button--disabled) {\n border-color: #fda29b;\n color: #b42318;\n background-color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n\n / destructive - focus-visible /\n .button--outline.button--destructive:focus-visible:not(.button--disabled) {\n border-color: #fda29b;\n color: #b42318;\n background-color: #fff;\n box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05),\n 0px 0px 0px 4px rgba(240, 68, 56, 0.24);\n }\n\n / secondary-grey /\n .button--outline.button--secondary-grey {\n box-shadow: 0px;\n }\n\n .button--outline.button--secondary-grey:hover:not(.button--disabled),\n .button--outline.button--secondary-grey.button--checked:not(\n .button--disabled\n ) {\n color: #344054;\n background-color: #f9fafb;\n }\n\n .button--outline.button--secondary-grey:active:not(.button--disabled) {\n box-shadow: 0px;\n }\n\n .button--outline.button--secondary-grey:focus-visible:not(.button--disabled) {\n box-shadow: 0px;\n }\n\n / secondary-blue /\n .button--outline.button--secondary-blue {\n box-shadow: 0px;\n }\n\n .button--outline.button--secondary-blue:hover:not(.button--disabled),\n .button--outline.button--secondary-blue.button--checked:not(\n .button--disabled\n ) {\n color: #004678;\n background-color: #eaf0f8;\n }\n\n .button--outline.button--secondary-blue:active:not(.button--disabled) {\n box-shadow: 0px;\n }\n\n .button--outline.button--secondary-blue:focus-visible:not(.button--disabled) {\n box-shadow: 0px;\n }\n\n @media (forced-colors: active) {\n .button.button--outline.button--checked:not(.button--disabled) {\n outline: solid 2px transparent;\n }\n }\n\n /\n * Pill modifier\n /\n\n .button--pill.button--small {\n border-radius: 24px;\n }\n\n .button--pill.button--medium {\n border-radius: 32px;\n }\n\n /\n * Circle modifier\n /\n\n .button--circle {\n padding-left: 0;\n padding-right: 0;\n }\n\n .button--circle.button--small {\n width: 24px;\n height: 24px;\n border-radius: 50%;\n }\n\n .button--circle.button--medium {\n width: 38px;\n height: 38px;\n border-radius: 50%;\n }\n\n .button--circle .button__prefix,\n .button--circle .button__suffix,\n .button--circle .button__caret {\n display: none;\n }\n\n / Caret modifier /\n\n .button--caret .button__suffix {\n display: none;\n }\n\n .button--caret .button__caret {\n height: auto;\n }\n\n /\n * Loading modifier\n /\n\n .button--loading {\n position: relative;\n cursor: wait;\n }\n\n .button--loading .button__prefix,\n .button--loading .button__label,\n .button--loading .button__suffix,\n .button--loading .button__caret {\n visibility: hidden;\n }\n\n .button--loading nile-spinner {\n --indicator-color: currentColor;\n position: absolute;\n font-size: 1em;\n height: 1em;\n width: 1em;\n top: calc(50% - 0.5em);\n left: calc(50% - 0.5em);\n }\n /\n * Badges\n /\n\n .button ::slotted(nile-badge) {\n position: absolute;\n top: 0;\n right: 0;\n translate: 50% -50%;\n pointer-events: none;\n }\n\n / outline with no border */\n .button--outline.button--hideborder {\n border: 0px;\n }\n`;\n"]}

package/dist/src/nile-button/nile-button.js CHANGED Viewed

@@ -4,11 +4,12 @@ import { classMap } from 'lit/directives/class-map.js';
 import { customElement, property, query, state } from 'lit/decorators.js';
 import { FormControlController, validValidityState } from '../internal/form';
 import { HasSlotController } from '../internal/slot';
-import { html, literal } from 'lit/static-html.js';
+import { html } from 'lit';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { watch } from '../internal/watch';
 import { styles } from './nile-button.css';
 import NileElement from '../internal/nile-element';
+import { literal } from 'lit/static-html.js';
 /**
  * @summary Buttons represent actions that are available to the user.
  * @status stable
@@ -217,69 +218,120 @@ let NileButton = class NileButton extends NileElement {
             'secondary-blue': 'black',
             'tertiary-blue': 'black',
         };
-        /* eslint-disable lit/no-invalid-html */
-        /* eslint-disable lit/binding-positions */
-        return html `
-      <${tag}
+        if (this.isLink()) {
+            return html `
+        <a
+          part="base"
+          class=${classMap({
+                button: true,
+                'button--primary': this.variant === 'primary',
+                'button--secondary': this.variant === 'secondary',
+                'button--tertiary': this.variant === 'tertiary',
+                'button--caution': this.variant === 'caution',
+                'button--ghost': this.variant === 'ghost',
+                'button--destructive': this.variant === 'destructive',
+                'button--secondary-grey': this.variant === 'secondary-grey',
+                'button--secondary-blue': this.variant === 'secondary-blue',
+                'button--hideborder': this.hideBorder,
+                'button--medium': this.size === 'medium',
+                'button--caret': this.caret,
+                'button--circle': this.circle,
+                'button--disabled': this.disabled,
+                'button--focused': this.hasFocus,
+                'button--loading': this.loading,
+                'button--standard': !this.outline,
+                'button--outline': this.outline,
+                'button--pill': this.pill,
+                'button--has-label': this.hasSlotController.test('[default]'),
+                'button--has-prefix': this.hasSlotController.test('prefix'),
+                'button--has-suffix': this.hasSlotController.test('suffix'),
+            })}
+          href=${ifDefined(this.href)}
+          target=${ifDefined(this.target)}
+          download=${ifDefined(this.download)}
+          rel=${ifDefined(this.rel)}
+          title=${this.title}
+          role="button"
+          aria-disabled=${this.disabled ? 'true' : 'false'}
+          tabindex=${this.disabled ? '-1' : '0'}
+          @blur=${this.handleBlur}
+          @focus=${this.handleFocus}
+          @click=${this.handleClick}
+        >
+          <slot name="prefix" part="prefix" class="button__prefix"></slot>
+          <slot part="label" class="button__label"></slot>
+          <slot name="suffix" part="suffix" class="button__suffix"></slot>
+          ${this.caret
+                ? html `
+                <nile-icon
+                  part="caret"
+                  class="button__caret"
+                  color="${variantCaretColors[this.variant]}"
+                  name="arrowdown"
+                ></nile-icon>
+              `
+                : ''}
+          ${this.loading ? html `<nile-spinner></nile-spinner>` : ''}
+        </a>
+      `;
+        }
+        else {
+            return html `
+      <button
         part="base"
         class=${classMap({
-            button: true,
-            'button--primary': this.variant === 'primary',
-            'button--secondary': this.variant === 'secondary',
-            'button--tertiary': this.variant === 'tertiary',
-            'button--caution': this.variant === 'caution',
-            'button--ghost': this.variant === 'ghost',
-            'button--destructive': this.variant === 'destructive',
-            'button--secondary-grey': this.variant === 'secondary-grey',
-            'button--secondary-blue': this.variant === 'secondary-blue',
-            'button--hideborder': this.hideBorder,
-            'button--medium': this.size === 'medium',
-            'button--caret': this.caret,
-            'button--circle': this.circle,
-            'button--disabled': this.disabled,
-            'button--focused': this.hasFocus,
-            'button--loading': this.loading,
-            'button--standard': !this.outline,
-            'button--outline': this.outline,
-            'button--pill': this.pill,
-            'button--has-label': this.hasSlotController.test('[default]'),
-            'button--has-prefix': this.hasSlotController.test('prefix'),
-            'button--has-suffix': this.hasSlotController.test('suffix'),
-        })}
-        ?disabled=${ifDefined(isLink ? undefined : this.disabled)}
-        type=${ifDefined(isLink ? undefined : this.type)}
-        title=${this
-            .title /* An empty title prevents browser validation tooltips from appearing on hover */}
-        name=${ifDefined(isLink ? undefined : this.name)}
-        value=${ifDefined(isLink ? undefined : this.value)}
-        href=${ifDefined(isLink ? this.href : undefined)}
-        target=${ifDefined(isLink ? this.target : undefined)}
-        download=${ifDefined(isLink ? this.download : undefined)}
-        rel=${ifDefined(isLink ? this.rel : undefined)}
-        role=${ifDefined(isLink ? undefined : 'button')}
+                button: true,
+                'button--primary': this.variant === 'primary',
+                'button--secondary': this.variant === 'secondary',
+                'button--tertiary': this.variant === 'tertiary',
+                'button--caution': this.variant === 'caution',
+                'button--ghost': this.variant === 'ghost',
+                'button--destructive': this.variant === 'destructive',
+                'button--secondary-grey': this.variant === 'secondary-grey',
+                'button--secondary-blue': this.variant === 'secondary-blue',
+                'button--hideborder': this.hideBorder,
+                'button--medium': this.size === 'medium',
+                'button--caret': this.caret,
+                'button--circle': this.circle,
+                'button--disabled': this.disabled,
+                'button--focused': this.hasFocus,
+                'button--loading': this.loading,
+                'button--standard': !this.outline,
+                'button--outline': this.outline,
+                'button--pill': this.pill,
+                'button--has-label': this.hasSlotController.test('[default]'),
+                'button--has-prefix': this.hasSlotController.test('prefix'),
+                'button--has-suffix': this.hasSlotController.test('suffix'),
+            })}
+        ?disabled=${this.disabled}
+        type=${this.type}
+        name=${ifDefined(this.name)}
+        value=${ifDefined(this.value)}
+        title=${this.title}
         aria-disabled=${this.disabled ? 'true' : 'false'}
         tabindex=${this.disabled ? '-1' : '0'}
         @blur=${this.handleBlur}
         @focus=${this.handleFocus}
-        @invalid=${this.isButton() ? this.handleInvalid : null}
+        @invalid=${this.handleInvalid}
         @click=${this.handleClick}
       >
         <slot name="prefix" part="prefix" class="button__prefix"></slot>
         <slot part="label" class="button__label"></slot>
         <slot name="suffix" part="suffix" class="button__suffix"></slot>
         ${this.caret
-            ? html `
-                <nile-icon
-                  part="caret"
-                  class="button__caret"
-                  color="${variantCaretColors[this.variant]}"
-                  name="arrowdown"
-                ></nile-icon>
-              `
-            : ''}
+                ? html `
+              <nile-icon
+                part="caret"
+                class="button__caret"
+                color="${variantCaretColors[this.variant]}"
+                name="arrowdown"
+              ></nile-icon>
+            `
+                : ''}
         ${this.loading ? html `<nile-spinner></nile-spinner>` : ''}
-      </${tag}>
+      </button>
     `;
+        }
     }
 };
 NileButton.styles = styles;

package/dist/src/nile-button/nile-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-button.js","sourceRoot":"","sources":["../../../src/nile-button/nile-button.ts"],"names":[],"mappings":"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","sourcesContent":["import '../nile-icon';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { FormControlController, validValidityState } from '../internal/form';\nimport { HasSlotController } from '../internal/slot';\nimport { html, literal } from 'lit/static-html.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { watch } from '../internal/watch';\nimport { styles } from './nile-button.css';\nimport type { CSSResultGroup, TemplateResult } from 'lit';\nimport type { NileFormControl } from '../internal/nile-element';\nimport NileElement from '../internal/nile-element';\n\n/*\n @summary Buttons represent actions that are available to the user.\n * @status stable\n * @since 2.0\n \n @dependency nile-icon\n * @dependency nile-spinner\n \n @event nile-blur - Emitted when the button loses focus.\n * @event nile-focus - Emitted when the button gains focus.\n * @event nile-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n \n @slot - The button's label.\n * @slot prefix - A presentational prefix icon or similar element.\n * @slot suffix - A presentational suffix icon or similar element.\n \n @csspart base - The component's base wrapper.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart label - The button's label.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart caret - The button's caret icon, an `<nile-icon>` element.\n /\n\n@customElement('nile-button')\nexport class NileButton extends NileElement implements NileFormControl {\n static styles: CSSResultGroup = styles;\n\n private readonly formControlController = new FormControlController(this, {\n form: input => {\n // Buttons support a form attribute that points to an arbitrary form, so if this attribute is set we need to query\n // the form from the same root using its id\n if (input.hasAttribute('form')) {\n const doc = input.getRootNode() as Document \| ShadowRoot;\n const formId = input.getAttribute('form')!;\n return doc.getElementById(formId) as HTMLFormElement;\n }\n\n // Fall back to the closest containing form\n return input.closest('form');\n },\n assumeInteractionOn: ['click'],\n });\n private readonly hasSlotController = new HasSlotController(\n this,\n '[default]',\n 'prefix',\n 'suffix'\n );\n\n @query('.button') button: HTMLButtonElement \| HTMLLinkElement;\n\n @state() private hasFocus = false;\n @state() invalid = false;\n @property() title = ''; // make reactive to pass through\n\n /* The button's theme variant. /\n @property({ reflect: true }) variant:\n \| 'primary'\n \| 'secondary'\n \| 'tertiary'\n \| 'caution'\n \| 'ghost'\n \| 'destructive'\n \| 'secondary-grey'\n \| 'secondary-blue' = 'primary';\n\n /* The button's size. /\n @property({ reflect: true }) size: 'medium' = 'medium';\n\n /* Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior. /\n @property({ type: Boolean, reflect: true }) caret = false;\n\n /* Disables the button. /\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /* Draws the button in a loading state. /\n @property({ type: Boolean, reflect: true }) loading = false;\n\n /* Draws an outlined button. /\n @property({ type: Boolean, reflect: true }) outline = false;\n\n /* Draws a pill-style button with rounded edges. /\n @property({ type: Boolean, reflect: true }) pill = false;\n\n /\n Draws a circular icon button. When this attribute is present, the button expects a single `<nile-icon>` in the\n * default slot.\n /\n @property({ type: Boolean, reflect: true }) circle = false;\n\n /\n The type of button. Note that the default value is `button` instead of `submit`, which is opposite of how native\n * `<button>` elements behave. When the type is `submit`, the button will submit the surrounding form.\n /\n @property() type: 'button' \| 'submit' \| 'reset' = 'button';\n\n /\n The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.\n * This attribute is ignored when `href` is present.\n /\n @property() name = '';\n\n /\n The value of the button, submitted as a pair with the button's name as part of the form data, but only when this\n * button is the submitter. This attribute is ignored when `href` is present.\n /\n @property() value = '';\n\n /* When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. /\n @property() href = '';\n\n /* Tells the browser where to open the link. Only used when `href` is present. /\n @property() target: '_blank' \| '_parent' \| '_self' \| '_top';\n\n /\n When using `href`, this attribute will map to the underlying link's `rel` attribute. Unlike regular links, the\n * default is `noreferrer noopener` to prevent security exploits. However, if you're using `target` to point to a\n * specific tab/window, this will prevent that from working correctly. You can remove or change the default value by\n * setting the attribute to an empty string or a value of your choice, respectively.\n /\n @property() rel = 'noreferrer noopener';\n\n /* Tells the browser to download the linked file as this filename. Only used when `href` is present. /\n @property() download?: string;\n\n /\n The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n * value of this attribute must be an id of a form in the same document or shadow root as the button.\n /\n @property() form: string;\n\n /* Used to override the form owner's `action` attribute. /\n @property({ attribute: 'formaction' }) formAction: string;\n\n /* Used to override the form owner's `enctype` attribute. /\n @property({ attribute: 'formenctype' })\n formEnctype:\n \| 'application/x-www-form-urlencoded'\n \| 'multipart/form-data'\n \| 'text/plain';\n\n /* Used to override the form owner's `method` attribute. /\n @property({ attribute: 'formmethod' }) formMethod: 'post' \| 'get';\n\n /* Used to override the form owner's `novalidate` attribute. /\n @property({ attribute: 'formnovalidate', type: Boolean })\n formNoValidate: boolean;\n\n /* Used to override the form owner's `target` attribute. /\n @property({ attribute: 'formtarget' }) formTarget:\n \| '_self'\n \| '_blank'\n \| '_parent'\n \| '_top'\n \| string;\n\n @property({ type: Boolean, reflect: true, attribute: 'hide-border' })\n hideBorder = false;\n\n /* Gets the validity state object /\n get validity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).validity;\n }\n\n return validValidityState;\n }\n\n /* Gets the validation message /\n get validationMessage() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).validationMessage;\n }\n\n return '';\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.handleHostClick = this.handleHostClick.bind(this);\n this.addEventListener('click', this.handleHostClick);\n this.emit('nile-init');\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.handleHostClick);\n this.emit('nile-destroy');\n }\n\n firstUpdated() {\n if (this.isButton()) {\n this.formControlController.updateValidity();\n }\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('nile-blur');\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('nile-focus');\n }\n\n private handleClick() {\n if (this.type === 'submit') {\n this.formControlController.submit(this);\n }\n\n if (this.type === 'reset') {\n this.formControlController.reset(this);\n }\n }\n\n private handleHostClick(event: MouseEvent) {\n // Prevent the click event from being emitted when the button is disabled or loading\n if (this.disabled \|\| this.loading) {\n event.preventDefault();\n event.stopImmediatePropagation();\n }\n }\n\n private handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n private isButton() {\n return this.href ? false : true;\n }\n\n private isLink() {\n return this.href ? true : false;\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n if (this.isButton()) {\n // Disabled form controls are always valid\n this.formControlController.setValidity(this.disabled);\n }\n }\n\n /* Simulates a click on the button. /\n click() {\n this.button.click();\n }\n\n /* Sets focus on the button. /\n focus(options?: FocusOptions) {\n this.button.focus(options);\n }\n\n /* Removes focus from the button. /\n blur() {\n this.button.blur();\n }\n\n /* Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. /\n checkValidity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).checkValidity();\n }\n\n return true;\n }\n\n /* Gets the associated form, if one exists. /\n getForm(): HTMLFormElement \| null {\n return this.formControlController.getForm();\n }\n\n /* Checks for validity and shows the browser's validation message if the control is invalid. /\n reportValidity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).reportValidity();\n }\n\n return true;\n }\n\n /* Sets a custom validation message. Pass an empty string to restore validity. /\n setCustomValidity(message: string) {\n if (this.isButton()) {\n (this.button as HTMLButtonElement).setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n }\n\n render(): TemplateResult {\n const isLink = this.isLink();\n const tag = isLink ? literal`a` : literal`button`;\n\n const variantCaretColors = {\n primary: 'white',\n secondary: 'black',\n tertiary: 'black',\n caution: 'white',\n ghost: 'black',\n destructive: 'white',\n 'secondary-grey': 'black',\n 'secondary-blue': 'black',\n 'tertiary-blue': 'black',\n };\n\n / eslint-disable lit/no-invalid-html /\n / eslint-disable lit/binding-positions /\n return html`\n <${tag}\n part=\"base\"\n class=${classMap({\n button: true,\n 'button--primary': this.variant === 'primary',\n 'button--secondary': this.variant === 'secondary',\n 'button--tertiary': this.variant === 'tertiary',\n 'button--caution': this.variant === 'caution',\n 'button--ghost': this.variant === 'ghost',\n 'button--destructive': this.variant === 'destructive',\n 'button--secondary-grey': this.variant === 'secondary-grey',\n 'button--secondary-blue': this.variant === 'secondary-blue',\n 'button--hideborder': this.hideBorder,\n 'button--medium': this.size === 'medium',\n 'button--caret': this.caret,\n 'button--circle': this.circle,\n 'button--disabled': this.disabled,\n 'button--focused': this.hasFocus,\n 'button--loading': this.loading,\n 'button--standard': !this.outline,\n 'button--outline': this.outline,\n 'button--pill': this.pill,\n 'button--has-label': this.hasSlotController.test('[default]'),\n 'button--has-prefix': this.hasSlotController.test('prefix'),\n 'button--has-suffix': this.hasSlotController.test('suffix'),\n })}\n ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n type=${ifDefined(isLink ? undefined : this.type)}\n title=${\n this\n .title / An empty title prevents browser validation tooltips from appearing on hover */\n }\n name=${ifDefined(isLink ? undefined : this.name)}\n value=${ifDefined(isLink ? undefined : this.value)}\n href=${ifDefined(isLink ? this.href : undefined)}\n target=${ifDefined(isLink ? this.target : undefined)}\n download=${ifDefined(isLink ? this.download : undefined)}\n rel=${ifDefined(isLink ? this.rel : undefined)}\n role=${ifDefined(isLink ? undefined : 'button')}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n tabindex=${this.disabled ? '-1' : '0'}\n @blur=${this.handleBlur}\n @focus=${this.handleFocus}\n @invalid=${this.isButton() ? this.handleInvalid : null}\n @click=${this.handleClick}\n >\n <slot name=\"prefix\" part=\"prefix\" class=\"button__prefix\"></slot>\n <slot part=\"label\" class=\"button__label\"></slot>\n <slot name=\"suffix\" part=\"suffix\" class=\"button__suffix\"></slot>\n ${\n this.caret\n ? html`\n <nile-icon\n part=\"caret\"\n class=\"button__caret\"\n color=\"${variantCaretColors[this.variant]}\"\n name=\"arrowdown\"\n ></nile-icon>\n `\n : ''\n }\n ${this.loading ? html`<nile-spinner></nile-spinner>` : ''}\n </${tag}>\n `;\n }\n}\n\nexport default NileButton;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-button': NileButton;\n }\n}\n"]}
1	+ {"version":3,"file":"nile-button.js","sourceRoot":"","sources":["../../../src/nile-button/nile-button.ts"],"names":[],"mappings":"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","sourcesContent":["import '../nile-icon';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { FormControlController, validValidityState } from '../internal/form';\nimport { HasSlotController } from '../internal/slot';\nimport { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { watch } from '../internal/watch';\nimport { styles } from './nile-button.css';\nimport type { CSSResultGroup, TemplateResult } from 'lit';\nimport type { NileFormControl } from '../internal/nile-element';\nimport NileElement from '../internal/nile-element';\nimport { literal } from 'lit/static-html.js';\n/*\n @summary Buttons represent actions that are available to the user.\n * @status stable\n * @since 2.0\n \n @dependency nile-icon\n * @dependency nile-spinner\n \n @event nile-blur - Emitted when the button loses focus.\n * @event nile-focus - Emitted when the button gains focus.\n * @event nile-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n \n @slot - The button's label.\n * @slot prefix - A presentational prefix icon or similar element.\n * @slot suffix - A presentational suffix icon or similar element.\n \n @csspart base - The component's base wrapper.\n * @csspart prefix - The container that wraps the prefix.\n * @csspart label - The button's label.\n * @csspart suffix - The container that wraps the suffix.\n * @csspart caret - The button's caret icon, an `<nile-icon>` element.\n /\n\n@customElement('nile-button')\nexport class NileButton extends NileElement implements NileFormControl {\n static styles: CSSResultGroup = styles;\n\n private readonly formControlController = new FormControlController(this, {\n form: input => {\n // Buttons support a form attribute that points to an arbitrary form, so if this attribute is set we need to query\n // the form from the same root using its id\n if (input.hasAttribute('form')) {\n const doc = input.getRootNode() as Document \| ShadowRoot;\n const formId = input.getAttribute('form')!;\n return doc.getElementById(formId) as HTMLFormElement;\n }\n\n // Fall back to the closest containing form\n return input.closest('form');\n },\n assumeInteractionOn: ['click'],\n });\n private readonly hasSlotController = new HasSlotController(\n this,\n '[default]',\n 'prefix',\n 'suffix'\n );\n\n @query('.button') button: HTMLButtonElement \| HTMLLinkElement;\n\n @state() private hasFocus = false;\n @state() invalid = false;\n @property() title = ''; // make reactive to pass through\n\n /* The button's theme variant. /\n @property({ reflect: true }) variant:\n \| 'primary'\n \| 'secondary'\n \| 'tertiary'\n \| 'caution'\n \| 'ghost'\n \| 'destructive'\n \| 'secondary-grey'\n \| 'secondary-blue' = 'primary';\n\n /* The button's size. /\n @property({ reflect: true }) size: 'medium' = 'medium';\n\n /* Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior. /\n @property({ type: Boolean, reflect: true }) caret = false;\n\n /* Disables the button. /\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /* Draws the button in a loading state. /\n @property({ type: Boolean, reflect: true }) loading = false;\n\n /* Draws an outlined button. /\n @property({ type: Boolean, reflect: true }) outline = false;\n\n /* Draws a pill-style button with rounded edges. /\n @property({ type: Boolean, reflect: true }) pill = false;\n\n /\n Draws a circular icon button. When this attribute is present, the button expects a single `<nile-icon>` in the\n * default slot.\n /\n @property({ type: Boolean, reflect: true }) circle = false;\n\n /\n The type of button. Note that the default value is `button` instead of `submit`, which is opposite of how native\n * `<button>` elements behave. When the type is `submit`, the button will submit the surrounding form.\n /\n @property() type: 'button' \| 'submit' \| 'reset' = 'button';\n\n /\n The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.\n * This attribute is ignored when `href` is present.\n /\n @property() name = '';\n\n /\n The value of the button, submitted as a pair with the button's name as part of the form data, but only when this\n * button is the submitter. This attribute is ignored when `href` is present.\n /\n @property() value = '';\n\n /* When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. /\n @property() href = '';\n\n /* Tells the browser where to open the link. Only used when `href` is present. /\n @property() target: '_blank' \| '_parent' \| '_self' \| '_top';\n\n /\n When using `href`, this attribute will map to the underlying link's `rel` attribute. Unlike regular links, the\n * default is `noreferrer noopener` to prevent security exploits. However, if you're using `target` to point to a\n * specific tab/window, this will prevent that from working correctly. You can remove or change the default value by\n * setting the attribute to an empty string or a value of your choice, respectively.\n /\n @property() rel = 'noreferrer noopener';\n\n /* Tells the browser to download the linked file as this filename. Only used when `href` is present. /\n @property() download?: string;\n\n /\n The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n * value of this attribute must be an id of a form in the same document or shadow root as the button.\n /\n @property() form: string;\n\n /* Used to override the form owner's `action` attribute. /\n @property({ attribute: 'formaction' }) formAction: string;\n\n /* Used to override the form owner's `enctype` attribute. /\n @property({ attribute: 'formenctype' })\n formEnctype:\n \| 'application/x-www-form-urlencoded'\n \| 'multipart/form-data'\n \| 'text/plain';\n\n /* Used to override the form owner's `method` attribute. /\n @property({ attribute: 'formmethod' }) formMethod: 'post' \| 'get';\n\n /* Used to override the form owner's `novalidate` attribute. /\n @property({ attribute: 'formnovalidate', type: Boolean })\n formNoValidate: boolean;\n\n /* Used to override the form owner's `target` attribute. /\n @property({ attribute: 'formtarget' }) formTarget:\n \| '_self'\n \| '_blank'\n \| '_parent'\n \| '_top'\n \| string;\n\n @property({ type: Boolean, reflect: true, attribute: 'hide-border' })\n hideBorder = false;\n\n /* Gets the validity state object /\n get validity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).validity;\n }\n\n return validValidityState;\n }\n\n /* Gets the validation message /\n get validationMessage() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).validationMessage;\n }\n\n return '';\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.handleHostClick = this.handleHostClick.bind(this);\n this.addEventListener('click', this.handleHostClick);\n this.emit('nile-init');\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.handleHostClick);\n this.emit('nile-destroy');\n }\n\n firstUpdated() {\n if (this.isButton()) {\n this.formControlController.updateValidity();\n }\n }\n\n private handleBlur() {\n this.hasFocus = false;\n this.emit('nile-blur');\n }\n\n private handleFocus() {\n this.hasFocus = true;\n this.emit('nile-focus');\n }\n\n private handleClick() {\n if (this.type === 'submit') {\n this.formControlController.submit(this);\n }\n\n if (this.type === 'reset') {\n this.formControlController.reset(this);\n }\n }\n\n private handleHostClick(event: MouseEvent) {\n // Prevent the click event from being emitted when the button is disabled or loading\n if (this.disabled \|\| this.loading) {\n event.preventDefault();\n event.stopImmediatePropagation();\n }\n }\n\n private handleInvalid(event: Event) {\n this.formControlController.setValidity(false);\n this.formControlController.emitInvalidEvent(event);\n }\n\n private isButton() {\n return this.href ? false : true;\n }\n\n private isLink() {\n return this.href ? true : false;\n }\n\n @watch('disabled', { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n if (this.isButton()) {\n // Disabled form controls are always valid\n this.formControlController.setValidity(this.disabled);\n }\n }\n\n /* Simulates a click on the button. /\n click() {\n this.button.click();\n }\n\n /* Sets focus on the button. /\n focus(options?: FocusOptions) {\n this.button.focus(options);\n }\n\n /* Removes focus from the button. /\n blur() {\n this.button.blur();\n }\n\n /* Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. /\n checkValidity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).checkValidity();\n }\n\n return true;\n }\n\n /* Gets the associated form, if one exists. /\n getForm(): HTMLFormElement \| null {\n return this.formControlController.getForm();\n }\n\n /* Checks for validity and shows the browser's validation message if the control is invalid. /\n reportValidity() {\n if (this.isButton()) {\n return (this.button as HTMLButtonElement).reportValidity();\n }\n\n return true;\n }\n\n /* Sets a custom validation message. Pass an empty string to restore validity. */\n setCustomValidity(message: string) {\n if (this.isButton()) {\n (this.button as HTMLButtonElement).setCustomValidity(message);\n this.formControlController.updateValidity();\n }\n }\n\n render(): TemplateResult {\n const isLink = this.isLink();\n const tag = isLink ? literal`a` : literal`button`;\n\n const variantCaretColors = {\n primary: 'white',\n secondary: 'black',\n tertiary: 'black',\n caution: 'white',\n ghost: 'black',\n destructive: 'white',\n 'secondary-grey': 'black',\n 'secondary-blue': 'black',\n 'tertiary-blue': 'black',\n };\n\n if(this.isLink()){\n return html`\n <a\n part=\"base\"\n class=${classMap({\n button: true,\n 'button--primary': this.variant === 'primary',\n 'button--secondary': this.variant === 'secondary',\n 'button--tertiary': this.variant === 'tertiary',\n 'button--caution': this.variant === 'caution',\n 'button--ghost': this.variant === 'ghost',\n 'button--destructive': this.variant === 'destructive',\n 'button--secondary-grey': this.variant === 'secondary-grey',\n 'button--secondary-blue': this.variant === 'secondary-blue',\n 'button--hideborder': this.hideBorder,\n 'button--medium': this.size === 'medium',\n 'button--caret': this.caret,\n 'button--circle': this.circle,\n 'button--disabled': this.disabled,\n 'button--focused': this.hasFocus,\n 'button--loading': this.loading,\n 'button--standard': !this.outline,\n 'button--outline': this.outline,\n 'button--pill': this.pill,\n 'button--has-label': this.hasSlotController.test('[default]'),\n 'button--has-prefix': this.hasSlotController.test('prefix'),\n 'button--has-suffix': this.hasSlotController.test('suffix'),\n })}\n href=${ifDefined(this.href)}\n target=${ifDefined(this.target)}\n download=${ifDefined(this.download)}\n rel=${ifDefined(this.rel)}\n title=${this.title}\n role=\"button\"\n aria-disabled=${this.disabled ? 'true' : 'false'}\n tabindex=${this.disabled ? '-1' : '0'}\n @blur=${this.handleBlur}\n @focus=${this.handleFocus}\n @click=${this.handleClick}\n >\n <slot name=\"prefix\" part=\"prefix\" class=\"button__prefix\"></slot>\n <slot part=\"label\" class=\"button__label\"></slot>\n <slot name=\"suffix\" part=\"suffix\" class=\"button__suffix\"></slot>\n ${this.caret\n ? html`\n <nile-icon\n part=\"caret\"\n class=\"button__caret\"\n color=\"${variantCaretColors[this.variant]}\"\n name=\"arrowdown\"\n ></nile-icon>\n `\n : ''}\n ${this.loading ? html`<nile-spinner></nile-spinner>` : ''}\n </a>\n `;\n }\n else{\n return html`\n <button\n part=\"base\"\n class=${classMap({\n button: true,\n 'button--primary': this.variant === 'primary',\n 'button--secondary': this.variant === 'secondary',\n 'button--tertiary': this.variant === 'tertiary',\n 'button--caution': this.variant === 'caution',\n 'button--ghost': this.variant === 'ghost',\n 'button--destructive': this.variant === 'destructive',\n 'button--secondary-grey': this.variant === 'secondary-grey',\n 'button--secondary-blue': this.variant === 'secondary-blue',\n 'button--hideborder': this.hideBorder,\n 'button--medium': this.size === 'medium',\n 'button--caret': this.caret,\n 'button--circle': this.circle,\n 'button--disabled': this.disabled,\n 'button--focused': this.hasFocus,\n 'button--loading': this.loading,\n 'button--standard': !this.outline,\n 'button--outline': this.outline,\n 'button--pill': this.pill,\n 'button--has-label': this.hasSlotController.test('[default]'),\n 'button--has-prefix': this.hasSlotController.test('prefix'),\n 'button--has-suffix': this.hasSlotController.test('suffix'),\n })}\n ?disabled=${this.disabled}\n type=${this.type}\n name=${ifDefined(this.name)}\n value=${ifDefined(this.value)}\n title=${this.title}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n tabindex=${this.disabled ? '-1' : '0'}\n @blur=${this.handleBlur}\n @focus=${this.handleFocus}\n @invalid=${this.handleInvalid}\n @click=${this.handleClick}\n >\n <slot name=\"prefix\" part=\"prefix\" class=\"button__prefix\"></slot>\n <slot part=\"label\" class=\"button__label\"></slot>\n <slot name=\"suffix\" part=\"suffix\" class=\"button__suffix\"></slot>\n ${this.caret\n ? html`\n <nile-icon\n part=\"caret\"\n class=\"button__caret\"\n color=\"${variantCaretColors[this.variant]}\"\n name=\"arrowdown\"\n ></nile-icon>\n `\n : ''}\n ${this.loading ? html`<nile-spinner></nile-spinner>` : ''}\n </button>\n `;\n }\n }\n}\n\nexport default NileButton;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-button': NileButton;\n }\n}\n"]}

package/dist/src/nile-button/nile-button.test.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-button.test.js","sourceRoot":"","sources":["../../../src/nile-button/nile-button.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,eAAe,CAAC,CAAC,sCAAsC;~~AAI9D~~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","sourcesContent":["import { expect, fixture, html } from '@open-wc/testing';\nimport './nile-button'; // Adjust the import path as necessary\nimport NileButton from './nile-button';\~~nimport sinon from 'sinon';\~~n\ndescribe('NileButton', () => {\n it('should render with default properties', async () => {\n const el = await fixture<NileButton>(html`<nile-button></nile-button>`);\n expect(el).to.exist;\n expect(el.variant).to.equal('primary');\n expect(el.size).to.equal('medium');\n expect(el.type).to.equal('button');\n expect(el.disabled).to.be.false;\n expect(el.loading).to.be.false;\n });\n\n it('should apply the correct classes based on properties', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button variant=\"secondary\" pill outline caret></nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n expect(button!.classList.contains('button--secondary')).to.be.true;\n expect(button!.classList.contains('button--pill')).to.be.true;\n expect(button!.classList.contains('button--outline')).to.be.true;\n expect(button!.classList.contains('button--caret')).to.be.true;\n });\n\n it('should be disabled when the disabled property is set', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button disabled></nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n expect(button!.hasAttribute('disabled')).to.be.true;\n expect(button!.getAttribute('aria-disabled')).to.equal('true');\n });\n\n it('should render a link when the href property is set', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button\n href=\"https://example.com\"\n target=\"_blank\"\n ></nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n expect(button!.tagName).to.equal('A');\n expect(button!.getAttribute('href')).to.equal('https://example.com');\n expect(button!.getAttribute('target')).to.equal('_blank');\n });\n\n it('should show a spinner when the loading property is set', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button loading></nile-button>`\n );\n const spinner = el.shadowRoot!.querySelector('nile-spinner');\n expect(spinner).to.exist;\n });\n\n it('should emit nile-focus and nile-blur events', async () => {\n const el = await fixture<NileButton>(html`<nile-button></nile-button>`);\n const button = el.shadowRoot!.querySelector('.button');\n\n let focusEventEmitted = false;\n el.addEventListener('nile-focus', () => (focusEventEmitted = true));\n button!.dispatchEvent(new FocusEvent('focus'));\n expect(focusEventEmitted).to.be.true;\n\n let blurEventEmitted = false;\n el.addEventListener('nile-blur', () => (blurEventEmitted = true));\n button!.dispatchEvent(new FocusEvent('blur'));\n expect(blurEventEmitted).to.be.true;\n });\n\n it('should simulate a click on the button', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button>Click Me</nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n\n let clicked = false;\n el.addEventListener('click', () => (clicked = true));\n el.click();\n expect(clicked).to.be.true;\n });\n\n it('should focus and blur the button programmatically', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button>Click Me</nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n el.focus();\n await el.updateComplete;\n const focusButton = el.shadowRoot!.querySelector('.button--focused');\n expect(focusButton!.classList.contains('button--focused')).to.be.true;\n\n el.blur();\n await el.updateComplete;\n const blurButton = el.shadowRoot!.querySelector('.button');\n expect(blurButton!.classList.contains('button--focused')).to.be.false;\n });\n\n it('should set a custom validation message', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button type=\"submit\"></nile-button>`\n );\n const form = document.createElement('form');\n form.appendChild(el);\n document.body.appendChild(form);\n\n el.setCustomValidity('Invalid input');\n expect(el.validationMessage).to.equal('Invalid input');\n\n el.setCustomValidity('');\n expect(el.validationMessage).to.equal('');\n\n document.body.removeChild(form);\n });\n});\n"]}
1	+ {"version":3,"file":"nile-button.test.js","sourceRoot":"","sources":["../../../src/nile-button/nile-button.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect, fixture, html } from '@open-wc/testing';\nimport './nile-button'; // Adjust the import path as necessary\nimport NileButton from './nile-button';\n\ndescribe('NileButton', () => {\n it('should render with default properties', async () => {\n const el = await fixture<NileButton>(html`<nile-button></nile-button>`);\n expect(el).to.exist;\n expect(el.variant).to.equal('primary');\n expect(el.size).to.equal('medium');\n expect(el.type).to.equal('button');\n expect(el.disabled).to.be.false;\n expect(el.loading).to.be.false;\n });\n\n it('should apply the correct classes based on properties', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button variant=\"secondary\" pill outline caret></nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n expect(button!.classList.contains('button--secondary')).to.be.true;\n expect(button!.classList.contains('button--pill')).to.be.true;\n expect(button!.classList.contains('button--outline')).to.be.true;\n expect(button!.classList.contains('button--caret')).to.be.true;\n });\n\n it('should be disabled when the disabled property is set', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button disabled></nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n expect(button!.hasAttribute('disabled')).to.be.true;\n expect(button!.getAttribute('aria-disabled')).to.equal('true');\n });\n\n it('should render a link when the href property is set', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button\n href=\"https://example.com\"\n target=\"_blank\"\n ></nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n expect(button!.tagName).to.equal('A');\n expect(button!.getAttribute('href')).to.equal('https://example.com');\n expect(button!.getAttribute('target')).to.equal('_blank');\n });\n\n it('should show a spinner when the loading property is set', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button loading></nile-button>`\n );\n const spinner = el.shadowRoot!.querySelector('nile-spinner');\n expect(spinner).to.exist;\n });\n\n it('should emit nile-focus and nile-blur events', async () => {\n const el = await fixture<NileButton>(html`<nile-button></nile-button>`);\n const button = el.shadowRoot!.querySelector('.button');\n\n let focusEventEmitted = false;\n el.addEventListener('nile-focus', () => (focusEventEmitted = true));\n button!.dispatchEvent(new FocusEvent('focus'));\n expect(focusEventEmitted).to.be.true;\n\n let blurEventEmitted = false;\n el.addEventListener('nile-blur', () => (blurEventEmitted = true));\n button!.dispatchEvent(new FocusEvent('blur'));\n expect(blurEventEmitted).to.be.true;\n });\n\n it('should simulate a click on the button', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button>Click Me</nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n\n let clicked = false;\n el.addEventListener('click', () => (clicked = true));\n el.click();\n expect(clicked).to.be.true;\n });\n\n it('should focus and blur the button programmatically', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button>Click Me</nile-button>`\n );\n const button = el.shadowRoot!.querySelector('.button');\n el.focus();\n await el.updateComplete;\n const focusButton = el.shadowRoot!.querySelector('.button--focused');\n expect(focusButton!.classList.contains('button--focused')).to.be.true;\n\n el.blur();\n await el.updateComplete;\n const blurButton = el.shadowRoot!.querySelector('.button');\n expect(blurButton!.classList.contains('button--focused')).to.be.false;\n });\n\n it('should set a custom validation message', async () => {\n const el = await fixture<NileButton>(\n html`<nile-button type=\"submit\"></nile-button>`\n );\n const form = document.createElement('form');\n form.appendChild(el);\n document.body.appendChild(form);\n\n el.setCustomValidity('Invalid input');\n expect(el.validationMessage).to.equal('Invalid input');\n\n el.setCustomValidity('');\n expect(el.validationMessage).to.equal('');\n\n document.body.removeChild(form);\n });\n});\n"]}

package/dist/src/nile-button-filter/nile-button-filter.css.d.ts CHANGED Viewed

@@ -7,6 +7,6 @@
 /**
  * ButtonFilter CSS
  */
-export declare const styles: import("lit-element").CSSResult;
-declare const _default: import("lit-element").CSSResult[];
+export declare const styles: import("lit").CSSResult;
+declare const _default: import("lit").CSSResult[];
 export default _default;

package/dist/src/nile-button-filter/nile-button-filter.css.js CHANGED Viewed

@@ -4,7 +4,7 @@
  * This source code is licensed under the BSD-3-Clause license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { css } from 'lit-element';
+import { css } from 'lit';
 /**
  * ButtonFilter CSS
  */

package/dist/src/nile-button-filter/nile-button-filter.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-button-filter.css.js","sourceRoot":"","sources":["../../../src/nile-button-filter/nile-button-filter.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,~~aAAa~~,CAAC;~~AAElC~~;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;CAyBxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/*\n Copyright Aquera Inc 2023\n \n This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { css } from 'lit~~-element~~';\n\n/\n ButtonFilter CSS\n /\nexport const styles = css`\n :host {\n }\n\n .inner__text {\n display: flex;\n gap: var(--nile-radius-base-standard);\n\talign-items: flex-start;\n }\n\n .inner__text span {\n color: var(--nile-colors-dark-900);\n text-align: center;\n font-feature-settings: 'clig' off, 'liga' off;\n font-family: Colfax-regular;\n font-size: var(--nile-font-size-base);\n font-style: normal;\n font-weight: 600;\n line-height: var(--nile-font-size-base); / 100% */\n letter-spacing: 0.2px;\n }\n\n .inner__text nile-badge {\n color:var(--nile-colors-white-base);\n }\n`;\n\nexport default [styles];\n"]}
1	+ {"version":3,"file":"nile-button-filter.css.js","sourceRoot":"","sources":["../../../src/nile-button-filter/nile-button-filter.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;CAyBxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/*\n Copyright Aquera Inc 2023\n \n This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { css } from 'lit';\n\n/\n ButtonFilter CSS\n /\nexport const styles = css`\n :host {\n }\n\n .inner__text {\n display: flex;\n gap: var(--nile-radius-base-standard);\n\talign-items: flex-start;\n }\n\n .inner__text span {\n color: var(--nile-colors-dark-900);\n text-align: center;\n font-feature-settings: 'clig' off, 'liga' off;\n font-family: Colfax-regular;\n font-size: var(--nile-font-size-base);\n font-style: normal;\n font-weight: 600;\n line-height: var(--nile-font-size-base); / 100% */\n letter-spacing: 0.2px;\n }\n\n .inner__text nile-badge {\n color:var(--nile-colors-white-base);\n }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-button-filter/nile-button-filter.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@
  * This source code is licensed under the BSD-3-Clause license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { CSSResultArray, TemplateResult } from 'lit-element';
+import { CSSResultArray, TemplateResult } from 'lit';
 import NileElement from '../internal/nile-element';
 /**
  * Nile icon component.

package/dist/src/nile-button-filter/nile-button-filter.js CHANGED Viewed

@@ -5,8 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { __decorate } from "tslib";
-import { html, property, } from 'lit-element';
-import { customElement, state } from 'lit/decorators.js';
+import { html, } from 'lit';
+import { customElement, state, property } from 'lit/decorators.js';
 import { styles } from './nile-button-filter.css';
 import NileElement from '../internal/nile-element';
 /**