@aquera/nile-elements 0.0.118 → 0.0.119
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/demo/variables.css +2 -2
- package/demo/variables_v2.css +2 -2
- package/dist/nile-calendar/nile-calendar.cjs.js +1 -1
- package/dist/nile-calendar/nile-calendar.cjs.js.map +1 -1
- package/dist/nile-calendar/nile-calendar.css.cjs.js +1 -1
- package/dist/nile-calendar/nile-calendar.css.cjs.js.map +1 -1
- package/dist/nile-calendar/nile-calendar.css.esm.js +7 -11
- package/dist/nile-calendar/nile-calendar.esm.js +4 -3
- package/dist/nile-input/nile-input.cjs.js +1 -1
- package/dist/nile-input/nile-input.cjs.js.map +1 -1
- package/dist/nile-input/nile-input.esm.js +4 -3
- package/dist/nile-link/index.cjs.js +1 -1
- package/dist/nile-link/index.esm.js +1 -1
- package/dist/nile-link/nile-link.cjs.js +1 -1
- package/dist/nile-link/nile-link.cjs.js.map +1 -1
- package/dist/nile-link/nile-link.css.cjs.js +1 -1
- package/dist/nile-link/nile-link.css.cjs.js.map +1 -1
- package/dist/nile-link/nile-link.css.esm.js +1 -0
- package/dist/nile-link/nile-link.esm.js +6 -5
- package/dist/nile-link/nile-link.test.cjs.js +1 -1
- package/dist/nile-link/nile-link.test.cjs.js.map +1 -1
- package/dist/nile-link/nile-link.test.esm.js +1 -1
- package/dist/nile-select/nile-select.css.cjs.js +1 -1
- package/dist/nile-select/nile-select.css.cjs.js.map +1 -1
- package/dist/nile-select/nile-select.css.esm.js +2 -2
- package/dist/nile-slide-toggle/nile-slide-toggle.cjs.js +1 -1
- package/dist/nile-slide-toggle/nile-slide-toggle.cjs.js.map +1 -1
- package/dist/nile-slide-toggle/nile-slide-toggle.css.cjs.js +1 -1
- package/dist/nile-slide-toggle/nile-slide-toggle.css.cjs.js.map +1 -1
- package/dist/nile-slide-toggle/nile-slide-toggle.css.esm.js +26 -5
- package/dist/nile-slide-toggle/nile-slide-toggle.esm.js +8 -6
- package/dist/src/nile-calendar/nile-calendar.css.js +5 -9
- package/dist/src/nile-calendar/nile-calendar.css.js.map +1 -1
- package/dist/src/nile-calendar/nile-calendar.d.ts +1 -1
- package/dist/src/nile-calendar/nile-calendar.js +10 -3
- package/dist/src/nile-calendar/nile-calendar.js.map +1 -1
- package/dist/src/nile-input/nile-input.js +4 -3
- package/dist/src/nile-input/nile-input.js.map +1 -1
- package/dist/src/nile-link/nile-link.css.js +1 -0
- package/dist/src/nile-link/nile-link.css.js.map +1 -1
- package/dist/src/nile-link/nile-link.d.ts +1 -0
- package/dist/src/nile-link/nile-link.js +7 -2
- package/dist/src/nile-link/nile-link.js.map +1 -1
- package/dist/src/nile-select/nile-select.css.js +2 -2
- package/dist/src/nile-select/nile-select.css.js.map +1 -1
- package/dist/src/nile-slide-toggle/nile-slide-toggle.css.js +26 -5
- package/dist/src/nile-slide-toggle/nile-slide-toggle.css.js.map +1 -1
- package/dist/src/nile-slide-toggle/nile-slide-toggle.d.ts +2 -0
- package/dist/src/nile-slide-toggle/nile-slide-toggle.js +17 -1
- package/dist/src/nile-slide-toggle/nile-slide-toggle.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/nile-calendar/nile-calendar.css.ts +5 -9
- package/src/nile-calendar/nile-calendar.ts +10 -4
- package/src/nile-input/nile-input.ts +5 -4
- package/src/nile-link/nile-link.css.ts +1 -0
- package/src/nile-link/nile-link.ts +5 -2
- package/src/nile-select/nile-select.css.ts +2 -2
- package/src/nile-slide-toggle/nile-slide-toggle.css.ts +26 -5
- package/src/nile-slide-toggle/nile-slide-toggle.ts +15 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
System.register(["../index-c7ad3b47.cjs.js"],function(_export,_context){"use strict";var e,_templateObject,o;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_index001CjsJs){e=_index001CjsJs.i;}],execute:function execute(){_export("s",o=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n :host {\n box-sizing: border-box;\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 .form-control .form-control__label {\n display: none;\n }\n\n .form-control .form-control__help-text {\n display: none;\n }\n\n /* Label */\n .form-control--has-label .form-control__label {\n display: block;\n margin-bottom:
|
|
1
|
+
System.register(["../index-c7ad3b47.cjs.js"],function(_export,_context){"use strict";var e,_templateObject,o;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_index001CjsJs){e=_index001CjsJs.i;}],execute:function execute(){_export("s",o=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n :host {\n box-sizing: border-box;\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 .form-control .form-control__label {\n display: none;\n }\n\n .form-control .form-control__help-text {\n display: none;\n }\n\n /* Label */\n .form-control--has-label .form-control__label {\n display: block;\n margin-bottom: 6px;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0.2px;\n }\n\n .form-control--has-label.form-control--medium .form-control__label {\n font-size: 14px;\n }\n\n :host([required]) .form-control--has-label .form-control__label::after {\n content: '*';\n margin-inline-start: -2px;\n color: inherit;\n }\n\n /* Help text */\n .form-control--has-help-text .form-control__help-text {\n display: block;\n color: #666666;\n margin-top: 0.75rem;\n }\n\n .form-control--has-help-text.form-control--medium .form-control__help-text {\n font-size: 0.875rem;\n }\n\n .form-control--has-help-text.form-control--radio-group\n .form-control__help-text {\n margin-top: 0.25rem;\n }\n\n :host {\n display: block;\n }\n\n /** The popup */\n .select {\n flex: 1 1 auto;\n display: inline-flex;\n width: 100%;\n position: relative;\n vertical-align: middle;\n }\n\n .select::part(popup) {\n z-index: 9999;\n }\n\n .select[data-current-placement^='top']::part(popup) {\n transform-origin: bottom;\n }\n\n .select[data-current-placement^='bottom']::part(popup) {\n transform-origin: top;\n }\n\n /* Combobox */\n .select__combobox {\n flex: 1;\n display: flex;\n width: 100%;\n min-width: 0;\n position: relative;\n align-items: center;\n justify-content: start;\n font-family: var(--nile-font-family-sans-serif);\n font-weight: 400;\n letter-spacing: normal;\n vertical-align: middle;\n overflow: hidden;\n cursor: pointer;\n transition: 150ms color, 150ms border, 150ms box-shadow,\n 150ms background-color;\n }\n\n .select__display-input {\n position: relative;\n width: 100%;\n font: inherit;\n border: none;\n background: none;\n color: #333333;\n cursor: inherit;\n overflow: hidden;\n padding: 0;\n margin: 0;\n -webkit-appearance: none;\n font-family: var(--nile-font-family-serif);\n }\n\n .select__display-input::placeholder {\n font-family: var(--nile-font-family-serif);\n }\n\n .select:not(.select--disabled):hover .select__display-input {\n color: #333333;\n }\n\n .select__display-input:focus {\n outline: none;\n }\n\n /* Visually hide the display input when multiple is enabled */\n .select--multiple:not(.select--placeholder-visible) .select__display-input {\n position: absolute;\n z-index: -1;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n }\n\n .select__value-input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n opacity: 0;\n z-index: -1;\n }\n\n .select__tags {\n display: flex;\n flex: 1;\n align-items: center;\n flex-wrap: no-wrap;\n margin-inline-start: 0.5rem;\n width: 100%;\n overflow: hidden;\n }\n\n .select__tags-count {\n color: #005ea6;\n font-family: Colfax-regular;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n letter-spacing: 0.2px;\n margin: 6px;\n }\n\n .select__tags-count-clearable {\n margin-right: 50px;\n }\n\n .select__tags::slotted(nile-tag) {\n cursor: pointer !important;\n }\n\n .select--disabled .select__tags,\n .select--disabled .select__tags::slotted(nile-tag) {\n cursor: not-allowed !important;\n }\n\n /* Standard selects */\n .select--standard .select__combobox {\n background-color: #ffffff;\n border: solid 1px #cccccc;\n }\n\n .select--standard .select__combobox:hover {\n border: 1px solid #000;\n background: #fff;\n }\n\n .select--standard.select--disabled .select__combobox {\n background-color: #f4f4f4;\n border-color: #cccccc;\n color: #999999;\n opacity: 0.5;\n cursor: not-allowed;\n outline: none;\n }\n\n .select--standard:not(.select--disabled).select--open .select__combobox,\n .select--standard:not(.select--disabled).select--focused .select__combobox {\n background-color: #f4f4f4;\n }\n\n .select--warning .select__combobox {\n border-color: var(--nile-colors-yellow-500);\n }\n\n .select--error .select__combobox {\n border-color: #e5434d;\n }\n\n .select--success {\n border-color: #43e5c0;\n }\n\n /* Filled selects */\n .select--filled .select__combobox {\n border: none;\n background-color: #f4f4f4;\n color: #333333;\n }\n\n .select--filled:hover:not(.select--disabled) .select__combobox {\n background-color: #f4f4f4;\n }\n\n .select--filled.select--disabled .select__combobox {\n background-color: #f4f4f4;\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .select--filled:not(.select--disabled).select--open .select__combobox,\n .select--filled:not(.select--disabled).select--focused .select__combobox {\n background-color: #f4f4f4;\n outline: 3px solid rgba(0, 89, 255, 0.4);\n }\n\n .select--medium .select__combobox {\n border-radius: 4px;\n font-size: 14px;\n padding: 12px;\n height: 40px;\n box-sizing: border-box;\n }\n\n .select--medium .select__clear {\n margin-inline-start: 0.75rem;\n }\n\n .select--medium .select__prefix::slotted(*) {\n margin-inline-end: 0.75rem;\n }\n\n .select--medium .select__prefix.multiple::slotted(*) {\n margin-inline-start: 0.75rem;\n }\n\n .select--medium.select--multiple:not(.select--placeholder-visible)\n .select__combobox {\n padding-inline-start: 0;\n }\n\n .select--medium .select__tags {\n gap: 3px;\n }\n\n /* Pills */\n .select--pill.select--medium .select__combobox {\n border-radius: 2.5rem;\n }\n\n /* Prefix */\n .select__prefix {\n flex: 0;\n display: inline-flex;\n align-items: center;\n color: #aaaaaa;\n }\n\n .select__suffix {\n flex: 0;\n display: inline-flex;\n align-items: center;\n color: #aaaaaa;\n }\n\n /* Clear button */\n .select__clear {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: #005ea6;\n border: none;\n background: none;\n padding: 0;\n transition: 150ms color;\n cursor: pointer;\n }\n\n .select__clear:hover {\n color: #999999;\n }\n\n .select__clear:focus {\n outline: none;\n }\n\n /* Expand icon */\n .select__expand-icon {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n transition: 250ms rotate ease;\n rotate: 0;\n margin-inline-start: 0.25rem;\n }\n\n .select--open .select__expand-icon {\n rotate: -180deg;\n }\n\n /* Listbox */\n .select__listbox {\n display: block;\n position: relative;\n font-size: 1rem;\n font-weight: 400;\n background: #ffffff;\n border: solid 1px #cccccc;\n border-radius: 0.25rem;\n padding-block: 0;\n padding-inline: 0;\n overflow: auto;\n overscroll-behavior: none;\n /* Make sure it adheres to the popup's auto size */\n max-width: var(--auto-size-available-width);\n max-height: var(--auto-size-available-height);\n }\n\n .select__options__search-enabled {\n padding-top: 10px;\n }\n\n .select__options {\n font-size: 14px;\n color: rgb(133, 129, 129);\n }\n\n .select__listbox::slotted(nile-divider) {\n --spacing: 0.25rem;\n }\n\n .select__listbox::slotted(small) {\n font-size: 0.875rem;\n font-weight: 600;\n color: #888888;\n padding-block: 0.25rem;\n padding-inline: 1rem;\n }\n\n .select__search {\n position: sticky;\n top: 0px;\n z-index: 1;\n width: calc(100% - 16px);\n padding: 8px;\n background-color: white;\n margin-bottom: -8px;\n }\n\n .select__footer {\n position: sticky;\n bottom: 0px;\n background: #fafafa;\n border: 1px solid #e5e9eb;\n display: flex;\n height: 15px;\n /* Auto layout */\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n padding: 8px 12px 16px;\n gap: 12px;\n justify-content: space-between;\n }\n\n .tag__prefix[slot='prefix'] {\n height: 14px;\n display: inline-block;\n overflow: hidden;\n }\n\n .tag__prefix[slot='prefix'] img {\n max-height: 100%;\n }\n\n .select__loader {\n width: 100%;\n text-align: center;\n display: block;\n }\n\n .select__loader--icon {\n margin-top: 20px;\n animation: spin 0.6s linear infinite;\n }\n\n .select__no-results {\n padding: 10px;\n }\n\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .select__invisible{\n opacity: 0;\n }\n\n .select__prefix--from-options {\n margin-inline-end: 12px;\n }\n \n .select__hide-default{\n display: none;\n }\n"]))));}};});
|
|
2
2
|
//# sourceMappingURL=nile-select.css.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-select.css.cjs.js","sources":["../../../src/nile-select/nile-select.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-element';\n\n/**\n * Select_2 CSS\n */\nexport const styles = css`\n :host {\n box-sizing: border-box;\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 .form-control .form-control__label {\n display: none;\n }\n\n .form-control .form-control__help-text {\n display: none;\n }\n\n /* Label */\n .form-control--has-label .form-control__label {\n display: block;\n margin-bottom:
|
|
1
|
+
{"version":3,"file":"nile-select.css.cjs.js","sources":["../../../src/nile-select/nile-select.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-element';\n\n/**\n * Select_2 CSS\n */\nexport const styles = css`\n :host {\n box-sizing: border-box;\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 .form-control .form-control__label {\n display: none;\n }\n\n .form-control .form-control__help-text {\n display: none;\n }\n\n /* Label */\n .form-control--has-label .form-control__label {\n display: block;\n margin-bottom: 6px;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n letter-spacing: 0.2px;\n }\n\n .form-control--has-label.form-control--medium .form-control__label {\n font-size: 14px;\n }\n\n :host([required]) .form-control--has-label .form-control__label::after {\n content: '*';\n margin-inline-start: -2px;\n color: inherit;\n }\n\n /* Help text */\n .form-control--has-help-text .form-control__help-text {\n display: block;\n color: #666666;\n margin-top: 0.75rem;\n }\n\n .form-control--has-help-text.form-control--medium .form-control__help-text {\n font-size: 0.875rem;\n }\n\n .form-control--has-help-text.form-control--radio-group\n .form-control__help-text {\n margin-top: 0.25rem;\n }\n\n :host {\n display: block;\n }\n\n /** The popup */\n .select {\n flex: 1 1 auto;\n display: inline-flex;\n width: 100%;\n position: relative;\n vertical-align: middle;\n }\n\n .select::part(popup) {\n z-index: 9999;\n }\n\n .select[data-current-placement^='top']::part(popup) {\n transform-origin: bottom;\n }\n\n .select[data-current-placement^='bottom']::part(popup) {\n transform-origin: top;\n }\n\n /* Combobox */\n .select__combobox {\n flex: 1;\n display: flex;\n width: 100%;\n min-width: 0;\n position: relative;\n align-items: center;\n justify-content: start;\n font-family: var(--nile-font-family-sans-serif);\n font-weight: 400;\n letter-spacing: normal;\n vertical-align: middle;\n overflow: hidden;\n cursor: pointer;\n transition: 150ms color, 150ms border, 150ms box-shadow,\n 150ms background-color;\n }\n\n .select__display-input {\n position: relative;\n width: 100%;\n font: inherit;\n border: none;\n background: none;\n color: #333333;\n cursor: inherit;\n overflow: hidden;\n padding: 0;\n margin: 0;\n -webkit-appearance: none;\n font-family: var(--nile-font-family-serif);\n }\n\n .select__display-input::placeholder {\n font-family: var(--nile-font-family-serif);\n }\n\n .select:not(.select--disabled):hover .select__display-input {\n color: #333333;\n }\n\n .select__display-input:focus {\n outline: none;\n }\n\n /* Visually hide the display input when multiple is enabled */\n .select--multiple:not(.select--placeholder-visible) .select__display-input {\n position: absolute;\n z-index: -1;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n }\n\n .select__value-input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n opacity: 0;\n z-index: -1;\n }\n\n .select__tags {\n display: flex;\n flex: 1;\n align-items: center;\n flex-wrap: no-wrap;\n margin-inline-start: 0.5rem;\n width: 100%;\n overflow: hidden;\n }\n\n .select__tags-count {\n color: #005ea6;\n font-family: Colfax-regular;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 14px;\n letter-spacing: 0.2px;\n margin: 6px;\n }\n\n .select__tags-count-clearable {\n margin-right: 50px;\n }\n\n .select__tags::slotted(nile-tag) {\n cursor: pointer !important;\n }\n\n .select--disabled .select__tags,\n .select--disabled .select__tags::slotted(nile-tag) {\n cursor: not-allowed !important;\n }\n\n /* Standard selects */\n .select--standard .select__combobox {\n background-color: #ffffff;\n border: solid 1px #cccccc;\n }\n\n .select--standard .select__combobox:hover {\n border: 1px solid #000;\n background: #fff;\n }\n\n .select--standard.select--disabled .select__combobox {\n background-color: #f4f4f4;\n border-color: #cccccc;\n color: #999999;\n opacity: 0.5;\n cursor: not-allowed;\n outline: none;\n }\n\n .select--standard:not(.select--disabled).select--open .select__combobox,\n .select--standard:not(.select--disabled).select--focused .select__combobox {\n background-color: #f4f4f4;\n }\n\n .select--warning .select__combobox {\n border-color: var(--nile-colors-yellow-500);\n }\n\n .select--error .select__combobox {\n border-color: #e5434d;\n }\n\n .select--success {\n border-color: #43e5c0;\n }\n\n /* Filled selects */\n .select--filled .select__combobox {\n border: none;\n background-color: #f4f4f4;\n color: #333333;\n }\n\n .select--filled:hover:not(.select--disabled) .select__combobox {\n background-color: #f4f4f4;\n }\n\n .select--filled.select--disabled .select__combobox {\n background-color: #f4f4f4;\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .select--filled:not(.select--disabled).select--open .select__combobox,\n .select--filled:not(.select--disabled).select--focused .select__combobox {\n background-color: #f4f4f4;\n outline: 3px solid rgba(0, 89, 255, 0.4);\n }\n\n .select--medium .select__combobox {\n border-radius: 4px;\n font-size: 14px;\n padding: 12px;\n height: 40px;\n box-sizing: border-box;\n }\n\n .select--medium .select__clear {\n margin-inline-start: 0.75rem;\n }\n\n .select--medium .select__prefix::slotted(*) {\n margin-inline-end: 0.75rem;\n }\n\n .select--medium .select__prefix.multiple::slotted(*) {\n margin-inline-start: 0.75rem;\n }\n\n .select--medium.select--multiple:not(.select--placeholder-visible)\n .select__combobox {\n padding-inline-start: 0;\n }\n\n .select--medium .select__tags {\n gap: 3px;\n }\n\n /* Pills */\n .select--pill.select--medium .select__combobox {\n border-radius: 2.5rem;\n }\n\n /* Prefix */\n .select__prefix {\n flex: 0;\n display: inline-flex;\n align-items: center;\n color: #aaaaaa;\n }\n\n .select__suffix {\n flex: 0;\n display: inline-flex;\n align-items: center;\n color: #aaaaaa;\n }\n\n /* Clear button */\n .select__clear {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: inherit;\n color: #005ea6;\n border: none;\n background: none;\n padding: 0;\n transition: 150ms color;\n cursor: pointer;\n }\n\n .select__clear:hover {\n color: #999999;\n }\n\n .select__clear:focus {\n outline: none;\n }\n\n /* Expand icon */\n .select__expand-icon {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n transition: 250ms rotate ease;\n rotate: 0;\n margin-inline-start: 0.25rem;\n }\n\n .select--open .select__expand-icon {\n rotate: -180deg;\n }\n\n /* Listbox */\n .select__listbox {\n display: block;\n position: relative;\n font-size: 1rem;\n font-weight: 400;\n background: #ffffff;\n border: solid 1px #cccccc;\n border-radius: 0.25rem;\n padding-block: 0;\n padding-inline: 0;\n overflow: auto;\n overscroll-behavior: none;\n /* Make sure it adheres to the popup's auto size */\n max-width: var(--auto-size-available-width);\n max-height: var(--auto-size-available-height);\n }\n\n .select__options__search-enabled {\n padding-top: 10px;\n }\n\n .select__options {\n font-size: 14px;\n color: rgb(133, 129, 129);\n }\n\n .select__listbox::slotted(nile-divider) {\n --spacing: 0.25rem;\n }\n\n .select__listbox::slotted(small) {\n font-size: 0.875rem;\n font-weight: 600;\n color: #888888;\n padding-block: 0.25rem;\n padding-inline: 1rem;\n }\n\n .select__search {\n position: sticky;\n top: 0px;\n z-index: 1;\n width: calc(100% - 16px);\n padding: 8px;\n background-color: white;\n margin-bottom: -8px;\n }\n\n .select__footer {\n position: sticky;\n bottom: 0px;\n background: #fafafa;\n border: 1px solid #e5e9eb;\n display: flex;\n height: 15px;\n /* Auto layout */\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n padding: 8px 12px 16px;\n gap: 12px;\n justify-content: space-between;\n }\n\n .tag__prefix[slot='prefix'] {\n height: 14px;\n display: inline-block;\n overflow: hidden;\n }\n\n .tag__prefix[slot='prefix'] img {\n max-height: 100%;\n }\n\n .select__loader {\n width: 100%;\n text-align: center;\n display: block;\n }\n\n .select__loader--icon {\n margin-top: 20px;\n animation: spin 0.6s linear infinite;\n }\n\n .select__no-results {\n padding: 10px;\n }\n\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .select__invisible{\n opacity: 0;\n }\n\n .select__prefix--from-options {\n margin-inline-end: 12px;\n }\n \n .select__hide-default{\n display: none;\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"wXAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
|
|
@@ -24,13 +24,13 @@ import{i as e}from"../index-0a3007c5.esm.js";const o=e`
|
|
|
24
24
|
/* Label */
|
|
25
25
|
.form-control--has-label .form-control__label {
|
|
26
26
|
display: block;
|
|
27
|
-
margin-bottom:
|
|
27
|
+
margin-bottom: 6px;
|
|
28
28
|
color: var(--nile-colors-dark-900);
|
|
29
29
|
font-family: Colfax-regular;
|
|
30
30
|
font-size: 14px;
|
|
31
31
|
font-style: normal;
|
|
32
32
|
font-weight: 400;
|
|
33
|
-
line-height:
|
|
33
|
+
line-height: 20px;
|
|
34
34
|
letter-spacing: 0.2px;
|
|
35
35
|
}
|
|
36
36
|
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o;}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o;},_typeof(o);}System.register(["tslib","../index-c7ad3b47.cjs.js","./nile-slide-toggle.css.cjs.js","../internal/nile-element.cjs.js","lit/directives/class-map.js","../custom-element-9087bdd5.cjs.js","../property-217fe924.cjs.js","lit"],function(_export,_context){"use strict";var e,
|
|
1
|
+
function _typeof(o){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o;}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o;},_typeof(o);}System.register(["tslib","../index-c7ad3b47.cjs.js","./nile-slide-toggle.css.cjs.js","../internal/nile-element.cjs.js","lit/directives/class-map.js","../custom-element-9087bdd5.cjs.js","../property-217fe924.cjs.js","lit"],function(_export,_context){"use strict";var e,t,i,s,l,o,r,_templateObject,_templateObject2,_templateObject3,n;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,_toPropertyKey(descriptor.key),descriptor);}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor;}function _toPropertyKey(t){var i=_toPrimitive(t,"string");return"symbol"==_typeof(i)?i:i+"";}function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.");}return("string"===r?String:Number)(t);}function _callSuper(t,o,e){return o=_getPrototypeOf(o),_possibleConstructorReturn(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],_getPrototypeOf(t).constructor):o.apply(t,e));}function _possibleConstructorReturn(self,call){if(call&&(_typeof(call)==="object"||typeof call==="function")){return call;}else if(call!==void 0){throw new TypeError("Derived constructors may only return object or undefined");}return _assertThisInitialized(self);}function _assertThisInitialized(self){if(self===void 0){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return self;}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t;})();}function _get(){if(typeof Reflect!=="undefined"&&Reflect.get){_get=Reflect.get.bind();}else{_get=function _get(target,property,receiver){var base=_superPropBase(target,property);if(!base)return;var desc=Object.getOwnPropertyDescriptor(base,property);if(desc.get){return desc.get.call(arguments.length<3?target:receiver);}return desc.value;};}return _get.apply(this,arguments);}function _superPropBase(object,property){while(!Object.prototype.hasOwnProperty.call(object,property)){object=_getPrototypeOf(object);if(object===null)break;}return object;}function _getPrototypeOf(o){_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf.bind():function _getPrototypeOf(o){return o.__proto__||Object.getPrototypeOf(o);};return _getPrototypeOf(o);}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function");}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,writable:true,configurable:true}});Object.defineProperty(subClass,"prototype",{writable:false});if(superClass)_setPrototypeOf(subClass,superClass);}function _setPrototypeOf(o,p){_setPrototypeOf=Object.setPrototypeOf?Object.setPrototypeOf.bind():function _setPrototypeOf(o,p){o.__proto__=p;return o;};return _setPrototypeOf(o,p);}return{setters:[function(_tslib){e=_tslib.__decorate;},function(_index001CjsJs){t=_index001CjsJs.x;},function(_nileSlideToggleCssCjsJs){i=_nileSlideToggleCssCjsJs.s;},function(_internalNileElementCjsJs){s=_internalNileElementCjsJs.N;},function(_litDirectivesClassMapJs){l=_litDirectivesClassMapJs.classMap;},function(_customElement003CjsJs){o=_customElement003CjsJs.e;},function(_property002CjsJs){r=_property002CjsJs.n;},function(_lit){}],execute:function execute(){_export("N",n=/*#__PURE__*/function(_s){function n(){var _this;_classCallCheck(this,n);_this=_callSuper(this,n,arguments),_this.label="",_this.sublabel="",_this.textPosition="right",_this.isChecked=!1,_this.fullWidth=!1,_this.disabled=!1,_this.helpText="",_this.errorMessage="";return _this;}_inherits(n,_s);return _createClass(n,[{key:"connectedCallback",value:function connectedCallback(){_get(_getPrototypeOf(n.prototype),"connectedCallback",this).call(this),this.emit("nile-init"),this.style.setProperty("--slide-toggle-width",this.fullWidth?"100%":"auto");}},{key:"disconnectedCallback",value:function disconnectedCallback(){_get(_getPrototypeOf(n.prototype),"disconnectedCallback",this).call(this),this.emit("nile-destroy");}},{key:"toggleValue",value:function toggleValue(){this.isChecked=!this.isChecked,this.emit("change",{checked:this.isChecked}),this.emit("nile-change",{checked:this.isChecked});}},{key:"render",value:function render(){var e=!!this.helpText,i=!!this.errorMessage;return t(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n <div\n class=","\n >\n <label \n class=\"","\"\n class=\"nile-slide-toggle__switch\">\n <input\n type=\"checkbox\"\n .checked=","\n @change=","\n />\n <span class=\"nile-slide-toggle__slider\"></span>\n </label>\n <span class=\"nile-slide-toggle__label\">\n <span>","</span>\n <span class=\"nile-slide-toggle__sublabel\">","</span>\n </span>\n </div>\n ","\n ","\n "])),l({"nile-slide-toggle":!0,"nile-slide--disabled":this.disabled,"nile-slide-toggle--reverse":"left"==this.textPosition}),l({"nile-slide-toggle__switch":!0,"nile-slide-toggle__switch--left":"right"==this.textPosition,"nile-slide-toggle__switch--right":"left"==this.textPosition}),this.isChecked,this.toggleValue,this.label,this.sublabel,e?t(_templateObject2||(_templateObject2=_taggedTemplateLiteral([" <nile-form-help-text>","</nile-form-help-text> "])),this.helpText):"",i?t(_templateObject3||(_templateObject3=_taggedTemplateLiteral(["\n <nile-form-error-message\n >","</nile-form-error-message\n >\n "])),this.errorMessage):"");}}]);}(s));n.styles=i,e([r({type:String})],n.prototype,"label",void 0),e([r({type:String})],n.prototype,"sublabel",void 0),e([r({type:String,attribute:"text-position"})],n.prototype,"textPosition",void 0),e([r({type:Boolean,reflect:!0})],n.prototype,"isChecked",void 0),e([r({type:Boolean,reflect:!0,attribute:"full-width"})],n.prototype,"fullWidth",void 0),e([r({type:Boolean,reflect:!0})],n.prototype,"disabled",void 0),e([r({attribute:"help-text",reflect:!0})],n.prototype,"helpText",void 0),e([r({attribute:"error-message",reflect:!0})],n.prototype,"errorMessage",void 0),_export("N",n=e([o("nile-slide-toggle")],n));}};});
|
|
2
2
|
//# sourceMappingURL=nile-slide-toggle.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-slide-toggle.cjs.js","sources":["../../../src/nile-slide-toggle/nile-slide-toggle.ts"],"sourcesContent":["import { CSSResultGroup } from 'lit';\nimport { LitElement, html, property, customElement } from 'lit-element';\nimport styles from './nile-slide-toggle.css';\nimport NileElement from '../internal/nile-element';\nimport { classMap } from 'lit/directives/class-map.js';\n\n@customElement('nile-slide-toggle')\nexport class NileSlideToggle extends NileElement {\n public static styles: CSSResultGroup = styles;\n\n @property({ type: String }) label = '';\n @property({ type: String }) sublabel = '';\n\n @property({ type: Boolean, reflect: true }) isChecked = false;\n\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n @property({ attribute: 'help-text', reflect: true }) helpText = '';\n\n @property({ attribute: 'error-message', reflect: true }) errorMessage = '';\n\n connectedCallback() {\n super.connectedCallback();\n this.emit('nile-init');\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.emit('nile-destroy');\n }\n\n toggleValue() {\n this.isChecked = !this.isChecked;\n this.emit('change',{ checked: this.isChecked });\n this.emit('nile-change',{ checked: this.isChecked });\n }\n\n public render() {\n const hasHelpText = this.helpText ? true : false;\n const hasErrorMessage = this.errorMessage ? true : false;\n\n return html`\n <div\n class=${classMap({\n 'nile-slide-toggle': true,\n 'nile-slide--disabled': this.disabled,\n })}\n >\n <label class=\"nile-slide-toggle__switch\">\n <input\n type=\"checkbox\"\n .checked=${this.isChecked}\n @change=${this.toggleValue}\n />\n <span class=\"nile-slide-toggle__slider\"></span>\n </label>\n <span class=\"nile-slide-toggle__label\">\n <span>${this.label}</span>\n <span class=\"nile-slide-toggle__sublabel\">${this.sublabel}</span>\n </span>\n </div>\n ${hasHelpText\n ? html` <nile-form-help-text>${this.helpText}</nile-form-help-text> `\n : ``}\n ${hasErrorMessage\n ? html`\n <nile-form-error-message\n >${this.errorMessage}</nile-form-error-message\n >\n `\n : ``}\n `;\n }\n}\n"],"names":["NileSlideToggle","n","this","label","sublabel","isChecked","disabled","helpText","errorMessage","_this","_inherits","
|
|
1
|
+
{"version":3,"file":"nile-slide-toggle.cjs.js","sources":["../../../src/nile-slide-toggle/nile-slide-toggle.ts"],"sourcesContent":["import { CSSResultGroup, PropertyValues } from 'lit';\nimport { LitElement, html, property, customElement } from 'lit-element';\nimport styles from './nile-slide-toggle.css';\nimport NileElement from '../internal/nile-element';\nimport { classMap } from 'lit/directives/class-map.js';\n\n@customElement('nile-slide-toggle')\nexport class NileSlideToggle extends NileElement {\n public static styles: CSSResultGroup = styles;\n\n @property({ type: String }) label = '';\n\n @property({ type: String }) sublabel = '';\n\n @property({ type: String, attribute:'text-position' }) textPosition:'left' | 'right' = 'right';\n\n @property({ type: Boolean, reflect: true }) isChecked = false;\n\n @property({ type: Boolean, reflect: true, attribute:'full-width' }) fullWidth = false;\n\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n @property({ attribute: 'help-text', reflect: true }) helpText = '';\n\n @property({ attribute: 'error-message', reflect: true }) errorMessage = '';\n\n connectedCallback() {\n super.connectedCallback();\n this.emit('nile-init');\n this.style.setProperty('--slide-toggle-width',this.fullWidth?'100%':'auto')\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.emit('nile-destroy');\n }\n\n toggleValue() {\n this.isChecked = !this.isChecked;\n this.emit('change',{ checked: this.isChecked });\n this.emit('nile-change',{ checked: this.isChecked });\n }\n\n public render() {\n const hasHelpText = this.helpText ? true : false;\n const hasErrorMessage = this.errorMessage ? true : false;\n\n return html`\n <div\n class=${classMap({\n 'nile-slide-toggle': true,\n 'nile-slide--disabled': this.disabled,\n 'nile-slide-toggle--reverse':this.textPosition=='left'\n })}\n >\n <label \n class=\"${classMap({\n 'nile-slide-toggle__switch':true,\n 'nile-slide-toggle__switch--left':this.textPosition=='right',\n 'nile-slide-toggle__switch--right':this.textPosition=='left',\n })}\"\n class=\"nile-slide-toggle__switch\">\n <input\n type=\"checkbox\"\n .checked=${this.isChecked}\n @change=${this.toggleValue}\n />\n <span class=\"nile-slide-toggle__slider\"></span>\n </label>\n <span class=\"nile-slide-toggle__label\">\n <span>${this.label}</span>\n <span class=\"nile-slide-toggle__sublabel\">${this.sublabel}</span>\n </span>\n </div>\n ${hasHelpText\n ? html` <nile-form-help-text>${this.helpText}</nile-form-help-text> `\n : ``}\n ${hasErrorMessage\n ? html`\n <nile-form-error-message\n >${this.errorMessage}</nile-form-error-message\n >\n `\n : ``}\n `;\n }\n}\n"],"names":["NileSlideToggle","_s","n","constructor","this","label","sublabel","textPosition","isChecked","fullWidth","disabled","helpText","errorMessage","_this","_inherits","_createClass","key","value","connectedCallback","super","emit","style","setProperty","disconnectedCallback","toggleValue","checked","render","hasHelpText","hasErrorMessage","html","_templateObject","_taggedTemplateLiteral","classMap","_templateObject2","_templateObject3","NileElement","styles","__decorate","property","type","String","prototype","attribute","Boolean","reflect","_export","customElement"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
System.register(["lit"],function(_export,_context){"use strict";var e,_templateObject,i;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_lit){e=_lit.css;}],execute:function execute(){_export("s",i=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n .nile-slide-toggle {\n display: inline-flex;\n align-items: baseline;\n }\n\n .nile-slide-toggle__switch {\n flex: 0 0 auto;\n position: relative;\n display: inline-block;\n width: 36px;\n height: 20px;\n line-height: 22px;\n margin-right: 8px;\n }\n\n .nile-slide-toggle__label {\n display: flex;\n flex-direction: column;\n
|
|
1
|
+
System.register(["lit"],function(_export,_context){"use strict";var e,_templateObject,i;function _taggedTemplateLiteral(strings,raw){if(!raw){raw=strings.slice(0);}return Object.freeze(Object.defineProperties(strings,{raw:{value:Object.freeze(raw)}}));}return{setters:[function(_lit){e=_lit.css;}],execute:function execute(){_export("s",i=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n :host{\n --slide-toggle-width:auto;\n display:inline-block;\n width:var(--slide-toggle-width);\n }\n\n .nile-slide-toggle {\n display: inline-flex;\n align-items: baseline;\n justify-content:space-between;\n width:100%;\n }\n\n .nile-slide-toggle--reverse{\n flex-direction:row-reverse;\n }\n\n .nile-slide-toggle__switch {\n flex: 0 0 auto;\n position: relative;\n display: inline-block;\n width: 36px;\n height: 20px;\n line-height: 22px;\n }\n\n .nile-slide-toggle__switch--left{\n margin-right: 8px;\n }\n\n .nile-slide-toggle__switch--right{\n margin-left: 8px;\n }\n\n .nile-slide-toggle__label {\n display: flex;\n flex-direction: column;\n gap: 2px;\n font-family: var(--nile-font-family-serif);\n letter-spacing: 0.2px;\n font-style: normal;\n color: var(--nile-colors-dark-900);\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n }\n\n .nile-slide-toggle__sublabel {\n font-family: var(--nile-font-family-serif);\n letter-spacing: 0.2px;\n font-style: normal;\n color: var(--nile-colors-gray-light-mode-600);\n font-size: 12px;\n font-weight: 400;\n line-height: 18px;\n }\n\n .nile-slide-toggle__switch input {\n opacity: 0;\n width: 0;\n height: 0;\n }\n\n .nile-slide-toggle__slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: var(--nile-slide-toggle-color-background-inactive);\n transition: 0.4s;\n border-radius: 34px;\n }\n\n .nile-slide-toggle__slider:active {\n box-shadow: 0px 0px 0px 1px rgba(133, 170, 209, 0.54);\n }\n\n .nile-slide-toggle__slider:focus {\n box-shadow: 0px 0px 0px 1px rgba(133, 170, 209, 0.54);\n }\n\n .nile-slide-toggle__slider:before {\n position: absolute;\n content: '';\n height: 16px;\n width: 16px;\n bottom: 2px;\n left: 2px;\n background-color: var(--nile-slide-toggle-color-indicator);\n transition: 0.4s;\n border-radius: 50%;\n }\n\n .nile-slide-toggle__switch input:checked + .nile-slide-toggle__slider {\n background-color: var(--nile-slide-toggle-color-background-active);\n }\n\n .nile-slide-toggle__switch input:focus + .nile-slide-toggle__slider {\n box-shadow: 0 0 1px var(--nile-slide-toggle-color-background-active);\n }\n\n .nile-slide-toggle__switch input:checked + .nile-slide-toggle__slider:before {\n transform: translateX(16px);\n }\n\n .nile-slide-toggle__slider.round {\n border-radius: 20px;\n }\n\n .nile-slide-toggle__slider.round:before {\n border-radius: 50%;\n }\n\n .nile-slide--disabled .nile-slide-toggle__slider {\n background-color: #f2f4f7;\n }\n\n .nile-slide--disabled .nile-slide-toggle__switch {\n pointer-events: none;\n cursor: not-allowed;\n }\n\n .nile-slide--disabled\n .nile-slide-toggle__switch\n input:checked\n + .nile-slide-toggle__slider {\n background-color: #f2f4f7;\n }\n"]))));}};});
|
|
2
2
|
//# sourceMappingURL=nile-slide-toggle.css.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-slide-toggle.css.cjs.js","sources":["../../../src/nile-slide-toggle/nile-slide-toggle.css.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport default css`\n .nile-slide-toggle {\n display: inline-flex;\n align-items: baseline;\n }\n\n .nile-slide-toggle__switch {\n flex: 0 0 auto;\n position: relative;\n display: inline-block;\n width: 36px;\n height: 20px;\n line-height: 22px;\n margin-right: 8px;\n }\n\n .nile-slide-toggle__label {\n display: flex;\n flex-direction: column;\n
|
|
1
|
+
{"version":3,"file":"nile-slide-toggle.css.cjs.js","sources":["../../../src/nile-slide-toggle/nile-slide-toggle.css.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport default css`\n :host{\n --slide-toggle-width:auto;\n display:inline-block;\n width:var(--slide-toggle-width);\n }\n\n .nile-slide-toggle {\n display: inline-flex;\n align-items: baseline;\n justify-content:space-between;\n width:100%;\n }\n\n .nile-slide-toggle--reverse{\n flex-direction:row-reverse;\n }\n\n .nile-slide-toggle__switch {\n flex: 0 0 auto;\n position: relative;\n display: inline-block;\n width: 36px;\n height: 20px;\n line-height: 22px;\n }\n\n .nile-slide-toggle__switch--left{\n margin-right: 8px;\n }\n\n .nile-slide-toggle__switch--right{\n margin-left: 8px;\n }\n\n .nile-slide-toggle__label {\n display: flex;\n flex-direction: column;\n gap: 2px;\n font-family: var(--nile-font-family-serif);\n letter-spacing: 0.2px;\n font-style: normal;\n color: var(--nile-colors-dark-900);\n font-size: 14px;\n font-weight: 500;\n line-height: 20px;\n }\n\n .nile-slide-toggle__sublabel {\n font-family: var(--nile-font-family-serif);\n letter-spacing: 0.2px;\n font-style: normal;\n color: var(--nile-colors-gray-light-mode-600);\n font-size: 12px;\n font-weight: 400;\n line-height: 18px;\n }\n\n .nile-slide-toggle__switch input {\n opacity: 0;\n width: 0;\n height: 0;\n }\n\n .nile-slide-toggle__slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: var(--nile-slide-toggle-color-background-inactive);\n transition: 0.4s;\n border-radius: 34px;\n }\n\n .nile-slide-toggle__slider:active {\n box-shadow: 0px 0px 0px 1px rgba(133, 170, 209, 0.54);\n }\n\n .nile-slide-toggle__slider:focus {\n box-shadow: 0px 0px 0px 1px rgba(133, 170, 209, 0.54);\n }\n\n .nile-slide-toggle__slider:before {\n position: absolute;\n content: '';\n height: 16px;\n width: 16px;\n bottom: 2px;\n left: 2px;\n background-color: var(--nile-slide-toggle-color-indicator);\n transition: 0.4s;\n border-radius: 50%;\n }\n\n .nile-slide-toggle__switch input:checked + .nile-slide-toggle__slider {\n background-color: var(--nile-slide-toggle-color-background-active);\n }\n\n .nile-slide-toggle__switch input:focus + .nile-slide-toggle__slider {\n box-shadow: 0 0 1px var(--nile-slide-toggle-color-background-active);\n }\n\n .nile-slide-toggle__switch input:checked + .nile-slide-toggle__slider:before {\n transform: translateX(16px);\n }\n\n .nile-slide-toggle__slider.round {\n border-radius: 20px;\n }\n\n .nile-slide-toggle__slider.round:before {\n border-radius: 50%;\n }\n\n .nile-slide--disabled .nile-slide-toggle__slider {\n background-color: #f2f4f7;\n }\n\n .nile-slide--disabled .nile-slide-toggle__switch {\n pointer-events: none;\n cursor: not-allowed;\n }\n\n .nile-slide--disabled\n .nile-slide-toggle__switch\n input:checked\n + .nile-slide-toggle__slider {\n background-color: #f2f4f7;\n }\n`;\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"iVAEeA,CAAAA,CAAAC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
|
|
@@ -1,7 +1,19 @@
|
|
|
1
1
|
import{css as e}from"lit";var i=e`
|
|
2
|
+
:host{
|
|
3
|
+
--slide-toggle-width:auto;
|
|
4
|
+
display:inline-block;
|
|
5
|
+
width:var(--slide-toggle-width);
|
|
6
|
+
}
|
|
7
|
+
|
|
2
8
|
.nile-slide-toggle {
|
|
3
9
|
display: inline-flex;
|
|
4
10
|
align-items: baseline;
|
|
11
|
+
justify-content:space-between;
|
|
12
|
+
width:100%;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.nile-slide-toggle--reverse{
|
|
16
|
+
flex-direction:row-reverse;
|
|
5
17
|
}
|
|
6
18
|
|
|
7
19
|
.nile-slide-toggle__switch {
|
|
@@ -11,24 +23,33 @@ import{css as e}from"lit";var i=e`
|
|
|
11
23
|
width: 36px;
|
|
12
24
|
height: 20px;
|
|
13
25
|
line-height: 22px;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.nile-slide-toggle__switch--left{
|
|
14
29
|
margin-right: 8px;
|
|
15
30
|
}
|
|
16
31
|
|
|
32
|
+
.nile-slide-toggle__switch--right{
|
|
33
|
+
margin-left: 8px;
|
|
34
|
+
}
|
|
35
|
+
|
|
17
36
|
.nile-slide-toggle__label {
|
|
18
37
|
display: flex;
|
|
19
38
|
flex-direction: column;
|
|
20
|
-
|
|
21
|
-
color: var(--nile-colors-gray-light-mode-700);
|
|
39
|
+
gap: 2px;
|
|
22
40
|
font-family: var(--nile-font-family-serif);
|
|
23
|
-
|
|
41
|
+
letter-spacing: 0.2px;
|
|
24
42
|
font-style: normal;
|
|
43
|
+
color: var(--nile-colors-dark-900);
|
|
44
|
+
font-size: 14px;
|
|
25
45
|
font-weight: 500;
|
|
26
46
|
line-height: 20px;
|
|
27
|
-
letter-spacing: 0.2px;
|
|
28
|
-
gap: 2px;
|
|
29
47
|
}
|
|
30
48
|
|
|
31
49
|
.nile-slide-toggle__sublabel {
|
|
50
|
+
font-family: var(--nile-font-family-serif);
|
|
51
|
+
letter-spacing: 0.2px;
|
|
52
|
+
font-style: normal;
|
|
32
53
|
color: var(--nile-colors-gray-light-mode-600);
|
|
33
54
|
font-size: 12px;
|
|
34
55
|
font-weight: 400;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
|
-
import{__decorate as e}from"tslib";import{x as
|
|
1
|
+
import{__decorate as e}from"tslib";import{x as t}from"../index-0a3007c5.esm.js";import{s as i}from"./nile-slide-toggle.css.esm.js";import{N as s}from"../internal/nile-element.esm.js";import{classMap as l}from"lit/directives/class-map.js";import{e as o}from"../custom-element-ed237dbb.esm.js";import{n as r}from"../property-09139d3c.esm.js";import"lit";let n=class extends s{constructor(){super(...arguments),this.label="",this.sublabel="",this.textPosition="right",this.isChecked=!1,this.fullWidth=!1,this.disabled=!1,this.helpText="",this.errorMessage=""}connectedCallback(){super.connectedCallback(),this.emit("nile-init"),this.style.setProperty("--slide-toggle-width",this.fullWidth?"100%":"auto")}disconnectedCallback(){super.disconnectedCallback(),this.emit("nile-destroy")}toggleValue(){this.isChecked=!this.isChecked,this.emit("change",{checked:this.isChecked}),this.emit("nile-change",{checked:this.isChecked})}render(){const e=!!this.helpText,i=!!this.errorMessage;return t`
|
|
2
2
|
<div
|
|
3
|
-
class=${l({"nile-slide-toggle":!0,"nile-slide--disabled":this.disabled})}
|
|
3
|
+
class=${l({"nile-slide-toggle":!0,"nile-slide--disabled":this.disabled,"nile-slide-toggle--reverse":"left"==this.textPosition})}
|
|
4
4
|
>
|
|
5
|
-
<label
|
|
5
|
+
<label
|
|
6
|
+
class="${l({"nile-slide-toggle__switch":!0,"nile-slide-toggle__switch--left":"right"==this.textPosition,"nile-slide-toggle__switch--right":"left"==this.textPosition})}"
|
|
7
|
+
class="nile-slide-toggle__switch">
|
|
6
8
|
<input
|
|
7
9
|
type="checkbox"
|
|
8
10
|
.checked=${this.isChecked}
|
|
@@ -15,10 +17,10 @@ import{__decorate as e}from"tslib";import{x as s}from"../index-0a3007c5.esm.js";
|
|
|
15
17
|
<span class="nile-slide-toggle__sublabel">${this.sublabel}</span>
|
|
16
18
|
</span>
|
|
17
19
|
</div>
|
|
18
|
-
${e?
|
|
19
|
-
${t
|
|
20
|
+
${e?t` <nile-form-help-text>${this.helpText}</nile-form-help-text> `:""}
|
|
21
|
+
${i?t`
|
|
20
22
|
<nile-form-error-message
|
|
21
23
|
>${this.errorMessage}</nile-form-error-message
|
|
22
24
|
>
|
|
23
25
|
`:""}
|
|
24
|
-
`}};n.styles=
|
|
26
|
+
`}};n.styles=i,e([r({type:String})],n.prototype,"label",void 0),e([r({type:String})],n.prototype,"sublabel",void 0),e([r({type:String,attribute:"text-position"})],n.prototype,"textPosition",void 0),e([r({type:Boolean,reflect:!0})],n.prototype,"isChecked",void 0),e([r({type:Boolean,reflect:!0,attribute:"full-width"})],n.prototype,"fullWidth",void 0),e([r({type:Boolean,reflect:!0})],n.prototype,"disabled",void 0),e([r({attribute:"help-text",reflect:!0})],n.prototype,"helpText",void 0),e([r({attribute:"error-message",reflect:!0})],n.prototype,"errorMessage",void 0),n=e([o("nile-slide-toggle")],n);export{n as N};
|
|
@@ -61,15 +61,6 @@ export const styles = css `
|
|
|
61
61
|
grid-row-gap: var(--nile-spacing-spacing-xs, 3px);
|
|
62
62
|
}
|
|
63
63
|
|
|
64
|
-
|
|
65
|
-
@media not all and (min-resolution: .001dpcm) {
|
|
66
|
-
@supports (-webkit-appearance:none)
|
|
67
|
-
{ .day-names, .days_container {
|
|
68
|
-
/* column-gap: 6px; */
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
|
|
73
64
|
.day_date ,.day_name{
|
|
74
65
|
font-family: var( --nile-font-family-serif);
|
|
75
66
|
font-style: normal;
|
|
@@ -282,6 +273,11 @@ export const styles = css `
|
|
|
282
273
|
background:#005291;
|
|
283
274
|
}
|
|
284
275
|
|
|
276
|
+
nile-input::part(input)::-webkit-inner-spin-button,
|
|
277
|
+
nile-input::part(input)::-webkit-outer-spin-button {
|
|
278
|
+
-webkit-appearance: none;
|
|
279
|
+
}
|
|
280
|
+
|
|
285
281
|
.hidden {
|
|
286
282
|
display: none !important;
|
|
287
283
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-calendar.css.js","sourceRoot":"","sources":["../../../src/nile-calendar/nile-calendar.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"nile-calendar.css.js","sourceRoot":"","sources":["../../../src/nile-calendar/nile-calendar.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6RxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit-element';\n\n/**\n * DatePicker CSS\n */\nexport const styles = css`\n :host {\n }\n\n .base {\n background-color: white;\n border-radius: 8px;\n width: 300px;\n box-shadow: 0px 8px 8px -4px #10182808;\n box-shadow: 0px 20px 24px -4px #10182814;\n }\n\n .calendar-container {\n font-family: var(--nile-font-family-serif);\n width: 100%;\n height: auto;\n text-align: center;\n background: white;\n border-radius: 8px;\n }\n\n .calendar-wrapper {\n background: white;\n display: flex;\n justify-content: space-between;\n width: 100%;\n border-radius: 8px;\n }\n\n .calendar-header {\n display: flex;\n justify-content: space-between;\n padding: 10px;\n padding: 22px 20px;\n font-size: 14px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.2px;\n }\n\n .calendar-header__month-navigation {\n cursor: pointer;\n }\n\n /* Date CSS_START */\n\n .days_container {\n\t\tdisplay: grid;\n padding: 0 12px 12px 12px;\n\t\tgrid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;\n\t\tgrid-row-gap: var(--nile-spacing-spacing-xs, 3px);\n }\n\n .day_date ,.day_name{\n\t\tfont-family: var( --nile-font-family-serif);\n\t\tfont-style: normal;\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t\ttext-align: center;\n\n\t\t/* width: 40px;\n\t\theight: 30px; */\n\t\tpadding: 5px 8px;\n\t\tdisplay:grid;\n\t\tplace-items:center;\n }\n\n .day_name{\n font-weight:500;\n }\n\n .day_date{\n font-weight:400;\n }\n\n\t.current__date__dot{\n\t\tbackground-color:white;\n\t\tposition:absolute;\n\t\tborder-radius:50%;\n\t\theight:5px;\n\t\twidth:5px;\n\t\tleft:25%;\n\t\ttop:90%;\n\t}\n\n .day_date:not(.range-start, .selected-date, .range-end) .current__date__dot{\n\t\tbackground-color:var(--nile-colors-primary-600,#005EA6);\n }\n\n\n .day_date:hover {\n background-color: #F9FAFB;\n }\n\n .filler {\n color: #7f7f7f;\n pointer-events: none;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .selected-date:hover {\n background: #005EA6;\n }\n\n .selected-date,\n .range-start,\n .range-end {\n border-radius: 4px;\n background: #005EA6;\n color: white;\n }\n\n .selected-date:hover,\n .range-start:hover,\n .range-end:hover,\n .day_date.in-range:hover {\n background: #005291;\n }\n\n .range-start.in-range {\n background: #005EA6;\n border-radius: 4px 0 0 4px;\n color: white;\n }\n\n .range-end {\n background: #005EA6;\n border-radius: 0 4px 4px 0;\n color: white;\n }\n\n .range-middle {\n background: #005EA6;\n color: white;\n border-radius: 0;\n }\n\n .day_date.selected {\n background: #005EA6;\n color: white;\n border-radius: 4px;\n }\n\n .day_date.in-range:not(.range-start,.range-end, .selected-date) {\n background: #e5e9eb;\n }\n\n .selected-date {\n color: white;\n border-radius: 4px;\n background: #005EA6;\n }\n\n .not-allowed{\n color: #7f7f7f;\n pointer-events: none;\n }\n\n /* Date CSS_END */\n\n .calender-input {\n box-sizing:border-box;\n padding: 0 16px;\n width:100%;\n justify-content: space-between;\n display: flex;\n gap:8px;\n flex-wrap: wrap;\n }\n\n .from {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n width: auto;\n }\n\n .manual-input-label {\n color: #7f7f7f;\n font-family: Colfax-regular;\n font-size: 12px;\n font-weight: 500;\n line-height: 12px;\n letter-spacing: 0.2px;\n }\n\n .button-container {\n width: 100%;\n text-align: right;\n padding: 12px 16px 16px 16px;\n box-sizing: border-box;\n }\n\n .calendar-config {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .calendar-switcher {\n width: 100%;\n margin: 0 12px;\n margin-top: 16px;\n }\n\n .units-wrapper{\n width:min-content;\n margin:auto;\n }\n\n .unit-container{\n display:grid;\n grid-template-columns: auto auto;\n row-gap:var(--nile-spacing-spacing-2xl);\n column-gap: var(--nile-spacing-spacing-sm);\n padding: 16px;\n padding-bottom: 0;\n }\n \n .duration-name{\n display:flex;\n align-items:center;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 20px; \n }\n \n .duration-units{\n display:flex;\n font-family: var( --nile-font-family-serif);\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 20px;\n }\n\n .duration__value{\n display: grid;\n place-items:center;\n width: 34px;\n height: 34px;\n cursor: pointer;\n border-radius: 4px;\n }\n\n .duration__value:hover{\n background:#F9FAFB;\n }\n\n .duration__value--selected{\n background-color:#005EA6;\n color: white;\n }\n\n .duration__value--selected:hover{\n background:#005291;\n }\n\n nile-input::part(input)::-webkit-inner-spin-button,\n nile-input::part(input)::-webkit-outer-spin-button {\n -webkit-appearance: none;\n }\n\n .hidden {\n display: none !important;\n }\n\n .unit-input-container {\n display: flex;\n justify-content: space-between;\n gap: 8px;\n padding: 0 16px;\n padding-top: 16px;\n }\n\n .duration-input,.time-input,.manual-input {\n width: 125px;\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -96,7 +96,7 @@ export declare class NileCalendar extends NileElement {
|
|
|
96
96
|
/**
|
|
97
97
|
* Function to handle relative date selection
|
|
98
98
|
*/
|
|
99
|
-
handleDurationChange(event:
|
|
99
|
+
handleDurationChange(event: CustomEvent): void;
|
|
100
100
|
handleUnitChange(event: any): void;
|
|
101
101
|
handleTimeValueClick(unit: TimeUnits, value: number, event: any): void;
|
|
102
102
|
createRelativePeriod(unit: String, value: number): {
|
|
@@ -225,7 +225,9 @@ let NileCalendar = class NileCalendar extends NileElement {
|
|
|
225
225
|
<div class="unit-input-container">
|
|
226
226
|
<nile-input
|
|
227
227
|
class="manual-input duration-input"
|
|
228
|
-
label="Duration"
|
|
228
|
+
label="Duration"
|
|
229
|
+
inputmode="numeric"
|
|
230
|
+
type="number"
|
|
229
231
|
value="${this.selectedValue}"
|
|
230
232
|
@nile-input="${this.handleDurationChange}"
|
|
231
233
|
placeholder="Enter Value"
|
|
@@ -233,7 +235,6 @@ let NileCalendar = class NileCalendar extends NileElement {
|
|
|
233
235
|
|
|
234
236
|
<nile-select class="manual-input time-input"
|
|
235
237
|
label="Unit of time"
|
|
236
|
-
style="margin-top:3px"
|
|
237
238
|
value="${this.selectedUnit}"
|
|
238
239
|
@nile-change="${this.handleUnitChange}"
|
|
239
240
|
>
|
|
@@ -464,7 +465,13 @@ let NileCalendar = class NileCalendar extends NileElement {
|
|
|
464
465
|
* Function to handle relative date selection
|
|
465
466
|
*/
|
|
466
467
|
handleDurationChange(event) {
|
|
467
|
-
|
|
468
|
+
event.detail.value = event.detail.value.replace(/e/gi, "");
|
|
469
|
+
const duration = Number(event.detail.value);
|
|
470
|
+
if (!duration) {
|
|
471
|
+
return;
|
|
472
|
+
}
|
|
473
|
+
;
|
|
474
|
+
this.selectedValue = duration;
|
|
468
475
|
if (this.selectedUnit && this.selectedValue) {
|
|
469
476
|
this.handleTimeValueClick(this.selectedUnit, this.selectedValue, event);
|
|
470
477
|
}
|