@luftborn/custom-elements 2.13.7 → 2.13.8

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 (10) hide show
  1. package/demo/index.js +5 -5
  2. package/demo/index.min.js +4 -4
  3. package/demo/index.min.js.map +1 -1
  4. package/dist/elements/CheckBoxElement/CheckBoxElement.js +2 -2
  5. package/dist/elements/CheckBoxElement/CheckBoxElement.js.map +1 -1
  6. package/dist/elements/RadioButtonGroup/RadioButtonGroupElement.js +2 -2
  7. package/dist/elements/RadioButtonGroup/RadioButtonGroupElement.js.map +1 -1
  8. package/package.json +1 -1
  9. package/src/elements/CheckBoxElement/CheckBoxElement.ts +1 -13
  10. package/src/elements/RadioButtonGroup/RadioButtonGroupElement.ts +1 -13
package/demo/index.min.js CHANGED
@@ -4054,7 +4054,7 @@ var CheckBoxElement = /** @class */ (function (_super) {
4054
4054
  fieldset = document.createElement('fieldset');
4055
4055
  wrapper.appendChild(fieldset);
4056
4056
  if (this.label) {
4057
- fieldset.insertAdjacentHTML('beforeend', "<legend class=\"sr-only\">" + this.label + "</legend>");
4057
+ fieldset.setAttribute('aria-label', this.label);
4058
4058
  }
4059
4059
  this.options.forEach(function (element, index) {
4060
4060
  fieldset.insertAdjacentHTML('beforeend', StringUtil_1.StringUtil.StringFormat(_this.checkboxTemplate, _this.name, element, _this.name + "-" + index));
@@ -4081,7 +4081,7 @@ var CheckBoxElement = /** @class */ (function (_super) {
4081
4081
  (0, custom_element_decorator_1.default)({
4082
4082
  selector: 'checkbox-element',
4083
4083
  template: "\n\t\t\t<div class=\"wrapper\">\n\t\t\t</div>",
4084
- style: "\n\t\t\t:host{\n\t\t\t\twidth:100%;\n\t\t\t}\n\t\t\t.checkbox {\n\t\t\t\twidth: auto;\n\t\t\t\tmargin: auto 0.188rem;\n\t\t\t\tcolor: rgba(72, 72, 72, 0.75);\n\t\t\t\tfont-size: 0.813rem;\n\t\t\t\tmargin-top: 0.25rem;\n\t\t\t}\n\t\t\t.checkbox:first-of-type {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\tinput[type='checkbox']{\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: auto !important;\n\t\t\t\tborder: none;\n\t\t\t\tbackground-color: #f1f4ff;\n\t\t\t\tmargin: 0.125rem;\n\t\t\t\tresize: none;\n\t\t\t}\n\t\t\t.sr-only:not(:focus):not(:active) {\n\t\t\t\tclip: rect(0 0 0 0); \n\t\t\t\tclip-path: inset(50%);\n\t\t\t\theight: 0.063rem;\n\t\t\t\toverflow: hidden;\n\t\t\t\tposition: absolute;\n\t\t\t\twhite-space: nowrap; \n\t\t\t\twidth: 0.063rem;\n\t\t\t}\n\t\t\tfieldset {\n\t\t\t\tborder: none;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t",
4084
+ style: "\n\t\t\t:host{\n\t\t\t\twidth:100%;\n\t\t\t}\n\t\t\t.checkbox {\n\t\t\t\twidth: auto;\n\t\t\t\tmargin: auto 0.188rem;\n\t\t\t\tcolor: rgba(72, 72, 72, 0.75);\n\t\t\t\tfont-size: 0.813rem;\n\t\t\t\tmargin-top: 0.25rem;\n\t\t\t}\n\t\t\t.checkbox:first-of-type {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\tinput[type='checkbox']{\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: auto !important;\n\t\t\t\tborder: none;\n\t\t\t\tbackground-color: #f1f4ff;\n\t\t\t\tmargin: 0.125rem;\n\t\t\t\tresize: none;\n\t\t\t}\n\t\t\tfieldset {\n\t\t\t\tborder: none;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t",
4085
4085
  useShadow: true,
4086
4086
  })
4087
4087
  ], CheckBoxElement);
@@ -6249,7 +6249,7 @@ var RadioButtonGroupElement = /** @class */ (function (_super) {
6249
6249
  fieldset = document.createElement('fieldset');
6250
6250
  wrapper.appendChild(fieldset);
6251
6251
  if (this.label) {
6252
- fieldset.insertAdjacentHTML('beforeend', "<legend class=\"sr-only\">" + this.label + "</legend>");
6252
+ fieldset.setAttribute('aria-label', this.label);
6253
6253
  }
6254
6254
  this.options.forEach(function (element, index) {
6255
6255
  fieldset.insertAdjacentHTML('beforeend', StringUtil_1.StringUtil.StringFormat(_this.radioButtonTemplate, _this.name, element, _this.name + "-" + index, "" + (_this.required ? 'required' : '')));
@@ -6269,7 +6269,7 @@ var RadioButtonGroupElement = /** @class */ (function (_super) {
6269
6269
  (0, custom_element_decorator_1.default)({
6270
6270
  selector: 'radio-group-element',
6271
6271
  template: "\n\t\t\t<div class=\"wrapper\">\n\t\t\t</div>",
6272
- style: "\n\t\t\t:host{\n\t\t\t\twidth:100%;\n\t\t\t}\n\t\t\t.radio-button {\n\t\t\t\twidth: auto;\n\t\t\t\tmargin: auto 0.188rem;\n\t\t\t\tcolor: rgba(72, 72, 72, 0.75);\n\t\t\t\tfont-size: 0.813rem;\n\t\t\t\tmargin-top: 0.25rem;\n\t\t\t}\n\t\t\t.radio-button:first-of-type {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\tinput{\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: auto !important;\n\t\t\t\tborder: none;\n\t\t\t\tbackground-color: #f1f4ff;\n\t\t\t\tmargin: 0.2rem;\n\t\t\t\tresize: none;\n\t\t\t}\n\t\t\t.sr-only:not(:focus):not(:active) {\n\t\t\t\tclip: rect(0 0 0 0);\n\t\t\t\tclip-path: inset(50%);\n\t\t\t\theight: 0.063rem;\n\t\t\t\toverflow: hidden;\n\t\t\t\tposition: absolute;\n\t\t\t\twhite-space: nowrap; \n\t\t\t\twidth: 0.063rem;\n\t\t\t}\n\t\t\tfieldset {\n\t\t\t\tborder: none;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t",
6272
+ style: "\n\t\t\t:host{\n\t\t\t\twidth:100%;\n\t\t\t}\n\t\t\t.radio-button {\n\t\t\t\twidth: auto;\n\t\t\t\tmargin: auto 0.188rem;\n\t\t\t\tcolor: rgba(72, 72, 72, 0.75);\n\t\t\t\tfont-size: 0.813rem;\n\t\t\t\tmargin-top: 0.25rem;\n\t\t\t}\n\t\t\t.radio-button:first-of-type {\n\t\t\t\tmargin-top: 0;\n\t\t\t}\n\t\t\tinput{\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: auto !important;\n\t\t\t\tborder: none;\n\t\t\t\tbackground-color: #f1f4ff;\n\t\t\t\tmargin: 0.2rem;\n\t\t\t\tresize: none;\n\t\t\t}\n\t\t\tfieldset {\n\t\t\t\tborder: none;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t",
6273
6273
  useShadow: true,
6274
6274
  })
6275
6275
  ], RadioButtonGroupElement);