@aquera/nile-elements 0.1.39-beta-1.2 → 0.1.40-beta-1.1

package/dist/src/nile-split-panel/nile-split-panel.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-split-panel.css.js","sourceRoot":"","sources":["../../../src/nile-split-panel/nile-split-panel.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyFxB,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 * SplitPanel CSS\n */\nexport const styles = css`\n  :host *,\n  :host *::before,\n  :host *::after {\n    box-sizing: inherit;\n  }\n\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    box-sizing: border-box;\n    --divider-width: 4px;\n    --divider-hit-area: 12px;\n    --min: 0%;\n    --max: 100%;\n\n    display: grid;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .start,\n  .end {\n    overflow: hidden;\n  }\n\n  .divider {\n    flex: 0 0 var(--divider-width);\n    display: flex;\n    position: relative;\n    align-items: center;\n    justify-content: center;\n    background-color: var(--nile-colors-neutral-100 var(--ng-componentcolors-utility-gray-50));\n    color: var(--nile-colors-dark-900,var(--ng-color-graytrue-900));\n    z-index: 1;\n  }\n\n  .divider:focus {\n    outline: none;\n  }\n\n  :host(:not([disabled])) .divider:focus-visible {\n    background-color: var(--nile-colors-blue-500, var(--ng-color-blue-500));\n    color: var(--nile-colors-white-base, var(--ng-color-base-white));\n  }\n\n  :host([disabled]) .divider {\n    cursor: not-allowed;\n  }\n\n  /* Horizontal */\n  :host(:not([vertical], [disabled])) .divider {\n    cursor: col-resize;\n  }\n\n  :host(:not([vertical])) .divider::after {\n    display: flex;\n    content: '';\n    position: absolute;\n    height: 100%;\n    left: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n    width: var(--divider-hit-area);\n  }\n\n  /* Vertical */\n  :host([vertical]) {\n    flex-direction: column;\n  }\n\n  :host([vertical]:not([disabled])) .divider {\n    cursor: row-resize;\n  }\n\n  :host([vertical]) .divider::after {\n    content: '';\n    position: absolute;\n    width: 100%;\n    top: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n    height: var(--divider-hit-area);\n  }\n\n  @media (forced-colors: active) {\n    .divider {\n      outline: solid 1px transparent;\n    }\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-split-panel.css.js","sourceRoot":"","sources":["../../../src/nile-split-panel/nile-split-panel.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyFxB,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 * SplitPanel CSS\n */\nexport const styles = css`\n  :host *,\n  :host *::before,\n  :host *::after {\n    box-sizing: inherit;\n  }\n\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    box-sizing: border-box;\n    --divider-width: 4px;\n    --divider-hit-area: 12px;\n    --min: 0%;\n    --max: 100%;\n\n    display: grid;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .start,\n  .end {\n    overflow: hidden;\n  }\n\n  .divider {\n    flex: 0 0 var(--divider-width);\n    display: flex;\n    position: relative;\n    align-items: center;\n    justify-content: center;\n    background-color: var(--nile-colors-neutral-400 , var(--ng-colors-bg-quaternary));\n    color: var(--nile-colors-dark-900,var(--ng-colors-text-primary-900));\n    z-index: 1;\n  }\n\n  .divider:focus {\n    outline: none;\n  }\n\n  :host(:not([disabled])) .divider:focus-visible {\n    background-color: var(--nile-colors-blue-500, var(--ng-componentcolors-utility-brand-50));\n    color: var(--nile-colors-white-base, var(--ng-colors-text-white));\n  }\n\n  :host([disabled]) .divider {\n    cursor: not-allowed;\n  }\n\n  /* Horizontal */\n  :host(:not([vertical], [disabled])) .divider {\n    cursor: col-resize;\n  }\n\n  :host(:not([vertical])) .divider::after {\n    display: flex;\n    content: '';\n    position: absolute;\n    height: 100%;\n    left: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n    width: var(--divider-hit-area);\n  }\n\n  /* Vertical */\n  :host([vertical]) {\n    flex-direction: column;\n  }\n\n  :host([vertical]:not([disabled])) .divider {\n    cursor: row-resize;\n  }\n\n  :host([vertical]) .divider::after {\n    content: '';\n    position: absolute;\n    width: 100%;\n    top: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n    height: var(--divider-hit-area);\n  }\n\n  @media (forced-colors: active) {\n    .divider {\n      outline: solid 1px transparent;\n    }\n  }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-stepper-item/nile-stepper-item.css.js

@@ -36,8 +36,8 @@ export const styles = css `
 
 	.stepper__item--lg {
 		--item-spacing: var( --nile-spacing-md, var(--ng-spacing-lg));
-		--stepper-item-title-size: var( --nile-type-scale-3, var(--ng-font-size-text-md) );
-		--stepper-item-subtitle-size: var( --nile-type-scale-2, var(--ng-font-size-text-md) );
+		--stepper-item-title-size: var( --nile-type-scale-3, var(--ng-font-size-text-sm) );
+		--stepper-item-subtitle-size: var( --nile-type-scale-2, var(--ng-font-size-text-sm) );
 		--stepper-item-text-line-height: var( --nile-line-height-small, var(--ng-line-height-text-md) );
 		--circle-height:22px;
 	}

package/dist/src/nile-stepper-item/nile-stepper-item.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-stepper-item.css.js","sourceRoot":"","sources":["../../../src/nile-stepper-item/nile-stepper-item.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuKxB,CAAC;AACF,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 * StepperItem CSS\n */\nexport const styles = css`\n\t:host {\n\t\t--stepper-flex-val:1;\n\t\t--bulletin--dot--seperation:30%;\n\t\t--lines-thickness: var(--nile-width-1px, var(--ng-border-width-2));\n\t\t\n\t\tdisplay: inline-block;\n\t\tflex-grow:var(--stepper-flex-val);\n\t\tmin-width: 200px;\n\t\t-webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\t}\n\t\n\t.stepper__item {\n\t\tmargin: var( --nile-spacing-none, var(--ng-spacing-none)) -1px;\n\t}\n\n\t.stepper__item--sm {\n\t\t--item-spacing: var( --nile-spacing-md, var(--ng-spacing-md));\n\t\t--stepper-item-title-size: var( --nile-type-scale-2, var(--ng-font-size-text-sm) );\n\t\t--stepper-item-subtitle-size: var( --nile-type-scale-1, var(--ng-font-size-text-sm) );\n\t\t--stepper-item-text-line-height: var( --nile-line-height-xsmall, var(--ng-line-height-text-sm) );\n\t\t--circle-height:18px;\n\t}\n\n\t.stepper__item--lg {\n\t\t--item-spacing: var( --nile-spacing-md, var(--ng-spacing-lg));\n\t\t--stepper-item-title-size: var( --nile-type-scale-3, var(--ng-font-size-text-md) );\n\t\t--stepper-item-subtitle-size: var( --nile-type-scale-2, var(--ng-font-size-text-md) );\n\t\t--stepper-item-text-line-height: var( --nile-line-height-small, var(--ng-line-height-text-md) );\n\t\t--circle-height:22px;\n\t}\n\n\t.stepper__item--xl {\n\t\t--item-spacing: var( --nile-spacing-lg, var(--ng-spacing-lg));\n\t\t--stepper-item-title-size: var( --nile-type-scale-4, var(--ng-font-size-text-md) );\n\t\t--stepper-item-subtitle-size: var( --nile-type-scale-3, var(--ng-font-size-text-md) );\n\t\t--stepper-item-text-line-height: var( --nile-line-height-medium, var(--ng-line-height-text-lg) );\n\t\t--circle-height:26px;\n\t}\n\n\t.stepper__line__content {\n\t\tdisplay:flex;\n\t\twidth:100%;\n\t\talign-items:center;\n\t\tgap: var(--nile-spacing-none, var(--ng-spacing-lg));\n\t}\n\n\t.stepper__line__container {\n\t\tflex-grow:1;\n\t\tpadding: var( --nile-spacing-none, var(--ng-spacing-none)) 1px;\n\t}\n\n\t.stepper__line--hastitle {\n\t\tdisplay:flex;\n\t\talign-items:center;\n\t}\n\n\t.stepper__line {\n\t\tdisplay: block;\n\t\tborder: 0;\n\t\tborder-top: var(--lines-thickness) solid var(--nile-colors-neutral-500, var(--ng-colors-border-secondary) );\n\t}\n\n\t.stepper__line--active {\n\t\tborder-top: var(--lines-thickness) solid var( --nile-colors-primary-600, var(--ng-colors-border-brand-alt) );\n\t}\n\n\t.stepper__item__content--above{\n\t\tposition: relative;\n\t\tmargin-right: var( --nile-spacing-md, var(--ng-spacing-md));\n\t}\n\n\t.stepper__item__content--above .stepper__content__subtitle{\n\t\tposition: absolute;\n    top: 100%;\n    white-space: nowrap;\n\t}\n\n\t.stepper__item__content--below {\n\t\tmargin-top: var(--item-spacing);\n\t\tdisplay:flex;\n\t\tflex-direction:column;\n\t\talign-items:center;\n\t}\n\t\n\t.stepper__item__bulletin {\n\t\tdisplay:grid;\n\t\tplace-content:center;\n\t\tmargin: var( --nile-spacing-none, var(--ng-spacing-none)) -1px;\n\t}\n\n\t.stepper__item__bulletin{\n\t\tmargin-left: var( --nile-spacing-sm, var(--ng-spacing-none));\n\t\tmargin-right: var( --nile-spacing-sm, var(--ng-spacing-none));\n\t}\n\t\n\t.stepper__item__bulletin--inline{\n\t\tmargin-right: var( --nile-spacing-sm, var(--ng-spacing-sm));\n\t}\n\n\t.stepper__item--selected .stepper__item__bulletin{\n\t\tpadding: var(--nile-spacing-2px, var(--ng-spacing-xxs));\n    border: var(--nile-border-size-2, var(--ng-border-width-2)) solid var(--ng-colors-effects-focus-ring);\n    border-radius: 50%;\n\t}\n\n\t.stepper__content__title {\n\t\tcolor:var( --nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n\t\tfont-size: var(--stepper-item-title-size);\n\t\tline-height: var(--stepper-item-text-line-height);\n\t\tfont-family: var(--nile-font-family-medium, var(--ng-font-family-body));\n\t\tfont-weight: var(--nile-font-weight-regular, var(--ng-font-weight-600));\n\t}\n\n\t.stepper__content__title--inline{\n\t\tpadding: var( --nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-md, var(--ng-spacing-md));\n\t\tcolor:var( --nile-colors-dark-900, var(--ng-colors-text-secondary-700) );\n\t}\n\n\t.stepper__content__title--active{\n\t\tcolor:var( --nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700) );\n\t\tfont-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-600));\n\t}\n\n\t.stepper__content__subtitle {\n\t\tcolor:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600) );\n\t\tfont-size: var(--stepper-item-subtitle-size);\n\t\tline-height: var(--stepper-item-text-line-height);\n\t\tfont-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n\t\tfont-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n\t}\n\n\t.stepper__content__subtitle--active{\n\t\tcolor:var( --nile-colors-primary-600, var(--ng-colors-text-brand-tertiary-600) );\n\t}\n\n\t.stepper__bulletin--dot {\n\t\twidth: var(--circle-height);\n\t\taspect-ratio: 1 / 1;\n\t\tborder-radius: var(--nile-radius-full, var(--ng-radius-full));\n\t\tbackground: radial-gradient(var(--nile-colors-neutral-500, var(--ng-colors-border-secondary) ) var(--bulletin--dot--seperation), var(--nile-colors-dark-200, var(--ng-colors-bg-primary)) var(--bulletin--dot--seperation));\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-neutral-500, var(--ng-colors-border-secondary) );\n\t}\n\n\t.stepper__bulletin__dot--active{\n\t\tbackground: radial-gradient(var(--nile-colors-white-base, var(--ng-colors-bg-primary) ) var(--bulletin--dot--seperation), var( --nile-colors-primary-600, var(--ng-colors-bg-brand-solid) ) var(--bulletin--dot--seperation));\n\t\tborder: var(--lines-thickness) solid var( --nile-colors-primary-500, var(--ng-colors-border-brand-alt) );\n\t\twidth: calc( var(--circle-height) + calc( var(--lines-thickness) * 2 ) );\n\t}\n\n\t.stepper__bulletin--icon {\n\t\tdisplay: grid;\n\t\tplace-content:center;\n\t\twidth: var(--circle-height);\n\t\tborder: var(--lines-thickness) solid var( --nile-colors-primary-600, var(--ng-colors-bg-brand-solid) );\n\t\taspect-ratio: 1 / 1;\n\t\tborder-radius: var(--nile-radius-full, var(--ng-radius-full));\n\t\tbackground-color:var( --nile-colors-primary-600, var(--ng-colors-bg-brand-solid) );\n\t\toverflow:hidden;\n\t}\n\t\n\t.stepper__bulletin__icon--active {\n\t\tborder: 1px solid var( --nile-colors-primary-500, var(--ng-colors-bg-brand-solid) );\n\t\twidth: calc(var(--circle-height) + calc( var(--lines-thickness) * 2));\n\t}\n`;\nexport default [styles];\n"]}
+{"version":3,"file":"nile-stepper-item.css.js","sourceRoot":"","sources":["../../../src/nile-stepper-item/nile-stepper-item.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuKxB,CAAC;AACF,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 * StepperItem CSS\n */\nexport const styles = css`\n\t:host {\n\t\t--stepper-flex-val:1;\n\t\t--bulletin--dot--seperation:30%;\n\t\t--lines-thickness: var(--nile-width-1px, var(--ng-border-width-2));\n\t\t\n\t\tdisplay: inline-block;\n\t\tflex-grow:var(--stepper-flex-val);\n\t\tmin-width: 200px;\n\t\t-webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\t}\n\t\n\t.stepper__item {\n\t\tmargin: var( --nile-spacing-none, var(--ng-spacing-none)) -1px;\n\t}\n\n\t.stepper__item--sm {\n\t\t--item-spacing: var( --nile-spacing-md, var(--ng-spacing-md));\n\t\t--stepper-item-title-size: var( --nile-type-scale-2, var(--ng-font-size-text-sm) );\n\t\t--stepper-item-subtitle-size: var( --nile-type-scale-1, var(--ng-font-size-text-sm) );\n\t\t--stepper-item-text-line-height: var( --nile-line-height-xsmall, var(--ng-line-height-text-sm) );\n\t\t--circle-height:18px;\n\t}\n\n\t.stepper__item--lg {\n\t\t--item-spacing: var( --nile-spacing-md, var(--ng-spacing-lg));\n\t\t--stepper-item-title-size: var( --nile-type-scale-3, var(--ng-font-size-text-sm) );\n\t\t--stepper-item-subtitle-size: var( --nile-type-scale-2, var(--ng-font-size-text-sm) );\n\t\t--stepper-item-text-line-height: var( --nile-line-height-small, var(--ng-line-height-text-md) );\n\t\t--circle-height:22px;\n\t}\n\n\t.stepper__item--xl {\n\t\t--item-spacing: var( --nile-spacing-lg, var(--ng-spacing-lg));\n\t\t--stepper-item-title-size: var( --nile-type-scale-4, var(--ng-font-size-text-md) );\n\t\t--stepper-item-subtitle-size: var( --nile-type-scale-3, var(--ng-font-size-text-md) );\n\t\t--stepper-item-text-line-height: var( --nile-line-height-medium, var(--ng-line-height-text-lg) );\n\t\t--circle-height:26px;\n\t}\n\n\t.stepper__line__content {\n\t\tdisplay:flex;\n\t\twidth:100%;\n\t\talign-items:center;\n\t\tgap: var(--nile-spacing-none, var(--ng-spacing-lg));\n\t}\n\n\t.stepper__line__container {\n\t\tflex-grow:1;\n\t\tpadding: var( --nile-spacing-none, var(--ng-spacing-none)) 1px;\n\t}\n\n\t.stepper__line--hastitle {\n\t\tdisplay:flex;\n\t\talign-items:center;\n\t}\n\n\t.stepper__line {\n\t\tdisplay: block;\n\t\tborder: 0;\n\t\tborder-top: var(--lines-thickness) solid var(--nile-colors-neutral-500, var(--ng-colors-border-secondary) );\n\t}\n\n\t.stepper__line--active {\n\t\tborder-top: var(--lines-thickness) solid var( --nile-colors-primary-600, var(--ng-colors-border-brand-alt) );\n\t}\n\n\t.stepper__item__content--above{\n\t\tposition: relative;\n\t\tmargin-right: var( --nile-spacing-md, var(--ng-spacing-md));\n\t}\n\n\t.stepper__item__content--above .stepper__content__subtitle{\n\t\tposition: absolute;\n    top: 100%;\n    white-space: nowrap;\n\t}\n\n\t.stepper__item__content--below {\n\t\tmargin-top: var(--item-spacing);\n\t\tdisplay:flex;\n\t\tflex-direction:column;\n\t\talign-items:center;\n\t}\n\t\n\t.stepper__item__bulletin {\n\t\tdisplay:grid;\n\t\tplace-content:center;\n\t\tmargin: var( --nile-spacing-none, var(--ng-spacing-none)) -1px;\n\t}\n\n\t.stepper__item__bulletin{\n\t\tmargin-left: var( --nile-spacing-sm, var(--ng-spacing-none));\n\t\tmargin-right: var( --nile-spacing-sm, var(--ng-spacing-none));\n\t}\n\t\n\t.stepper__item__bulletin--inline{\n\t\tmargin-right: var( --nile-spacing-sm, var(--ng-spacing-sm));\n\t}\n\n\t.stepper__item--selected .stepper__item__bulletin{\n\t\tpadding: var(--nile-spacing-2px, var(--ng-spacing-xxs));\n    border: var(--nile-border-size-2, var(--ng-border-width-2)) solid var(--ng-colors-effects-focus-ring);\n    border-radius: 50%;\n\t}\n\n\t.stepper__content__title {\n\t\tcolor:var( --nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n\t\tfont-size: var(--stepper-item-title-size);\n\t\tline-height: var(--stepper-item-text-line-height);\n\t\tfont-family: var(--nile-font-family-medium, var(--ng-font-family-body));\n\t\tfont-weight: var(--nile-font-weight-regular, var(--ng-font-weight-600));\n\t}\n\n\t.stepper__content__title--inline{\n\t\tpadding: var( --nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-md, var(--ng-spacing-md));\n\t\tcolor:var( --nile-colors-dark-900, var(--ng-colors-text-secondary-700) );\n\t}\n\n\t.stepper__content__title--active{\n\t\tcolor:var( --nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700) );\n\t\tfont-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-600));\n\t}\n\n\t.stepper__content__subtitle {\n\t\tcolor:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600) );\n\t\tfont-size: var(--stepper-item-subtitle-size);\n\t\tline-height: var(--stepper-item-text-line-height);\n\t\tfont-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n\t\tfont-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n\t}\n\n\t.stepper__content__subtitle--active{\n\t\tcolor:var( --nile-colors-primary-600, var(--ng-colors-text-brand-tertiary-600) );\n\t}\n\n\t.stepper__bulletin--dot {\n\t\twidth: var(--circle-height);\n\t\taspect-ratio: 1 / 1;\n\t\tborder-radius: var(--nile-radius-full, var(--ng-radius-full));\n\t\tbackground: radial-gradient(var(--nile-colors-neutral-500, var(--ng-colors-border-secondary) ) var(--bulletin--dot--seperation), var(--nile-colors-dark-200, var(--ng-colors-bg-primary)) var(--bulletin--dot--seperation));\n\t\tborder: var(--lines-thickness) solid var(--nile-colors-neutral-500, var(--ng-colors-border-secondary) );\n\t}\n\n\t.stepper__bulletin__dot--active{\n\t\tbackground: radial-gradient(var(--nile-colors-white-base, var(--ng-colors-bg-primary) ) var(--bulletin--dot--seperation), var( --nile-colors-primary-600, var(--ng-colors-bg-brand-solid) ) var(--bulletin--dot--seperation));\n\t\tborder: var(--lines-thickness) solid var( --nile-colors-primary-500, var(--ng-colors-border-brand-alt) );\n\t\twidth: calc( var(--circle-height) + calc( var(--lines-thickness) * 2 ) );\n\t}\n\n\t.stepper__bulletin--icon {\n\t\tdisplay: grid;\n\t\tplace-content:center;\n\t\twidth: var(--circle-height);\n\t\tborder: var(--lines-thickness) solid var( --nile-colors-primary-600, var(--ng-colors-bg-brand-solid) );\n\t\taspect-ratio: 1 / 1;\n\t\tborder-radius: var(--nile-radius-full, var(--ng-radius-full));\n\t\tbackground-color:var( --nile-colors-primary-600, var(--ng-colors-bg-brand-solid) );\n\t\toverflow:hidden;\n\t}\n\t\n\t.stepper__bulletin__icon--active {\n\t\tborder: 1px solid var( --nile-colors-primary-500, var(--ng-colors-bg-brand-solid) );\n\t\twidth: calc(var(--circle-height) + calc( var(--lines-thickness) * 2));\n\t}\n`;\nexport default [styles];\n"]}

package/dist/src/nile-tab/nile-tab.css.js

@@ -16,7 +16,7 @@ export const styles = css `
   :host {
     display: inline-block;
     --tab-border-radius: var(--nile-radius-md, var(--ng-radius-md));
-    --tab-padding: var(--nile-spacing-none, var(--ng-spacing-0)) var(--nile-spacing-xs, var(--ng-spacing-1)) var(--nile-spacing-lg, var(--ng--spacing-3)) var(--nile-spacing-xs, var(--ng-spacing-1));
+    --tab-padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-xs, var(--ng-spacing-xs)) var(--nile-spacing-lg, var(--ng--spacing-3)) var(--nile-spacing-xs, var(--ng-spacing-xs));
     --tab-hover-background-color:transparent;
     --tab-active-background-color: transparent;
     -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));
@@ -46,7 +46,7 @@ export const styles = css `
     font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-600));
     line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));
     letter-spacing: 0.2px;
-    gap: var(--nile-spacing-md, var(--ng-spacing-2));
+    gap: var(--nile-spacing-md, var(--ng-spacing-md));
     height: 36px;
     box-sizing: border-box;
   }
@@ -70,7 +70,7 @@ export const styles = css `
   }
 
   .tab.tab--closable {
-    padding-inline-end: var(--nile-spacing-xs, var(--ng-spacing-1));
+    padding-inline-end: var(--nile-spacing-xs, var(--ng-spacing-xs));
   }
 
   .tab.tab--disabled {
@@ -80,11 +80,11 @@ export const styles = css `
 
   .tab__close-button {
     font-size: var(--nile-type-scale-4, var(--ng-font-size-text-sm));
-    margin-inline-start: var(--nile-spacing-xs, var(--ng-spacing-1));
+    margin-inline-start: var(--nile-spacing-xs, var(--ng-spacing-xs));
   }
 
   .tab__close-button::part(base) {
-    padding: var(--nile-spacing-xs, var(--ng-spacing-1));
+    padding: var(--nile-spacing-xs, var(--ng-spacing-xs));
   }
 
   @media (forced-colors: active) {

package/dist/src/nile-tab/nile-tab.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-tab.css.js","sourceRoot":"","sources":["../../../src/nile-tab/nile-tab.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqFxB,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 * Tab CSS\n */\nexport const styles = css`\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    display: inline-block;\n    --tab-border-radius: var(--nile-radius-md, var(--ng-radius-md));\n    --tab-padding: var(--nile-spacing-none, var(--ng-spacing-0)) var(--nile-spacing-xs, var(--ng-spacing-1)) var(--nile-spacing-lg, var(--ng--spacing-3)) var(--nile-spacing-xs, var(--ng-spacing-1));\n    --tab-hover-background-color:transparent;\n    --tab-active-background-color: transparent;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  :host([centered]) {\n    flex: 1;\n    text-align: center;\n  }\n\n  .tab {\n    display: inline-flex;\n    width: 100%;\n    align-items: center;\n    border-radius: var(--tab-border-radius);\n    color: var(--nile-colors-gray-light-mode-500, var(--ng-colors-text-quaternary-500));\n    padding: var(--tab-padding);\n    white-space: nowrap;\n    user-select: none;\n    cursor: pointer;\n    transition: 0.2s box-shadow, 0.2s color;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-600));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n    gap: var(--nile-spacing-md, var(--ng-spacing-2));\n    height: 36px;\n    box-sizing: border-box;\n  }\n\n  .tab:hover:not(.tab--disabled) {\n    color: var(--nile-colors-primary-700, var(--ng-colors-text-brand-secondary-700));\n    background-color: var(--tab-hover-background-color);\n  }\n\n  .tab:focus {\n    outline: none;\n  }\n\n  .tab:focus-visible:not(.tab--disabled) {\n    color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));\n  }\n\n  .tab.tab--active:not(.tab--disabled) {\n    color: var(--nile-colors-primary-700, var(--ng-colors-text-brand-secondary-700));\n    background-color: var(--tab-active-background-color);\n  }\n\n  .tab.tab--closable {\n    padding-inline-end: var(--nile-spacing-xs, var(--ng-spacing-1));\n  }\n\n  .tab.tab--disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .tab__close-button {\n    font-size: var(--nile-type-scale-4, var(--ng-font-size-text-sm));\n    margin-inline-start: var(--nile-spacing-xs, var(--ng-spacing-1));\n  }\n\n  .tab__close-button::part(base) {\n    padding: var(--nile-spacing-xs, var(--ng-spacing-1));\n  }\n\n  @media (forced-colors: active) {\n    .tab.tab--active:not(.tab--disabled) {\n      outline: solid 1px transparent;\n      outline-offset: -3px;\n    }\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-tab.css.js","sourceRoot":"","sources":["../../../src/nile-tab/nile-tab.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqFxB,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 * Tab CSS\n */\nexport const styles = css`\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    display: inline-block;\n    --tab-border-radius: var(--nile-radius-md, var(--ng-radius-md));\n    --tab-padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-xs, var(--ng-spacing-xs)) var(--nile-spacing-lg, var(--ng--spacing-3)) var(--nile-spacing-xs, var(--ng-spacing-xs));\n    --tab-hover-background-color:transparent;\n    --tab-active-background-color: transparent;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  :host([centered]) {\n    flex: 1;\n    text-align: center;\n  }\n\n  .tab {\n    display: inline-flex;\n    width: 100%;\n    align-items: center;\n    border-radius: var(--tab-border-radius);\n    color: var(--nile-colors-gray-light-mode-500, var(--ng-colors-text-quaternary-500));\n    padding: var(--tab-padding);\n    white-space: nowrap;\n    user-select: none;\n    cursor: pointer;\n    transition: 0.2s box-shadow, 0.2s color;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-600));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n    gap: var(--nile-spacing-md, var(--ng-spacing-md));\n    height: 36px;\n    box-sizing: border-box;\n  }\n\n  .tab:hover:not(.tab--disabled) {\n    color: var(--nile-colors-primary-700, var(--ng-colors-text-brand-secondary-700));\n    background-color: var(--tab-hover-background-color);\n  }\n\n  .tab:focus {\n    outline: none;\n  }\n\n  .tab:focus-visible:not(.tab--disabled) {\n    color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));\n  }\n\n  .tab.tab--active:not(.tab--disabled) {\n    color: var(--nile-colors-primary-700, var(--ng-colors-text-brand-secondary-700));\n    background-color: var(--tab-active-background-color);\n  }\n\n  .tab.tab--closable {\n    padding-inline-end: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  .tab.tab--disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .tab__close-button {\n    font-size: var(--nile-type-scale-4, var(--ng-font-size-text-sm));\n    margin-inline-start: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  .tab__close-button::part(base) {\n    padding: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  @media (forced-colors: active) {\n    .tab.tab--active:not(.tab--disabled) {\n      outline: solid 1px transparent;\n      outline-offset: -3px;\n    }\n  }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-tab-group/nile-tab-group.css.js

@@ -17,7 +17,7 @@ export const styles = css `
     --indicator-color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));
     --track-color: var(--nile-colors-neutral-400, var(--ng-componentcolors-utility-gray-500));
     --track-width: var(--nile-width-2px, var(--ng-width-0-5));
-    --tab-gap: var(--nile-spacing-lg, var(--ng-spacing-3));
+    --tab-gap: var(--nile-spacing-lg, var(--ng-spacing-lg));
     -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));
     -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));
     text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));
@@ -38,7 +38,7 @@ export const styles = css `
 
   .hide__track {
     --track-width: 0px;
-    --tab-gap: var(--nile-spacing-xs, var(--ng-spacing-1));
+    --tab-gap: var(--nile-spacing-xs, var(--ng-spacing-xs));
   }
 
   .tab-group__indicator {
@@ -57,7 +57,7 @@ export const styles = css `
 
   .tab-group--has-scroll-controls .tab-group__nav-container {
     position: relative;
-    padding: var(--nile-spacing-none) var(--ng-spacing-3);
+    padding: var(--nile-spacing-none) var(--ng-spacing-lg);
   }
 
   .tab-group__body {
@@ -136,7 +136,7 @@ export const styles = css `
   }
 
   .tab-group--top ::slotted(nile-tab-panel) {
-    --padding: var(--nile-spacing-lg, var(--ng-spacing-3)) var(--nile-spacing-none, var(--ng-spacing-none));
+    --padding: var(--nile-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-none, var(--ng-spacing-none));
   }
 
   /*
@@ -219,7 +219,7 @@ export const styles = css `
   }
 
   .tab-group--start ::slotted(nile-tab-panel) {
-    --padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-lg, var(--ng-spacing-3));
+    --padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-lg, var(--ng-spacing-lg));
   }
 
   /*
@@ -256,13 +256,13 @@ export const styles = css `
   }
 
   .tab-group--end ::slotted(nile-tab-panel) {
-    --padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-lg, var(--ng-spacing-3));
+    --padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-lg, var(--ng-spacing-lg));
   }
 
   .hide__track slot::slotted(nile-tab) {
     --tab-border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs));
-    --tab-padding:var(--nile-spacing-md, var(--ng-spacing-md)) var(--nile-spacing-lg, var(--ng-spacing-3));
-    --tab-hover-background-color: var(--nile-colors-neutral-100, var(--ng-colors-background-bg-secondary));
+    --tab-padding:var(--nile-spacing-md, var(--ng-spacing-md)) var(--nile-spacing-lg, var(--ng-spacing-lg));
+    --tab-hover-background-color: var(--nile-colors-neutral-100, var(--ng-colors-bg-secondary));
     --tab-active-background-color: var(--nile-colors-brand-50, var(--ng-colors-bg-brand-primary-alt));
   }
 `;

package/dist/src/nile-tab-group/nile-tab-group.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-tab-group.css.js","sourceRoot":"","sources":["../../../src/nile-tab-group/nile-tab-group.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiQxB,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 * TabGroup CSS\n */\nexport const styles = css`\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    --indicator-color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));\n    --track-color: var(--nile-colors-neutral-400, var(--ng-componentcolors-utility-gray-500));\n    --track-width: var(--nile-width-2px, var(--ng-width-0-5));\n    --tab-gap: var(--nile-spacing-lg, var(--ng-spacing-3));\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\n    display: block;\n  }\n\n  .tab-group {\n    display: flex;\n    border-radius: var(--nile-radius-none, var(--ng-radius-none));\n  }\n\n  .tab-group__tabs {\n    display: flex;\n    position: relative;\n    gap: var(--tab-gap);\n  }\n\n  .hide__track {\n    --track-width: 0px;\n    --tab-gap: var(--nile-spacing-xs, var(--ng-spacing-1));\n  }\n\n  .tab-group__indicator {\n    position: absolute;\n    transition: 0.3s translate ease, 0.3s width ease;\n  }\n\n  .tab-group__indicator__path{\n    position: absolute;\n    height: var(--track-width);\n    width: 100%;\n    background: var(--nile-colors-neutral-400, var(--ng-colors-bg-quaternary));\n    bottom:0px;\n    z-index:0;\n  }\n\n  .tab-group--has-scroll-controls .tab-group__nav-container {\n    position: relative;\n    padding: var(--nile-spacing-none) var(--ng-spacing-3);\n  }\n\n  .tab-group__body {\n    display: block;\n    overflow: auto;\n  }\n\n  .tab-group__scroll-button {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    width: 20px;\n  }\n\n  .tab-group__scroll-button--start {\n    left: 0;\n  }\n\n  .tab-group__scroll-button--end {\n    right: 0;\n  }\n\n  .tab-group--rtl .tab-group__scroll-button--start {\n    left: auto;\n    right: 0;\n  }\n\n  .tab-group--rtl .tab-group__scroll-button--end {\n    left: 0;\n    right: auto;\n  }\n\n  /*\n   * Top\n   */\n\n  .tab-group--top {\n    flex-direction: column;\n  }\n\n  .tab-group--top .tab-group__nav-container {\n    order: 1;\n  }\n\n  .tab-group--top .tab-group__nav {\n    display: flex;\n    overflow-x: auto;\n\n    /* Hide scrollbar in Firefox */\n    scrollbar-width: none;\n  }\n\n  /* Hide scrollbar in Chrome/Safari */\n  .tab-group--top .tab-group__nav::-webkit-scrollbar {\n    width: 0;\n    height: 0;\n  }\n\n  .tab-group--top .tab-group__tabs {\n    flex: 1 1 auto;\n    position: relative;\n    flex-direction: row;\n  }\n\n  .tab-group--top .tab-group__indicator {\n    bottom: 0px;\n    border-bottom: 2px solid var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));\n    z-index:0;\n  }\n\n  .tab-group--top .tab-group__body {\n    order: 2;\n  }\n\n  .tab-group--top ::slotted(nile-tab-panel) {\n    --padding: var(--nile-spacing-lg, var(--ng-spacing-3)) var(--nile-spacing-none, var(--ng-spacing-none));\n  }\n\n  /*\n   * Bottom\n   */\n\n  .tab-group--bottom {\n    flex-direction: column;\n  }\n\n  .tab-group--bottom .tab-group__nav-container {\n    order: 2;\n  }\n\n  .tab-group--bottom .tab-group__nav {\n    display: flex;\n    overflow-x: auto;\n\n    /* Hide scrollbar in Firefox */\n    scrollbar-width: none;\n  }\n\n  /* Hide scrollbar in Chrome/Safari */\n  .tab-group--bottom .tab-group__nav::-webkit-scrollbar {\n    width: 0;\n    height: 0;\n  }\n\n  .tab-group--bottom .tab-group__tabs {\n    flex: 1 1 auto;\n    position: relative;\n    flex-direction: row;\n    border-top: solid var(--track-width) var(--track-color);\n  }\n\n  .tab-group--bottom .tab-group__indicator {\n    top: calc(-1 * var(--track-width));\n    border-top: solid var(--track-width) var(--indicator-color);\n  }\n\n  .tab-group--bottom .tab-group__body {\n    order: 1;\n  }\n\n  .tab-group--bottom ::slotted(nile-tab-panel) {\n    --padding: var(--nile-spacing-lg) var(--nile-spacing-none);\n  }\n\n  /*\n   * Start\n   */\n\n  .tab-group--start {\n    flex-direction: row;\n  }\n\n  .tab-group--start .tab-group__nav-container {\n    order: 1;\n  }\n\n  .tab-group--start .tab-group__tabs {\n    flex: 0 0 auto;\n    flex-direction: column;\n    border-inline-end: solid var(--track-width) var(--track-color);\n  }\n\n  .tab-group--start .tab-group__indicator {\n    right: calc(-1 * var(--track-width));\n    border-right: solid var(--track-width) var(--indicator-color);\n  }\n\n  .tab-group--start.tab-group--rtl .tab-group__indicator {\n    right: auto;\n    left: calc(-1 * var(--track-width));\n  }\n\n  .tab-group--start .tab-group__body {\n    flex: 1 1 auto;\n    order: 2;\n  }\n\n  .tab-group--start ::slotted(nile-tab-panel) {\n    --padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-lg, var(--ng-spacing-3));\n  }\n\n  /*\n   * End\n   */\n\n  .tab-group--end {\n    flex-direction: row;\n  }\n\n  .tab-group--end .tab-group__nav-container {\n    order: 2;\n  }\n\n  .tab-group--end .tab-group__tabs {\n    flex: 0 0 auto;\n    flex-direction: column;\n    border-left: solid var(--track-width) var(--track-color);\n  }\n\n  .tab-group--end .tab-group__indicator {\n    left: calc(-1 * var(--track-width));\n    border-inline-start: solid var(--track-width) var(--indicator-color);\n  }\n\n  .tab-group--end.tab-group--rtl .tab-group__indicator {\n    right: calc(-1 * var(--track-width));\n    left: auto;\n  }\n\n  .tab-group--end .tab-group__body {\n    flex: 1 1 auto;\n    order: 1;\n  }\n\n  .tab-group--end ::slotted(nile-tab-panel) {\n    --padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-lg, var(--ng-spacing-3));\n  }\n\n  .hide__track slot::slotted(nile-tab) {\n    --tab-border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs));\n    --tab-padding:var(--nile-spacing-md, var(--ng-spacing-md)) var(--nile-spacing-lg, var(--ng-spacing-3));\n    --tab-hover-background-color: var(--nile-colors-neutral-100, var(--ng-colors-background-bg-secondary));\n    --tab-active-background-color: var(--nile-colors-brand-50, var(--ng-colors-bg-brand-primary-alt));\n  }\n`;\n\nexport default [styles];\n\n"]}
+{"version":3,"file":"nile-tab-group.css.js","sourceRoot":"","sources":["../../../src/nile-tab-group/nile-tab-group.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiQxB,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 * TabGroup CSS\n */\nexport const styles = css`\n  [hidden] {\n    display: none !important;\n  }\n\n  :host {\n    --indicator-color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));\n    --track-color: var(--nile-colors-neutral-400, var(--ng-componentcolors-utility-gray-500));\n    --track-width: var(--nile-width-2px, var(--ng-width-0-5));\n    --tab-gap: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\n    display: block;\n  }\n\n  .tab-group {\n    display: flex;\n    border-radius: var(--nile-radius-none, var(--ng-radius-none));\n  }\n\n  .tab-group__tabs {\n    display: flex;\n    position: relative;\n    gap: var(--tab-gap);\n  }\n\n  .hide__track {\n    --track-width: 0px;\n    --tab-gap: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  .tab-group__indicator {\n    position: absolute;\n    transition: 0.3s translate ease, 0.3s width ease;\n  }\n\n  .tab-group__indicator__path{\n    position: absolute;\n    height: var(--track-width);\n    width: 100%;\n    background: var(--nile-colors-neutral-400, var(--ng-colors-bg-quaternary));\n    bottom:0px;\n    z-index:0;\n  }\n\n  .tab-group--has-scroll-controls .tab-group__nav-container {\n    position: relative;\n    padding: var(--nile-spacing-none) var(--ng-spacing-lg);\n  }\n\n  .tab-group__body {\n    display: block;\n    overflow: auto;\n  }\n\n  .tab-group__scroll-button {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    width: 20px;\n  }\n\n  .tab-group__scroll-button--start {\n    left: 0;\n  }\n\n  .tab-group__scroll-button--end {\n    right: 0;\n  }\n\n  .tab-group--rtl .tab-group__scroll-button--start {\n    left: auto;\n    right: 0;\n  }\n\n  .tab-group--rtl .tab-group__scroll-button--end {\n    left: 0;\n    right: auto;\n  }\n\n  /*\n   * Top\n   */\n\n  .tab-group--top {\n    flex-direction: column;\n  }\n\n  .tab-group--top .tab-group__nav-container {\n    order: 1;\n  }\n\n  .tab-group--top .tab-group__nav {\n    display: flex;\n    overflow-x: auto;\n\n    /* Hide scrollbar in Firefox */\n    scrollbar-width: none;\n  }\n\n  /* Hide scrollbar in Chrome/Safari */\n  .tab-group--top .tab-group__nav::-webkit-scrollbar {\n    width: 0;\n    height: 0;\n  }\n\n  .tab-group--top .tab-group__tabs {\n    flex: 1 1 auto;\n    position: relative;\n    flex-direction: row;\n  }\n\n  .tab-group--top .tab-group__indicator {\n    bottom: 0px;\n    border-bottom: 2px solid var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));\n    z-index:0;\n  }\n\n  .tab-group--top .tab-group__body {\n    order: 2;\n  }\n\n  .tab-group--top ::slotted(nile-tab-panel) {\n    --padding: var(--nile-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-none, var(--ng-spacing-none));\n  }\n\n  /*\n   * Bottom\n   */\n\n  .tab-group--bottom {\n    flex-direction: column;\n  }\n\n  .tab-group--bottom .tab-group__nav-container {\n    order: 2;\n  }\n\n  .tab-group--bottom .tab-group__nav {\n    display: flex;\n    overflow-x: auto;\n\n    /* Hide scrollbar in Firefox */\n    scrollbar-width: none;\n  }\n\n  /* Hide scrollbar in Chrome/Safari */\n  .tab-group--bottom .tab-group__nav::-webkit-scrollbar {\n    width: 0;\n    height: 0;\n  }\n\n  .tab-group--bottom .tab-group__tabs {\n    flex: 1 1 auto;\n    position: relative;\n    flex-direction: row;\n    border-top: solid var(--track-width) var(--track-color);\n  }\n\n  .tab-group--bottom .tab-group__indicator {\n    top: calc(-1 * var(--track-width));\n    border-top: solid var(--track-width) var(--indicator-color);\n  }\n\n  .tab-group--bottom .tab-group__body {\n    order: 1;\n  }\n\n  .tab-group--bottom ::slotted(nile-tab-panel) {\n    --padding: var(--nile-spacing-lg) var(--nile-spacing-none);\n  }\n\n  /*\n   * Start\n   */\n\n  .tab-group--start {\n    flex-direction: row;\n  }\n\n  .tab-group--start .tab-group__nav-container {\n    order: 1;\n  }\n\n  .tab-group--start .tab-group__tabs {\n    flex: 0 0 auto;\n    flex-direction: column;\n    border-inline-end: solid var(--track-width) var(--track-color);\n  }\n\n  .tab-group--start .tab-group__indicator {\n    right: calc(-1 * var(--track-width));\n    border-right: solid var(--track-width) var(--indicator-color);\n  }\n\n  .tab-group--start.tab-group--rtl .tab-group__indicator {\n    right: auto;\n    left: calc(-1 * var(--track-width));\n  }\n\n  .tab-group--start .tab-group__body {\n    flex: 1 1 auto;\n    order: 2;\n  }\n\n  .tab-group--start ::slotted(nile-tab-panel) {\n    --padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-lg, var(--ng-spacing-lg));\n  }\n\n  /*\n   * End\n   */\n\n  .tab-group--end {\n    flex-direction: row;\n  }\n\n  .tab-group--end .tab-group__nav-container {\n    order: 2;\n  }\n\n  .tab-group--end .tab-group__tabs {\n    flex: 0 0 auto;\n    flex-direction: column;\n    border-left: solid var(--track-width) var(--track-color);\n  }\n\n  .tab-group--end .tab-group__indicator {\n    left: calc(-1 * var(--track-width));\n    border-inline-start: solid var(--track-width) var(--indicator-color);\n  }\n\n  .tab-group--end.tab-group--rtl .tab-group__indicator {\n    right: calc(-1 * var(--track-width));\n    left: auto;\n  }\n\n  .tab-group--end .tab-group__body {\n    flex: 1 1 auto;\n    order: 1;\n  }\n\n  .tab-group--end ::slotted(nile-tab-panel) {\n    --padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-lg, var(--ng-spacing-lg));\n  }\n\n  .hide__track slot::slotted(nile-tab) {\n    --tab-border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs));\n    --tab-padding:var(--nile-spacing-md, var(--ng-spacing-md)) var(--nile-spacing-lg, var(--ng-spacing-lg));\n    --tab-hover-background-color: var(--nile-colors-neutral-100, var(--ng-colors-bg-secondary));\n    --tab-active-background-color: var(--nile-colors-brand-50, var(--ng-colors-bg-brand-primary-alt));\n  }\n`;\n\nexport default [styles];\n\n"]}

package/dist/src/nile-table-header-item/nile-table-header-item.css.js

@@ -18,7 +18,7 @@ export const styles = css `
     -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));
     text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));
   }
-  
+
   .header__item__wrapper{
     min-width:var(--cell-min-width);
     width:var(--cell-width);
@@ -54,7 +54,7 @@ export const styles = css `
   .sorting__icons {
     display: flex;
     flex-direction: column;
-    align-items: centre;
+    align-items: center;
   }
 
   .sorting__icons nile-icon:hover {

package/dist/src/nile-table-header-item/nile-table-header-item.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-table-header-item.css.js","sourceRoot":"","sources":["../../../src/nile-table-header-item/nile-table-header-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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DxB,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 * TableHeaderItem CSS\n */\nexport const styles = css`\n  :host {\n    --cell-min-width: auto;\n    --cell-width: auto;\n    display: table-cell;\n    box-sizing: border-box;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n  \n  .header__item__wrapper{\n    min-width:var(--cell-min-width);\n    width:var(--cell-width);\n    display:flex;\n    align-items:center;\n    box-sizing: border-box;\n    padding: var(--nile-spacing-lg , var(--ng-spacing-lg)) var(--nile-spacing-3-x , var(--ng-spacing-3xl));\n    min-height: 44px;\n    height: 44px;\n  }\n\n  .headers {\n    overflow:hidden;\n    display: flex;\n    align-items: center;\n    height: auto;\n    width: 100%;\n    gap: var(--nile-spacing-md , var(--ng-spacing-xs));\n    color: var(--nile-colors-gray-light-mode-600 , var(--ng-colors-text-quaternary-500));\n    font-family: var(--nile-font-family-serif , var(--ng-font-family-body));\n    font-feature-settings: 'clig' off, 'liga' off;\n    font-size: var(--nile-type-scale-2 , var(--ng-font-size-text-xs));\n    font-weight: var(--nile-font-weight-medium , var(--ng-font-weight-600));\n    font-style: normal;\n    /* line-height: var(--nile-type-scale-5); */\n    line-height: normal;\n  }\n\n  nile-icon {\n    cursor: pointer;\n  }\n\n  .sorting__icons {\n    display: flex;\n    flex-direction: column;\n    align-items: centre;\n  }\n\n  .sorting__icons nile-icon:hover {\n    opacity: 0.4;\n  }\n\n  .hover__arrow {\n    opacity: 0;\n  }\n\n  .headers:hover .hover__arrow {\n    opacity: 0.3;\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-table-header-item.css.js","sourceRoot":"","sources":["../../../src/nile-table-header-item/nile-table-header-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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DxB,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 * TableHeaderItem CSS\n */\nexport const styles = css`\n  :host {\n    --cell-min-width: auto;\n    --cell-width: auto;\n    display: table-cell;\n    box-sizing: border-box;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .header__item__wrapper{\n    min-width:var(--cell-min-width);\n    width:var(--cell-width);\n    display:flex;\n    align-items:center;\n    box-sizing: border-box;\n    padding: var(--nile-spacing-lg , var(--ng-spacing-lg)) var(--nile-spacing-3-x , var(--ng-spacing-3xl));\n    min-height: 44px;\n    height: 44px;\n  }\n\n  .headers {\n    overflow:hidden;\n    display: flex;\n    align-items: center;\n    height: auto;\n    width: 100%;\n    gap: var(--nile-spacing-md , var(--ng-spacing-xs));\n    color: var(--nile-colors-gray-light-mode-600 , var(--ng-colors-text-quaternary-500));\n    font-family: var(--nile-font-family-serif , var(--ng-font-family-body));\n    font-feature-settings: 'clig' off, 'liga' off;\n    font-size: var(--nile-type-scale-2 , var(--ng-font-size-text-xs));\n    font-weight: var(--nile-font-weight-medium , var(--ng-font-weight-600));\n    font-style: normal;\n    /* line-height: var(--nile-type-scale-5); */\n    line-height: normal;\n  }\n\n  nile-icon {\n    cursor: pointer;\n  }\n\n  .sorting__icons {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n  }\n\n  .sorting__icons nile-icon:hover {\n    opacity: 0.4;\n  }\n\n  .hover__arrow {\n    opacity: 0;\n  }\n\n  .headers:hover .hover__arrow {\n    opacity: 0.3;\n  }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-table-row/nile-table-row.css.js

@@ -24,9 +24,7 @@ export const styles = css `
     background-color: var(--nile-table-header-background-color , var(--ng-colors-bg-secondary));
   }
 
-  nile-table-row > slot::slotted(nile-table-cell-item:first-child) {
-    color: var(--nile-colors-red-500);
-  }
+  
 `;
 export default [styles];
 //# sourceMappingURL=nile-table-row.css.js.map

package/dist/src/nile-table-row/nile-table-row.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-table-row.css.js","sourceRoot":"","sources":["../../../src/nile-table-row/nile-table-row.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;CAmBxB,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 * TableRow CSS\n */\nexport const styles = css`\n  :host {\n    display: table-row;\n    width: 100%;\n    height: 100%;\n    height: max-content;\n    border-bottom: 1px solid var(--nile-table-row-border-color , var(--ng-colors-border-secondary));\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  slot::slotted(nile-table-header-item) {\n    background-color: var(--nile-table-header-background-color , var(--ng-colors-bg-secondary));\n  }\n\n  nile-table-row > slot::slotted(nile-table-cell-item:first-child) {\n    color: var(--nile-colors-red-500);\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-table-row.css.js","sourceRoot":"","sources":["../../../src/nile-table-row/nile-table-row.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;CAiBxB,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 * TableRow CSS\n */\nexport const styles = css`\n  :host {\n    display: table-row;\n    width: 100%;\n    height: 100%;\n    height: max-content;\n    border-bottom: 1px solid var(--nile-table-row-border-color , var(--ng-colors-border-secondary));\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  slot::slotted(nile-table-header-item) {\n    background-color: var(--nile-table-header-background-color , var(--ng-colors-bg-secondary));\n  }\n\n  \n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-tag/nile-tag.css.js

@@ -24,7 +24,7 @@ export const styles = css `
     white-space: nowrap;
     user-select: none;
     border-radius: var(--nile-radius-sm , var(--ng-radius-sm));
-    gap: var(--nile-spacing-sm , var(--ng-spacing-1-5));
+    gap: var(--nile-spacing-sm , var(--ng-spacing-sm));
   }
 
   .tag__remove::part(base) {
@@ -40,7 +40,7 @@ export const styles = css `
     font-size: var(--nile-type-scale-3 , var(--ng-font-size-text-sm));
     height: var(--nile-height-26px , var(--ng-height-auto));
     border: var(--nile-border-size-2, var(--ng-border-width-1)) solid var(--nile-colors-neutral-400 , var(--ng-colors-border-primary));
-    padding: var(--nile-spacing-none , var(--ng-spacing-1)) var(--nile-spacing-lg , var(--ng-spacing-2));
+    padding: var(--nile-spacing-none , var(--ng-spacing-xs)) var(--nile-spacing-lg , var(--ng-spacing-md));
   }
 
   .tag--primary {
@@ -130,7 +130,7 @@ export const styles = css `
   }
 
   .tag__remove {
-    margin-inline-start: var(--nile-spacing-md , var(--ng-spacing-2));
+    margin-inline-start: var(--nile-spacing-md , var(--ng-spacing-md));
   }
 
   /*
@@ -138,11 +138,11 @@ export const styles = css `
    */
 
   .tag--pill {
-    border-radius: var(--nile-radius-full , var(--ng-spacing-20));
+    border-radius: var(--nile-radius-full , var(--ng-spacing-8xl));
   }
 
   .tag__prefix {
-  padding: var(--nile-spacing-xs , var(--ng-spacing-1)) var(--nile-spacing-sm , var(--ng-spacing-1-5));
+  padding: var(--nile-spacing-xs , var(--ng-spacing-xs)) var(--nile-spacing-sm , var(--ng-spacing-sm));
 }
 
  .tag__content {

package/dist/src/nile-tag/nile-tag.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-tag.css.js","sourceRoot":"","sources":["../../../src/nile-tag/nile-tag.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiJxB,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 * Tag CSS\n */\nexport const styles = css`\n  :host {\n    display: inline-block;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .tag {\n    display: flex;\n    align-items: center;\n    border: solid 2px;\n    line-height: 1;\n    white-space: nowrap;\n    user-select: none;\n    border-radius: var(--nile-radius-sm , var(--ng-radius-sm));\n    gap: var(--nile-spacing-sm , var(--ng-spacing-1-5));\n  }\n\n  .tag__remove::part(base) {\n    color: inherit;\n    padding: var(--nile-spacing-none , var(--ng-spacing-none));\n  }\n\n  /*\n   * Variant modifiers\n   */\n\n  .tag--medium {\n    font-size: var(--nile-type-scale-3 , var(--ng-font-size-text-sm));\n    height: var(--nile-height-26px , var(--ng-height-auto));\n    border: var(--nile-border-size-2, var(--ng-border-width-1)) solid var(--nile-colors-neutral-400 , var(--ng-colors-border-primary));\n    padding: var(--nile-spacing-none , var(--ng-spacing-1)) var(--nile-spacing-lg , var(--ng-spacing-2));\n  }\n\n  .tag--primary {\n    background: var(--nile-colors-primary-600);\n    border-color: var(--nile-colors-primary-600, var(--ng-colors-border-primary));\n    border: 2px solid  var(--nile-colors-primary-600, var(--ng-colors-border-primary));\n    color: var(--nile-colors-white-base);\n  }\n\n  .tag--primary:hover {\n    border: 2px solid rgba(0, 94, 166, 0.50);\n  }\n\n  .tag--primary:active > nile-icon-button {\n    color: var(--nile-colors-blue-700);\n  }\n\n  .tag--success {\n    background: var(--nile-colors-green-400);\n    border: 2px solid var(--nile-colors-green-400, var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900);\n  }\n\n  .tag--success:hover {\n    border: 2px solid var(--nile-colors-green-500, var(--ng-colors-border-primary));\n  }\n\n  .tag--success:active > nile-icon-button {\n    color: var(--nile-colors-green-700);\n  }\n\n  .tag--normal {\n    background: var(--nile-colors-neutral-400 , var(--ng-colors-bg-primary));\n    border: var(--nile-border-size-2, var(--ng-border-width-1)) solid var(--nile-colors-neutral-400 , var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900 , var(--ng-colors-text-secondary-700));\n  }\n  \n  .tag--normal:hover {\n    border: var(--nile-border-size-2, var(--ng-border-width-1)) solid var(--nile-colors-neutral-500 , var(--ng-colors-border-primary));\n  }\n\n  .tag--normal:active > nile-icon-button {\n    color: var(--nile-colors-neutral-700);\n  }\n\n  .tag--warning {\n    background: var(--nile-colors-yellow-400);\n    border: 2px solid var(--nile-colors-yellow-400, var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900);\n  }\n\n  .tag--warning:hover {\n    border: 2px solid var(--nile-colors-yellow-500, var(--ng-colors-border-primary));\n  }\n\n  .tag--warning:active > nile-icon-button {\n    color: var(--nile-colors-yellow-500);\n  }\n\n\n  .tag--error {\n    background: var(--nile-colors-red-400);\n    border: 2px solid var(--nile-colors-red-400, var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900);\n  }\n\n  .tag--error:hover {\n    border: 2px solid var(--nile-colors-red-500, var(--ng-colors-border-primary));\n  }\n\n  .tag--error:active > nile-icon-button {\n    color: var(--nile-colors-red-500);\n  }\n\n  .tag--info {\n    background: var(--nile-colors-blue-400);\n    border: 2px solid var(--nile-colors-blue-400, var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900);\n  }\n\n  .tag--info:hover {\n    border: 2px solid var(--nile-colors-blue-500, var(--ng-colors-border-primary));\n  }\n\n  .tag--info:active > nile-icon-button {\n    color: var(--nile-colors-red-500);\n  }\n\n  .tag__remove {\n    margin-inline-start: var(--nile-spacing-md , var(--ng-spacing-2));\n  }\n\n  /*\n   * Pill modifier\n   */\n\n  .tag--pill {\n    border-radius: var(--nile-radius-full , var(--ng-spacing-20));\n  }\n\n  .tag__prefix {\n  padding: var(--nile-spacing-xs , var(--ng-spacing-1)) var(--nile-spacing-sm , var(--ng-spacing-1-5));\n}\n\n .tag__content {\n  font-size: var(--nile-type-scale-3 , var(--ng-font-size-text-sm));\n}\n\n  .cross_icon {\n    margin-left: auto;\n  }\n\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-tag.css.js","sourceRoot":"","sources":["../../../src/nile-tag/nile-tag.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiJxB,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 * Tag CSS\n */\nexport const styles = css`\n  :host {\n    display: inline-block;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .tag {\n    display: flex;\n    align-items: center;\n    border: solid 2px;\n    line-height: 1;\n    white-space: nowrap;\n    user-select: none;\n    border-radius: var(--nile-radius-sm , var(--ng-radius-sm));\n    gap: var(--nile-spacing-sm , var(--ng-spacing-sm));\n  }\n\n  .tag__remove::part(base) {\n    color: inherit;\n    padding: var(--nile-spacing-none , var(--ng-spacing-none));\n  }\n\n  /*\n   * Variant modifiers\n   */\n\n  .tag--medium {\n    font-size: var(--nile-type-scale-3 , var(--ng-font-size-text-sm));\n    height: var(--nile-height-26px , var(--ng-height-auto));\n    border: var(--nile-border-size-2, var(--ng-border-width-1)) solid var(--nile-colors-neutral-400 , var(--ng-colors-border-primary));\n    padding: var(--nile-spacing-none , var(--ng-spacing-xs)) var(--nile-spacing-lg , var(--ng-spacing-md));\n  }\n\n  .tag--primary {\n    background: var(--nile-colors-primary-600);\n    border-color: var(--nile-colors-primary-600, var(--ng-colors-border-primary));\n    border: 2px solid  var(--nile-colors-primary-600, var(--ng-colors-border-primary));\n    color: var(--nile-colors-white-base);\n  }\n\n  .tag--primary:hover {\n    border: 2px solid rgba(0, 94, 166, 0.50);\n  }\n\n  .tag--primary:active > nile-icon-button {\n    color: var(--nile-colors-blue-700);\n  }\n\n  .tag--success {\n    background: var(--nile-colors-green-400);\n    border: 2px solid var(--nile-colors-green-400, var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900);\n  }\n\n  .tag--success:hover {\n    border: 2px solid var(--nile-colors-green-500, var(--ng-colors-border-primary));\n  }\n\n  .tag--success:active > nile-icon-button {\n    color: var(--nile-colors-green-700);\n  }\n\n  .tag--normal {\n    background: var(--nile-colors-neutral-400 , var(--ng-colors-bg-primary));\n    border: var(--nile-border-size-2, var(--ng-border-width-1)) solid var(--nile-colors-neutral-400 , var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900 , var(--ng-colors-text-secondary-700));\n  }\n  \n  .tag--normal:hover {\n    border: var(--nile-border-size-2, var(--ng-border-width-1)) solid var(--nile-colors-neutral-500 , var(--ng-colors-border-primary));\n  }\n\n  .tag--normal:active > nile-icon-button {\n    color: var(--nile-colors-neutral-700);\n  }\n\n  .tag--warning {\n    background: var(--nile-colors-yellow-400);\n    border: 2px solid var(--nile-colors-yellow-400, var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900);\n  }\n\n  .tag--warning:hover {\n    border: 2px solid var(--nile-colors-yellow-500, var(--ng-colors-border-primary));\n  }\n\n  .tag--warning:active > nile-icon-button {\n    color: var(--nile-colors-yellow-500);\n  }\n\n\n  .tag--error {\n    background: var(--nile-colors-red-400);\n    border: 2px solid var(--nile-colors-red-400, var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900);\n  }\n\n  .tag--error:hover {\n    border: 2px solid var(--nile-colors-red-500, var(--ng-colors-border-primary));\n  }\n\n  .tag--error:active > nile-icon-button {\n    color: var(--nile-colors-red-500);\n  }\n\n  .tag--info {\n    background: var(--nile-colors-blue-400);\n    border: 2px solid var(--nile-colors-blue-400, var(--ng-colors-border-primary));\n    color: var(--nile-colors-dark-900);\n  }\n\n  .tag--info:hover {\n    border: 2px solid var(--nile-colors-blue-500, var(--ng-colors-border-primary));\n  }\n\n  .tag--info:active > nile-icon-button {\n    color: var(--nile-colors-red-500);\n  }\n\n  .tag__remove {\n    margin-inline-start: var(--nile-spacing-md , var(--ng-spacing-md));\n  }\n\n  /*\n   * Pill modifier\n   */\n\n  .tag--pill {\n    border-radius: var(--nile-radius-full , var(--ng-spacing-8xl));\n  }\n\n  .tag__prefix {\n  padding: var(--nile-spacing-xs , var(--ng-spacing-xs)) var(--nile-spacing-sm , var(--ng-spacing-sm));\n}\n\n .tag__content {\n  font-size: var(--nile-type-scale-3 , var(--ng-font-size-text-sm));\n}\n\n  .cross_icon {\n    margin-left: auto;\n  }\n\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-textarea/nile-textarea.css.js

@@ -54,7 +54,7 @@ export const styles = css `
     margin-top: var(--nile-spacing-lg, var(--ng-spacing-sm));
     font-size: var(--nile-type-scale-2), var(--ng-font-size-text-md);
     font-style: normal;
-    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-400));
+    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));
     line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));
     letter-spacing: 0.2px;
   }
@@ -80,7 +80,7 @@ export const styles = css `
     letter-spacing: 0.5px;
     vertical-align: middle;
     border-radius: var(--nile-radius-sm, var(--ng-radius-md));
-    transition: 0.3s color, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) border, 0.3s box-shadow, 0.3s background-color;
+    transition: var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) color, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) border, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) box-shadow, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) background-color;
     cursor: text;
     min-height: var(--nile-height-12px, var(--ng-height-12px));
   }
@@ -147,7 +147,7 @@ export const styles = css `
     font-family: var(--nile-font-family-serif, var(--ng-font-family-body));
     font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));
     font-style: normal;
-    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-400));
+    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));
     line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md)); /* 100% */
     letter-spacing: 0.2px;
     color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
@@ -204,7 +204,8 @@ export const styles = css `
   }
 
   .textarea--standard.textarea--success {
-    border-color: var(--nile-colors-green-500, var(--ng-colors-text-success-primary-600));
+    //TODO: Need Token from design system
+    border-color: var(--nile-colors-green-500);
   }
 
   .textarea--standard.textarea--destructive {
@@ -221,35 +222,38 @@ export const styles = css `
     border-radius: var(--nile-radius-sm, var(--ng-radius-xs));
     max-width: 400px;
     background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
-    border: 1px solid var(--nile-colors-red-500, var(--ng-colors-border-error-subtle));
-    color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));
+    //TODO: Need Token from design system
+    border: 1px solid var(--nile-colors-red-500);
+    //TODO: Need Token from design system
+    color: var(--nile-colors-red-500);
     padding: var(--nile-spacing-lg, var(--ng-spacing-lg));
     font-size: var(--nile-type-scale-2, var(--ng-font-size-text-md));
     max-height: 300px;
-    overflow-y: scroll;
+    overflow-y: auto;
     line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));
   }
 
   .input__remove-non-printable {
     color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));
-    margin-left: var(--nile-spacing-lg, var(--ng-nile-spacing-lg));
+    margin-left: var(--nile-spacing-lg, var(--ng-spacing-lg));
     font-size: var(--nile-type-scale-3, var(--nile-font-size-base));
     color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
     cursor: pointer;
   }
 
   .input__srtiked-text-container {
-    margin-top: var(--nile-spacing-xs, var(--ng-nile-spacing-xs));
+    margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));
     color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
-    word-wrap: break-all;
-    line-height: var(--nile-line-height-xsmall, var(--ng-nile-line-height-xsmall));
+    word-break: break-all;
+    overflow-wrap: break-word;
+    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));
   }
 
   .input__srtiked-text {
     text-decoration: line-through;
-    text-decoration-color: var(--nile-colors-white-base, var(--ng-colors-background-bg-primary));
-    color: var(--nile-colors-white-base, var(--ng-colors-background-bg-primary));
-    background-color: var(--nile-colors-red-500, var(--ng-colors-text-text-error-primary600));
+    text-decoration-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
+    color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
+    background-color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));
   }
 `;
 export default [styles];

package/dist/src/nile-textarea/nile-textarea.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-textarea.css.js","sourceRoot":"","sources":["../../../src/nile-textarea/nile-textarea.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmPxB,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 * TextArea CSS\n */\nexport const styles = css`\n  .form-control .form-control__label {\n    display: none;\n  }\n\n  .form-control .form-control__help-text {\n    display: none;\n  }\n\n  /* Label */\n  .form-control--has-label .form-control__label {\n    display: inline-block;\n    margin-bottom: var(--nile-spacing-lg, var(--ng-spacing-sm));\n    color: var(--nile-textarea-label-color, var(--ng-colors-text-secondary-700));\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-textarea-label-font-weight, var(--ng-font-weight-500));\n    line-height: var(--nile-textarea-label-line-height, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-label.form-control--medium .form-control__label {\n    font-size: var(--nile-font-size-base, var(--ng-font-size-text-sm));\n  }\n\n  :host([required]) .form-control--has-label .form-control__label::after {\n    content: '*';\n    margin-inline-start: -2px;\n    color: var(--nile-colors-red-700, var(--ng-colors-text-brand-tertiary-600));\n  }\n\n  /* Help text */\n  .form-control--has-help-text .form-control__help-text {\n    display: block;\n    color: var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n    margin-top: var(--nile-spacing-sm, var(--ng-spacing-sm));\n  }\n\n  /* Error message */\n  .form-control__error-message {\n    display: block;\n    color: var(--nile-colors-red-700, var(--ng-colors-text-error-primary-600));\n    margin-top: var(--nile-spacing-lg, var(--ng-spacing-sm));\n    font-size: var(--nile-type-scale-2), var(--ng-font-size-text-md);\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-400));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-help-text.form-control--medium .form-control__help-text {\n    font-size: var(--nile-type-scale-1, var(--ng-font-size-text-sm));\n  }\n\n  /* Host styles */\n  :host {\n    display: block;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  /* Textarea styles */\n  .textarea {\n    display: flex;\n    align-items: center;\n    position: relative;\n    width: 100%;\n    letter-spacing: 0.5px;\n    vertical-align: middle;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n    transition: 0.3s color, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) border, 0.3s box-shadow, 0.3s background-color;\n    cursor: text;\n    min-height: var(--nile-height-12px, var(--ng-height-12px));\n  }\n\n  /* Standard textareas */\n  .textarea--standard {\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border: 1px solid var(--nile-textarea-standard-border-color, var(--ng-colors-border-primary));\n    box-shadow:var(--nile-textarea-standard-box-shadow, var(--ng-colors-effects-shadow-xs));\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) {\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-primary));\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-primary));\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled) {\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    box-shadow: var(--nile-textarea-standard-focused-box-shadow, var(--ng-colors-effects-shadow-xs));\n    border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-brand));\n    border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n  }\n\n  .textarea--standard.textarea--warning.textarea--focused:not(.textarea--disabled) {\n    border-color: var(--nile-colors-dark-900, var(--ng-componentcolors-utility-warning-500));\n    border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n  }\n\n  .textarea--standard.textarea--error.textarea--focused:not(.textarea--disabled) {\n    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-error));\n    border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled)\n    .textarea__control {\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n  }\n\n  .textarea--standard.textarea--disabled {\n    border-color: var(--nile-textarea-standard-disabled-border-color, var(--ng-colors-border-disabled));\n    background: var(--nile-textarea-standard-disabled-background-color, var(--ng-colors-border-disabled-subtle));\n    opacity: 0.5;\n    cursor: not-allowed;\n    box-shadow:var(--nile-textarea-standard-disabled-box-shadow, var(--ng-colors-effects-shadow-xs));\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control {\n    color: var(--nile-colors-neutral-500, var(--ng-colors-text-disabled));\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control::placeholder {\n    color: var(--nile-colors-neutral-500, var(--ng-colors-text-placeholder));\n  }\n\n  /* Textarea control styles */\n  .textarea__control {\n    flex: 1 1 auto;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-400));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md)); /* 100% */\n    letter-spacing: 0.2px;\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    border: none;\n    background: none;\n    box-shadow: none;\n    cursor: inherit;\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::-webkit-search-decoration,\n  .textarea__control::-webkit-search-cancel-button,\n  .textarea__control::-webkit-search-results-button,\n  .textarea__control::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::placeholder {\n    color: var(--nile-colors-dark-500, var(--ng-colors-text-placeholder));\n    user-select: none;\n  }\n\n  .textarea__control:focus {\n    outline: none;\n  }\n\n  .textarea--medium .textarea__control {\n    padding: var(--nile-textarea-padding, var(--ng-spacing-lg)) var(--nile-textarea-padding, var(--ng-spacing-lg));\n  }\n\n  /* Resize types */\n  .textarea--resize-none .textarea__control {\n    resize: none;\n    min-height: var(--nile-height-12px, var(--ng-height-12px));\n  }\n\n  .textarea--resize-vertical .textarea__control {\n    resize: vertical;\n    min-height: var(--nile-height-12px, var(--ng-height-12px));\n  }\n\n  .textarea--resize-auto .textarea__control {\n    resize: none;\n    overflow-y: hidden;\n    min-height: var(--nile-height-12px, var(--ng-height-12px));\n  }\n\n  .textarea--standard.textarea--warning {\n    border-color: var(--nile-colors-yellow-500, var(--ng-componentcolors-utility-warning-500));\n  }\n\n  .textarea--standard.textarea--error {\n    border-color: var(--nile-colors-red-500, var(--ng-colors-border-error-subtle));\n  }\n\n  .textarea--standard.textarea--success {\n    border-color: var(--nile-colors-green-500, var(--ng-colors-text-success-primary-600));\n  }\n\n  .textarea--standard.textarea--destructive {\n    border-color: var(--nile-colors-red-400);\n    box-shadow: var(--nile-box-shadow-1, var(--ng-colors-effects-shadow-xs));\n  }\n\n  .textarea--standard.textarea--destructive.textarea--focused {\n    border-color: var(--nile-colors-red-400, var(--ng-colors-border-error));\n    box-shadow: var(--nile-box-shadow-5, var(--ng-colors-effects-shadow-xs));\n  }\n\n  .input__non-printable {\n    border-radius: var(--nile-radius-sm, var(--ng-radius-xs));\n    max-width: 400px;\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border: 1px solid var(--nile-colors-red-500, var(--ng-colors-border-error-subtle));\n    color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));\n    padding: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    font-size: var(--nile-type-scale-2, var(--ng-font-size-text-md));\n    max-height: 300px;\n    overflow-y: scroll;\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n  }\n\n  .input__remove-non-printable {\n    color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));\n    margin-left: var(--nile-spacing-lg, var(--ng-nile-spacing-lg));\n    font-size: var(--nile-type-scale-3, var(--nile-font-size-base));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    cursor: pointer;\n  }\n\n  .input__srtiked-text-container {\n    margin-top: var(--nile-spacing-xs, var(--ng-nile-spacing-xs));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    word-wrap: break-all;\n    line-height: var(--nile-line-height-xsmall, var(--ng-nile-line-height-xsmall));\n  }\n\n  .input__srtiked-text {\n    text-decoration: line-through;\n    text-decoration-color: var(--nile-colors-white-base, var(--ng-colors-background-bg-primary));\n    color: var(--nile-colors-white-base, var(--ng-colors-background-bg-primary));\n    background-color: var(--nile-colors-red-500, var(--ng-colors-text-text-error-primary600));\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-textarea.css.js","sourceRoot":"","sources":["../../../src/nile-textarea/nile-textarea.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuPxB,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 * TextArea CSS\n */\nexport const styles = css`\n  .form-control .form-control__label {\n    display: none;\n  }\n\n  .form-control .form-control__help-text {\n    display: none;\n  }\n\n  /* Label */\n  .form-control--has-label .form-control__label {\n    display: inline-block;\n    margin-bottom: var(--nile-spacing-lg, var(--ng-spacing-sm));\n    color: var(--nile-textarea-label-color, var(--ng-colors-text-secondary-700));\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-textarea-label-font-weight, var(--ng-font-weight-500));\n    line-height: var(--nile-textarea-label-line-height, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-label.form-control--medium .form-control__label {\n    font-size: var(--nile-font-size-base, var(--ng-font-size-text-sm));\n  }\n\n  :host([required]) .form-control--has-label .form-control__label::after {\n    content: '*';\n    margin-inline-start: -2px;\n    color: var(--nile-colors-red-700, var(--ng-colors-text-brand-tertiary-600));\n  }\n\n  /* Help text */\n  .form-control--has-help-text .form-control__help-text {\n    display: block;\n    color: var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n    margin-top: var(--nile-spacing-sm, var(--ng-spacing-sm));\n  }\n\n  /* Error message */\n  .form-control__error-message {\n    display: block;\n    color: var(--nile-colors-red-700, var(--ng-colors-text-error-primary-600));\n    margin-top: var(--nile-spacing-lg, var(--ng-spacing-sm));\n    font-size: var(--nile-type-scale-2), var(--ng-font-size-text-md);\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n    letter-spacing: 0.2px;\n  }\n\n  .form-control--has-help-text.form-control--medium .form-control__help-text {\n    font-size: var(--nile-type-scale-1, var(--ng-font-size-text-sm));\n  }\n\n  /* Host styles */\n  :host {\n    display: block;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  /* Textarea styles */\n  .textarea {\n    display: flex;\n    align-items: center;\n    position: relative;\n    width: 100%;\n    letter-spacing: 0.5px;\n    vertical-align: middle;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n    transition: var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) color, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) border, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) box-shadow, var(--nile-transition-duration-default, var(--ng-transition-duration-instant)) background-color;\n    cursor: text;\n    min-height: var(--nile-height-12px, var(--ng-height-12px));\n  }\n\n  /* Standard textareas */\n  .textarea--standard {\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border: 1px solid var(--nile-textarea-standard-border-color, var(--ng-colors-border-primary));\n    box-shadow:var(--nile-textarea-standard-box-shadow, var(--ng-colors-effects-shadow-xs));\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) {\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border-color: var(--nile-textarea-standard-hover-border-color, var(--ng-colors-border-primary));\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n  }\n\n  .textarea--standard:hover:not(.textarea--disabled) .textarea__control {\n    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-primary));\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled) {\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    box-shadow: var(--nile-textarea-standard-focused-box-shadow, var(--ng-colors-effects-shadow-xs));\n    border-color: var(--nile-textarea-standard-focused-border-color, var(--ng-colors-border-brand));\n    border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n  }\n\n  .textarea--standard.textarea--warning.textarea--focused:not(.textarea--disabled) {\n    border-color: var(--nile-colors-dark-900, var(--ng-componentcolors-utility-warning-500));\n    border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n  }\n\n  .textarea--standard.textarea--error.textarea--focused:not(.textarea--disabled) {\n    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-error));\n    border-width: var(--nile-border-width-1, var(--ng-border-width-2));\n  }\n\n  .textarea--standard.textarea--focused:not(.textarea--disabled)\n    .textarea__control {\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n  }\n\n  .textarea--standard.textarea--disabled {\n    border-color: var(--nile-textarea-standard-disabled-border-color, var(--ng-colors-border-disabled));\n    background: var(--nile-textarea-standard-disabled-background-color, var(--ng-colors-border-disabled-subtle));\n    opacity: 0.5;\n    cursor: not-allowed;\n    box-shadow:var(--nile-textarea-standard-disabled-box-shadow, var(--ng-colors-effects-shadow-xs));\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control {\n    color: var(--nile-colors-neutral-500, var(--ng-colors-text-disabled));\n  }\n\n  .textarea--standard.textarea--disabled .textarea__control::placeholder {\n    color: var(--nile-colors-neutral-500, var(--ng-colors-text-placeholder));\n  }\n\n  /* Textarea control styles */\n  .textarea__control {\n    flex: 1 1 auto;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md)); /* 100% */\n    letter-spacing: 0.2px;\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    border: none;\n    background: none;\n    box-shadow: none;\n    cursor: inherit;\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::-webkit-search-decoration,\n  .textarea__control::-webkit-search-cancel-button,\n  .textarea__control::-webkit-search-results-button,\n  .textarea__control::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n\n  .textarea__control::placeholder {\n    color: var(--nile-colors-dark-500, var(--ng-colors-text-placeholder));\n    user-select: none;\n  }\n\n  .textarea__control:focus {\n    outline: none;\n  }\n\n  .textarea--medium .textarea__control {\n    padding: var(--nile-textarea-padding, var(--ng-spacing-lg)) var(--nile-textarea-padding, var(--ng-spacing-lg));\n  }\n\n  /* Resize types */\n  .textarea--resize-none .textarea__control {\n    resize: none;\n    min-height: var(--nile-height-12px, var(--ng-height-12px));\n  }\n\n  .textarea--resize-vertical .textarea__control {\n    resize: vertical;\n    min-height: var(--nile-height-12px, var(--ng-height-12px));\n  }\n\n  .textarea--resize-auto .textarea__control {\n    resize: none;\n    overflow-y: hidden;\n    min-height: var(--nile-height-12px, var(--ng-height-12px));\n  }\n\n  .textarea--standard.textarea--warning {\n    border-color: var(--nile-colors-yellow-500, var(--ng-componentcolors-utility-warning-500));\n  }\n\n  .textarea--standard.textarea--error {\n    border-color: var(--nile-colors-red-500, var(--ng-colors-border-error-subtle));\n  }\n\n  .textarea--standard.textarea--success {\n    //TODO: Need Token from design system\n    border-color: var(--nile-colors-green-500);\n  }\n\n  .textarea--standard.textarea--destructive {\n    border-color: var(--nile-colors-red-400);\n    box-shadow: var(--nile-box-shadow-1, var(--ng-colors-effects-shadow-xs));\n  }\n\n  .textarea--standard.textarea--destructive.textarea--focused {\n    border-color: var(--nile-colors-red-400, var(--ng-colors-border-error));\n    box-shadow: var(--nile-box-shadow-5, var(--ng-colors-effects-shadow-xs));\n  }\n\n  .input__non-printable {\n    border-radius: var(--nile-radius-sm, var(--ng-radius-xs));\n    max-width: 400px;\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    //TODO: Need Token from design system\n    border: 1px solid var(--nile-colors-red-500);\n    //TODO: Need Token from design system\n    color: var(--nile-colors-red-500);\n    padding: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    font-size: var(--nile-type-scale-2, var(--ng-font-size-text-md));\n    max-height: 300px;\n    overflow-y: auto;\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n  }\n\n  .input__remove-non-printable {\n    color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));\n    margin-left: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    font-size: var(--nile-type-scale-3, var(--nile-font-size-base));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    cursor: pointer;\n  }\n\n  .input__srtiked-text-container {\n    margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    word-break: break-all;\n    overflow-wrap: break-word;\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-md));\n  }\n\n  .input__srtiked-text {\n    text-decoration: line-through;\n    text-decoration-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    background-color: var(--nile-colors-red-500, var(--ng-colors-text-error-primary-600));\n  }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-toast/nile-toast.css.js

@@ -25,7 +25,7 @@ export const styles = css `
     position: relative;
     display: flex;
     align-items: flex-start;
-    border: solid 2px 2px;
+    border: solid 2px;
     border-radius: var(--nile-radius-md, var(--ng-radius-xl));
     margin: inherit;
     padding: var(--nile-spacing-xl, var(--ng-spacing-xl));
@@ -130,7 +130,7 @@ export const styles = css `
 
   .alert__message--title {
     font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-600));
-    color:var(--nile-colors-dark-900, var(--ng-colors-primary-900));
+    color:var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));
   }
 
   .alert__message--content {

package/dist/src/nile-toast/nile-toast.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-toast.css.js","sourceRoot":"","sources":["../../../src/nile-toast/nile-toast.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4LxB,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 * Toast CSS\n */\nexport const styles = css`\n  :host {\n    display: contents;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\n    /* For better DX, we'll reset the margin here so the base part can inherit it */\n    margin: var(--nile-spacing-none);\n  }\n\n  .alert {\n    max-width: 100%;\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    align-items: flex-start;\n    border: solid 2px 2px;\n    border-radius: var(--nile-radius-md, var(--ng-radius-xl));\n    margin: inherit;\n    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    gap: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    width: max-content;\n    min-width: 400px;\n  }\n\n  .alert:not(.alert--has-icon) .alert__icon,\n  .alert:not(.alert--closable) .alert__close-button {\n    display: none;\n  }\n\n  .alert__prefix-icon-container {\n    background-color: var(--nile-colors-red-500);\n    border-radius: var(--nile-radius-sm);\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .alert__icon {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    font-size: var(--nile-type-scale-1);\n  }\n\n  .alert--success {\n    border: 1px solid var(--nile-toast-color-border-success, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-success, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--success .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-success, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--info {\n    border: 1px solid var(--nile-toast-color-border-info, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-info, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--info .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-info, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--warning {\n    border: 1px solid var(--nile-toast-color-border-warning, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-warning, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--warning .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-warning, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--error {\n    border: 1px solid var(--nile-toast-color-border-error, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-error, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--error .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-error, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--gray {\n    border: 1px solid var(--nile-toast-color-border-gray, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-gray, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--gray .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-gray, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--black {\n    border: 1px solid var(--nile-toast-color-border-black);\n    background: var(--nile-toast-color-background-black);\n    box-shadow: var(--nile-toast-color-box-black);\n  }\n\n  .alert--black .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-black);\n  }\n\n  .alert__message {\n    flex: 1 1 auto;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    align-items: flex-start;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-dark-900);\n    gap: var(--nile-spacing-sm, var(--ng-spacing-sm));\n  }\n\n  .alert__message--title {\n    font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-600));\n    color:var(--nile-colors-dark-900, var(--ng-colors-primary-900));\n  }\n\n  .alert__message--content {\n    font-weight:var(--nile-font-weight-regular, var(--ng-font-weight-400));\n    color:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n  }\n\n  .alert__message--content-only {\n  }\n\n  .alert__close-button {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .alert__tags {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  .alert__tag {\n    height: 24px;\n    display: flex;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n    border: 1px solid var(--nile-colors-neutral-400);\n    background: var(--nile-colors-white-base);\n  }\n\n  .alert__tag-content {\n    border-left: 1px solid var(--nile-colors-neutral-400);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-sm, var(--ng-spacing-sm));\n\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-tertiary-600));\n    font-family:  var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-600));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .alert__tag-image {\n    height: 24px;\n    width: 24px;\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-xs, var(--ng-radius-xs));\n  }\n\n  .alert__prefix-img {\n    height: 24px;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n  }\n\n  .alert--no-content{\n    align-items:center ;\n  }\n\n  [hidden] {\n    display: none;\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-toast.css.js","sourceRoot":"","sources":["../../../src/nile-toast/nile-toast.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4LxB,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 * Toast CSS\n */\nexport const styles = css`\n  :host {\n    display: contents;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n\n    /* For better DX, we'll reset the margin here so the base part can inherit it */\n    margin: var(--nile-spacing-none);\n  }\n\n  .alert {\n    max-width: 100%;\n    box-sizing: border-box;\n    position: relative;\n    display: flex;\n    align-items: flex-start;\n    border: solid 2px;\n    border-radius: var(--nile-radius-md, var(--ng-radius-xl));\n    margin: inherit;\n    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    gap: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    width: max-content;\n    min-width: 400px;\n  }\n\n  .alert:not(.alert--has-icon) .alert__icon,\n  .alert:not(.alert--closable) .alert__close-button {\n    display: none;\n  }\n\n  .alert__prefix-icon-container {\n    background-color: var(--nile-colors-red-500);\n    border-radius: var(--nile-radius-sm);\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n\n  .alert__icon {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    font-size: var(--nile-type-scale-1);\n  }\n\n  .alert--success {\n    border: 1px solid var(--nile-toast-color-border-success, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-success, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--success .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-success, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--info {\n    border: 1px solid var(--nile-toast-color-border-info, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-info, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--info .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-info, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--warning {\n    border: 1px solid var(--nile-toast-color-border-warning, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-warning, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--warning .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-warning, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--error {\n    border: 1px solid var(--nile-toast-color-border-error, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-error, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--error .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-error, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--gray {\n    border: 1px solid var(--nile-toast-color-border-gray, var(--ng-colors-border-secondary-alt));\n    background: var(--nile-toast-color-background-gray, var(--ng-colors-bg-primary-alt));\n    box-shadow: var(--nile-toast-color-box-shadow, var(--ng-shadow-xs));\n  }\n\n  .alert--gray .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-gray, var(--ng-colors-bg-primary-alt));\n  }\n\n  .alert--black {\n    border: 1px solid var(--nile-toast-color-border-black);\n    background: var(--nile-toast-color-background-black);\n    box-shadow: var(--nile-toast-color-box-black);\n  }\n\n  .alert--black .alert__prefix-icon-container {\n    background: var(--nile-toast-color-icon-background-color-black);\n  }\n\n  .alert__message {\n    flex: 1 1 auto;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    flex-direction: column;\n    align-items: flex-start;\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-dark-900);\n    gap: var(--nile-spacing-sm, var(--ng-spacing-sm));\n  }\n\n  .alert__message--title {\n    font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-600));\n    color:var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n  }\n\n  .alert__message--content {\n    font-weight:var(--nile-font-weight-regular, var(--ng-font-weight-400));\n    color:var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n  }\n\n  .alert__message--content-only {\n  }\n\n  .alert__close-button {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  .alert__tags {\n    display: flex;\n    flex-wrap: wrap;\n    gap: var(--nile-spacing-lg, var(--ng-spacing-lg));\n    margin-top: var(--nile-spacing-xs, var(--ng-spacing-xs));\n  }\n\n  .alert__tag {\n    height: 24px;\n    display: flex;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n    border: 1px solid var(--nile-colors-neutral-400);\n    background: var(--nile-colors-white-base);\n  }\n\n  .alert__tag-content {\n    border-left: 1px solid var(--nile-colors-neutral-400);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-spacing-sm, var(--ng-spacing-sm));\n\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-tertiary-600));\n    font-family:  var(--nile-font-family-serif, var(--ng-font-family-display));\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    font-style: normal;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-600));\n    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n    letter-spacing: 0.2px;\n  }\n\n  .alert__tag-image {\n    height: 24px;\n    width: 24px;\n    border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-none, var(--ng-radius-none)) var(--nile-radius-radius-xs, var(--ng-radius-xs));\n  }\n\n  .alert__prefix-img {\n    height: 24px;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-sm));\n  }\n\n  .alert--no-content{\n    align-items:center ;\n  }\n\n  [hidden] {\n    display: none;\n  }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-toolbar/nile-toolbar.css.js

@@ -28,8 +28,8 @@ export const styles = css `
     font-weight: var(--nile-toolbar-font-weight, var(--ng-font-weight-500));
     font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));
     font-size: var(--nile-toolbar-font-size, var(--ng-font-size-text-xl));
-    background-color: var(--nile-toolbar-background-color, var(--ng-colors-text-primary-on-brand));
-    color: var(--nile-toolbar-text-color, var(--ng-color-base-black));
+    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
+    /* color: var(--nile-toolbar-text-color, var(--ng-color-base-black)); */  // TODO: Need to be tokenized in future.
   }
 `;
 export default [styles];

package/dist/src/nile-toolbar/nile-toolbar.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-toolbar.css.js","sourceRoot":"","sources":["../../../src/nile-toolbar/nile-toolbar.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;CAuBxB,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 * Toolbar CSS\n */\nexport const styles = css`\n  :host {\n    display: block;\n    width: 100%;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .toolbar {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 0 48px;\n    box-sizing: border-box;\n    min-height: 64px;\n    line-height: var(--nile-toolbar-line-height, var(--ng-line-height-text-xl));\n    font-weight: var(--nile-toolbar-font-weight, var(--ng-font-weight-500));\n    font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n    font-size: var(--nile-toolbar-font-size, var(--ng-font-size-text-xl));\n    background-color: var(--nile-toolbar-background-color, var(--ng-colors-text-primary-on-brand));\n    color: var(--nile-toolbar-text-color, var(--ng-color-base-black));\n  }\n`;\n\nexport default [styles];\n"]}
+{"version":3,"file":"nile-toolbar.css.js","sourceRoot":"","sources":["../../../src/nile-toolbar/nile-toolbar.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;CAuBxB,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 * Toolbar CSS\n */\nexport const styles = css`\n  :host {\n    display: block;\n    width: 100%;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n  }\n\n  .toolbar {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 0 48px;\n    box-sizing: border-box;\n    min-height: 64px;\n    line-height: var(--nile-toolbar-line-height, var(--ng-line-height-text-xl));\n    font-weight: var(--nile-toolbar-font-weight, var(--ng-font-weight-500));\n    font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n    font-size: var(--nile-toolbar-font-size, var(--ng-font-size-text-xl));\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    /* color: var(--nile-toolbar-text-color, var(--ng-color-base-black)); */  // TODO: Need to be tokenized in future.\n  }\n`;\n\nexport default [styles];\n"]}

package/dist/src/nile-tooltip/nile-tooltip.css.js

@@ -16,7 +16,6 @@ export const styles = css `
     -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));
     -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));
     text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));
-    
     display: contents;
   }
 
@@ -53,7 +52,7 @@ export const styles = css `
     border-radius: var(--nile-radius-sm, var(--ng-radius-md));
     background-color: var(--nile-tooltip-color-background, var(--ng-colors-bg-primary-solid));
     font-size: var(--nile-tooltip-font-size-sm, var(--ng-font-size-text-xs));
-    font-weight: var(--nile-tooltip-font-weight-sm, var(--ng-font-weight-600));
+    font-weight: var(--nile-tooltip-font-weight-sm, var(--ng-font-weight-semibold));
     line-height: var(--nile-tooltip-line-height-sm, var(--ng-line-height-text-xs));
     padding: var(--nile-tooltip-padding-y, var(--ng-spacing-md)) var(--nile-tooltip-padding-x, var(--ng-spacing-md));
     color: var(--nile-colors-white-base, var(--ng-colors-text-white));

package/dist/src/nile-tooltip/nile-tooltip.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"nile-tooltip.css.js","sourceRoot":"","sources":["../../../src/nile-tooltip/nile-tooltip.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DxB,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 * Tooltip CSS\n */\nexport const styles = css`\n  :host {\n    --max-width: 20rem;\n    --hide-delay: 0ms;\n    --show-delay: 150ms;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n    \n    display: contents;\n  }\n\n  .tooltip {\n    --arrow-size: 5px;\n    --arrow-color: var(--nile-tooltip-color-background, var(--ng-colors-bg-primary-solid));\n  }\n\n  .tooltip::part(popup) {\n    pointer-events: none;\n    z-index: 1000;\n  }\n\n  .tooltip[placement^='top']::part(popup) {\n    transform-origin: bottom;\n  }\n\n  .tooltip[placement^='bottom']::part(popup) {\n    transform-origin: top;\n  }\n\n  .tooltip[placement^='left']::part(popup) {\n    transform-origin: right;\n  }\n\n  .tooltip[placement^='right']::part(popup) {\n    transform-origin: left;\n  }\n\n  .tooltip__body {\n    display: block;\n    width: max-content;\n    max-width: var(--max-width);\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n    background-color: var(--nile-tooltip-color-background, var(--ng-colors-bg-primary-solid));\n    font-size: var(--nile-tooltip-font-size-sm, var(--ng-font-size-text-xs));\n    font-weight: var(--nile-tooltip-font-weight-sm, var(--ng-font-weight-600));\n    line-height: var(--nile-tooltip-line-height-sm, var(--ng-line-height-text-xs));\n    padding: var(--nile-tooltip-padding-y, var(--ng-spacing-md)) var(--nile-tooltip-padding-x, var(--ng-spacing-md));\n    color: var(--nile-colors-white-base, var(--ng-colors-text-white));\n    pointer-events: none;\n    word-break: break-word;\n    font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n    box-shadow:var(--nile-box-shadow-none, var(--ng-shadow-lg));\n  }\n\n  .tooltip__body--large {\n    font-size: var(--nile-tooltip-font-size-lg);\n    line-height: var(--nile-tooltip-line-height-lg);\n    font-weight: var(--nile-tooltip-font-weight-lg);\n  }\n`;\n\nexport default [styles];"]}
+{"version":3,"file":"nile-tooltip.css.js","sourceRoot":"","sources":["../../../src/nile-tooltip/nile-tooltip.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DxB,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 * Tooltip CSS\n */\nexport const styles = css`\n  :host {\n    --max-width: 20rem;\n    --hide-delay: 0ms;\n    --show-delay: 150ms;\n    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing));\n    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing));\n    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering));\n    display: contents;\n  }\n\n  .tooltip {\n    --arrow-size: 5px;\n    --arrow-color: var(--nile-tooltip-color-background, var(--ng-colors-bg-primary-solid));\n  }\n\n  .tooltip::part(popup) {\n    pointer-events: none;\n    z-index: 1000;\n  }\n\n  .tooltip[placement^='top']::part(popup) {\n    transform-origin: bottom;\n  }\n\n  .tooltip[placement^='bottom']::part(popup) {\n    transform-origin: top;\n  }\n\n  .tooltip[placement^='left']::part(popup) {\n    transform-origin: right;\n  }\n\n  .tooltip[placement^='right']::part(popup) {\n    transform-origin: left;\n  }\n\n  .tooltip__body {\n    display: block;\n    width: max-content;\n    max-width: var(--max-width);\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n    background-color: var(--nile-tooltip-color-background, var(--ng-colors-bg-primary-solid));\n    font-size: var(--nile-tooltip-font-size-sm, var(--ng-font-size-text-xs));\n    font-weight: var(--nile-tooltip-font-weight-sm, var(--ng-font-weight-semibold));\n    line-height: var(--nile-tooltip-line-height-sm, var(--ng-line-height-text-xs));\n    padding: var(--nile-tooltip-padding-y, var(--ng-spacing-md)) var(--nile-tooltip-padding-x, var(--ng-spacing-md));\n    color: var(--nile-colors-white-base, var(--ng-colors-text-white));\n    pointer-events: none;\n    word-break: break-word;\n    font-family: var(--nile-font-family-sans-serif, var(--ng-font-family-body));\n    box-shadow:var(--nile-box-shadow-none, var(--ng-shadow-lg));\n  }\n\n  .tooltip__body--large {\n    font-size: var(--nile-tooltip-font-size-lg);\n    line-height: var(--nile-tooltip-line-height-lg);\n    font-weight: var(--nile-tooltip-font-weight-lg);\n  }\n`;\n\nexport default [styles];\n"]}