@limetech/lime-elements 36.3.0-next.9 → 36.3.0

package/dist/cjs/{dateFormatter-d7a8d40d.js → sv-dffe48b5.js}

@@ -63,6 +63,89 @@ _commonjsHelpers.createCommonjsModule(function (module, exports) {
 })));
 });
 
+_commonjsHelpers.createCommonjsModule(function (module, exports) {
+(function (global, factory) {
+   typeof _commonjsHelpers.commonjsRequire === 'function' ? factory(moment.moment) :
+   factory(global.moment);
+}(_commonjsHelpers.commonjsGlobal, (function (moment) {
+    //! moment.js locale configuration
+
+    function processRelativeTime(number, withoutSuffix, key, isFuture) {
+        var format = {
+            m: ['eine Minute', 'einer Minute'],
+            h: ['eine Stunde', 'einer Stunde'],
+            d: ['ein Tag', 'einem Tag'],
+            dd: [number + ' Tage', number + ' Tagen'],
+            w: ['eine Woche', 'einer Woche'],
+            M: ['ein Monat', 'einem Monat'],
+            MM: [number + ' Monate', number + ' Monaten'],
+            y: ['ein Jahr', 'einem Jahr'],
+            yy: [number + ' Jahre', number + ' Jahren'],
+        };
+        return withoutSuffix ? format[key][0] : format[key][1];
+    }
+
+    var de = moment.defineLocale('de', {
+        months: 'Januar_Februar_März_April_Mai_Juni_Juli_August_September_Oktober_November_Dezember'.split(
+            '_'
+        ),
+        monthsShort:
+            'Jan._Feb._März_Apr._Mai_Juni_Juli_Aug._Sep._Okt._Nov._Dez.'.split('_'),
+        monthsParseExact: true,
+        weekdays:
+            'Sonntag_Montag_Dienstag_Mittwoch_Donnerstag_Freitag_Samstag'.split(
+                '_'
+            ),
+        weekdaysShort: 'So._Mo._Di._Mi._Do._Fr._Sa.'.split('_'),
+        weekdaysMin: 'So_Mo_Di_Mi_Do_Fr_Sa'.split('_'),
+        weekdaysParseExact: true,
+        longDateFormat: {
+            LT: 'HH:mm',
+            LTS: 'HH:mm:ss',
+            L: 'DD.MM.YYYY',
+            LL: 'D. MMMM YYYY',
+            LLL: 'D. MMMM YYYY HH:mm',
+            LLLL: 'dddd, D. MMMM YYYY HH:mm',
+        },
+        calendar: {
+            sameDay: '[heute um] LT [Uhr]',
+            sameElse: 'L',
+            nextDay: '[morgen um] LT [Uhr]',
+            nextWeek: 'dddd [um] LT [Uhr]',
+            lastDay: '[gestern um] LT [Uhr]',
+            lastWeek: '[letzten] dddd [um] LT [Uhr]',
+        },
+        relativeTime: {
+            future: 'in %s',
+            past: 'vor %s',
+            s: 'ein paar Sekunden',
+            ss: '%d Sekunden',
+            m: processRelativeTime,
+            mm: '%d Minuten',
+            h: processRelativeTime,
+            hh: '%d Stunden',
+            d: processRelativeTime,
+            dd: processRelativeTime,
+            w: processRelativeTime,
+            ww: '%d Wochen',
+            M: processRelativeTime,
+            MM: processRelativeTime,
+            y: processRelativeTime,
+            yy: processRelativeTime,
+        },
+        dayOfMonthOrdinalParse: /\d{1,2}\./,
+        ordinal: '%d.',
+        week: {
+            dow: 1, // Monday is the first day of the week.
+            doy: 4, // The week that contains Jan 4th is the first week of the year.
+        },
+    });
+
+    return de;
+
+})));
+});
+
 _commonjsHelpers.createCommonjsModule(function (module, exports) {
 (function (global, factory) {
    typeof _commonjsHelpers.commonjsRequire === 'function' ? factory(moment.moment) :
@@ -194,146 +277,6 @@ _commonjsHelpers.createCommonjsModule(function (module, exports) {
 })));
 });
 
-_commonjsHelpers.createCommonjsModule(function (module, exports) {
-(function (global, factory) {
-   typeof _commonjsHelpers.commonjsRequire === 'function' ? factory(moment.moment) :
-   factory(global.moment);
-}(_commonjsHelpers.commonjsGlobal, (function (moment) {
-    //! moment.js locale configuration
-
-    var nb = moment.defineLocale('nb', {
-        months: 'januar_februar_mars_april_mai_juni_juli_august_september_oktober_november_desember'.split(
-            '_'
-        ),
-        monthsShort:
-            'jan._feb._mars_apr._mai_juni_juli_aug._sep._okt._nov._des.'.split('_'),
-        monthsParseExact: true,
-        weekdays: 'søndag_mandag_tirsdag_onsdag_torsdag_fredag_lørdag'.split('_'),
-        weekdaysShort: 'sø._ma._ti._on._to._fr._lø.'.split('_'),
-        weekdaysMin: 'sø_ma_ti_on_to_fr_lø'.split('_'),
-        weekdaysParseExact: true,
-        longDateFormat: {
-            LT: 'HH:mm',
-            LTS: 'HH:mm:ss',
-            L: 'DD.MM.YYYY',
-            LL: 'D. MMMM YYYY',
-            LLL: 'D. MMMM YYYY [kl.] HH:mm',
-            LLLL: 'dddd D. MMMM YYYY [kl.] HH:mm',
-        },
-        calendar: {
-            sameDay: '[i dag kl.] LT',
-            nextDay: '[i morgen kl.] LT',
-            nextWeek: 'dddd [kl.] LT',
-            lastDay: '[i går kl.] LT',
-            lastWeek: '[forrige] dddd [kl.] LT',
-            sameElse: 'L',
-        },
-        relativeTime: {
-            future: 'om %s',
-            past: '%s siden',
-            s: 'noen sekunder',
-            ss: '%d sekunder',
-            m: 'ett minutt',
-            mm: '%d minutter',
-            h: 'en time',
-            hh: '%d timer',
-            d: 'en dag',
-            dd: '%d dager',
-            w: 'en uke',
-            ww: '%d uker',
-            M: 'en måned',
-            MM: '%d måneder',
-            y: 'ett år',
-            yy: '%d år',
-        },
-        dayOfMonthOrdinalParse: /\d{1,2}\./,
-        ordinal: '%d.',
-        week: {
-            dow: 1, // Monday is the first day of the week.
-            doy: 4, // The week that contains Jan 4th is the first week of the year.
-        },
-    });
-
-    return nb;
-
-})));
-});
-
-_commonjsHelpers.createCommonjsModule(function (module, exports) {
-(function (global, factory) {
-   typeof _commonjsHelpers.commonjsRequire === 'function' ? factory(moment.moment) :
-   factory(global.moment);
-}(_commonjsHelpers.commonjsGlobal, (function (moment) {
-    //! moment.js locale configuration
-
-    var sv = moment.defineLocale('sv', {
-        months: 'januari_februari_mars_april_maj_juni_juli_augusti_september_oktober_november_december'.split(
-            '_'
-        ),
-        monthsShort: 'jan_feb_mar_apr_maj_jun_jul_aug_sep_okt_nov_dec'.split('_'),
-        weekdays: 'söndag_måndag_tisdag_onsdag_torsdag_fredag_lördag'.split('_'),
-        weekdaysShort: 'sön_mån_tis_ons_tor_fre_lör'.split('_'),
-        weekdaysMin: 'sö_må_ti_on_to_fr_lö'.split('_'),
-        longDateFormat: {
-            LT: 'HH:mm',
-            LTS: 'HH:mm:ss',
-            L: 'YYYY-MM-DD',
-            LL: 'D MMMM YYYY',
-            LLL: 'D MMMM YYYY [kl.] HH:mm',
-            LLLL: 'dddd D MMMM YYYY [kl.] HH:mm',
-            lll: 'D MMM YYYY HH:mm',
-            llll: 'ddd D MMM YYYY HH:mm',
-        },
-        calendar: {
-            sameDay: '[Idag] LT',
-            nextDay: '[Imorgon] LT',
-            lastDay: '[Igår] LT',
-            nextWeek: '[På] dddd LT',
-            lastWeek: '[I] dddd[s] LT',
-            sameElse: 'L',
-        },
-        relativeTime: {
-            future: 'om %s',
-            past: 'för %s sedan',
-            s: 'några sekunder',
-            ss: '%d sekunder',
-            m: 'en minut',
-            mm: '%d minuter',
-            h: 'en timme',
-            hh: '%d timmar',
-            d: 'en dag',
-            dd: '%d dagar',
-            M: 'en månad',
-            MM: '%d månader',
-            y: 'ett år',
-            yy: '%d år',
-        },
-        dayOfMonthOrdinalParse: /\d{1,2}(\:e|\:a)/,
-        ordinal: function (number) {
-            var b = number % 10,
-                output =
-                    ~~((number % 100) / 10) === 1
-                        ? ':e'
-                        : b === 1
-                        ? ':a'
-                        : b === 2
-                        ? ':a'
-                        : b === 3
-                        ? ':e'
-                        : ':e';
-            return number + output;
-        },
-        week: {
-            dow: 1, // Monday is the first day of the week.
-            doy: 4, // The week that contains Jan 4th is the first week of the year.
-        },
-    });
-
-    return sv;
-
-})));
-});
-
 _commonjsHelpers.createCommonjsModule(function (module, exports) {
 (function (global, factory) {
    typeof _commonjsHelpers.commonjsRequire === 'function' ? factory(moment.moment) :
@@ -449,6 +392,71 @@ _commonjsHelpers.createCommonjsModule(function (module, exports) {
 })));
 });
 
+_commonjsHelpers.createCommonjsModule(function (module, exports) {
+(function (global, factory) {
+   typeof _commonjsHelpers.commonjsRequire === 'function' ? factory(moment.moment) :
+   factory(global.moment);
+}(_commonjsHelpers.commonjsGlobal, (function (moment) {
+    //! moment.js locale configuration
+
+    var nb = moment.defineLocale('nb', {
+        months: 'januar_februar_mars_april_mai_juni_juli_august_september_oktober_november_desember'.split(
+            '_'
+        ),
+        monthsShort:
+            'jan._feb._mars_apr._mai_juni_juli_aug._sep._okt._nov._des.'.split('_'),
+        monthsParseExact: true,
+        weekdays: 'søndag_mandag_tirsdag_onsdag_torsdag_fredag_lørdag'.split('_'),
+        weekdaysShort: 'sø._ma._ti._on._to._fr._lø.'.split('_'),
+        weekdaysMin: 'sø_ma_ti_on_to_fr_lø'.split('_'),
+        weekdaysParseExact: true,
+        longDateFormat: {
+            LT: 'HH:mm',
+            LTS: 'HH:mm:ss',
+            L: 'DD.MM.YYYY',
+            LL: 'D. MMMM YYYY',
+            LLL: 'D. MMMM YYYY [kl.] HH:mm',
+            LLLL: 'dddd D. MMMM YYYY [kl.] HH:mm',
+        },
+        calendar: {
+            sameDay: '[i dag kl.] LT',
+            nextDay: '[i morgen kl.] LT',
+            nextWeek: 'dddd [kl.] LT',
+            lastDay: '[i går kl.] LT',
+            lastWeek: '[forrige] dddd [kl.] LT',
+            sameElse: 'L',
+        },
+        relativeTime: {
+            future: 'om %s',
+            past: '%s siden',
+            s: 'noen sekunder',
+            ss: '%d sekunder',
+            m: 'ett minutt',
+            mm: '%d minutter',
+            h: 'en time',
+            hh: '%d timer',
+            d: 'en dag',
+            dd: '%d dager',
+            w: 'en uke',
+            ww: '%d uker',
+            M: 'en måned',
+            MM: '%d måneder',
+            y: 'ett år',
+            yy: '%d år',
+        },
+        dayOfMonthOrdinalParse: /\d{1,2}\./,
+        ordinal: '%d.',
+        week: {
+            dow: 1, // Monday is the first day of the week.
+            doy: 4, // The week that contains Jan 4th is the first week of the year.
+        },
+    });
+
+    return nb;
+
+})));
+});
+
 _commonjsHelpers.createCommonjsModule(function (module, exports) {
 (function (global, factory) {
    typeof _commonjsHelpers.commonjsRequire === 'function' ? factory(moment.moment) :
@@ -559,36 +567,77 @@ _commonjsHelpers.createCommonjsModule(function (module, exports) {
 })));
 });
 
-class DateFormatter {
-  constructor(language = 'en') {
-    this.language = language;
-  }
-  formatDate(date, dateFormat) {
-    if (date) {
-      return moment.moment(date).locale(this.getLanguage()).format(dateFormat);
-    }
-    return '';
-  }
-  parseDate(date, dateFormat) {
-    if (date) {
-      return moment.moment(date, dateFormat).toDate();
-    }
-    return null;
-  }
-  getLanguage() {
-    return this.language === 'no' ? 'nb' : this.language;
-  }
-  getDateFormat(type) {
-    return ({
-      date: 'L',
-      time: 'LT',
-      week: '[w] W GGGG',
-      month: 'MM/YYYY',
-      quarter: '[Q]Q YYYY',
-      year: 'YYYY',
-      datetime: 'L - LT',
-    }[type] || 'L - LT');
-  }
-}
-
-exports.DateFormatter = DateFormatter;
+_commonjsHelpers.createCommonjsModule(function (module, exports) {
+(function (global, factory) {
+   typeof _commonjsHelpers.commonjsRequire === 'function' ? factory(moment.moment) :
+   factory(global.moment);
+}(_commonjsHelpers.commonjsGlobal, (function (moment) {
+    //! moment.js locale configuration
+
+    var sv = moment.defineLocale('sv', {
+        months: 'januari_februari_mars_april_maj_juni_juli_augusti_september_oktober_november_december'.split(
+            '_'
+        ),
+        monthsShort: 'jan_feb_mar_apr_maj_jun_jul_aug_sep_okt_nov_dec'.split('_'),
+        weekdays: 'söndag_måndag_tisdag_onsdag_torsdag_fredag_lördag'.split('_'),
+        weekdaysShort: 'sön_mån_tis_ons_tor_fre_lör'.split('_'),
+        weekdaysMin: 'sö_må_ti_on_to_fr_lö'.split('_'),
+        longDateFormat: {
+            LT: 'HH:mm',
+            LTS: 'HH:mm:ss',
+            L: 'YYYY-MM-DD',
+            LL: 'D MMMM YYYY',
+            LLL: 'D MMMM YYYY [kl.] HH:mm',
+            LLLL: 'dddd D MMMM YYYY [kl.] HH:mm',
+            lll: 'D MMM YYYY HH:mm',
+            llll: 'ddd D MMM YYYY HH:mm',
+        },
+        calendar: {
+            sameDay: '[Idag] LT',
+            nextDay: '[Imorgon] LT',
+            lastDay: '[Igår] LT',
+            nextWeek: '[På] dddd LT',
+            lastWeek: '[I] dddd[s] LT',
+            sameElse: 'L',
+        },
+        relativeTime: {
+            future: 'om %s',
+            past: 'för %s sedan',
+            s: 'några sekunder',
+            ss: '%d sekunder',
+            m: 'en minut',
+            mm: '%d minuter',
+            h: 'en timme',
+            hh: '%d timmar',
+            d: 'en dag',
+            dd: '%d dagar',
+            M: 'en månad',
+            MM: '%d månader',
+            y: 'ett år',
+            yy: '%d år',
+        },
+        dayOfMonthOrdinalParse: /\d{1,2}(\:e|\:a)/,
+        ordinal: function (number) {
+            var b = number % 10,
+                output =
+                    ~~((number % 100) / 10) === 1
+                        ? ':e'
+                        : b === 1
+                        ? ':a'
+                        : b === 2
+                        ? ':a'
+                        : b === 3
+                        ? ':e'
+                        : ':e';
+            return number + output;
+        },
+        week: {
+            dow: 1, // Monday is the first day of the week.
+            doy: 4, // The week that contains Jan 4th is the first week of the year.
+        },
+    });
+
+    return sv;
+
+})));
+});

package/dist/cjs/{translations-ca7279bc.js → translations-f8080c48.js}

@@ -1,6 +1,11 @@
 'use strict';
 
 const da = {
+  'callout.note': 'Bemærk',
+  'callout.important': 'Vigtig',
+  'callout.tip': 'Tip',
+  'callout.caution': 'Advarsel',
+  'callout.warning': 'Advarsel',
   'date-picker.today': 'Idag',
   'date-picker.month.heading': 'Måned',
   'date-picker.quarter.heading': 'Kvartal',
@@ -10,6 +15,11 @@ const da = {
 };
 
 const en = {
+  'callout.note': 'Note',
+  'callout.important': 'Important',
+  'callout.tip': 'Tip',
+  'callout.caution': 'Caution',
+  'callout.warning': 'Warning',
   'date-picker.today': 'Today',
   'date-picker.month.heading': 'Month',
   'date-picker.quarter.heading': 'Quarter',
@@ -21,6 +31,11 @@ const en = {
 };
 
 const fi = {
+  'callout.note': 'Huomio',
+  'callout.important': 'Tärkeää',
+  'callout.tip': 'Vinkki',
+  'callout.caution': 'Varoitus',
+  'callout.warning': 'Varoitus',
   'date-picker.today': 'Tänään',
   'date-picker.month.heading': 'Kuukausi',
   'date-picker.quarter.heading': 'Vuosineljännes',
@@ -30,6 +45,11 @@ const fi = {
 };
 
 const nl = {
+  'callout.note': 'Opmerking',
+  'callout.important': 'Belangrijk',
+  'callout.tip': 'Tip',
+  'callout.caution': 'Waarschuwing',
+  'callout.warning': 'Waarschuwing',
   'date-picker.today': 'Vandaag',
   'date-picker.month.heading': 'Maand',
   'date-picker.quarter.heading': 'Kwartaal',
@@ -39,6 +59,11 @@ const nl = {
 };
 
 const no = {
+  'callout.note': 'Note',
+  'callout.important': 'Viktig',
+  'callout.tip': 'Tip',
+  'callout.caution': 'Advarsel',
+  'callout.warning': 'Advarsel',
   'date-picker.today': 'I dag',
   'date-picker.month.heading': 'Måned',
   'date-picker.quarter.heading': 'Kvartal',
@@ -48,6 +73,11 @@ const no = {
 };
 
 const sv = {
+  'callout.note': 'Obs',
+  'callout.important': 'Viktigt',
+  'callout.tip': 'Tips',
+  'callout.caution': 'Varning',
+  'callout.warning': 'Varning',
   'date-picker.today': 'Idag',
   'date-picker.month.heading': 'Månad',
   'date-picker.quarter.heading': 'Kvartal',

package/dist/collection/collection-manifest.json

@@ -4,6 +4,7 @@
     "./components/banner/banner.js",
     "./components/button/button.js",
     "./components/button-group/button-group.js",
+    "./components/callout/callout.js",
     "./components/checkbox/checkbox.js",
     "./components/chip-set/chip-set.js",
     "./components/circular-progress/circular-progress.js",

package/dist/collection/components/badge/badge.css

@@ -64,6 +64,14 @@
   );
 }
 
+/**
+ * Note! This file is exported to `dist/scss/` in the published
+ * node module, for consumer projects to import.
+ * That means this file cannot import from any file that isn't
+ * also exported, keeping the same relative path.
+ *
+ * Or, just don't import anything, that works too.
+ */
 /**
  * @prop --badge-background-color: badge background color
  * @prop --badge-text-color: badge text color
@@ -72,7 +80,17 @@
   display: none;
 }
 
-:host {
+:host(limel-badge) {
+  --limel-min-badge-size: 1rem;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  flex-shrink: 0;
+  min-height: var(--limel-min-badge-size);
+  min-width: var(--limel-min-badge-size);
+}
+
+span {
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   font-family: Roboto, sans-serif;
@@ -80,28 +98,25 @@
   font-family: var(--mdc-typography-font-family, Roboto, sans-serif);
   cursor: default;
   box-sizing: border-box;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-shrink: 0;
-  font-size: 0.6875rem;
-  height: 1.25rem;
-  line-height: 1;
-  min-width: 1.25rem;
-  padding: 0 0.3125rem;
-  border-radius: 1.25rem;
-  background-color: var(--badge-background-color, rgb(var(--contrast-500)));
-  color: var(--badge-text-color, rgb(var(--contrast-1200)));
-}
-
-span {
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
-  min-width: 0;
-  max-width: 2.25rem;
+  text-align: center;
+  font-size: 0.6875rem;
+  line-height: var(--limel-min-badge-size);
+  color: var(--badge-text-color, rgb(var(--contrast-1200)));
+  border-radius: var(--limel-min-badge-size);
+  max-height: var(--limel-min-badge-size);
+  min-width: 0.5rem;
+  min-height: 0.5rem;
+  background-color: var(--badge-background-color, rgb(var(--contrast-500)));
+}
+span:not(:empty) {
+  min-width: var(--limel-min-badge-size);
+  max-width: 2.75rem;
+  padding: 0 0.28125rem;
 }
 
-:host(.has-large-label) {
+:host(.has-large-label) span {
   cursor: help;
 }

package/dist/collection/components/badge/badge.js

@@ -1,8 +1,10 @@
 import { h, Host } from '@stencil/core';
 import { abbreviate } from './format';
 /**
- * The Badge component can display both `number` and `string` as `label`.
+ * The Badge component can be used to display a notification badge,
+ * optionally with a number or a text label.
  *
+ * @exampleComponent limel-example-badge
  * @exampleComponent limel-example-badge-number
  * @exampleComponent limel-example-badge-string
  */
@@ -13,15 +15,13 @@ export class Badge {
   render() {
     return (h(Host, { title: this.labelIsLarge() ? this.label : '', class: {
         'has-large-label': this.labelIsLarge(),
-      } }, this.renderLabel()));
+      } }, h("span", null, this.renderLabel())));
   }
   renderLabel() {
     if (typeof this.label === 'number') {
-      return h("span", null, abbreviate(this.label));
-    }
-    else if (typeof this.label === 'string') {
-      return h("span", null, this.label);
+      return abbreviate(this.label);
     }
+    return this.label;
   }
   labelIsLarge() {
     const largeNumericLabel = 999;
@@ -56,7 +56,7 @@ export class Badge {
           "references": {}
         },
         "required": false,
-        "optional": false,
+        "optional": true,
         "docs": {
           "tags": [],
           "text": "Label to display in the badge.\nNumeric labels larger than 999 will be rounded and abbreviated.\nString labels get truncated if their length is longer than\nsix characters."

package/dist/collection/components/banner/banner.css

@@ -69,8 +69,7 @@
  *
  * Nothing in this file may output any CSS
  * without being explicitly used by outside code.
- */
-/**
+ */ /**
  * @prop --banner-icon-fill-color: Color of the banner icon.
  * @prop --banner-icon-background-color: Background color of the banner icon.
  */