@aquera/nile-elements 1.8.8 → 1.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -0
- package/dist/index.js +29 -19
- package/dist/nile-button-toggle/nile-button-toggle.css.cjs.js +1 -1
- package/dist/nile-button-toggle/nile-button-toggle.css.cjs.js.map +1 -1
- package/dist/nile-button-toggle/nile-button-toggle.css.esm.js +5 -5
- package/dist/nile-filter-chip/nile-filter-chip.css.cjs.js +1 -1
- package/dist/nile-filter-chip/nile-filter-chip.css.cjs.js.map +1 -1
- package/dist/nile-filter-chip/nile-filter-chip.css.esm.js +5 -5
- package/dist/nile-grid/nile-grid.css.cjs.js +1 -1
- package/dist/nile-grid/nile-grid.css.cjs.js.map +1 -1
- package/dist/nile-grid/nile-grid.css.esm.js +1 -1
- package/dist/nile-list-item/nile-list-item.css.cjs.js +1 -1
- package/dist/nile-list-item/nile-list-item.css.cjs.js.map +1 -1
- package/dist/nile-list-item/nile-list-item.css.esm.js +9 -3
- package/dist/nile-menu-item/nile-menu-item.css.cjs.js +1 -1
- package/dist/nile-menu-item/nile-menu-item.css.cjs.js.map +1 -1
- package/dist/nile-menu-item/nile-menu-item.css.esm.js +5 -5
- package/dist/nile-nav-tab/nile-nav-tab.css.cjs.js +1 -1
- package/dist/nile-nav-tab/nile-nav-tab.css.cjs.js.map +1 -1
- package/dist/nile-nav-tab/nile-nav-tab.css.esm.js +4 -0
- package/dist/nile-option/nile-option.css.cjs.js +1 -1
- package/dist/nile-option/nile-option.css.cjs.js.map +1 -1
- package/dist/nile-option/nile-option.css.esm.js +3 -3
- package/dist/src/nile-button-toggle/nile-button-toggle.css.js +5 -5
- package/dist/src/nile-button-toggle/nile-button-toggle.css.js.map +1 -1
- package/dist/src/nile-filter-chip/nile-filter-chip.css.js +3 -3
- package/dist/src/nile-filter-chip/nile-filter-chip.css.js.map +1 -1
- package/dist/src/nile-grid/nile-grid.css.js +1 -1
- package/dist/src/nile-grid/nile-grid.css.js.map +1 -1
- package/dist/src/nile-list-item/nile-list-item.css.js +7 -1
- package/dist/src/nile-list-item/nile-list-item.css.js.map +1 -1
- package/dist/src/nile-menu-item/nile-menu-item.css.js +5 -5
- package/dist/src/nile-menu-item/nile-menu-item.css.js.map +1 -1
- package/dist/src/nile-nav-tab/nile-nav-tab.css.js +4 -0
- package/dist/src/nile-nav-tab/nile-nav-tab.css.js.map +1 -1
- package/dist/src/nile-option/nile-option.css.js +3 -3
- package/dist/src/nile-option/nile-option.css.js.map +1 -1
- package/dist/src/version.js +1 -1
- package/dist/src/version.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/nile-button-toggle/nile-button-toggle.css.ts +5 -5
- package/src/nile-filter-chip/nile-filter-chip.css.ts +3 -3
- package/src/nile-grid/nile-grid.css.ts +1 -1
- package/src/nile-list-item/nile-list-item.css.ts +7 -1
- package/src/nile-menu-item/nile-menu-item.css.ts +5 -5
- package/src/nile-nav-tab/nile-nav-tab.css.ts +4 -0
- package/src/nile-option/nile-option.css.ts +3 -3
|
@@ -35,15 +35,15 @@ import{css as i}from"lit";const n=i`
|
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
.option--hover:not(.option--current):not(.option--disabled) {
|
|
38
|
-
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-
|
|
38
|
+
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-secondary-hover));
|
|
39
39
|
color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
|
|
40
40
|
border-radius: var(--nile-radius-none, var(--ng-radius-sm));
|
|
41
41
|
}
|
|
42
42
|
|
|
43
43
|
.option--current,
|
|
44
44
|
.option--current.option--disabled {
|
|
45
|
-
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-
|
|
46
|
-
color: var(--nile-colors-primary-600, var(--ng-colors-
|
|
45
|
+
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));
|
|
46
|
+
color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));
|
|
47
47
|
opacity: 1;
|
|
48
48
|
border-radius: var(--nile-radius-none, var(--ng-radius-sm));
|
|
49
49
|
}
|
|
@@ -39,7 +39,7 @@ export const styles = css `
|
|
|
39
39
|
}
|
|
40
40
|
|
|
41
41
|
.nile-button-toggle:hover {
|
|
42
|
-
background: var(--nile-colors-neutral-100, var(--ng-colors-bg-
|
|
42
|
+
background: var(--nile-colors-neutral-100, var(--ng-colors-bg-secondary-hover));
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
.nile-button-toggle:active {
|
|
@@ -71,13 +71,13 @@ export const styles = css `
|
|
|
71
71
|
}
|
|
72
72
|
|
|
73
73
|
.nile-button-toggle__active {
|
|
74
|
-
background-color: var( --nile-colors-neutral-500, var(--ng-colors-bg-primary
|
|
75
|
-
color: var(--nile-colors-dark-900, var(--ng-colors-
|
|
74
|
+
background-color: var( --nile-colors-neutral-500, var(--ng-colors-bg-brand-primary) );
|
|
75
|
+
color: var(--nile-colors-dark-900, var(--ng-colors-bg-brand-solid));
|
|
76
76
|
}
|
|
77
77
|
|
|
78
78
|
.nile-button-toggle__active:hover {
|
|
79
|
-
background-color: var(--nile-colors-neutral-500, var(--ng-colors-bg-primary
|
|
80
|
-
color: var(--nile-colors-dark-900, var(--ng-colors-
|
|
79
|
+
background-color: var(--nile-colors-neutral-500, var(--ng-colors-bg-brand-primary));
|
|
80
|
+
color: var(--nile-colors-dark-900, var(--ng-colors-bg-brand-solid));
|
|
81
81
|
}
|
|
82
82
|
|
|
83
83
|
.nile-button-toggle__disabled {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-button-toggle.css.js","sourceRoot":"","sources":["../../../src/nile-button-toggle/nile-button-toggle.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2ExB,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 * ButtonToggle CSS\n */\nexport const styles = css`\n :host {\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 .nile-button-toggle {\n display: flex;\n padding: var(--nile-spacing-sm, var(--ng-spacing-md))\n var(--nile-spacing-xl, var(--ng-spacing-xl))\n var(--nile-spacing-sm, var(--ng-spacing-md))\n var(--nile-spacing-14px, var(--ng-spacing-xl));\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n cursor: pointer;\n border-radius: var(--nile-radius-radius-xs, var(--ng-radius-md));\n font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-semibold));\n color: var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n text-align: center;\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 line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n letter-spacing: 0.2px;\n justify-content: center;\n align-items: center;\n gap: var(--nile-spacing-md, var(--ng-spacing-md));\n height: 40px;\n box-sizing: border-box;\n }\n\n .nile-button-toggle:hover {\n background: var(--nile-colors-neutral-100, var(--ng-colors-bg-
|
|
1
|
+
{"version":3,"file":"nile-button-toggle.css.js","sourceRoot":"","sources":["../../../src/nile-button-toggle/nile-button-toggle.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2ExB,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 * ButtonToggle CSS\n */\nexport const styles = css`\n :host {\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 .nile-button-toggle {\n display: flex;\n padding: var(--nile-spacing-sm, var(--ng-spacing-md))\n var(--nile-spacing-xl, var(--ng-spacing-xl))\n var(--nile-spacing-sm, var(--ng-spacing-md))\n var(--nile-spacing-14px, var(--ng-spacing-xl));\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n cursor: pointer;\n border-radius: var(--nile-radius-radius-xs, var(--ng-radius-md));\n font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-semibold));\n color: var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));\n text-align: center;\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 line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n letter-spacing: 0.2px;\n justify-content: center;\n align-items: center;\n gap: var(--nile-spacing-md, var(--ng-spacing-md));\n height: 40px;\n box-sizing: border-box;\n }\n\n .nile-button-toggle:hover {\n background: var(--nile-colors-neutral-100, var(--ng-colors-bg-secondary-hover));\n }\n\n .nile-button-toggle:active {\n background: var(--nile-colors-neutral-400, var(--ng-colors-bg-primary-hover));\n }\n\n .nile-button-toggle__initial {\n border-radius: \n var(--nile-radius-radius-xs, var(--ng-radius-md)) \n var(--nile-radius-radius-none, var(--ng-radius-none)) \n var(--nile-radius-radius-none, var(--ng-radius-none)) \n var(--nile-radius-radius-xs, var(--ng-radius-md));\n }\n\n .nile-button-toggle__end {\n border-radius: \n var(--nile-radius-radius-none, var(--ng-radius-none))\n var(--nile-radius-radius-xs, var(--ng-radius-md))\n var(--nile-radius-radius-xs, var(--ng-radius-md))\n var(--nile-radius-radius-none, var(--ng-radius-none));\n border-left: var(--nile-radius-radius-none, var(--ng-radius-none));\n }\n\n .nile-button-toggle__middle {\n border-width: 1px 1px 1px 0;\n border-style: solid;\n border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n border-radius: var(--nile-radius-radius-none, var(--ng-radius-none));\n }\n\n .nile-button-toggle__active {\n background-color: var( --nile-colors-neutral-500, var(--ng-colors-bg-brand-primary) );\n color: var(--nile-colors-dark-900, var(--ng-colors-bg-brand-solid));\n }\n\n .nile-button-toggle__active:hover {\n background-color: var(--nile-colors-neutral-500, var(--ng-colors-bg-brand-primary));\n color: var(--nile-colors-dark-900, var(--ng-colors-bg-brand-solid));\n }\n\n .nile-button-toggle__disabled {\n cursor: not-allowed;\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -38,14 +38,14 @@ export const styles = css `
|
|
|
38
38
|
}
|
|
39
39
|
|
|
40
40
|
.chip:hover {
|
|
41
|
-
background-color: var(--nile-filter-chip-hover-background, var(--ng-colors-bg-
|
|
41
|
+
background-color: var(--nile-filter-chip-hover-background, var(--ng-colors-bg-secondary-hover));
|
|
42
42
|
}
|
|
43
43
|
.chip:active {
|
|
44
|
-
background-color: var(--nile-filter-chip-active-background, var(--ng-colors-bg-
|
|
44
|
+
background-color: var(--nile-filter-chip-active-background, var(--ng-colors-bg-brand-primary));
|
|
45
45
|
border-color: var(--nile-filter-chip-active-border-color-stroke);
|
|
46
46
|
}
|
|
47
47
|
:host([active]) .chip {
|
|
48
|
-
background-color: var(--nile-filter-chip-active-background, var(--ng-colors-bg-
|
|
48
|
+
background-color: var(--nile-filter-chip-active-background, var(--ng-colors-bg-brand-primary));
|
|
49
49
|
border-color: var(--nile-filter-chip-active-border-color-stroke);
|
|
50
50
|
}
|
|
51
51
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-filter-chip.css.js","sourceRoot":"","sources":["../../../src/nile-filter-chip/nile-filter-chip.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB;;GAEG;AAEH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmKxB,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 * FilterChip CSS\n */\n\nexport const styles = css`\n\n :host{\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 .filter-chips {\n display: flex;\n align-items: center;\n }\n\n\n .chip {\n display: inline-flex;\n align-items: center;\n height: 30px;\n padding: 8px;\n border: 1px solid var(--nile-filter-chip-chip-border-color-stroke, var(--ng-colors-border-primary));\n border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n font-size: 14px;\n background-color: var(--nile-filter-chip-background-default, var(--ng-colors-bg-primary));\n color: var(--nile-filter-chip-text-default, var(--ng-colors-text-secondary-700));\n transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;\n cursor: pointer;\n box-sizing: border-box;\n }\n\n .chip:hover {\n background-color: var(--nile-filter-chip-hover-background, var(--ng-colors-bg-
|
|
1
|
+
{"version":3,"file":"nile-filter-chip.css.js","sourceRoot":"","sources":["../../../src/nile-filter-chip/nile-filter-chip.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB;;GAEG;AAEH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmKxB,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 * FilterChip CSS\n */\n\nexport const styles = css`\n\n :host{\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 .filter-chips {\n display: flex;\n align-items: center;\n }\n\n\n .chip {\n display: inline-flex;\n align-items: center;\n height: 30px;\n padding: 8px;\n border: 1px solid var(--nile-filter-chip-chip-border-color-stroke, var(--ng-colors-border-primary));\n border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n font-size: 14px;\n background-color: var(--nile-filter-chip-background-default, var(--ng-colors-bg-primary));\n color: var(--nile-filter-chip-text-default, var(--ng-colors-text-secondary-700));\n transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;\n cursor: pointer;\n box-sizing: border-box;\n }\n\n .chip:hover {\n background-color: var(--nile-filter-chip-hover-background, var(--ng-colors-bg-secondary-hover));\n }\n .chip:active {\n background-color: var(--nile-filter-chip-active-background, var(--ng-colors-bg-brand-primary));\n border-color: var(--nile-filter-chip-active-border-color-stroke);\n}\n:host([active]) .chip {\n background-color: var(--nile-filter-chip-active-background, var(--ng-colors-bg-brand-primary));\n border-color: var(--nile-filter-chip-active-border-color-stroke);\n}\n\n\n .icon {\n color: var(--nile-filter-chip-icon-color-default, var(--ng-colors-text-primary-900));\n display: flex;\n align-items: center;\n justify-content: center;\n vertical-align: middle;\n position: relative;\n top: 12px;\n }\n\n .label {\n font-weight: 500;\n color: var(--nile-filter-chip-label-color-default, var(--ng-colors-text-primary-900));\n }\n\n nile-badge::part(base) {\n width: auto;\n height: 14px;\n border-radius: 100px;\n padding: 6px;\n gap: 10px;\n font-size: 8px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n line-height: 1;\n }\n\n .chip-container {\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n }\n\n .clear-all-container {\n margin-left: 18px;\n white-space: nowrap;\n cursor: pointer;\n }\n\n\n .value {\n color: var(--nile-filter-chip-values-color-default, var(--ng-colors-text-brand-secondary-700));\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 140px;\n vertical-align: bottom;\n}\n\n\n .close-icon {\n color: var(--nile-filter-chip-close-icon-color-default, var(--ng-componentcolors-utility-gray-400));\n cursor: pointer;\n display: flex;\n align-items: center;\n border-radius: 50%;\n transition: background-color 0.2s;\n }\n\n .close-icon:hover {\n background-color: var(--nile-filter-chip-close-icon-hover-background, var(--ng-colors-bg-primary-hover));\n color: var(--nile-filter-chip-close-icon-hover-color, var(--ng-componentcolors-utility-gray-500));\n }\n\n.label-wrapper {\n margin-right: 4px;\n}\n\n::slotted([slot=\"icon\"]) {\n margin-right: 6px;\n}\n\n.value-wrapper {\n margin-right: 4px; \n}\n\n.badge-wrapper {\n margin-right: 12px; \n}\n\n.badge{\n display: inline-flex;\n align-items: center;\n height: 20px; \n}\n\nnile-badge::part(content) {\n line-height: 20px;\n}\n\n:host([disabled]) .chip {\n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-disabled-subtle));\n border-color: var(--nile-colors-neutral-400, var(--ng-colors-border-disabled));\n color: var(--nile-colors-neutral-500, var(--ng-colors-text-secondary-700));\n cursor: not-allowed;\n opacity: var(--nile-opacity-100, var(--ng-opacity-50));\n}\n\n:host([disabled]) .label {\n color: var(--nile-colors-neutral-500, var(--ng-colors-text-secondary-700));\n font-family:colfax-regular;\n user-select: none;\n -webkit-user-select: none;\n}\n\n:host([disabled]) .value {\n color: var(--nile-colors-primary-500, var(--ng-colors-text-brand-secondary-700));\n user-select: none;\n -webkit-user-select: none;\n}\n\n:host([disabled]) nile-badge::part(base) {\n background-color: var(--nile-colors-primary-500,var(--ng-colors-text-brand-secondary-700));\n color: var(--nile-colors-white-base, var(--ng-colors-text-white));\n user-select: none;\n -webkit-user-select: none;\n}\n\n`;\n\nexport default [styles];\n\n "]}
|
|
@@ -14,7 +14,7 @@ export const styles = css `
|
|
|
14
14
|
inline-size: 100%;
|
|
15
15
|
position: relative;
|
|
16
16
|
box-sizing: border-box;
|
|
17
|
-
border: 1px solid var(--nile-colors-neutral-400,
|
|
17
|
+
border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-secondary));
|
|
18
18
|
border-radius: var(--nile-radius-md, var(--ng-radius-xl));
|
|
19
19
|
background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
|
|
20
20
|
max-height: 100%;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-grid.css.js","sourceRoot":"","sources":["../../../src/nile-grid/nile-grid.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2025\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\nexport const styles = css`\n :host {\n --min-width: 180px;\n display: grid;\n grid-template-rows: auto;\n overflow: auto;\n inline-size: 100%;\n position: relative;\n box-sizing: border-box;\n border: 1px solid var(--nile-colors-neutral-400,
|
|
1
|
+
{"version":3,"file":"nile-grid.css.js","sourceRoot":"","sources":["../../../src/nile-grid/nile-grid.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2025\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\nexport const styles = css`\n :host {\n --min-width: 180px;\n display: grid;\n grid-template-rows: auto;\n overflow: auto;\n inline-size: 100%;\n position: relative;\n box-sizing: border-box;\n border: 1px solid var(--nile-colors-neutral-400, var(--ng-colors-border-secondary));\n border-radius: var(--nile-radius-md, var(--ng-radius-xl));\n background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n max-height: 100%;\n width: 100%;\n min-width: var(--min-width);\n box-shadow: var(--nile-box-shadow-3, var(--ng-shadow-xs));\n }\n\n ::slotted(nile-grid-head),\n ::slotted(nile-grid-body) {\n inline-size: 100%;\n }\n\n .nile-resize-start,\n .nile-resize-end {\n position: absolute;\n z-index: 4;\n background-color: var(--nile-colors-neutral-400, var(--ng-colors-border-secondary));\n width: 2px;\n height: 100%;\n top: 0;\n display: none;\n bottom: 0;\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -25,7 +25,13 @@ export const styles = css `
|
|
|
25
25
|
}
|
|
26
26
|
|
|
27
27
|
:host(:hover) {
|
|
28
|
-
background-color: var(--nile-colors-neutral-400, var(
|
|
28
|
+
background-color: var(--nile-colors-neutral-400, var(--ng-colors-bg-secondary-hover)); /* Change background color on hover */
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
:host([selected]),
|
|
32
|
+
:host([active]) {
|
|
33
|
+
background-color: var(--ng-colors-bg-brand-primary); /* Selection background */
|
|
34
|
+
color: var(--ng-colors-bg-brand-solid); /* Selection text and elements */
|
|
29
35
|
}
|
|
30
36
|
|
|
31
37
|
.preffix__icon {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-list-item.css.js","sourceRoot":"","sources":["../../../src/nile-list-item/nile-list-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
|
|
1
|
+
{"version":3,"file":"nile-list-item.css.js","sourceRoot":"","sources":["../../../src/nile-list-item/nile-list-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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgExB,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 * ListItem CSS\n */\nexport const styles = css`\n :host {\n display: flex;\n padding: \n var(--nile-spacing-lg, var(--ng-spacing-lg)) \n var(--nile-spacing-xl, var(--ng-spacing-xl));\n flex-direction: row;\n align-items: flex-start;\n justify-content: start;\n position: relative;\n height: 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 :host(:hover) {\n background-color: var(--nile-colors-neutral-400, var(--ng-colors-bg-secondary-hover)); /* Change background color on hover */\n }\n\n :host([selected]),\n :host([active]) {\n background-color: var(--ng-colors-bg-brand-primary); /* Selection background */\n color: var(--ng-colors-bg-brand-solid); /* Selection text and elements */\n }\n\n .preffix__icon {\n display: inline-block;\n margin-right: var(--nile-spacing-lg, var(--ng-spacing-lg));\n }\n\n .list__item {\n cursor: pointer;\n height: 100%;\n display: block;\n font-size: var(--nile-type-scale-4, var(--ng-font-size-text-md));\n }\n\n .content__wrapper {\n display: flex;\n flex-direction: column;\n gap: var(--nile-spacing-3px, var(--ng-spacing-xs));\n height: 100%;\n box-sizing: border-box;\n }\n\n .heading {\n display: inline-block;\n font-size: var(--nile-type-scale-5, var(--ng-font-size-text-lg));\n font-weight: var(--nile-font-weight-semi-bold, var(--ng-font-weight-semibold));\n }\n\n .subheading {\n display: inline-block;\n font-size: var(--nile-type-scale-2, var(--ng-font-size-text-xs));\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n }\n\n .list-item__suffix {\n display: inline-block;\n position: absolute;\n right: 16px;\n cursor: pointer;\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -52,8 +52,8 @@ export const styles = css `
|
|
|
52
52
|
}
|
|
53
53
|
|
|
54
54
|
.menu-item.menu-item--active {
|
|
55
|
-
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-
|
|
56
|
-
color: var(--nile-colors-primary-600, var(--ng-colors-
|
|
55
|
+
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));
|
|
56
|
+
color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));
|
|
57
57
|
}
|
|
58
58
|
|
|
59
59
|
.menu-item.menu-item--disabled {
|
|
@@ -92,13 +92,13 @@ export const styles = css `
|
|
|
92
92
|
}
|
|
93
93
|
|
|
94
94
|
:host(:hover:not([active], [aria-disabled='true'], :focus-visible)) .menu-item {
|
|
95
|
-
background-color: var(--nile-colors-neutral-100,var(--ng-colors-bg-
|
|
95
|
+
background-color: var(--nile-colors-neutral-100,var(--ng-colors-bg-secondary-hover));
|
|
96
96
|
color: var(--nile-colors-dark-900,var(--ng-colors-text-secondary-hover));
|
|
97
97
|
}
|
|
98
98
|
|
|
99
99
|
:host([active]:hover:not([aria-disabled='true'], :focus-visible)) .menu-item {
|
|
100
|
-
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-
|
|
101
|
-
color: var(--nile-colors-primary-600, var(--ng-colors-
|
|
100
|
+
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));
|
|
101
|
+
color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));
|
|
102
102
|
}
|
|
103
103
|
|
|
104
104
|
:host(:focus-visible) .menu-item {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-menu-item.css.js","sourceRoot":"","sources":["../../../src/nile-menu-item/nile-menu-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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0HxB,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 * MenuItem CSS\n */\nexport const styles = css`\n :host {\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 :host *,\n :host *::before,\n :host *::after {\n box-sizing: inherit;\n }\n\n [hidden] {\n display: none !important;\n }\n\n :host {\n display: block;\n }\n\n :host([inert]) {\n display: none;\n }\n\n .menu-item {\n position: relative;\n display: flex;\n align-items: stretch;\n font-size: var(--nile-font-size-rem-large ,var(--ng-font-size-text-sm));\n font-weight: var(--nile-font-weight-regular,var(--ng-font-weight-semibold));\n line-height: var(--nile-line-height-1-8,var(--ng-line-height-text-md));\n letter-spacing: normal;\n color: var(--nile-color-dark-1, var(--ng-colors-text-secondary-700));\n min-height:40px;\n transition: 150ms fill;\n user-select: none;\n white-space: nowrap;\n cursor: pointer;\n padding: var(--nile-spacing-none, var(--ng-spacing-md)) var(--nile-spacing-xl, var(--ng-spacing-xl));\n }\n\n .menu-item.menu-item--active {\n background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-
|
|
1
|
+
{"version":3,"file":"nile-menu-item.css.js","sourceRoot":"","sources":["../../../src/nile-menu-item/nile-menu-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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0HxB,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 * MenuItem CSS\n */\nexport const styles = css`\n :host {\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 :host *,\n :host *::before,\n :host *::after {\n box-sizing: inherit;\n }\n\n [hidden] {\n display: none !important;\n }\n\n :host {\n display: block;\n }\n\n :host([inert]) {\n display: none;\n }\n\n .menu-item {\n position: relative;\n display: flex;\n align-items: stretch;\n font-size: var(--nile-font-size-rem-large ,var(--ng-font-size-text-sm));\n font-weight: var(--nile-font-weight-regular,var(--ng-font-weight-semibold));\n line-height: var(--nile-line-height-1-8,var(--ng-line-height-text-md));\n letter-spacing: normal;\n color: var(--nile-color-dark-1, var(--ng-colors-text-secondary-700));\n min-height:40px;\n transition: 150ms fill;\n user-select: none;\n white-space: nowrap;\n cursor: pointer;\n padding: var(--nile-spacing-none, var(--ng-spacing-md)) var(--nile-spacing-xl, var(--ng-spacing-xl));\n }\n\n .menu-item.menu-item--active {\n background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n }\n\n .menu-item.menu-item--disabled {\n outline: none;\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .menu-item .menu-item__label {\n margin: auto var(--nile-spacing-none,var(--ng-spacing-none));\n display: inline-flex;\n }\n\n .menu-item .menu-item__prefix {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n }\n\n .menu-item .menu-item__prefix::slotted(*) {\n margin-inline-end: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n }\n\n .menu-item .menu-item__suffix {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n }\n\n .menu-item .menu-item__suffix::slotted(*) {\n margin-inline-start: var(--nile-font-size-rem-xsmall,var(--ng-spacing-md));\n }\n\n :host(:focus-visible) {\n outline: none;\n }\n\n :host(:hover:not([active], [aria-disabled='true'], :focus-visible)) .menu-item {\n background-color: var(--nile-colors-neutral-100,var(--ng-colors-bg-secondary-hover));\n color: var(--nile-colors-dark-900,var(--ng-colors-text-secondary-hover));\n }\n\n :host([active]:hover:not([aria-disabled='true'], :focus-visible)) .menu-item {\n background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n }\n\n :host(:focus-visible) .menu-item {\n outline: none;\n background-color: var(--nile-colors-blue-500,var(--ng-colors-bg-active));\n color: var(--nile-colors-white-base,var(--ng-colors-text-primary-900));\n opacity: 1;\n }\n\n .menu-item .menu-item__check,\n .menu-item .menu-item__chevron {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1.5em;\n visibility: hidden;\n }\n\n .menu-item--checked .menu-item__check,\n .menu-item--has-submenu .menu-item__chevron {\n visibility: visible;\n }\n\n @media (forced-colors: active) {\n :host(:hover:not([aria-disabled='true'])) .menu-item,\n :host(:focus-visible) .menu-item {\n outline: dashed 1px SelectedItem;\n outline-offset: -1px;\n }\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -137,6 +137,10 @@ export const styles = css `
|
|
|
137
137
|
}
|
|
138
138
|
|
|
139
139
|
/* Hover */
|
|
140
|
+
.nav-tab:hover:not(.nav-tab--disabled)::part(base),
|
|
141
|
+
.nav-tab:hover:not(.nav-tab--disabled)::part(label) {
|
|
142
|
+
text-decoration: none;
|
|
143
|
+
}
|
|
140
144
|
.nav-tab:hover:not(.nav-tab--disabled)::part(base) {
|
|
141
145
|
color: var(--nile-colors-dark-500, var(--ng-colors-text-brand-secondary-700));
|
|
142
146
|
background-color: var(--tab-hover-background-color);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-nav-tab.css.js","sourceRoot":"","sources":["../../../src/nile-nav-tab/nile-nav-tab.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"nile-nav-tab.css.js","sourceRoot":"","sources":["../../../src/nile-nav-tab/nile-nav-tab.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiMxB,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\nexport const styles = css`\n \n [hidden] {\n display: none;\n }\n\n :host {\n display: flex;\n flex-direction: column;\n align-self: stretch;\n position: relative;\n\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 cursor: pointer;\n }\n\n :host([centered]) {\n flex: 1;\n text-align: center;\n }\n\n /* --------------------------------------------------------------------------\n * Tab shell (list item)\n * -------------------------------------------------------------------------- */\n\n .nav-tab-container {\n flex: 1 1 auto;\n width: var(--nav-tab-item-width);\n padding: 0;\n box-sizing: border-box;\n border-radius: var(--nile-nav-tab-radius);\n border: var(--nile-nav-transparent-border);\n transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;\n position: relative;\n display: flex;\n align-items: stretch;\n list-style: none;\n overflow: var(--nile-nav-tab-container-overflow);\n margin-top: var(--nile-nav-tab-margin);\n margin-bottom: var(--nile-nav-tab-margin);\n \n }\n\n /* --------------------------------------------------------------------------\n * nile-link wrapper + internal <a> (part base)\n * -------------------------------------------------------------------------- */\n\n .nav-tab {\n display: flex;\n flex: 1 1 auto;\n align-self: stretch;\n width: 100%;\n min-width: 0;\n min-height: 0;\n align-items: center;\n box-sizing: border-box;\n }\n\n .nav-tab::part(base) {\n display: flex;\n flex: 1 1 auto;\n align-self: stretch;\n width: 100%;\n min-height: 100%;\n height: 100%;\n align-items: center;\n justify-content: var(--justify-content);\n white-space: var(--white-space, nowrap);\n user-select: none;\n transition: 0.2s box-shadow, 0.2s color;\n gap: var(--nile-spacing-md, var(--ng-spacing-md));\n box-sizing: border-box;\n text-decoration: none;\n font-family: var(--nile-font-family-medium, 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-medium, var(--ng-font-weight-semibold));\n line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));\n letter-spacing: 0.2px;\n word-break: var(--word-break);\n overflow-wrap: var(--overflow-wrap);\n text-align: var(--text-align);\n padding: var(--nile-nav-tab-padding);\n }\n\n /* --------------------------------------------------------------------------\n * Host: active / hover (container + link color)\n * -------------------------------------------------------------------------- */\n\n :host([active]) .nav-tab-container {\n background-color: var(--nile-nav-tab-bg-active);\n border-radius: var(--nile-nav-tab-radius);\n border: var(--nile-nav-tab-border);\n box-shadow: var(--nile-nav-tab-active-box-shadow);\n }\n\n :host(:hover:not([disabled]):not([active])) .nav-tab-container {\n background-color: var(--nile-nav-tab-bg-hover);\n border: var(--nile-nav-tab-border);\n box-shadow: var(--nile-nav-tab-active-box-shadow);\n }\n\n :host(:hover:not([disabled]):not([active])) .nav-tab-container ::part(base) {\n color: var(--nile-nav-tab-text-color-hover, var(--nile-colors-primary-700, var(--ng-colors-text-brand-secondary-700)));\n }\n\n /* --------------------------------------------------------------------------\n * nile-link part: label inherits anchor\n * -------------------------------------------------------------------------- */\n\n .nav-tab::part(label) {\n color: inherit;\n font-family: inherit;\n font-size: inherit;\n font-style: inherit;\n font-weight: inherit;\n line-height: inherit;\n letter-spacing: inherit;\n }\n\n /* --------------------------------------------------------------------------\n * Interaction states (::part base)\n * -------------------------------------------------------------------------- */\n\n /* Default (inactive) */\n .nav-tab:not(.nav-tab--active):not(.nav-tab--disabled)::part(base) {\n color: var(--nile-colors-dark-500, var(--ng-colors-text-secondary-700));\n }\n\n /* Hover */\n .nav-tab:hover:not(.nav-tab--disabled)::part(base),\n .nav-tab:hover:not(.nav-tab--disabled)::part(label) {\n text-decoration: none;\n }\n .nav-tab:hover:not(.nav-tab--disabled)::part(base) {\n color: var(--nile-colors-dark-500, var(--ng-colors-text-brand-secondary-700));\n background-color: var(--tab-hover-background-color);\n }\n\n /* Focus — roving tabindex is on :host; inner link stays tabindex=-1 */\n :host(:focus-visible:not([disabled])) .nav-tab::part(base) {\n color: var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700));\n }\n\n /* Active */\n .nav-tab.nav-tab--active:not(.nav-tab--disabled)::part(base) {\n color: var(--nile-nav-tab-active-color, var(--nile-colors-primary-600, var(--ng-colors-text-brand-secondary-700)));\n background-color: var(--tab-active-background-color);\n }\n\n /* --------------------------------------------------------------------------\n * Disabled\n * -------------------------------------------------------------------------- */\n\n .nav-tab.nav-tab--disabled {\n cursor: not-allowed;\n }\n\n :host([disabled]) .nav-tab-container {\n cursor: not-allowed;\n }\n\n .nav-tab.nav-tab--disabled::part(base) {\n color: var(--nile-colors-neutral-500, var(--ng-colors-text-disabled));\n cursor: not-allowed;\n pointer-events: none;\n }\n\n .nav-tab.nav-tab--disabled::part(label) {\n color: var(--nile-colors-neutral-500, var(--ng-colors-text-disabled));\n }\n\n .nav-tab.nav-tab--disabled:hover::part(base),\n :host([disabled]:focus-visible) .nav-tab::part(base) {\n background-color: transparent;\n }\n\n /* --------------------------------------------------------------------------\n * Closable: close button\n * -------------------------------------------------------------------------- */\n\n .nav-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 .nav-tab__close-button::part(base) {\n padding: var(--nile-spacing-xs, var(--ng-spacing-xs));\n }\n\n \n`;\n\nexport default [styles];\n"]}
|
|
@@ -45,15 +45,15 @@ export const styles = css `
|
|
|
45
45
|
}
|
|
46
46
|
|
|
47
47
|
.option--hover:not(.option--current):not(.option--disabled) {
|
|
48
|
-
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-
|
|
48
|
+
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-secondary-hover));
|
|
49
49
|
color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
|
|
50
50
|
border-radius: var(--nile-radius-none, var(--ng-radius-sm));
|
|
51
51
|
}
|
|
52
52
|
|
|
53
53
|
.option--current,
|
|
54
54
|
.option--current.option--disabled {
|
|
55
|
-
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-
|
|
56
|
-
color: var(--nile-colors-primary-600, var(--ng-colors-
|
|
55
|
+
background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));
|
|
56
|
+
color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));
|
|
57
57
|
opacity: 1;
|
|
58
58
|
border-radius: var(--nile-radius-none, var(--ng-radius-sm));
|
|
59
59
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-option.css.js","sourceRoot":"","sources":["../../../src/nile-option/nile-option.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0JxB,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 * Option_2 CSS\n */\nexport const styles = css`\n :host {\n display: block;\n user-select: none;\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(:focus) {\n outline: none;\n }\n\n .option {\n position: relative;\n display: flex;\n align-items: center;\n font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-medium));\n line-height: var(--nile-line-height-1-8, var(--ng-line-height-text-md));\n letter-spacing: normal;\n color: var(--nile-color-dark-1, var(--ng-colors-text-primary-900));\n padding: var(--nile-spacing-sm, var(--ng-spacing-md)) var(--nile-spacing-none, var(--ng-spacing-none));\n transition: 150ms fill;\n font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n cursor: pointer;\n margin-bottom: var(--nile-spacing-none, var(--ng-spacing-xxs) )\n }\n :host([legacy]) .option {\n padding: var(--nile-spacing-sm, var(--ng-spacing-md)) var(--nile-spacing-none, var(--ng-spacing-md));\n }\n\n .option--single-select {\n padding: var(--nile-spacing-9px, var(--ng-spacing-md)) var(--nile-spacing-lg, var(--ng-spacing-md));\n }\n\n .option--hover:not(.option--current):not(.option--disabled) {\n background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-
|
|
1
|
+
{"version":3,"file":"nile-option.css.js","sourceRoot":"","sources":["../../../src/nile-option/nile-option.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0JxB,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 * Option_2 CSS\n */\nexport const styles = css`\n :host {\n display: block;\n user-select: none;\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(:focus) {\n outline: none;\n }\n\n .option {\n position: relative;\n display: flex;\n align-items: center;\n font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-medium));\n line-height: var(--nile-line-height-1-8, var(--ng-line-height-text-md));\n letter-spacing: normal;\n color: var(--nile-color-dark-1, var(--ng-colors-text-primary-900));\n padding: var(--nile-spacing-sm, var(--ng-spacing-md)) var(--nile-spacing-none, var(--ng-spacing-none));\n transition: 150ms fill;\n font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n cursor: pointer;\n margin-bottom: var(--nile-spacing-none, var(--ng-spacing-xxs) )\n }\n :host([legacy]) .option {\n padding: var(--nile-spacing-sm, var(--ng-spacing-md)) var(--nile-spacing-none, var(--ng-spacing-md));\n }\n\n .option--single-select {\n padding: var(--nile-spacing-9px, var(--ng-spacing-md)) var(--nile-spacing-lg, var(--ng-spacing-md));\n }\n\n .option--hover:not(.option--current):not(.option--disabled) {\n background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-secondary-hover));\n color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n border-radius: var(--nile-radius-none, var(--ng-radius-sm));\n }\n\n .option--current,\n .option--current.option--disabled {\n background-color: var(--nile-colors-primary-100, var(--ng-colors-bg-brand-primary));\n color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-solid));\n opacity: 1;\n border-radius: var(--nile-radius-none, var(--ng-radius-sm));\n }\n\n .option--disabled {\n outline: none;\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .option__label {\n flex: 1 1 auto;\n display: inline-block;\n line-height: 1.4;\n word-break: break-all;\n }\n\n .option .option__check {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n visibility: hidden;\n padding-inline-end: var(--nile-spacing-xs);\n color: var(--nile-colors-primary-600, var(--ng-colors-fg-brand-primary-600));\n }\n\n .option--selected .option__check {\n visibility: visible;\n }\n\n :host([tickonselect][selected]) .option__check {\n visibility: visible;\n }\n\n .option__prefix,\n .option__suffix {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n }\n\n .option__prefix::slotted(*) {\n margin-inline-end: var(--nile-font-size-rem-xsmall, var(--ng-spacing-md));\n }\n\n .option__suffix::slotted(*) {\n margin-inline-start: var(--nile-font-size-rem-xsmall, var(--ng-spacing-md));\n }\n\n :host(:not([aria-selected='true'])) .option .option__suffix{\n display: var(--nile-display-block, var(--ng-display-none));\n }\n\n .option--checkbox{\n pointer-events: none;\n margin-left: var(--nile-spacing-lg, var(--ng-spacing-lg));\n margin-right: var(--nile-spacing-lg, var(--ng-spacing-lg));\n width:auto;\n display:var(--nile-display-inline-block, var(--ng-display-inline-block));\n }\n :host([legacy]) .option--checkbox{\n display:var(--nile-display-inline-block, var(--ng-display-none));\n }\n\n \n :host([tickonselect]) .option--checkbox{\n display: none;\n }\n\n :host([tickonselect]) .option{\n padding-left: var(--nile-spacing-lg, var(--ng-spacing-lg));\n padding-right: var(--nile-spacing-lg, var(--ng-spacing-lg));\n }\n\n\n @media (forced-colors: active) {\n :host(:hover:not([aria-disabled='true'])) .option {\n outline: dashed 1px SelectedItem;\n outline-offset: -1px;\n }\n }\n\n .option__label-container {\n display: flex;\n flex-direction: column;\n }\n\n .option__description {\n font-size: var(--nile-type-scale-2, var(--ng-font-size-text-sm));\n color: var(--nile-colors-dark-500, var(--ng-colors-text-tertiary-600));\n }\n\n .text-ellipsis {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n display: inline-block;\n width: 99%;\n }\n\n .option__label-text-ellipsis {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n display: inline-block;\n width: 99%;\n }\n`;\n\nexport default [styles];\n"]}
|
package/dist/src/version.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// Version utility - placeholders will be replaced during build
|
|
2
|
-
export const NILE_ELEMENTS_VERSION = '1.
|
|
2
|
+
export const NILE_ELEMENTS_VERSION = '1.9.0';
|
|
3
3
|
export const NILE_VERSION = '1.2.7';
|
|
4
4
|
// Set global versions for runtime access
|
|
5
5
|
if (typeof window !== 'undefined') {
|
package/dist/src/version.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.js","sourceRoot":"","sources":["../../src/version.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,MAAM,CAAC,MAAM,qBAAqB,GAAG,2BAA2B,CAAC;AACjE,MAAM,CAAC,MAAM,YAAY,GAAG,kBAAkB,CAAC;AAE/C,yCAAyC;AACzC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;IACjC,MAAc,CAAC,mBAAmB,GAAG,qBAAqB,CAAC;IAC3D,MAAc,CAAC,WAAW,GAAG,YAAY,CAAC;IAC3C,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,IAAI,EAAE,GAAG,EAAE,EAAE,QAAQ,EAAE,YAAY,EAAE,EAAE,CAAC;AACzE,CAAC","sourcesContent":["// Version utility - placeholders will be replaced during build\nexport const NILE_ELEMENTS_VERSION = '1.
|
|
1
|
+
{"version":3,"file":"version.js","sourceRoot":"","sources":["../../src/version.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,MAAM,CAAC,MAAM,qBAAqB,GAAG,2BAA2B,CAAC;AACjE,MAAM,CAAC,MAAM,YAAY,GAAG,kBAAkB,CAAC;AAE/C,yCAAyC;AACzC,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;IACjC,MAAc,CAAC,mBAAmB,GAAG,qBAAqB,CAAC;IAC3D,MAAc,CAAC,WAAW,GAAG,YAAY,CAAC;IAC3C,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,IAAI,EAAE,GAAG,EAAE,EAAE,QAAQ,EAAE,YAAY,EAAE,EAAE,CAAC;AACzE,CAAC","sourcesContent":["// Version utility - placeholders will be replaced during build\nexport const NILE_ELEMENTS_VERSION = '1.9.0';\nexport const NILE_VERSION = '1.2.7';\n\n// Set global versions for runtime access\nif (typeof window !== 'undefined') {\n (window as any).nileElementsVersion = NILE_ELEMENTS_VERSION;\n (window as any).nileVersion = NILE_VERSION;\n window.process = window.process || { env: { NODE_ENV: 'production' } };\n}\n"]}
|