@limetech/lime-elements 35.0.0-next.2 → 35.0.0-next.20

package/dist/collection/style/internal/lime-theme.scss

@@ -10,37 +10,36 @@
 @use '../brand-colors';
 @use '../_theme-color-variables';
 
-@use '@material/theme' with
-    (
-        $primary: brand-colors.$lime-turquoise,
-        $secondary: brand-colors.$lime-dark-grey,
-        $background: #fff,
-        $surface: #fff,
-        $error: #b00020,
-        $on-primary: #fff,
-        $on-secondary: #fff,
-        $on-surface: #000,
-        $on-error: #fff,
-        // $text-disabled-on-background: rgba(0, 0, 0, 0.38),
-        // $text-hint-on-light: rgba(0, 0, 0, 0.38),
-        // $text-primary-on-background: rgba(0, 0, 0, 0.87),
-        // $text-secondary-on-background: rgba(0, 0, 0, 0.54),
-        //
-        // The following variables are also available to be set if needed
-        // (note by Ads: they probably aren't available in MDC v11)
-        //
-        // $text-hint-on-background: rgba(0, 0, 0, 0.38),
-        // $text-icon-on-background: rgba(0, 0, 0, 0.38),
-        // $text-primary-on-light: rgba(0, 0, 0, 0.87),
-        // $text-secondary-on-light: rgba(0, 0, 0, 0.54),
-        // $text-disabled-on-light: rgba(0, 0, 0, 0.38),
-        // $text-icon-on-light: rgba(0, 0, 0, 0.38),
-        // $text-primary-on-dark: white,
-        // $text-secondary-on-dark: rgba(255, 255, 255, 0.7),
-        // $text-hint-on-dark: rgba(255, 255, 255, 0.5),
-        // $text-disabled-on-dark: rgba(255, 255, 255, 0.5),
-        // $text-icon-on-dark: rgba(255, 255, 255, 0.5),
-    );
+@use '@material/theme' with (
+    $primary: brand-colors.$lime-turquoise,
+    $secondary: brand-colors.$lime-dark-grey,
+    $background: #fff,
+    $surface: #fff,
+    $error: #b00020,
+    $on-primary: #fff,
+    $on-secondary: #fff,
+    $on-surface: #000,
+    $on-error: #fff,
+    // $text-disabled-on-background: rgba(0, 0, 0, 0.38),
+    // $text-hint-on-light: rgba(0, 0, 0, 0.38),
+    // $text-primary-on-background: rgba(0, 0, 0, 0.87),
+    // $text-secondary-on-background: rgba(0, 0, 0, 0.54),
+    //
+    // The following variables are also available to be set if needed
+    // (note by Ads: they probably aren't available in MDC v11)
+    //
+    // $text-hint-on-background: rgba(0, 0, 0, 0.38),
+    // $text-icon-on-background: rgba(0, 0, 0, 0.38),
+    // $text-primary-on-light: rgba(0, 0, 0, 0.87),
+    // $text-secondary-on-light: rgba(0, 0, 0, 0.54),
+    // $text-disabled-on-light: rgba(0, 0, 0, 0.38),
+    // $text-icon-on-light: rgba(0, 0, 0, 0.38),
+    // $text-primary-on-dark: white,
+    // $text-secondary-on-dark: rgba(255, 255, 255, 0.7),
+    // $text-hint-on-dark: rgba(255, 255, 255, 0.5),
+    // $text-disabled-on-dark: rgba(255, 255, 255, 0.5),
+    // $text-icon-on-dark: rgba(255, 255, 255, 0.5),
+);
 @forward '@material/theme';
 
 @use './lime-typography';

package/dist/collection/style/internal/lime-typography.scss

@@ -9,60 +9,59 @@
 
 @use '../functions';
 
-@use '@material/typography' with
-    (
-        $styles-headline1: (
-            font-size: functions.pxToRem(22),
-            line-height: functions.pxToRem(22),
-        ),
-        $styles-headline2: (
-            font-size: functions.pxToRem(16),
-            line-height: functions.pxToRem(14),
-        ),
-        $styles-headline3: (
-            font-size: functions.pxToRem(16),
-            line-height: functions.pxToRem(14),
-        ),
-        $styles-headline4: (
-            font-size: functions.pxToRem(16),
-            line-height: functions.pxToRem(14),
-        ),
-        $styles-headline5: (
-            font-size: functions.pxToRem(14),
-            line-height: functions.pxToRem(14),
-        ),
-        $styles-headline6: (
-            font-size: functions.pxToRem(14),
-            line-height: functions.pxToRem(14),
-        ),
-        $styles-subtitle1: (
-            font-size: functions.pxToRem(14),
-            line-height: functions.pxToRem(18),
-        ),
-        $styles-subtitle2: (
-            font-size: functions.pxToRem(13),
-            line-height: functions.pxToRem(18),
-        ),
-        $styles-body1: (
-            font-size: functions.pxToRem(13),
-            line-height: functions.pxToRem(24),
-        ),
-        $styles-body2: (
-            font-size: functions.pxToRem(13),
-            line-height: functions.pxToRem(26),
-        ),
-        $styles-caption: (
-            font-size: functions.pxToRem(11),
-            line-height: functions.pxToRem(14),
-        ),
-        $styles-button: (
-            font-size: functions.pxToRem(14),
-            line-height: functions.pxToRem(36),
-            text-transform: none,
-        ),
-        $styles-overline: (
-            font-size: functions.pxToRem(11),
-            line-height: functions.pxToRem(14),
-        )
-    );
+@use '@material/typography' with (
+    $styles-headline1: (
+        font-size: functions.pxToRem(22),
+        line-height: functions.pxToRem(22),
+    ),
+    $styles-headline2: (
+        font-size: functions.pxToRem(16),
+        line-height: functions.pxToRem(14),
+    ),
+    $styles-headline3: (
+        font-size: functions.pxToRem(16),
+        line-height: functions.pxToRem(14),
+    ),
+    $styles-headline4: (
+        font-size: functions.pxToRem(16),
+        line-height: functions.pxToRem(14),
+    ),
+    $styles-headline5: (
+        font-size: functions.pxToRem(14),
+        line-height: functions.pxToRem(14),
+    ),
+    $styles-headline6: (
+        font-size: functions.pxToRem(14),
+        line-height: functions.pxToRem(14),
+    ),
+    $styles-subtitle1: (
+        font-size: functions.pxToRem(14),
+        line-height: functions.pxToRem(18),
+    ),
+    $styles-subtitle2: (
+        font-size: functions.pxToRem(13),
+        line-height: functions.pxToRem(18),
+    ),
+    $styles-body1: (
+        font-size: functions.pxToRem(13),
+        line-height: functions.pxToRem(24),
+    ),
+    $styles-body2: (
+        font-size: functions.pxToRem(13),
+        line-height: functions.pxToRem(26),
+    ),
+    $styles-caption: (
+        font-size: functions.pxToRem(11),
+        line-height: functions.pxToRem(14),
+    ),
+    $styles-button: (
+        font-size: functions.pxToRem(14),
+        line-height: functions.pxToRem(36),
+        text-transform: none,
+    ),
+    $styles-overline: (
+        font-size: functions.pxToRem(11),
+        line-height: functions.pxToRem(14),
+    )
+);
 @forward '@material/typography';

package/dist/collection/style/internal/shared_input-select-picker.scss

@@ -54,6 +54,7 @@ $cropped-label-hack--font-size: 0.875rem; //14px
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
 
+    color: $input-text-color;
     font-size: functions.pxToRem(14);
     font-weight: 400;
     letter-spacing: 0.009375em;

package/dist/collection/style/internal/z-index.scss

@@ -9,7 +9,8 @@ $input-field--mdc-text-field__input--readonly: 1 !default;
 $list--has-interactive-items--mdc-list-item--hover: 1 !default;
 $list-static-actions-list: 1 !default;
 $tab-bar--active-tab: 2 !default;
-$table--has-interactive-rows--selectable-row--hover: 1 !default;
+$table--has-interactive-rows--selectable-row--hover: 2 !default;
+$table--limel-table--row-selector: 1 !default;
 $popover-before: -1 !default;
 $button-group-radio-button-keyboard-focused: 1 !default;
 $list-mdc-list-item: 0 !default;

package/dist/esm/checkbox.template-f429c5b6.js

@@ -0,0 +1,39 @@
+import { h } from './index-4456d4ad.js';
+
+const CheckboxTemplate = (props) => {
+  const inputProps = {};
+  if (props.indeterminate) {
+    inputProps['data-indeterminate'] = 'true';
+  }
+  return [
+    h("div", { class: "mdc-form-field " },
+      h("div", { class: {
+          'mdc-checkbox': true,
+          'mdc-checkbox--invalid': props.invalid,
+          'mdc-checkbox--disabled': props.disabled,
+          'mdc-checkbox--required': props.required,
+          'mdc-checkbox--indeterminate': props.indeterminate,
+        } },
+        h("input", Object.assign({ type: "checkbox", class: "mdc-checkbox__native-control", id: props.id, checked: props.checked, disabled: props.disabled, required: props.required, onChange: props.onChange }, inputProps)),
+        h("div", { class: "mdc-checkbox__background" },
+          h("svg", { class: "mdc-checkbox__checkmark", viewBox: "0 0 24 24" },
+            h("path", { class: "mdc-checkbox__checkmark-path", fill: "none", d: "M1.73,12.91 8.1,19.28 22.79,4.59" })),
+          h("div", { class: "mdc-checkbox__mixedmark" }))),
+      h("label", { class: {
+          'mdc-checkbox--invalid': props.invalid,
+          'mdc-checkbox--disabled': props.disabled,
+          'mdc-checkbox--required': props.required,
+          'mdc-checkbox--indeterminate': props.indeterminate,
+        }, htmlFor: props.id }, props.label)),
+    h(HelperText, { text: props.helperText }),
+  ];
+};
+const HelperText = (props) => {
+  if (typeof props.text !== 'string') {
+    return;
+  }
+  return (h("div", { class: "limel-checkbox-helper-line" },
+    h("p", { class: "limel-checkbox-helper-text", "aria-hidden": "true" }, props.text.trim())));
+};
+
+export { CheckboxTemplate as C };

package/dist/esm/{component-89e0ce26.js → component-19eb6e2b.js}

@@ -1,4 +1,4 @@
-import { M as MDCFoundation, a as MDCComponent } from './component-d682c974.js';
+import { M as MDCFoundation, a as MDCComponent } from './component-410aad5a.js';
 import { e as estimateScrollWidth } from './ponyfill-30263d5e.js';
 
 /*! *****************************************************************************
@@ -98,7 +98,9 @@ var MDCFloatingLabelFoundation = /** @class */ (function (_super) {
     __extends(MDCFloatingLabelFoundation, _super);
     function MDCFloatingLabelFoundation(adapter) {
         var _this = _super.call(this, __assign(__assign({}, MDCFloatingLabelFoundation.defaultAdapter), adapter)) || this;
-        _this.shakeAnimationEndHandler_ = function () { return _this.handleShakeAnimationEnd_(); };
+        _this.shakeAnimationEndHandler = function () {
+            _this.handleShakeAnimationEnd();
+        };
         return _this;
     }
     Object.defineProperty(MDCFloatingLabelFoundation, "cssClasses", {
@@ -127,10 +129,10 @@ var MDCFloatingLabelFoundation = /** @class */ (function (_super) {
         configurable: true
     });
     MDCFloatingLabelFoundation.prototype.init = function () {
-        this.adapter.registerInteractionHandler('animationend', this.shakeAnimationEndHandler_);
+        this.adapter.registerInteractionHandler('animationend', this.shakeAnimationEndHandler);
     };
     MDCFloatingLabelFoundation.prototype.destroy = function () {
-        this.adapter.deregisterInteractionHandler('animationend', this.shakeAnimationEndHandler_);
+        this.adapter.deregisterInteractionHandler('animationend', this.shakeAnimationEndHandler);
     };
     /**
      * Returns the width of the label element.
@@ -178,7 +180,7 @@ var MDCFloatingLabelFoundation = /** @class */ (function (_super) {
             this.adapter.removeClass(LABEL_REQUIRED);
         }
     };
-    MDCFloatingLabelFoundation.prototype.handleShakeAnimationEnd_ = function () {
+    MDCFloatingLabelFoundation.prototype.handleShakeAnimationEnd = function () {
         var LABEL_SHAKE = MDCFloatingLabelFoundation.cssClasses.LABEL_SHAKE;
         this.adapter.removeClass(LABEL_SHAKE);
     };