@linzjs/lui 21.40.1 → 21.40.3

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 (7) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/index.js +2 -2
  3. package/dist/index.js.map +1 -1
  4. package/dist/lui.esm.js +2 -2
  5. package/dist/lui.esm.js.map +1 -1
  6. package/dist/scss/Components/LuiSwitchButton/LuiSwitchButton.scss +46 -29
  7. package/package.json +1 -1
package/dist/lui.esm.js CHANGED
@@ -46990,14 +46990,14 @@ var LuiSidePanelProvider = function (_a) {
46990
46990
  React__default.createElement(LuiSidePanelContainer, __assign({}, props))));
46991
46991
  };
46992
46992
 
46993
- var css_248z$g = ".lui-switch-checkbox {\n height: 0;\n width: 0;\n visibility: hidden;\n}\n\n.lui-switch-label {\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n width: 40px;\n height: 20px;\n background: grey;\n border-radius: 40px;\n position: relative;\n transition: background-color 0.2s;\n}\n\n.lui-switch-label .lui-switch-button {\n content: \"\";\n position: absolute;\n top: 2px;\n left: 2px;\n width: 18px;\n height: 16px;\n border-radius: 18px;\n transition: 0.2s;\n background: #fff;\n box-shadow: 0 0 2px 0 rgba(10, 10, 10, 0.29);\n}\n\n.lui-switch-checkbox:checked + .lui-switch-label .lui-switch-button {\n left: calc(100% - 2px);\n transform: translateX(-100%);\n}\n\n.lui-switch-label:active .lui-switch-button {\n width: 20px;\n}";
46993
+ var css_248z$g = ".lui-switch-checkbox {\n height: 0;\n width: 0;\n visibility: hidden;\n}\n\n.lui-switch-label {\n display: flex;\n align-items: center;\n cursor: pointer;\n width: 40px;\n padding: 2px;\n background: #ffffff;\n border: 1px solid #007198;\n border-radius: 40px;\n position: relative;\n transition: background-color 0.2s;\n}\n\n.lui-switch-label .lui-switch-button {\n content: \"\";\n position: relative;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n transition: 0.2s;\n background: #007198;\n box-shadow: 0 0 2px 0 rgba(10, 10, 10, 0.29);\n}\n\n.lui-switch-label-checked {\n background: #007198;\n}\n.lui-switch-label-checked .lui-switch-button {\n transform: translateX(20px);\n background: #ffffff;\n}\n\n.lui-switch-checkbox:disabled + .lui-switch-label {\n border: 1px solid #989189;\n background: #eaeaea;\n}\n.lui-switch-checkbox:disabled + .lui-switch-label .lui-switch-button {\n background: #989189;\n}\n.lui-switch-checkbox:disabled + .lui-switch-label-checked {\n background: #989189;\n}\n.lui-switch-checkbox:disabled + .lui-switch-label-checked .lui-switch-button {\n background: #eaeaea;\n}";
46994
46994
  styleInject(css_248z$g);
46995
46995
 
46996
46996
  var LuiSwitchButton = function (props) {
46997
46997
  var generatedId = useGenerateOrDefaultId();
46998
46998
  return (React__default.createElement(React__default.Fragment, null,
46999
46999
  React__default.createElement("input", __assign({ className: "lui-switch-checkbox", type: "checkbox", "data-testid": 'lui-switch-new', id: generatedId }, props)),
47000
- React__default.createElement("label", { "data-testid": "label", style: { background: props.checked ? '#007198' : 'gray' }, className: "lui-switch-label", htmlFor: generatedId },
47000
+ React__default.createElement("label", { "data-testid": "label", className: clsx('lui-switch-label', props.checked ? 'lui-switch-label-checked' : null), htmlFor: generatedId },
47001
47001
  React__default.createElement("span", { className: "lui-switch-button" }))));
47002
47002
  };
47003
47003