npm - @aquera/nile-elements - Versions diffs - 1.0.1-beta-1.9 → 1.1.0-beta-1.0 - Mend

@aquera/nile-elements 1.0.1-beta-1.9 → 1.1.0-beta-1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1895) hide show

package/dist/nile-pagination/nile-pagination.css.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-System.register(["lit"],function(_export,_context){"use strict";var a,_templateObject,n;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){a=_lit.css;}],execute:function execute(){_export("s",n=a(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n  }\n\n  .pagination-wrapper {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: var(--nile-spacing-spacing-md, var(--ng-spacing-md)) var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) ;\n  }\n\n \n  .pagination-wrapper.v2 .pager-container {\n    flex-direction: row;\n    align-items: center;\n    gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n    margin-right: var(--nile-spacing-spacing-xl, var(--ng-spacing-xl)); \n  }\n\n  .pagination-wrapper.v2 .range-text {\n    margin-right: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n    font-size: var(--nile-font-size-small, var(--ng-font-size-text-sm));\n    color: var(--nile-colors-dark-900, var( --ng-colors-text-primary-900));\n    font-feature-settings: 'liga' off, 'clig' off;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));\n  }\n\n \n  .pagination-wrapper.compact {\n    min-width: 324px;\n    justify-content: space-between;\n  }\n\n\n\n.pagination-wrapper.compact .range-text {\n  margin-right: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n  white-space: nowrap;\n}\n\n\n.pagination-wrapper.compact .pager-container {\n  gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n}\n\n\n  .pagination-wrapper.compact .pager-container {\n    display: flex;\n    align-items: center;\n    gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n  }\n\n  .pagination-wrapper.compact .page-size-dropdown ::part(base) {\n    min-width: 32px;\n    height: 32px;\n    padding: 0 6px;\n  }\n\n  .pagination-wrapper.compact .page-size-dropdown .chevron {\n    transition: transform 0.2s;\n  }\n  .pagination-wrapper.compact .page-size-dropdown .open .chevron {\n    transform: rotate(180deg);\n  }\n\n  .pagination-wrapper.compact ul.pagination:not(.compact-pagination) {\n    display: none;\n  }\n\n  .compact-pagination {\n    display: flex;\n    align-items: center;\n    gap: var(--nile-spacing-spacing-xs, var(--ng-spacing-xs));\n    list-style: none;\n    margin: 0;\n    padding: 0;\n  }\n  .page-dropdown .current-page-btn {\n    padding: 2px;\n    font-size: var(--nile-font-size-small, var(--ng-font-weight-regular));\n  }\n\n  nile-button.current-page-btn::part(base){\n    min-width: 51px;\n  }\n\n  nile-button.current-page-btn::part(base):active {\n  min-width: 51px;\n}\n\n  .pager-container {\n    display: flex;\n    align-items: center;\n    gap: var(--nile-spacing-spacing-3xl, var(--ng-spacing-3xl));\n  }\n\n.pagination-wrapper.compact .pager-container {\n  gap: var(--nile-spacing-xxs, var(--ng-spacing-xxs)) !important;\n}\n\n  .range-text {\n    font-size: var(--nile-font-size-small,  var(--ng-font-weight-regular));\n    color: var(--nile-colors-dark-900,var( --ng-colors-text-primary-900) );\n    white-space: nowrap;\n  }\n\n  .page-size-select {\n    display: inline-flex;\n    align-items: center;\n  }\n\n  ul.pagination {\n    display: flex;\n    list-style: none;\n    padding: var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n    margin: var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n    gap: var(--nile-radius-radius-xxs, var(--ng-radius-xxs));\n  }\n\n  ul.pagination li {\n    margin: var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n  }\n\n  .ellipsis-scroll-wrapper {\n    max-height: 194px;\n    overflow-y: auto;\n    width: 66px;\n  }\n    .down-scroll-wrapper {\n    max-height: 150px;\n    overflow-y: auto;\n    width: 60px;\n  }\n\n\n    .compact-scroll-wrapper {\n    max-height: 160px;\n    overflow-y: auto;\n    width: 60px;\n  }\n  .compact-dropdown nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n  \n    .page-size-dropdown nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n\n      .compact-scroll-wrapper1 {\n    max-height: 164px;\n    overflow-y: auto;\n    width: 60px;\n  }\n\n  .compact-dropdown1 nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n  \n    .compact-dropdown1 nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n\n\n  .ellipsis-dropdown nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n\n  .page-size-menu {\n    max-height: 144px;\n    overflow-y: auto;\n  }\n\n.pagination-wrapper.fluid ul.pagination li:first-child {\n  margin-right: var(--nile-spacing-spacing-xs, var(--ng-spacing-xs));\n}\n.pagination-wrapper.fluid ul.pagination li:last-child {\n  margin-left: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n}\n\n\n  .page-size-label {\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));\n    color: var(--nile-colors-dark-500, var(--ng-colors-text-primary-500));\n    margin-left: var(--nile-spacing-spacing-md, var(--ng-spacing-md));\n    font-feature-settings: 'liga' off, 'clig' off;\n    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular)); \n  }\n\n  nile-button::part(base) {\n    min-width: 32px;\n    height: 32px;\n    padding: 0px 6px;\n    box-shadow: none;\n  }\n  \n   nile-button.down::part(base) {\n    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n  }\n\n  nile-button.down::part(base):active {\n    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n  }\n\n\n  nile-button.current-page-btn::part(base) {\n    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary)); \n  }\n\n  nile-button.current-page-btn::part(base):active {\n    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n  }\n  \n  nile-button::part(base):active {\n    min-width: 32px;\n    height: 32px;\n    padding: 0px 6px;\n    box-shadow: none;\n    border: none;\n  }\n\n  nile-button.down::part(base) {\n    min-width: 62px;\n  }\n\n  nile-button.compactbtn:part(base){\n    background-color: red;\n  }\n  .page-size-dropdown .chevron {\n    transition: transform 0.2s;\n  }\n  .page-size-dropdown .open .chevron {\n    transform: rotate(180deg);\n  }\n \n  .pagination-wrapper.compact .compact-dropdown .chevron,\n  .pagination-wrapper.compact .compact-dropdown1 .chevron {\n    transition: transform 0.2s;\n  }\n  .pagination-wrapper.compact .compact-dropdown .down.open .chevron,\n  .pagination-wrapper.compact .compact-dropdown1 .current-page-btn.open .chevron {\n    transform: rotate(180deg);\n  }\n\n  .prev-button::part(base) {\n    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n  }\n\n  .next-button::part(base) {\n    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n  }\n\n"]))));}};});
+System.register(["lit"],function(_export,_context){"use strict";var a,_templateObject,n;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){a=_lit.css;}],execute:function execute(){_export("s",n=a(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n  }\n\n  .pagination-wrapper {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: var(--nile-spacing-spacing-md) var(--nile-spacing-spacing-lg) ;\n  }\n\n \n  .pagination-wrapper.v2 .pager-container {\n    flex-direction: row;\n    align-items: center;\n    gap: var(--nile-spacing-spacing-md);\n    margin-right: var(--nile-spacing-spacing-xl);\n  }\n\n  .pagination-wrapper.v2 .range-text {\n    margin-right: var(--nile-spacing-spacing-md);\n    font-size: var(--nile-font-size-small);\n    color: var(--nile-colors-dark-900);\n    font-feature-settings: 'liga' off, 'clig' off;\n    font-weight: var(--nile-font-weight-regular);\n  }\n\n \n  .pagination-wrapper.compact {\n    min-width: 324px;\n    justify-content: space-between;\n  }\n\n\n\n.pagination-wrapper.compact .range-text {\n  margin-right: var(--nile-spacing-spacing-md);\n  white-space: nowrap;\n}\n\n\n.pagination-wrapper.compact .pager-container {\n  gap: var(--nile-spacing-spacing-md);\n}\n\n\n  .pagination-wrapper.compact .pager-container {\n    display: flex;\n    align-items: center;\n    gap: var(--nile-spacing-spacing-md);\n  }\n\n  .pagination-wrapper.compact .page-size-dropdown ::part(base) {\n    min-width: 32px;\n    height: 32px;\n    padding: 0 6px;\n  }\n\n  .pagination-wrapper.compact .page-size-dropdown .chevron {\n    transition: transform 0.2s;\n  }\n  .pagination-wrapper.compact .page-size-dropdown .open .chevron {\n    transform: rotate(180deg);\n  }\n\n  .pagination-wrapper.compact ul.pagination:not(.compact-pagination) {\n    display: none;\n  }\n\n  .compact-pagination {\n    display: flex;\n    align-items: center;\n    gap: var(--nile-spacing-spacing-xs);\n    list-style: none;\n    margin: 0;\n    padding: 0;\n  }\n  .page-dropdown .current-page-btn {\n    padding: 2px;\n    font-size: var(--nile-font-size-small);\n  }\n\n  nile-button.current-page-btn::part(base){\n    min-width: 51px;\n  }\n\n  nile-button.current-page-btn::part(base):active {\n  min-width: 51px;\n}\n\n  .pager-container {\n    display: flex;\n    align-items: center;\n    gap: var(--nile-spacing-spacing-3xl);\n  }\n\n.pagination-wrapper.compact .pager-container {\n  gap: var(--nile-spacing-xxs) !important;\n}\n\n  .range-text {\n    font-size: var(--nile-font-size-small);\n    color: var(--nile-colors-dark-900);\n    white-space: nowrap;\n  }\n\n  .page-size-select {\n    display: inline-flex;\n    align-items: center;\n  }\n\n  ul.pagination {\n    display: flex;\n    list-style: none;\n    padding: var(--nile-spacing-spacing-none);\n    margin: var(--nile-spacing-spacing-none);\n    gap: var(--nile-radius-radius-xxs);\n  }\n\n  ul.pagination li {\n    margin: var(--nile-spacing-spacing-none);\n  }\n\n  .ellipsis-scroll-wrapper {\n    max-height: 194px;\n    overflow-y: auto;\n    width: 66px;\n  }\n    .down-scroll-wrapper {\n    max-height: 150px;\n    overflow-y: auto;\n    width: 60px;\n  }\n\n\n    .compact-scroll-wrapper {\n    max-height: 160px;\n    overflow-y: auto;\n    width: 60px;\n  }\n  .compact-dropdown nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n  \n    .page-size-dropdown nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n\n      .compact-scroll-wrapper1 {\n    max-height: 164px;\n    overflow-y: auto;\n    width: 60px;\n  }\n\n  .compact-dropdown1 nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n  \n    .compact-dropdown1 nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n\n\n  .ellipsis-dropdown nile-menu {\n    overflow-y: auto;\n    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n    box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n  }\n\n  .page-size-menu {\n    max-height: 144px;\n    overflow-y: auto;\n  }\n\n.pagination-wrapper.fluid ul.pagination li:first-child {\n  margin-right: var(--nile-spacing-spacing-xs);\n}\n.pagination-wrapper.fluid ul.pagination li:last-child {\n  margin-left: var(--nile-spacing-spacing-md);\n}\n\n\n  .page-size-label {\n    font-size: var(--nile-type-scale-3);\n    color: var(--nile-colors-dark-500);\n    margin-left: var(--nile-spacing-spacing-md);\n    font-feature-settings: 'liga' off, 'clig' off;\n    font-weight: var(--nile-font-weight-regular); \n  }\n\n  nile-button::part(base) {\n    min-width: 32px;\n    height: 32px;\n    padding: 0px 6px;\n    box-shadow: none;\n  }\n\n  nile-button::part(base):active {\n    min-width: 32px;\n    height: 32px;\n    padding: 0px 6px;\n    box-shadow: none;\n    border: none;\n  }\n\n  nile-button.down::part(base) {\n    min-width: 62px;\n  }\n\n  nile-button.compactbtn:part(base){\n    background-color: red;\n  }\n  .page-size-dropdown .chevron {\n    transition: transform 0.2s;\n  }\n  .page-size-dropdown .open .chevron {\n    transform: rotate(180deg);\n  }\n \n  .pagination-wrapper.compact .compact-dropdown .chevron,\n  .pagination-wrapper.compact .compact-dropdown1 .chevron {\n    transition: transform 0.2s;\n  }\n  .pagination-wrapper.compact .compact-dropdown .down.open .chevron,\n  .pagination-wrapper.compact .compact-dropdown1 .current-page-btn.open .chevron {\n    transform: rotate(180deg);\n  }\n\n\n"]))));}};});
 //# sourceMappingURL=nile-pagination.css.cjs.js.map

package/dist/nile-pagination/nile-pagination.css.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-pagination.css.cjs.js","sources":["../../../src/nile-pagination/nile-pagination.css.ts"],"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\n/\n Pagination CSS\n */\nexport const styles = css`\n :host {\n }\n\n .pagination-wrapper {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: var(--nile-spacing-spacing-md~~, var(--ng-spacing-md~~)) var(--nile-spacing-spacing-lg~~, var(--ng-spacing-lg~~)) ;\n }\n\n \n .pagination-wrapper.v2 .pager-container {\n flex-direction: row;\n align-items: center;\n gap: var(--nile-spacing-spacing-md~~, var(--ng-spacing-md~~));\n margin-right: var(--nile-spacing-spacing-xl~~, var(--ng-spacing-xl~~)~~); \~~n }\n\n .pagination-wrapper.v2 .range-text {\n margin-right: var(--nile-spacing-spacing-md~~, var(--ng-spacing-md~~));\n font-size: var(--nile-font-size-small~~, var(--ng-font-size-text-sm~~));\n color: var(--nile-colors-dark-900~~, var( --ng-colors-text-primary-900~~));\n font-feature-settings: 'liga' off, 'clig' off;\n font-weight: var(--nile-font-weight-regular~~, var(--ng-font-weight-regular~~));\n }\n\n \n .pagination-wrapper.compact {\n min-width: 324px;\n justify-content: space-between;\n }\n\n\n\n.pagination-wrapper.compact .range-text {\n margin-right: var(--nile-spacing-spacing-md~~, var(--ng-spacing-md~~));\n white-space: nowrap;\n}\n\n\n.pagination-wrapper.compact .pager-container {\n gap: var(--nile-spacing-spacing-md~~, var(--ng-spacing-md~~));\n}\n\n\n .pagination-wrapper.compact .pager-container {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-md~~, var(--ng-spacing-md~~));\n }\n\n .pagination-wrapper.compact .page-size-dropdown ::part(base) {\n min-width: 32px;\n height: 32px;\n padding: 0 6px;\n }\n\n .pagination-wrapper.compact .page-size-dropdown .chevron {\n transition: transform 0.2s;\n }\n .pagination-wrapper.compact .page-size-dropdown .open .chevron {\n transform: rotate(180deg);\n }\n\n .pagination-wrapper.compact ul.pagination:not(.compact-pagination) {\n display: none;\n }\n\n .compact-pagination {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-xs~~, var(--ng-spacing-xs~~));\n list-style: none;\n margin: 0;\n padding: 0;\n }\n .page-dropdown .current-page-btn {\n padding: 2px;\n font-size: var(--nile-font-size-small~~, var(--ng-font-weight-regular~~));\n }\n\n nile-button.current-page-btn::part(base){\n min-width: 51px;\n }\n\n nile-button.current-page-btn::part(base):active {\n min-width: 51px;\n}\n\n .pager-container {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-3xl~~, var(--ng-spacing-3xl~~));\n }\n\n.pagination-wrapper.compact .pager-container {\n gap: var(--nile-spacing-xxs~~, var(--ng-spacing-xxs~~)) !important;\n}\n\n .range-text {\n font-size: var(--nile-font-size-small~~, var(--ng-font-weight-regular~~));\n color: var(--nile-colors-dark-900~~,var( --ng-colors-text-primary-900~~) );\n white-space: nowrap;\n }\n\n .page-size-select {\n display: inline-flex;\n align-items: center;\n }\n\n ul.pagination {\n display: flex;\n list-style: none;\n padding: var(--nile-spacing-spacing-none~~, var(--ng-spacing-none~~));\n margin: var(--nile-spacing-spacing-none~~, var(--ng-spacing-none~~));\n gap: var(--nile-radius-radius-xxs~~, var(--ng-radius-xxs~~));\n }\n\n ul.pagination li {\n margin: var(--nile-spacing-spacing-none~~, var(--ng-spacing-none~~));\n }\n\n .ellipsis-scroll-wrapper {\n max-height: 194px;\n overflow-y: auto;\n width: 66px;\n }\n .down-scroll-wrapper {\n max-height: 150px;\n overflow-y: auto;\n width: 60px;\n }\n\n\n .compact-scroll-wrapper {\n max-height: 160px;\n overflow-y: auto;\n width: 60px;\n }\n .compact-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg~~, var(--ng-spacing-lg~~)) var(--nile-spacing-spacing-none~~, var(--ng-spacing-none~~));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n \n .page-size-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg~~, var(--ng-spacing-lg~~)) var(--nile-spacing-spacing-none~~, var(--ng-spacing-none~~));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n .compact-scroll-wrapper1 {\n max-height: 164px;\n overflow-y: auto;\n width: 60px;\n }\n\n .compact-dropdown1 nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg~~, var(--ng-spacing-lg~~)) var(--nile-spacing-spacing-none~~, var(--ng-spacing-none~~));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n \n .compact-dropdown1 nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg~~, var(--ng-spacing-lg~~)) var(--nile-spacing-spacing-none~~, var(--ng-spacing-none~~));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n\n .ellipsis-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg~~, var(--ng-spacing-lg~~)) var(--nile-spacing-spacing-none~~, var(--ng-spacing-none~~));\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n .page-size-menu {\n max-height: 144px;\n overflow-y: auto;\n }\n\n.pagination-wrapper.fluid ul.pagination li:first-child {\n margin-right: var(--nile-spacing-spacing-xs~~, var(--ng-spacing-xs~~));\n}\n.pagination-wrapper.fluid ul.pagination li:last-child {\n margin-left: var(--nile-spacing-spacing-md~~, var(--ng-spacing-md~~));\n}\n\n\n .page-size-label {\n font-size: var(--nile-type-scale-3~~, var(--ng-font-size-text-sm~~));\n color: var(--nile-colors-dark-500~~, var(--ng-colors-text-primary-500~~));\n margin-left: var(--nile-spacing-spacing-md~~, var(--ng-spacing-md~~));\n font-feature-settings: 'liga' off, 'clig' off;\n font-weight: var(--nile-font-weight-regular~~, var(--ng-font-weight-regular~~)); \n }\n\n nile-button::part(base) {\n min-width: 32px;\n height: 32px;\n padding: 0px 6px;\n box-shadow: none;\n }\n \n ~~nile-button.down::part(base) {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n~~ ~~}\n\n~~ nile-button~~.down~~::part(base):active {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n\n\n nile-button.current-page-btn::part(base) {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary)); \n }\n\n nile-button.current-page-btn::part(base):active {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n \n nile-button::part(base):active {\n min-width: 32px;\n height: 32px;\n padding: 0px 6px;\n box-shadow: none;\n border: none;\n }\n\n nile-button.down::part(base) {\n min-width: 62px;\n }\n\n nile-button.compactbtn:part(base){\n background-color: red;\n }\n .page-size-dropdown .chevron {\n transition: transform 0.2s;\n }\n .page-size-dropdown .open .chevron {\n transform: rotate(180deg);\n }\n \n .pagination-wrapper.compact .compact-dropdown .chevron,\n .pagination-wrapper.compact .compact-dropdown1 .chevron {\n transition: transform 0.2s;\n }\n .pagination-wrapper.compact .compact-dropdown .down.open .chevron,\n .pagination-wrapper.compact .compact-dropdown1 .current-page-btn.open .chevron {\n transform: rotate(180deg);\n }\n\n ~~.prev-button::part(base) {~~\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n\n .next-button::part(base) {\n border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));\n }\n\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
1	+ {"version":3,"file":"nile-pagination.css.cjs.js","sources":["../../../src/nile-pagination/nile-pagination.css.ts"],"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\n/\n Pagination CSS\n */\nexport const styles = css`\n :host {\n }\n\n .pagination-wrapper {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: var(--nile-spacing-spacing-md) var(--nile-spacing-spacing-lg) ;\n }\n\n \n .pagination-wrapper.v2 .pager-container {\n flex-direction: row;\n align-items: center;\n gap: var(--nile-spacing-spacing-md);\n margin-right: var(--nile-spacing-spacing-xl);\n }\n\n .pagination-wrapper.v2 .range-text {\n margin-right: var(--nile-spacing-spacing-md);\n font-size: var(--nile-font-size-small);\n color: var(--nile-colors-dark-900);\n font-feature-settings: 'liga' off, 'clig' off;\n font-weight: var(--nile-font-weight-regular);\n }\n\n \n .pagination-wrapper.compact {\n min-width: 324px;\n justify-content: space-between;\n }\n\n\n\n.pagination-wrapper.compact .range-text {\n margin-right: var(--nile-spacing-spacing-md);\n white-space: nowrap;\n}\n\n\n.pagination-wrapper.compact .pager-container {\n gap: var(--nile-spacing-spacing-md);\n}\n\n\n .pagination-wrapper.compact .pager-container {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-md);\n }\n\n .pagination-wrapper.compact .page-size-dropdown ::part(base) {\n min-width: 32px;\n height: 32px;\n padding: 0 6px;\n }\n\n .pagination-wrapper.compact .page-size-dropdown .chevron {\n transition: transform 0.2s;\n }\n .pagination-wrapper.compact .page-size-dropdown .open .chevron {\n transform: rotate(180deg);\n }\n\n .pagination-wrapper.compact ul.pagination:not(.compact-pagination) {\n display: none;\n }\n\n .compact-pagination {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-xs);\n list-style: none;\n margin: 0;\n padding: 0;\n }\n .page-dropdown .current-page-btn {\n padding: 2px;\n font-size: var(--nile-font-size-small);\n }\n\n nile-button.current-page-btn::part(base){\n min-width: 51px;\n }\n\n nile-button.current-page-btn::part(base):active {\n min-width: 51px;\n}\n\n .pager-container {\n display: flex;\n align-items: center;\n gap: var(--nile-spacing-spacing-3xl);\n }\n\n.pagination-wrapper.compact .pager-container {\n gap: var(--nile-spacing-xxs) !important;\n}\n\n .range-text {\n font-size: var(--nile-font-size-small);\n color: var(--nile-colors-dark-900);\n white-space: nowrap;\n }\n\n .page-size-select {\n display: inline-flex;\n align-items: center;\n }\n\n ul.pagination {\n display: flex;\n list-style: none;\n padding: var(--nile-spacing-spacing-none);\n margin: var(--nile-spacing-spacing-none);\n gap: var(--nile-radius-radius-xxs);\n }\n\n ul.pagination li {\n margin: var(--nile-spacing-spacing-none);\n }\n\n .ellipsis-scroll-wrapper {\n max-height: 194px;\n overflow-y: auto;\n width: 66px;\n }\n .down-scroll-wrapper {\n max-height: 150px;\n overflow-y: auto;\n width: 60px;\n }\n\n\n .compact-scroll-wrapper {\n max-height: 160px;\n overflow-y: auto;\n width: 60px;\n }\n .compact-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n \n .page-size-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n .compact-scroll-wrapper1 {\n max-height: 164px;\n overflow-y: auto;\n width: 60px;\n }\n\n .compact-dropdown1 nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n \n .compact-dropdown1 nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n\n .ellipsis-dropdown nile-menu {\n overflow-y: auto;\n padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);\n box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);\n }\n\n .page-size-menu {\n max-height: 144px;\n overflow-y: auto;\n }\n\n.pagination-wrapper.fluid ul.pagination li:first-child {\n margin-right: var(--nile-spacing-spacing-xs);\n}\n.pagination-wrapper.fluid ul.pagination li:last-child {\n margin-left: var(--nile-spacing-spacing-md);\n}\n\n\n .page-size-label {\n font-size: var(--nile-type-scale-3);\n color: var(--nile-colors-dark-500);\n margin-left: var(--nile-spacing-spacing-md);\n font-feature-settings: 'liga' off, 'clig' off;\n font-weight: var(--nile-font-weight-regular); \n }\n\n nile-button::part(base) {\n min-width: 32px;\n height: 32px;\n padding: 0px 6px;\n box-shadow: none;\n }\n\n nile-button::part(base):active {\n min-width: 32px;\n height: 32px;\n padding: 0px 6px;\n box-shadow: none;\n border: none;\n }\n\n nile-button.down::part(base) {\n min-width: 62px;\n }\n\n nile-button.compactbtn:part(base){\n background-color: red;\n }\n .page-size-dropdown .chevron {\n transition: transform 0.2s;\n }\n .page-size-dropdown .open .chevron {\n transform: rotate(180deg);\n }\n \n .pagination-wrapper.compact .compact-dropdown .chevron,\n .pagination-wrapper.compact .compact-dropdown1 .chevron {\n transition: transform 0.2s;\n }\n .pagination-wrapper.compact .compact-dropdown .down.open .chevron,\n .pagination-wrapper.compact .compact-dropdown1 .current-page-btn.open .chevron {\n transform: rotate(180deg);\n }\n\n\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}

package/dist/nile-pagination/nile-pagination.css.esm.js CHANGED Viewed

@@ -6,23 +6,23 @@ import{css as a}from"lit";const n=a`
     display: flex;
     align-items: center;
     justify-content: space-between;
-    padding: var(--nile-spacing-spacing-md, var(--ng-spacing-md)) var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) ;
+    padding: var(--nile-spacing-spacing-md) var(--nile-spacing-spacing-lg) ;
   }
   .pagination-wrapper.v2 .pager-container {
     flex-direction: row;
     align-items: center;
-    gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));
-    margin-right: var(--nile-spacing-spacing-xl, var(--ng-spacing-xl));
+    gap: var(--nile-spacing-spacing-md);
+    margin-right: var(--nile-spacing-spacing-xl);
   }
   .pagination-wrapper.v2 .range-text {
-    margin-right: var(--nile-spacing-spacing-md, var(--ng-spacing-md));
-    font-size: var(--nile-font-size-small, var(--ng-font-size-text-sm));
-    color: var(--nile-colors-dark-900, var( --ng-colors-text-primary-900));
+    margin-right: var(--nile-spacing-spacing-md);
+    font-size: var(--nile-font-size-small);
+    color: var(--nile-colors-dark-900);
     font-feature-settings: 'liga' off, 'clig' off;
-    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));
+    font-weight: var(--nile-font-weight-regular);
   }
@@ -34,20 +34,20 @@ import{css as a}from"lit";const n=a`
 .pagination-wrapper.compact .range-text {
-  margin-right: var(--nile-spacing-spacing-md, var(--ng-spacing-md));
+  margin-right: var(--nile-spacing-spacing-md);
   white-space: nowrap;
 }
 .pagination-wrapper.compact .pager-container {
-  gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));
+  gap: var(--nile-spacing-spacing-md);
 }
   .pagination-wrapper.compact .pager-container {
     display: flex;
     align-items: center;
-    gap: var(--nile-spacing-spacing-md, var(--ng-spacing-md));
+    gap: var(--nile-spacing-spacing-md);
   }
   .pagination-wrapper.compact .page-size-dropdown ::part(base) {
@@ -70,14 +70,14 @@ import{css as a}from"lit";const n=a`
   .compact-pagination {
     display: flex;
     align-items: center;
-    gap: var(--nile-spacing-spacing-xs, var(--ng-spacing-xs));
+    gap: var(--nile-spacing-spacing-xs);
     list-style: none;
     margin: 0;
     padding: 0;
   }
   .page-dropdown .current-page-btn {
     padding: 2px;
-    font-size: var(--nile-font-size-small, var(--ng-font-weight-regular));
+    font-size: var(--nile-font-size-small);
   }
   nile-button.current-page-btn::part(base){
@@ -91,16 +91,16 @@ import{css as a}from"lit";const n=a`
   .pager-container {
     display: flex;
     align-items: center;
-    gap: var(--nile-spacing-spacing-3xl, var(--ng-spacing-3xl));
+    gap: var(--nile-spacing-spacing-3xl);
   }
 .pagination-wrapper.compact .pager-container {
-  gap: var(--nile-spacing-xxs, var(--ng-spacing-xxs)) !important;
+  gap: var(--nile-spacing-xxs) !important;
 }
   .range-text {
-    font-size: var(--nile-font-size-small,  var(--ng-font-weight-regular));
-    color: var(--nile-colors-dark-900,var( --ng-colors-text-primary-900) );
+    font-size: var(--nile-font-size-small);
+    color: var(--nile-colors-dark-900);
     white-space: nowrap;
   }
@@ -112,13 +112,13 @@ import{css as a}from"lit";const n=a`
   ul.pagination {
     display: flex;
     list-style: none;
-    padding: var(--nile-spacing-spacing-none, var(--ng-spacing-none));
-    margin: var(--nile-spacing-spacing-none, var(--ng-spacing-none));
-    gap: var(--nile-radius-radius-xxs, var(--ng-radius-xxs));
+    padding: var(--nile-spacing-spacing-none);
+    margin: var(--nile-spacing-spacing-none);
+    gap: var(--nile-radius-radius-xxs);
   }
   ul.pagination li {
-    margin: var(--nile-spacing-spacing-none, var(--ng-spacing-none));
+    margin: var(--nile-spacing-spacing-none);
   }
   .ellipsis-scroll-wrapper {
@@ -140,13 +140,13 @@ import{css as a}from"lit";const n=a`
   }
   .compact-dropdown nile-menu {
     overflow-y: auto;
-    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));
+    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);
     box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
   }
     .page-size-dropdown nile-menu {
     overflow-y: auto;
-    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));
+    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);
     box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
   }
@@ -158,20 +158,20 @@ import{css as a}from"lit";const n=a`
   .compact-dropdown1 nile-menu {
     overflow-y: auto;
-    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));
+    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);
     box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
   }
     .compact-dropdown1 nile-menu {
     overflow-y: auto;
-    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));
+    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);
     box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
   }
   .ellipsis-dropdown nile-menu {
     overflow-y: auto;
-    padding: var(--nile-spacing-spacing-lg, var(--ng-spacing-lg)) var(--nile-spacing-spacing-none, var(--ng-spacing-none));
+    padding: var(--nile-spacing-spacing-lg) var(--nile-spacing-spacing-none);
     box-shadow: 0px 4px 8px 0px rgba(119, 125, 130, 0.15);
   }
@@ -181,19 +181,19 @@ import{css as a}from"lit";const n=a`
   }
 .pagination-wrapper.fluid ul.pagination li:first-child {
-  margin-right: var(--nile-spacing-spacing-xs, var(--ng-spacing-xs));
+  margin-right: var(--nile-spacing-spacing-xs);
 }
 .pagination-wrapper.fluid ul.pagination li:last-child {
-  margin-left: var(--nile-spacing-spacing-md, var(--ng-spacing-md));
+  margin-left: var(--nile-spacing-spacing-md);
 }
   .page-size-label {
-    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm));
-    color: var(--nile-colors-dark-500, var(--ng-colors-text-primary-500));
-    margin-left: var(--nile-spacing-spacing-md, var(--ng-spacing-md));
+    font-size: var(--nile-type-scale-3);
+    color: var(--nile-colors-dark-500);
+    margin-left: var(--nile-spacing-spacing-md);
     font-feature-settings: 'liga' off, 'clig' off;
-    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-regular));
+    font-weight: var(--nile-font-weight-regular);
   }
   nile-button::part(base) {
@@ -202,24 +202,7 @@ import{css as a}from"lit";const n=a`
     padding: 0px 6px;
     box-shadow: none;
   }
-   nile-button.down::part(base) {
-    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));
-  }
-  nile-button.down::part(base):active {
-    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));
-  }
-  nile-button.current-page-btn::part(base) {
-    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));
-  }
-  nile-button.current-page-btn::part(base):active {
-    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));
-  }
   nile-button::part(base):active {
     min-width: 32px;
     height: 32px;
@@ -251,12 +234,5 @@ import{css as a}from"lit";const n=a`
     transform: rotate(180deg);
   }
-  .prev-button::part(base) {
-    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));
-  }
-  .next-button::part(base) {
-    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-primary));
-  }
 `;export{n as s};

package/dist/nile-pagination/nile-pagination.esm.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import{__decorate as i}from"tslib";import{html as e}from"lit";import{property as t,state as n,query as s,customElement as r}from"lit/decorators.js";import{s as a}from"./nile-pagination.css.esm.js";import{N as o}from"../internal/nile-element.esm.js";import{c as l,g as h,a as d,b as c}from"./nile-pagination-utils.esm.js";let p=class extends o{constructor(){super(...arguments),this.totalItems=0,this.currentPage=1,this.pageSize=50,this.pageSizeOptions=[10,25,50,100],this.variant="fluid",this.disabled=!1,this.showTitle=!0,this._pageSizeOpen=!1,this._pageOpen=!1}static get styles(){return[a]}firstUpdated(){this._pageSizeDropdown&&(this._pageSizeDropdown.addEventListener("nile-show",(()=>{this._pageSizeOpen=!0})),this._pageSizeDropdown.addEventListener("nile-after-hide",(()=>{this._pageSizeOpen=!1})))}get totalPages(){return Math.max(1,l(this.totalItems,this.pageSize))}goToPage(i){if(this.disabled)return;const e=this.currentPage;this.currentPage=i,this.emit("nile-change",{page:i,previousPage:e,pageSize:this.pageSize})}onPageSizeSelect(i){if(this.disabled||this.pageSize===i)return;const e=this.currentPage;this.pageSize=i,this.currentPage=1,this.emit("nile-change",{page:1,previousPage:e,pageSize:i})}renderCompactRangeText(){const i=h(this.totalItems,this.pageSize,this.currentPage).replace(/^Showing\s*/,"");return e`<div class="range-text">${i}</div>`}renderRangeText(){return 0===this.totalItems?e`<div class="range-text">Showing 0 of 0</div>`:e`
+import{__decorate as i}from"tslib";import{html as e}from"lit";import{property as t,state as n,query as s,customElement as r}from"lit/decorators.js";import{s as a}from"./nile-pagination.css.esm.js";import{N as l}from"../internal/nile-element.esm.js";import{c as o,g as h,a as d,b as c}from"./nile-pagination-utils.esm.js";let p=class extends l{constructor(){super(...arguments),this.totalItems=0,this.currentPage=1,this.pageSize=50,this.pageSizeOptions=[10,25,50,100],this.variant="fluid",this.disabled=!1,this.showTitle=!0,this._pageSizeOpen=!1,this._pageOpen=!1}static get styles(){return[a]}firstUpdated(){this._pageSizeDropdown&&(this._pageSizeDropdown.addEventListener("nile-show",(()=>{this._pageSizeOpen=!0})),this._pageSizeDropdown.addEventListener("nile-after-hide",(()=>{this._pageSizeOpen=!1})))}get totalPages(){return Math.max(1,o(this.totalItems,this.pageSize))}goToPage(i){if(this.disabled)return;const e=this.currentPage;this.currentPage=i,this.emit("nile-change",{page:i,previousPage:e,pageSize:this.pageSize})}onPageSizeSelect(i){if(this.disabled||this.pageSize===i)return;const e=this.currentPage;this.pageSize=i,this.currentPage=1,this.emit("nile-change",{page:1,previousPage:e,pageSize:i})}renderCompactRangeText(){const i=h(this.totalItems,this.pageSize,this.currentPage).replace(/^Showing\s*/,"");return e`<div class="range-text">${i}</div>`}renderRangeText(){return 0===this.totalItems?e`<div class="range-text">Showing 0 of 0</div>`:e`
       <div part="range-text" class="range-text">
         ${h(this.totalItems,this.pageSize,this.currentPage)}
       </div>
@@ -13,9 +13,9 @@ import{__decorate as i}from"tslib";import{html as e}from"lit";import{property as
           >
             ${this.pageSize}
             <nile-icon
-                 name="var(--nile-icon-chevron-down, var(--ng-icon-chevron-down))"
+              name="chevrondown"
               size="14"
-              method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))"
+              color="var(--nile-colors-dark-500)"
               class="chevron"
             ></nile-icon>
           </nile-button>
@@ -49,9 +49,9 @@ import{__decorate as i}from"tslib";import{html as e}from"lit";import{property as
         >
           ${this.pageSize}
           <nile-icon
-               name="var(--nile-icon-chevron-down, var(--ng-icon-chevron-down))"
+            name="chevrondown"
             size="14"
-            method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))"
+            color="var(--nile-colors-dark-500)"
             class="chevron"
           ></nile-icon>
         </nile-button>
@@ -74,9 +74,8 @@ import{__decorate as i}from"tslib";import{html as e}from"lit";import{property as
           variant="tertiary"
           ?disabled=${1===this.currentPage||this.disabled}
           @click=${()=>this.goToPage(this.currentPage-1)}
-          class="prev-button"
         >
-          <nile-icon name="var(--nile-icon-arrow-left, var(--ng-icon-chevron-left))" method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))" size="14"></nile-icon>
+          <nile-icon name="arrowleft" size="14"></nile-icon>
         </nile-button>
       </li>
     `}renderNextButton(){return e`
@@ -85,9 +84,8 @@ import{__decorate as i}from"tslib";import{html as e}from"lit";import{property as
           variant="tertiary"
           ?disabled=${this.currentPage===this.totalPages||this.disabled}
           @click=${()=>this.goToPage(this.currentPage+1)}
-          class="next-button"
         >
-          <nile-icon name="var(--nile-icon-arrow-right, var(--ng-icon-chevron-right))" method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))" size="14"></nile-icon>
+          <nile-icon name="arrowright" size="14"></nile-icon>
         </nile-button>
       </li>
     `}renderPageItem(i,t,n){return"…"===i?e`
@@ -139,9 +137,8 @@ import{__decorate as i}from"tslib";import{html as e}from"lit";import{property as
                 >
                   ${this.currentPage}
                   <nile-icon
-                    name="var(--nile-icon-chevron-down, var(--ng-icon-chevron-down))"
+                    name="chevrondown"
                     size="14"
-                    method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))"
                     class="chevron"
                   ></nile-icon>
                 </nile-button>

package/dist/nile-popover/nile-popover.css.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-System.register(["lit"],function(_export,_context){"use strict";var o,_templateObject,n;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){o=_lit.css;}],execute:function execute(){_export("s",n=o(_templateObject||(_templateObject=_taggedTemplateLiteral(["\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  .popover__title {\n    display: block;\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));\n    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));\n    font-size: var(--nile-type-scale-4, 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: var(--nile-spacing-one-by-five-x, var(--ng-spacing-none));\n  }\n\n  .popover__box {\n    display: flex;\n    flex-direction: column;\n    height: auto;\n    min-width: var(--nile-width-352px, var(--ng-width-80));\n    gap: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));\n    border-radius: var(--nile-radius-sm, var(--ng-radius-md));\n    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));\n    border: solid 1px var(--nile-colors-dark-200, var(--ng-colors-border-secondary-alt));\n    box-shadow: var(--nile-box-shadow-2, var(--ng-shadow-lg));\n  }\n\n  .popover__action {\n    align-self: end;\n    display: inline;\n  }\n\n  nile-popup {\n    --arrow-size: 18px;\n    --arrow-color: var(--nile-colors-white-base, var(--ng-colors-text-white));\n  }\n"]))));}};});
+System.register(["lit"],function(_export,_context){"use strict";var e,_templateObject,o;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){e=_lit.css;}],execute:function execute(){_export("s",o=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    box-sizing: 'border-box';\n  }\n\n  .popover__title {\n    display: block;\n    color: var(--nile-colors-dark-900);\n    font-family: var(--nile-font-family-serif);\n    font-size: var(--nile-type-scale-4);\n    font-style: normal;\n    font-weight: 500;\n    line-height: var(--nile-type-scale-4);\n    letter-spacing: 0.2px;\n  }\n\n  .popover__box {\n    display: flex;\n    flex-direction: column;\n    height: auto;\n    min-width: 352px;\n    gap: var(--nile-type-scale-4);\n    padding: var(--nile-type-scale-4);\n    border-radius: var(--nile-radius-base-standard);\n    background-color: var(--nile-colors-white-base);\n    border: solid 1px hsl(240 5.9% 90%);\n    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n      0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n  }\n\n  .popover__action {\n    align-self: end;\n    display: inline;\n  }\n\n  nile-popup {\n    --arrow-size: 18px;\n    --arrow-color: var(--nile-colors-white-base);\n  }\n"]))));}};});
 //# sourceMappingURL=nile-popover.css.cjs.js.map

package/dist/nile-popover/nile-popover.css.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-popover.css.cjs.js","sources":["../../../src/nile-popover/nile-popover.css.ts"],"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 Popover 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 .popover__title {\n display: block;\n color: var(--nile-colors-dark-900~~, var(--ng-colors-text-primary-900~~));\n font-family: var(--nile-font-family-serif~~, var(--ng-font-family-body~~));\n font-size: var(--nile-type-scale-4~~, 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: ~~var(--nile-spacing-one-by-five-x, var(--ng-spacing-none))~~;\n }\n\n .popover__box {\n display: flex;\n flex-direction: column;\n height: auto;\n min-width: ~~var(--nile-width-~~352px~~, var(--ng-width-80))~~;\n gap: var(--nile-~~spacing~~-~~xl, var(--ng~~-~~spacing-xl~~));\n padding: var(--nile-~~spacing~~-~~xl, var(--ng~~-~~spacing-xl~~));\n border-radius: var(--nile-radius-~~sm, var(--ng~~-~~radius-md~~));\n background-color: var(--nile-colors-white-base~~, var(--ng-colors-bg-primary~~));\n border: solid 1px ~~var~~(~~--nile-colors-dark-200,~~ ~~var(--ng-colors-border-secondary-alt~~));\n box-shadow: ~~var~~(~~--nile~~-~~box-shadow-2~~, ~~var(--ng-shadow-lg~~));\n }\n\n .popover__action {\n align-self: end;\n display: inline;\n }\n\n nile-popup {\n --arrow-size: 18px;\n --arrow-color: var(--nile-colors-white-base~~, var(--ng-colors-text-white~~));\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
1	+ {"version":3,"file":"nile-popover.css.cjs.js","sources":["../../../src/nile-popover/nile-popover.css.ts"],"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 Popover CSS\n */\nexport const styles = css`\n :host {\n box-sizing: 'border-box';\n }\n\n .popover__title {\n display: block;\n color: var(--nile-colors-dark-900);\n font-family: var(--nile-font-family-serif);\n font-size: var(--nile-type-scale-4);\n font-style: normal;\n font-weight: 500;\n line-height: var(--nile-type-scale-4);\n letter-spacing: 0.2px;\n }\n\n .popover__box {\n display: flex;\n flex-direction: column;\n height: auto;\n min-width: 352px;\n gap: var(--nile-type-scale-4);\n padding: var(--nile-type-scale-4);\n border-radius: var(--nile-radius-base-standard);\n background-color: var(--nile-colors-white-base);\n border: solid 1px hsl(240 5.9% 90%);\n box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n 0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n }\n\n .popover__action {\n align-self: end;\n display: inline;\n }\n\n nile-popup {\n --arrow-size: 18px;\n --arrow-color: var(--nile-colors-white-base);\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}

package/dist/nile-popover/nile-popover.css.esm.js CHANGED Viewed

@@ -1,33 +1,31 @@
-import{css as o}from"lit";const n=o`
+import{css as e}from"lit";const o=e`
   :host {
-    box-sizing: border-box;
-    -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));
+    box-sizing: 'border-box';
   }
   .popover__title {
     display: block;
-    color: var(--nile-colors-dark-900, var(--ng-colors-text-primary-900));
-    font-family: var(--nile-font-family-serif, var(--ng-font-family-body));
-    font-size: var(--nile-type-scale-4, var(--ng-font-size-text-sm));
+    color: var(--nile-colors-dark-900);
+    font-family: var(--nile-font-family-serif);
+    font-size: var(--nile-type-scale-4);
     font-style: normal;
-    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-semibold));
-    line-height: var(--nile-line-height-xsmall, var(--ng-line-height-text-sm));
-    letter-spacing: var(--nile-spacing-one-by-five-x, var(--ng-spacing-none));
+    font-weight: 500;
+    line-height: var(--nile-type-scale-4);
+    letter-spacing: 0.2px;
   }
   .popover__box {
     display: flex;
     flex-direction: column;
     height: auto;
-    min-width: var(--nile-width-352px, var(--ng-width-80));
-    gap: var(--nile-spacing-xl, var(--ng-spacing-xl));
-    padding: var(--nile-spacing-xl, var(--ng-spacing-xl));
-    border-radius: var(--nile-radius-sm, var(--ng-radius-md));
-    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
-    border: solid 1px var(--nile-colors-dark-200, var(--ng-colors-border-secondary-alt));
-    box-shadow: var(--nile-box-shadow-2, var(--ng-shadow-lg));
+    min-width: 352px;
+    gap: var(--nile-type-scale-4);
+    padding: var(--nile-type-scale-4);
+    border-radius: var(--nile-radius-base-standard);
+    background-color: var(--nile-colors-white-base);
+    border: solid 1px hsl(240 5.9% 90%);
+    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),
+      0px 8px 8px -4px rgba(16, 24, 40, 0.03);
   }
   .popover__action {
@@ -37,6 +35,6 @@ import{css as o}from"lit";const n=o`
   nile-popup {
     --arrow-size: 18px;
-    --arrow-color: var(--nile-colors-white-base, var(--ng-colors-text-white));
+    --arrow-color: var(--nile-colors-white-base);
   }
-`;export{n as s};
+`;export{o as s};

package/dist/nile-popup/nile-popup.css.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-System.register(["lit"],function(_export,_context){"use strict";var o,_templateObject,a;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){o=_lit.css;}],execute:function execute(){_export("s",a=o(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    --arrow-color: var(--nile-colors-dark-200);\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    --arrow-size: 6px;\n\n    /*\n     * These properties are computed to account for the arrow's dimensions after being rotated 45\xBA. The constant\n     * 0.7071 is derived from sin(45), which is the diagonal size of the arrow's container after rotating.\n     */\n    --arrow-size-diagonal: calc(var(--arrow-size) * 0.7071);\n    --arrow-padding-offset: calc(\n      var(--arrow-size-diagonal) - var(--arrow-size)\n    );\n\n    display: contents;\n  }\n\n  .popup {\n    position: absolute;\n    isolation: isolate;\n    max-width: var(--auto-size-available-width, none);\n    max-height: var(--auto-size-available-height, none);\n    z-index: 800;\n  }\n\n  .popup--fixed {\n    position: fixed;\n  }\n\n  .popup:not(.popup--active) {\n    display: none;\n  }\n\n  .popup__arrow {\n    position: absolute;\n    width: calc(var(--arrow-size-diagonal) * 2);\n    height: calc(var(--arrow-size-diagonal) * 2);\n    rotate: 45deg;\n    background: var(--arrow-color);\n    z-index: -1;\n    /* Added border and box-shadow to arrow */\n    border: solid 1px var(--nile-colors-dark-200);\n    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n      0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n  }\n"]))));}};});
+System.register(["lit"],function(_export,_context){"use strict";var o,_templateObject,a;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){o=_lit.css;}],execute:function execute(){_export("s",a=o(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    --arrow-color: hsl(240 4.8% 95.9%);\n    --arrow-size: 6px;\n\n    /*\n     * These properties are computed to account for the arrow's dimensions after being rotated 45\xBA. The constant\n     * 0.7071 is derived from sin(45), which is the diagonal size of the arrow's container after rotating.\n     */\n    --arrow-size-diagonal: calc(var(--arrow-size) * 0.7071);\n    --arrow-padding-offset: calc(\n      var(--arrow-size-diagonal) - var(--arrow-size)\n    );\n\n    display: contents;\n  }\n\n  .popup {\n    position: absolute;\n    isolation: isolate;\n    max-width: var(--auto-size-available-width, none);\n    max-height: var(--auto-size-available-height, none);\n    z-index: 800;\n  }\n\n  .popup--fixed {\n    position: fixed;\n  }\n\n  .popup:not(.popup--active) {\n    display: none;\n  }\n\n  .popup__arrow {\n    position: absolute;\n    width: calc(var(--arrow-size-diagonal) * 2);\n    height: calc(var(--arrow-size-diagonal) * 2);\n    rotate: 45deg;\n    background: var(--arrow-color);\n    z-index: -1;\n    /* Added border and box-shadow to arrow */\n    border: solid 1px hsl(240 5.9% 90%);\n    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n      0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n  }\n"]))));}};});
 //# sourceMappingURL=nile-popup.css.cjs.js.map

package/dist/nile-popup/nile-popup.css.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-popup.css.cjs.js","sources":["../../../src/nile-popup/nile-popup.css.ts"],"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 Popup CSS\n /\nexport const styles = css`\n :host {\n --arrow-color: ~~var~~(~~--nile-colors-dark-200);\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 --~~arrow-size: 6px;\n\n /\n * These properties are computed to account for the arrow's dimensions after being rotated 45º. The constant\n * 0.7071 is derived from sin(45), which is the diagonal size of the arrow's container after rotating.\n /\n --arrow-size-diagonal: calc(var(--arrow-size) 0.7071);\n --arrow-padding-offset: calc(\n var(--arrow-size-diagonal) - var(--arrow-size)\n );\n\n display: contents;\n }\n\n .popup {\n position: absolute;\n isolation: isolate;\n max-width: var(--auto-size-available-width, none);\n max-height: var(--auto-size-available-height, none);\n z-index: 800;\n }\n\n .popup--fixed {\n position: fixed;\n }\n\n .popup:not(.popup--active) {\n display: none;\n }\n\n .popup__arrow {\n position: absolute;\n width: calc(var(--arrow-size-diagonal) * 2);\n height: calc(var(--arrow-size-diagonal) * 2);\n rotate: 45deg;\n background: var(--arrow-color);\n z-index: -1;\n /* Added border and box-shadow to arrow */\n border: solid 1px ~~var~~(~~--nile-colors-dark-200~~);\n box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n 0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
1	+ {"version":3,"file":"nile-popup.css.cjs.js","sources":["../../../src/nile-popup/nile-popup.css.ts"],"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 Popup CSS\n /\nexport const styles = css`\n :host {\n --arrow-color: hsl(240 4.8% 95.9%);\n --arrow-size: 6px;\n\n /\n * These properties are computed to account for the arrow's dimensions after being rotated 45º. The constant\n * 0.7071 is derived from sin(45), which is the diagonal size of the arrow's container after rotating.\n /\n --arrow-size-diagonal: calc(var(--arrow-size) 0.7071);\n --arrow-padding-offset: calc(\n var(--arrow-size-diagonal) - var(--arrow-size)\n );\n\n display: contents;\n }\n\n .popup {\n position: absolute;\n isolation: isolate;\n max-width: var(--auto-size-available-width, none);\n max-height: var(--auto-size-available-height, none);\n z-index: 800;\n }\n\n .popup--fixed {\n position: fixed;\n }\n\n .popup:not(.popup--active) {\n display: none;\n }\n\n .popup__arrow {\n position: absolute;\n width: calc(var(--arrow-size-diagonal) * 2);\n height: calc(var(--arrow-size-diagonal) * 2);\n rotate: 45deg;\n background: var(--arrow-color);\n z-index: -1;\n /* Added border and box-shadow to arrow */\n border: solid 1px hsl(240 5.9% 90%);\n box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n 0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}

package/dist/nile-popup/nile-popup.css.esm.js CHANGED Viewed

@@ -1,9 +1,6 @@
 import{css as o}from"lit";const a=o`
   :host {
-    --arrow-color: var(--nile-colors-dark-200);
-    -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));
+    --arrow-color: hsl(240 4.8% 95.9%);
     --arrow-size: 6px;
     /*
@@ -42,7 +39,7 @@ import{css as o}from"lit";const a=o`
     background: var(--arrow-color);
     z-index: -1;
     /* Added border and box-shadow to arrow */
-    border: solid 1px var(--nile-colors-dark-200);
+    border: solid 1px hsl(240 5.9% 90%);
     box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08),
       0px 8px 8px -4px rgba(16, 24, 40, 0.03);
   }

package/dist/nile-progress-bar/nile-progress-bar.css.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-System.register(["lit"],function(_export,_context){"use strict";var r,_templateObject,o;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){r=_lit.css;}],execute:function execute(){_export("s",o=r(_templateObject||(_templateObject=_taggedTemplateLiteral(["\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  .nile-progress-bar__container {\n    width: 100%;\n    margin: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-height-auto, var(--ng-height-auto));\n  }\n\n  .nile-progress-bar__progress-bar {\n    width: 100%;\n    counter-reset: step;\n    padding: var(--nile-spacing-none, var(--ng-spacing-none));\n    margin: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-height-auto, var(--ng-height-auto));\n    list-style: none;\n    display: flex;\n    height: var(--nile-height-6px, var(--ng-height-8px));\n    justify-content: space-between;\n  }\n\n  .nile-progress-bar__progress-bar li {\n    position: relative;\n    width: 100%;\n    height: var(--nile-height-6px, var(--ng-height-8px));\n    background-color: var(--nile-progress-bar-track-color-stroke, var(--ng-colors-bg-quaternary));\n    transition: stroke-dashoffset 0.8s ease-in-out;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-full));\n    overflow: hidden;\n  }\n\n   \n\n  .nile-progress-bar__progress-bar li.changeColor::after {\n    background-color: var(--nile-progress-bar-progress-color-stroke, var(--ng-colors-fg-brand-primary-600));\n  }\n\n  .nile-progress-bar__progress-bar li span {\n    position: absolute;\n    top: 0;\n    left: 0;\n    background-color: var(--nile-progress-bar-progress-color-stroke, var(--ng-colors-fg-brand-primary-600));\n    height: 100%;\n    transition: all 1s linear;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-full));\n  }\n\n  .nile-progress-bar__progress-bar.lg li span {\n    border-radius: var(--nile-radius-sm, var(--ng-radius-full));\n  }\n\n  .nile-progress-bar__reset {\n    background-color: var(--nile-progress-bar-track-color-stroke, var(--ng-colors-bg-quaternary));\n    position: absolute;\n    z-index: 1;\n    border-radius: var(--nile-radius-sm, var(--ng-radius-full));\n  }\n"]))));}};});
+System.register(["lit"],function(_export,_context){"use strict";var r,_templateObject,o;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){r=_lit.css;}],execute:function execute(){_export("s",o=r(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  .nile-progress-bar__container {\n    width: 100%;\n    margin: 0 auto;\n  }\n\n  .nile-progress-bar__progress-bar {\n    width: 100%;\n    counter-reset: step;\n    padding: 0;\n    margin: 0 auto;\n    list-style: none;\n    display: flex;\n    height: 6px;\n    justify-content: space-between;\n  }\n\n  .nile-progress-bar__progress-bar li {\n    position: relative;\n    width: 100%;\n    height: 6px;\n    background-color: var(--nile-progress-bar-track-color-stroke);\n    transition: stroke-dashoffset 0.8s ease-in-out;\n    border-radius: 4px;  \n    overflow: hidden;\n  }\n\n   \n\n  .nile-progress-bar__progress-bar li.changeColor::after {\n    background-color: var(--nile-progress-bar-progress-color-stroke);\n  }\n\n  .nile-progress-bar__progress-bar li span {\n    position: absolute;\n    top: 0;\n    left: 0;\n    background-color: var(--nile-progress-bar-progress-color-stroke);\n    height: 100%;\n    transition: all 1s linear;\n    border-radius: 4px;  \n  }\n\n  .nile-progress-bar__progress-bar.lg li span {\n    border-radius: 4px;\n  }\n\n  .nile-progress-bar__reset {\n    background-color: var(--nile-progress-bar-track-color-stroke);\n    position: absolute;\n    z-index: 1;\n    border-radius: 4px; \n  }\n"]))));}};});
 //# sourceMappingURL=nile-progress-bar.css.cjs.js.map

package/dist/nile-progress-bar/nile-progress-bar.css.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nile-progress-bar.css.cjs.js","sources":["../../../src/nile-progress-bar/nile-progress-bar.css.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport default 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 .nile-progress-bar__container {\n width: 100%;\n margin: ~~var(--nile-spacing-none,~~ ~~var(--ng-spacing-none)) var(--nile-height-~~auto~~, var(--ng-height-auto))~~;\n }\n\n .nile-progress-bar__progress-bar {\n width: 100%;\n counter-reset: step;\n padding: ~~var(--nile-spacing-none, var(--ng-spacing-none))~~;\n margin: ~~var(--nile-spacing-none,~~ ~~var(--ng-spacing-none)) var(--nile-height-~~auto~~, var(--ng-height-auto))~~;\n list-style: none;\n display: flex;\n height: ~~var(--nile-height-~~6px~~, var(--ng-height-8px))~~;\n justify-content: space-between;\n }\n\n .nile-progress-bar__progress-bar li {\n position: relative;\n width: 100%;\n height: ~~var(--nile-height-~~6px~~, var(--ng-height-8px))~~;\n background-color: var(--nile-progress-bar-track-color-stroke~~, var(--ng-colors-bg-quaternary~~));\n transition: stroke-dashoffset 0.8s ease-in-out;\n border-radius: ~~var(--nile-radius-sm, var(--ng-radius-full));\~~n overflow: hidden;\n }\n\n \n\n .nile-progress-bar__progress-bar li.changeColor::after {\n background-color: var(--nile-progress-bar-progress-color-stroke~~, var(--ng-colors-fg-brand-primary-600~~));\n }\n\n .nile-progress-bar__progress-bar li span {\n position: absolute;\n top: 0;\n left: 0;\n background-color: var(--nile-progress-bar-progress-color-stroke~~, var(--ng-colors-fg-brand-primary-600~~));\n height: 100%;\n transition: all 1s linear;\n border-radius: ~~var(--nile-radius-sm, var(--ng-radius-full));\~~n }\n\n .nile-progress-bar__progress-bar.lg li span {\n border-radius: ~~var(--nile-radius-sm, var(--ng-radius-full))~~;\n }\n\n .nile-progress-bar__reset {\n background-color: var(--nile-progress-bar-track-color-stroke~~, var(--ng-colors-bg-quaternary~~));\n position: absolute;\n z-index: 1;\n border-radius: ~~var(--nile-radius-sm,~~ ~~var(--ng-radius-full));\~~n }\n`;\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAEeA,CAAAA,CAAAC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
1	+ {"version":3,"file":"nile-progress-bar.css.cjs.js","sources":["../../../src/nile-progress-bar/nile-progress-bar.css.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport default css`\n .nile-progress-bar__container {\n width: 100%;\n margin: 0 auto;\n }\n\n .nile-progress-bar__progress-bar {\n width: 100%;\n counter-reset: step;\n padding: 0;\n margin: 0 auto;\n list-style: none;\n display: flex;\n height: 6px;\n justify-content: space-between;\n }\n\n .nile-progress-bar__progress-bar li {\n position: relative;\n width: 100%;\n height: 6px;\n background-color: var(--nile-progress-bar-track-color-stroke);\n transition: stroke-dashoffset 0.8s ease-in-out;\n border-radius: 4px; \n overflow: hidden;\n }\n\n \n\n .nile-progress-bar__progress-bar li.changeColor::after {\n background-color: var(--nile-progress-bar-progress-color-stroke);\n }\n\n .nile-progress-bar__progress-bar li span {\n position: absolute;\n top: 0;\n left: 0;\n background-color: var(--nile-progress-bar-progress-color-stroke);\n height: 100%;\n transition: all 1s linear;\n border-radius: 4px; \n }\n\n .nile-progress-bar__progress-bar.lg li span {\n border-radius: 4px;\n }\n\n .nile-progress-bar__reset {\n background-color: var(--nile-progress-bar-track-color-stroke);\n position: absolute;\n z-index: 1;\n border-radius: 4px; \n }\n`;\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"oTAEeA,CAAAA,CAAAC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}

package/dist/nile-progress-bar/nile-progress-bar.css.esm.js CHANGED Viewed

@@ -1,60 +1,54 @@
 import{css as r}from"lit";var o=r`
-:host{
-  -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));
-}
   .nile-progress-bar__container {
     width: 100%;
-    margin: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-height-auto, var(--ng-height-auto));
+    margin: 0 auto;
   }
   .nile-progress-bar__progress-bar {
     width: 100%;
     counter-reset: step;
-    padding: var(--nile-spacing-none, var(--ng-spacing-none));
-    margin: var(--nile-spacing-none, var(--ng-spacing-none)) var(--nile-height-auto, var(--ng-height-auto));
+    padding: 0;
+    margin: 0 auto;
     list-style: none;
     display: flex;
-    height: var(--nile-height-6px, var(--ng-height-8px));
+    height: 6px;
     justify-content: space-between;
   }
   .nile-progress-bar__progress-bar li {
     position: relative;
     width: 100%;
-    height: var(--nile-height-6px, var(--ng-height-8px));
-    background-color: var(--nile-progress-bar-track-color-stroke, var(--ng-colors-bg-quaternary));
+    height: 6px;
+    background-color: var(--nile-progress-bar-track-color-stroke);
     transition: stroke-dashoffset 0.8s ease-in-out;
-    border-radius: var(--nile-radius-sm, var(--ng-radius-full));
+    border-radius: 4px;
     overflow: hidden;
   }
   .nile-progress-bar__progress-bar li.changeColor::after {
-    background-color: var(--nile-progress-bar-progress-color-stroke, var(--ng-colors-fg-brand-primary-600));
+    background-color: var(--nile-progress-bar-progress-color-stroke);
   }
   .nile-progress-bar__progress-bar li span {
     position: absolute;
     top: 0;
     left: 0;
-    background-color: var(--nile-progress-bar-progress-color-stroke, var(--ng-colors-fg-brand-primary-600));
+    background-color: var(--nile-progress-bar-progress-color-stroke);
     height: 100%;
     transition: all 1s linear;
-    border-radius: var(--nile-radius-sm, var(--ng-radius-full));
+    border-radius: 4px;
   }
   .nile-progress-bar__progress-bar.lg li span {
-    border-radius: var(--nile-radius-sm, var(--ng-radius-full));
+    border-radius: 4px;
   }
   .nile-progress-bar__reset {
-    background-color: var(--nile-progress-bar-track-color-stroke, var(--ng-colors-bg-quaternary));
+    background-color: var(--nile-progress-bar-track-color-stroke);
     position: absolute;
     z-index: 1;
-    border-radius: var(--nile-radius-sm, var(--ng-radius-full));
+    border-radius: 4px;
   }
 `;export{o as s};

package/dist/nile-radio/nile-radio.css.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-System.register(["lit"],function(_export,_context){"use strict";var r,_templateObject,o;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){r=_lit.css;}],execute:function execute(){_export("s",o=r(_templateObject||(_templateObject=_taggedTemplateLiteral(["\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  :host(:focus-visible) {\n    outline: 0px;\n  }\n\n  .radio {\n    display: inline-flex;\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-medium));\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-tertiary-600));\n    vertical-align: middle;\n    cursor: pointer;\n    margin: var(--nile-spacing-10px, var(--ng-spacing-lg)) var(--nile-spacing-none, var(--ng-spacing-none));\n    align-items: center;\n  }\n\n  .radio--medium {\n    --toggle-size: 14px;\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md))\n  }\n\n  .radio__checked-icon {\n    display: var(--nile-display-inline-flex, var(--ng-display-block));\n    width: var(--nile-radio-inner-width, var(--ng-width-2));\n    height: var(--nile-radio-inner-width, var(--ng-height-8px));\n    border-radius: var(--nile-radius-full, var(--ng-radius-full));\n    background: var(--nile-radio-checked-icon-background, var(--ng-colors-bg-primary));\n  }\n\n  .radio__control {\n    flex: 0 0 auto;\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: var(--nile-radio-outer-width, var(--ng-width-4));\n    height: var(--nile-radio-outer-height, var(--ng-height-16px));\n    border: solid 1px var(--nile-radio-outer-border-color, var(--ng-colors-border-primary));\n    border-radius: var(--nile-radius-full, var(--ng-radius-full));\n    background-color: var(--nile-radio-outer-background-color, var(--ng-colors-bg-primary));\n    color: transparent;\n    transition: var(--nile-transition-duration-default, var(--ng-transition-duration-default)) border-color,\n      var(--nile-transition-duration-default, var(--ng-transition-duration-default)) background-color,\n      var(--nile-transition-duration-default, var(--ng-transition-duration-default)) color,\n      var(--nile-transition-duration-default, var(--ng-transition-duration-default)) box-shadow;\n  }\n\n  .radio__input {\n    position: absolute;\n    opacity: 0;\n    padding: var(--nile-spacing-none, var(--ng-spacing-none));\n    margin: var(--nile-spacing-none, var(--ng-spacing-none));\n    pointer-events: none;\n  }\n\n  /* Hover */\n  .radio:not(.radio--checked):not(.radio--disabled) .radio__control:hover {\n    border: 1px solid var(--nile-radio-hover-border-color, var(--ng-colors-border-disabled-subtle));\n    background: var(--nile-radio-hover-background-color, var(--ng-colors-bg-primary));\n  }\n\n  /* Checked */\n  .radio--checked .radio__control {\n    color: var(--nile-colors-primary-600, var(--ng-colors-fg-brand-primary-600));\n    border: 1px solid var(--nile-radio-checked-border-color, var(--ng-colors-border-brand));\n    background-color: var(--nile-radio-checked-background-color,var(--ng-colors-bg-brand-solid));\n  }\n\n  /* Checked + hover */\n  .radio.radio--checked:not(.radio--disabled) .radio__control:hover {\n    border: 1px solid var(--nile-radio-checked-hover-border-color, var(--ng-colors-border-brand-alt));\n    background-color: var(--nile-radio-checked-hover-background-color, var(--ng-colors-bg-brand-solid));\n  }\n\n  /* Checked + hover */\n  .radio__checked-icon:hover {\n    background-color: var(--nile-radio-checked-hover-icon-background-color, var(--ng-colors-bg-primary));\n  }\n\n  /* Checked + focus */\n  :host(:focus-visible) .radio__control {\n    outline: solid var(--nile-outline-3px, var(--ng-outline-2px)) var(--nile-box-shadow-12, var(--ng-colors-bg-brand-solid));\n    outline-offset: 1px;\n  }\n\n  .radio__control:focus-visible {\n    outline: solid var(--nile-outline-3px, var(--ng-outline-2px)) var(--nile-box-shadow-12, var(--ng-colors-bg-brand-solid));\n    outline-offset: 2px;\n  }\n\n  .radio--focused .radio__control {\n    outline: solid var(--nile-outline-none, var(--ng-outline-2px)) var(--nile-outline-none, var(--ng-colors-bg-brand-solid));\n    outline-offset: 1px;\n  }\n\n  /* Disabled */\n  .radio--disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .radio--disabled .radio__checked-icon {\n    background-color:var(--nile-colors-neutral-500, var(--ng-colors-bg-disabled-subtle)); // for v2\n  }\n\n  .radio--disabled .radio__control {\n    background-color:var(--nile-colors-neutral-100, var(--ng-colors-bg-disabled-subtle));\n    border: 1px solid var(--nile-colors-neutral-500, var(--ng-colors-border-disabled-subtle));\n  }\n\n  /* When the control isn't checked, hide the circle for Windows High Contrast mode a11y */\n  .radio:not(.radio--checked) svg circle {\n    opacity: 0;\n  }\n\n  .radio__label {\n    display: inline-block;\n    color: var(--nile-colors-dark-900, var(--ng-colors-text-tertiary-600));\n    line-height: var(--nile-type-scale-3, var(--ng-line-height-text-sm));\n    margin-inline-start: var(--nile-spacing-7px, var(--ng-spacing-md));\n    user-select: none;\n    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-md));\n    margin-top: var(--nile-spacing-xxs, var(--ng-spacing-xxs));\n  }\n  .radio__label_border {\n    padding: var(--nile-spacing-lg, var(--ng-spacing-xl));\n    border-radius: var(--nile-radius-sm, var(--ng-radius-xl));\n    border: var(--nile-border-width-1, var(--ng-border-width-1)) solid var(--nile-colors-neutral-400, var(--ng-colors-border-secondary));\n  }\n"]))));}};});
+System.register(["lit"],function(_export,_context){"use strict";var o,_templateObject,r;function _taggedTemplateLiteral(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}));}return{setters:[function(_lit){o=_lit.css;}],execute:function execute(){_export("s",r=o(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n  :host {\n    display: block;\n  }\n\n  :host(:focus-visible) {\n    outline: 0px;\n  }\n\n  .radio {\n    display: inline-flex;\n    align-items: top;\n    font-size: 14px;\n    font-weight: 500;\n    color: var(--nile-colors-dark-900);\n    vertical-align: middle;\n    cursor: pointer;\n    margin: 10px 0;\n    align-items: center;\n  }\n\n  .radio--medium {\n    --toggle-size: 14px;\n    font-size: 14px;\n  }\n\n  .radio__checked-icon {\n    display: inline-flex;\n    width: var(--nile-radio-inner-width);\n    height: var(--nile-radio-inner-width);\n    border-radius: 50%;\n    background: var(--nile-radio-checked-icon-background);\n  }\n\n  .radio__control {\n    flex: 0 0 auto;\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: var(--nile-radio-outer-width);\n    height: var(--nile-radio-outer-height);\n    border: solid 1px var(--nile-radio-outer-border-color);\n    border-radius: 50%;\n    background-color: var(--nile-radio-outer-background-color);\n    color: transparent;\n    transition: var(--nile-transition-duration-default) border-color,\n      var(--nile-transition-duration-default) background-color,\n      var(--nile-transition-duration-default) color,\n      var(--nile-transition-duration-default) box-shadow;\n  }\n\n  .radio__input {\n    position: absolute;\n    opacity: 0;\n    padding: 0;\n    margin: 0;\n    pointer-events: none;\n  }\n\n  /* Hover */\n  .radio:not(.radio--checked):not(.radio--disabled) .radio__control:hover {\n    border: 1px solid var(--nile-radio-hover-border-color);\n    background: var(--nile-radio-hover-background-color);\n  }\n\n  /* Checked */\n  .radio--checked .radio__control {\n    color: var(--nile-colors-primary-600);\n    border: 1px solid var(--nile-radio-checked-border-color);\n    background-color: var(--nile-radio-checked-background-color);\n  }\n\n  /* Checked + hover */\n  .radio.radio--checked:not(.radio--disabled) .radio__control:hover {\n    border: 1px solid var(--nile-radio-checked-hover-border-color);\n    background-color: var(--nile-radio-checked-hover-background-color); \n  }\n\n  /* Checked + hover */\n  .radio__checked-icon:hover {\n    background-color: var(--nile-radio-checked-hover-icon-background-color);\n  }\n\n  /* Checked + focus */\n  :host(:focus-visible) .radio__control {\n    outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n    outline-offset: 1px;\n  }\n\n  /* Disabled */\n  .radio--disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .radio--disabled .radio__checked-icon {\n    background-color:var(--nile-colors-neutral-500); // for v2\n  }\n\n  .radio--disabled .radio__control {\n    background-color:var(--nile-colors-neutral-100)F9FAFB;\n    border: 1px solid var(--nile-colors-neutral-500);\n  }\n\n  /* When the control isn't checked, hide the circle for Windows High Contrast mode a11y */\n  .radio:not(.radio--checked) svg circle {\n    opacity: 0;\n  }\n\n  .radio__label {\n    display: inline-block;\n    color: var(--nile-colors-dark-900);\n    line-height: var(--nile-type-scale-3);\n    margin-inline-start: 0.5em;\n    user-select: none;\n    font-size: var(--nile-type-scale-3);\n    margin-top: 2px;\n  }\n  .radio__label_border {\n    padding: 0.75rem;\n    border-radius: 4px;\n    border: 1px solid var(--Neutral-Normal, var(--nile-colors-neutral-400));\n  }\n"]))));}};});
 //# sourceMappingURL=nile-radio.css.cjs.js.map