@aquera/nile-elements 0.0.4-3 → 0.0.4-4

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.
@@ -1379,6 +1379,7 @@ const YM=Symbol.for(""),bM=M=>{if((null==M?void 0:M.r)===YM)return null==M?void
1379
1379
  `,N([zM({type:Boolean,reflect:!0})],M.NileDrawer.prototype,"open",void 0),N([AM()],M.NileDrawer.prototype,"domExistence",void 0),M.NileDrawer=N([uM("nile-drawer")],M.NileDrawer);const JM=u`
1380
1380
  :host {
1381
1381
  display: inline-block;
1382
+ width: 100%;
1382
1383
  }
1383
1384
 
1384
1385
  .checkbox {
@@ -1,2 +1,2 @@
1
- System.register(["../index-cd83c5c8.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(){_export("s",o=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n :host {\n display: inline-block;\n }\n\n .checkbox {\n position: relative;\n display: inline-flex;\n align-items: top;\n font-weight: 400;\n color: var(--nile-colors-dark-900);\n vertical-align: middle;\n cursor: pointer;\n }\n\n .checkbox--medium {\n --toggle-size: var(--nile-type-scale-3);\n font-size: var(--nile-type-scale-3);\n }\n\n .checkbox__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-type-scale-3);\n height: var(--nile-type-scale-3);\n border: solid 1px var(--nile-colors-neutral-700);\n background-color: var(--nile-colors-white-base);\n border-radius: 4px;\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 .checkbox__input {\n position: absolute;\n opacity: 0;\n padding: 0;\n margin: 0;\n pointer-events: none;\n }\n\n /* svg {\n display:none !important;\n } */\n\n /* Hover */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-100);\n border: 1px solid var(--nile-colors-primary-600);\n border-radius: 4px;\n }\n\n /* Focus */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Checked/indeterminate */\n .checkbox--checked .checkbox__control,\n .checkbox--indeterminate .checkbox__control {\n border-color: var(--nile-colors-primary-600);\n background-color: var(--nile-colors-primary-600);\n }\n\n /* Checked/indeterminate + hover */\n .checkbox.checkbox--checked:not(.checkbox--disabled) .checkbox__control:hover,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-900);\n border: 1px solid var(--nile-colors-primary-900);\n }\n\n /* Checked/indeterminate + focus */\n .checkbox.checkbox--checked:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Disabled */\n .checkbox--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .checkbox__label {\n display: inline-block;\n line-height: 14px;\n font-size: 14px;\n margin-inline-start: 0.5em;\n user-select: none;\n margin-top: 2px;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.2px;\n }\n\n :host([required]) .checkbox__label::after {\n content: '*';\n margin-inline-start: -2px;\n }\n\n .checkbox__checked-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__indeterminate-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__icon {\n float: right;\n cursor: pointer;\n }\n"]))));}};});
1
+ System.register(["../index-cd83c5c8.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(){_export("s",o=e(_templateObject||(_templateObject=_taggedTemplateLiteral(["\n :host {\n display: inline-block;\n width: 100%;\n }\n\n .checkbox {\n position: relative;\n display: inline-flex;\n align-items: top;\n font-weight: 400;\n color: var(--nile-colors-dark-900);\n vertical-align: middle;\n cursor: pointer;\n }\n\n .checkbox--medium {\n --toggle-size: var(--nile-type-scale-3);\n font-size: var(--nile-type-scale-3);\n }\n\n .checkbox__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-type-scale-3);\n height: var(--nile-type-scale-3);\n border: solid 1px var(--nile-colors-neutral-700);\n background-color: var(--nile-colors-white-base);\n border-radius: 4px;\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 .checkbox__input {\n position: absolute;\n opacity: 0;\n padding: 0;\n margin: 0;\n pointer-events: none;\n }\n\n /* svg {\n display:none !important;\n } */\n\n /* Hover */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-100);\n border: 1px solid var(--nile-colors-primary-600);\n border-radius: 4px;\n }\n\n /* Focus */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Checked/indeterminate */\n .checkbox--checked .checkbox__control,\n .checkbox--indeterminate .checkbox__control {\n border-color: var(--nile-colors-primary-600);\n background-color: var(--nile-colors-primary-600);\n }\n\n /* Checked/indeterminate + hover */\n .checkbox.checkbox--checked:not(.checkbox--disabled) .checkbox__control:hover,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-900);\n border: 1px solid var(--nile-colors-primary-900);\n }\n\n /* Checked/indeterminate + focus */\n .checkbox.checkbox--checked:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Disabled */\n .checkbox--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .checkbox__label {\n display: inline-block;\n line-height: 14px;\n font-size: 14px;\n margin-inline-start: 0.5em;\n user-select: none;\n margin-top: 2px;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.2px;\n }\n\n :host([required]) .checkbox__label::after {\n content: '*';\n margin-inline-start: -2px;\n }\n\n .checkbox__checked-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__indeterminate-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__icon {\n float: right;\n cursor: pointer;\n }\n"]))));}};});
2
2
  //# sourceMappingURL=nile-checkbox.css.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"nile-checkbox.css.cjs.js","sources":["../../../src/nile-checkbox/nile-checkbox.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 * Checkbox CSS\n */\nexport const styles = css`\n :host {\n display: inline-block;\n }\n\n .checkbox {\n position: relative;\n display: inline-flex;\n align-items: top;\n font-weight: 400;\n color: var(--nile-colors-dark-900);\n vertical-align: middle;\n cursor: pointer;\n }\n\n .checkbox--medium {\n --toggle-size: var(--nile-type-scale-3);\n font-size: var(--nile-type-scale-3);\n }\n\n .checkbox__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-type-scale-3);\n height: var(--nile-type-scale-3);\n border: solid 1px var(--nile-colors-neutral-700);\n background-color: var(--nile-colors-white-base);\n border-radius: 4px;\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 .checkbox__input {\n position: absolute;\n opacity: 0;\n padding: 0;\n margin: 0;\n pointer-events: none;\n }\n\n /* svg {\n display:none !important;\n } */\n\n /* Hover */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-100);\n border: 1px solid var(--nile-colors-primary-600);\n border-radius: 4px;\n }\n\n /* Focus */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Checked/indeterminate */\n .checkbox--checked .checkbox__control,\n .checkbox--indeterminate .checkbox__control {\n border-color: var(--nile-colors-primary-600);\n background-color: var(--nile-colors-primary-600);\n }\n\n /* Checked/indeterminate + hover */\n .checkbox.checkbox--checked:not(.checkbox--disabled) .checkbox__control:hover,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-900);\n border: 1px solid var(--nile-colors-primary-900);\n }\n\n /* Checked/indeterminate + focus */\n .checkbox.checkbox--checked:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Disabled */\n .checkbox--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .checkbox__label {\n display: inline-block;\n line-height: 14px;\n font-size: 14px;\n margin-inline-start: 0.5em;\n user-select: none;\n margin-top: 2px;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.2px;\n }\n\n :host([required]) .checkbox__label::after {\n content: '*';\n margin-inline-start: -2px;\n }\n\n .checkbox__checked-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__indeterminate-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__icon {\n float: right;\n cursor: pointer;\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"gXAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
1
+ {"version":3,"file":"nile-checkbox.css.cjs.js","sources":["../../../src/nile-checkbox/nile-checkbox.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 * Checkbox CSS\n */\nexport const styles = css`\n :host {\n display: inline-block;\n width: 100%;\n }\n\n .checkbox {\n position: relative;\n display: inline-flex;\n align-items: top;\n font-weight: 400;\n color: var(--nile-colors-dark-900);\n vertical-align: middle;\n cursor: pointer;\n }\n\n .checkbox--medium {\n --toggle-size: var(--nile-type-scale-3);\n font-size: var(--nile-type-scale-3);\n }\n\n .checkbox__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-type-scale-3);\n height: var(--nile-type-scale-3);\n border: solid 1px var(--nile-colors-neutral-700);\n background-color: var(--nile-colors-white-base);\n border-radius: 4px;\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 .checkbox__input {\n position: absolute;\n opacity: 0;\n padding: 0;\n margin: 0;\n pointer-events: none;\n }\n\n /* svg {\n display:none !important;\n } */\n\n /* Hover */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-100);\n border: 1px solid var(--nile-colors-primary-600);\n border-radius: 4px;\n }\n\n /* Focus */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Checked/indeterminate */\n .checkbox--checked .checkbox__control,\n .checkbox--indeterminate .checkbox__control {\n border-color: var(--nile-colors-primary-600);\n background-color: var(--nile-colors-primary-600);\n }\n\n /* Checked/indeterminate + hover */\n .checkbox.checkbox--checked:not(.checkbox--disabled) .checkbox__control:hover,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-900);\n border: 1px solid var(--nile-colors-primary-900);\n }\n\n /* Checked/indeterminate + focus */\n .checkbox.checkbox--checked:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Disabled */\n .checkbox--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .checkbox__label {\n display: inline-block;\n line-height: 14px;\n font-size: 14px;\n margin-inline-start: 0.5em;\n user-select: none;\n margin-top: 2px;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.2px;\n }\n\n :host([required]) .checkbox__label::after {\n content: '*';\n margin-inline-start: -2px;\n }\n\n .checkbox__checked-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__indeterminate-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__icon {\n float: right;\n cursor: pointer;\n }\n`;\n\nexport default [styles];\n"],"names":["styles","css","_templateObject","_taggedTemplateLiteral"],"mappings":"gXAYaA,CAAAA,CAASC,CAAG,CAAAC,eAAA,GAAAA,eAAA,CAAAC,sBAAA"}
@@ -1,6 +1,7 @@
1
1
  import{i as e}from"../index-cd2f9c12.esm.js";const o=e`
2
2
  :host {
3
3
  display: inline-block;
4
+ width: 100%;
4
5
  }
5
6
 
6
7
  .checkbox {
@@ -11,6 +11,7 @@ import { css } from 'lit-element';
11
11
  export const styles = css `
12
12
  :host {
13
13
  display: inline-block;
14
+ width: 100%;
14
15
  }
15
16
 
16
17
  .checkbox {
@@ -1 +1 @@
1
- {"version":3,"file":"nile-checkbox.css.js","sourceRoot":"","sources":["../../../src/nile-checkbox/nile-checkbox.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgIxB,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 * Checkbox CSS\n */\nexport const styles = css`\n :host {\n display: inline-block;\n }\n\n .checkbox {\n position: relative;\n display: inline-flex;\n align-items: top;\n font-weight: 400;\n color: var(--nile-colors-dark-900);\n vertical-align: middle;\n cursor: pointer;\n }\n\n .checkbox--medium {\n --toggle-size: var(--nile-type-scale-3);\n font-size: var(--nile-type-scale-3);\n }\n\n .checkbox__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-type-scale-3);\n height: var(--nile-type-scale-3);\n border: solid 1px var(--nile-colors-neutral-700);\n background-color: var(--nile-colors-white-base);\n border-radius: 4px;\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 .checkbox__input {\n position: absolute;\n opacity: 0;\n padding: 0;\n margin: 0;\n pointer-events: none;\n }\n\n /* svg {\n display:none !important;\n } */\n\n /* Hover */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-100);\n border: 1px solid var(--nile-colors-primary-600);\n border-radius: 4px;\n }\n\n /* Focus */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Checked/indeterminate */\n .checkbox--checked .checkbox__control,\n .checkbox--indeterminate .checkbox__control {\n border-color: var(--nile-colors-primary-600);\n background-color: var(--nile-colors-primary-600);\n }\n\n /* Checked/indeterminate + hover */\n .checkbox.checkbox--checked:not(.checkbox--disabled) .checkbox__control:hover,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-900);\n border: 1px solid var(--nile-colors-primary-900);\n }\n\n /* Checked/indeterminate + focus */\n .checkbox.checkbox--checked:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Disabled */\n .checkbox--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .checkbox__label {\n display: inline-block;\n line-height: 14px;\n font-size: 14px;\n margin-inline-start: 0.5em;\n user-select: none;\n margin-top: 2px;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.2px;\n }\n\n :host([required]) .checkbox__label::after {\n content: '*';\n margin-inline-start: -2px;\n }\n\n .checkbox__checked-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__indeterminate-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__icon {\n float: right;\n cursor: pointer;\n }\n`;\n\nexport default [styles];\n"]}
1
+ {"version":3,"file":"nile-checkbox.css.js","sourceRoot":"","sources":["../../../src/nile-checkbox/nile-checkbox.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiIxB,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 * Checkbox CSS\n */\nexport const styles = css`\n :host {\n display: inline-block;\n width: 100%;\n }\n\n .checkbox {\n position: relative;\n display: inline-flex;\n align-items: top;\n font-weight: 400;\n color: var(--nile-colors-dark-900);\n vertical-align: middle;\n cursor: pointer;\n }\n\n .checkbox--medium {\n --toggle-size: var(--nile-type-scale-3);\n font-size: var(--nile-type-scale-3);\n }\n\n .checkbox__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-type-scale-3);\n height: var(--nile-type-scale-3);\n border: solid 1px var(--nile-colors-neutral-700);\n background-color: var(--nile-colors-white-base);\n border-radius: 4px;\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 .checkbox__input {\n position: absolute;\n opacity: 0;\n padding: 0;\n margin: 0;\n pointer-events: none;\n }\n\n /* svg {\n display:none !important;\n } */\n\n /* Hover */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-100);\n border: 1px solid var(--nile-colors-primary-600);\n border-radius: 4px;\n }\n\n /* Focus */\n .checkbox:not(.checkbox--checked):not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Checked/indeterminate */\n .checkbox--checked .checkbox__control,\n .checkbox--indeterminate .checkbox__control {\n border-color: var(--nile-colors-primary-600);\n background-color: var(--nile-colors-primary-600);\n }\n\n /* Checked/indeterminate + hover */\n .checkbox.checkbox--checked:not(.checkbox--disabled) .checkbox__control:hover,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__control:hover {\n background: var(--nile-colors-primary-900);\n border: 1px solid var(--nile-colors-primary-900);\n }\n\n /* Checked/indeterminate + focus */\n .checkbox.checkbox--checked:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control,\n .checkbox.checkbox--indeterminate:not(.checkbox--disabled)\n .checkbox__input:focus-visible\n ~ .checkbox__control {\n outline: solid 3px hsl(198.6 88.7% 48.4% / 40%);\n outline-offset: 1px;\n }\n\n /* Disabled */\n .checkbox--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n .checkbox__label {\n display: inline-block;\n line-height: 14px;\n font-size: 14px;\n margin-inline-start: 0.5em;\n user-select: none;\n margin-top: 2px;\n color: var(--nile-colors-dark-900);\n font-family: Colfax-regular;\n font-style: normal;\n font-weight: 400;\n letter-spacing: 0.2px;\n }\n\n :host([required]) .checkbox__label::after {\n content: '*';\n margin-inline-start: -2px;\n }\n\n .checkbox__checked-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__indeterminate-icon {\n --nile-svg-stroke: white;\n }\n\n .checkbox__icon {\n float: right;\n cursor: pointer;\n }\n`;\n\nexport default [styles];\n"]}