@luzmo/analytics-components-kit 1.0.1-alpha.56 → 1.0.1-alpha.57
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.
|
@@ -40,16 +40,17 @@
|
|
|
40
40
|
${this.indeterminate?F():i.Rt``}
|
|
41
41
|
</span>
|
|
42
42
|
<label id="label" for="input"><slot></slot></label>
|
|
43
|
-
`}updated(o){super.updated(o),o.has("disabled")&&(o.get("disabled")!==void 0||this.disabled)&&(this.disabled?(this.inputElement.tabIndex=this.tabIndex,this.tabIndex=-1):(this.tabIndex=this.inputElement.tabIndex,this.inputElement.removeAttribute("tabindex")),this.inputElement.disabled=this.disabled),o.has("indeterminate")&&(this.inputElement.indeterminate=this.indeterminate),o.has("invalid")&&(this.invalid?this.inputElement.setAttribute("aria-invalid","true"):this.inputElement.removeAttribute("aria-invalid"))}};O.shadowRootOptions={...i.It.shadowRootOptions,delegatesFocus:!0};let d=O;u([i.zt({type:Boolean,reflect:!0})],d.prototype,"disabled");u([i.zt({type:Boolean,reflect:!0})],d.prototype,"indeterminate");u([i.zt({type:Boolean,reflect:!0})],d.prototype,"autofocus");u([i.zt({type:Boolean,reflect:!0})],d.prototype,"invalid");u([i.zt({type:Boolean,reflect:!0})],d.prototype,"emphasized");u([i.zt({reflect:!0,type:Number,attribute:"tabindex"})],d.prototype,"tabIndex");customElements.get("luzmo-checkbox")||customElements.define("luzmo-checkbox",d);const L={none:()=>t.msg("None",{desc:"Period option"}),past:()=>t.msg("Past value",{desc:"Period option"}),absoluteChange:()=>t.msg("Absolute change",{desc:"Period option"}),percentageChange:()=>t.msg("% change",{desc:"Period option"})},z=[{key:"periods",i18n:()=>t.msg("Periods",{desc:"Period option"})},{key:"years",i18n:()=>t.msg("Years",{desc:"Period option"})},{key:"quarters",i18n:()=>t.msg("Quarters",{desc:"Period option"})},{key:"months",i18n:()=>t.msg("Months",{desc:"Period option"})},{key:"weeks",i18n:()=>t.msg("Weeks",{desc:"Period option"})},{key:"days",i18n:()=>t.msg("Days",{desc:"Period option"})},{key:"hours",i18n:()=>t.msg("Hours",{desc:"Period option"})},{key:"minutes",i18n:()=>t.msg("Minutes",{desc:"Period option"})},{key:"seconds",i18n:()=>t.msg("Seconds",{desc:"Period option"})}],A=":host{font-family:var(--luzmo-display-settings-period-over-period-font-family, var(--luzmo-font-family));font-size:var(--luzmo-display-settings-period-over-period-font-size, var(--display-settings-period-over-period-font-size));color:var(--luzmo-display-settings-period-over-period-color, var(--luzmo-font-color))}:host .settings-container{display:flex;flex-direction:column;gap:var(--luzmo-display-settings-vertical-gap, var(--luzmo-spacing-2))}:host .settings-row{display:flex;justify-content:flex-start;align-items:center;gap:var(--luzmo-display-settings-period-over-period-gap, var(--display-settings-period-over-period-gap))}:host{--display-settings-period-over-period-gap: var(--luzmo-spacing-3);--display-settings-period-over-period-font-size: var(--luzmo-font-size)}:host([size=s]){--display-settings-period-over-period-gap: var(--luzmo-spacing-3);--display-settings-period-over-period-font-size: var(--luzmo-font-size-s)}:host([size=l]){--display-settings-period-over-period-gap: var(--luzmo-spacing-4);--display-settings-period-over-period-font-size: var(--luzmo-font-size-l)}:host([size=xl]){--display-settings-period-over-period-gap: var(--luzmo-spacing-5);--display-settings-period-over-period-font-size: var(--luzmo-font-size-xl)}";var N=Object.defineProperty,B=Object.getOwnPropertyDescriptor,h=(n,o,e,c)=>{for(var r=c>1?void 0:c?B(o,e):o,l=n.length-1,a;l>=0;l--)(a=n[l])&&(r=(c?a(o,e,r):a(r))||r);return c&&r&&N(o,e,r),r};exports.LuzmoDisplaySettingsPeriodOverPeriod=class extends _.SizedMixin(I.LuzmoElement,{validSizes:Object.values(_.ElementSizes)}){constructor(){super(...arguments),this.language="en",this.slotContent={}}static get styles(){return[s.r(A)]}willUpdate(o){var e,c,r,l,a,m,b,v,f,k,y,P,w,C;if(o.has("slotContent")){this._periodComparison=(c=(e=this.slotContent)==null?void 0:e.periodOverPeriod)==null?void 0:c.type,this._numberPeriods=(l=(r=this.slotContent)==null?void 0:r.periodOverPeriod)==null?void 0:l.quantity;const p=(m=(a=this.slotContent)==null?void 0:a.periodOverPeriod)==null?void 0:m.level;this._periodLevel=typeof p=="number"&&p>=0&&p<z.length?z[p].key:((v=(b=this.slotContent)==null?void 0:b.periodOverPeriod)==null?void 0:v.level)||"periods",this._incompletePeriods=(k=(f=this.slotContent)==null?void 0:f.periodOverPeriod)==null?void 0:k.periodToDate,this._minLevel=((P=(y=this.slotContent)==null?void 0:y.periodOverPeriod)==null?void 0:P.minLevel)??((w=this.slotContent)==null?void 0:w.lowestLevel)??(((C=this.slotContent)==null?void 0:C.subtype)==="date"?5:9)}this._periodComparison=this._periodComparison??"none",this._numberPeriods=this._numberPeriods??1,this._periodLevel=this._periodLevel??"periods",this._incompletePeriods=this._incompletePeriods??!1,this._minLevel=this._minLevel??9,o.has("language")&&this.language!==t.getLocale()&&([...t.targetLocales].includes(this.language??"en")||this.language==="en")&&t.setLocale(this.language)}setPeriodComparison(){var v;const o={...this.slotContent};this._periodComparison=this._periodComparisonElement.value;const e=S.decomposeNumericFormat((v=this.slotContent)==null?void 0:v.format),c=["%","y","a%","ay"].includes(e.typeFormat),r=e.typeFormat.includes("a"),l=r?"a":"",a=e.comma===","||r?",":"",m=e.precision?Number.parseInt(e.precision.replace(".",""),10):0,b=["z","az","y","ay","w","aw"].includes(e.typeFormat);this._periodComparison==="percentageChange"&&!c?o.format=`${a}.${m}${l}${b?"y":"%"}`:this._periodComparison!=="percentageChange"&&o.subtype==="currency"&&c&&(o.format=`${a}.${m}${l}${b?"z":"f"}`),this.sendEvent(o)}setNumberOfPeriods(){this._numberPeriods=Number.parseInt(this._numberPeriodsElement.value,10);const o={...this.slotContent};this.sendEvent(o)}setPeriodLevel(){this._periodLevel=this._periodLevelElement.value;const o={...this.slotContent};this.sendEvent(o)}setIncompletePeriods(){this._incompletePeriods=this._incompletePeriodsElement.checked;const o={...this.slotContent};this.sendEvent(o)}sendEvent(o){const e={...o},c=z.findIndex(r=>r.key===this._periodLevel);e.periodOverPeriod={type:this._periodComparison,level:Math.max(c,0),quantity:this._numberPeriods,periodToDate:this._incompletePeriods,minLevel:this._minLevel},this._periodComparison==="none"&&delete e.periodOverPeriod,this.dispatchEvent(new CustomEvent("slot-content-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{slotContent:e}}))}renderPeriodSettings(){const o=z.slice(0,(this._minLevel??0)+1).map(e=>s.x`<luzmo-menu-item value=${e.key}>
|
|
43
|
+
`}updated(o){super.updated(o),o.has("disabled")&&(o.get("disabled")!==void 0||this.disabled)&&(this.disabled?(this.inputElement.tabIndex=this.tabIndex,this.tabIndex=-1):(this.tabIndex=this.inputElement.tabIndex,this.inputElement.removeAttribute("tabindex")),this.inputElement.disabled=this.disabled),o.has("indeterminate")&&(this.inputElement.indeterminate=this.indeterminate),o.has("invalid")&&(this.invalid?this.inputElement.setAttribute("aria-invalid","true"):this.inputElement.removeAttribute("aria-invalid"))}};O.shadowRootOptions={...i.It.shadowRootOptions,delegatesFocus:!0};let d=O;u([i.zt({type:Boolean,reflect:!0})],d.prototype,"disabled");u([i.zt({type:Boolean,reflect:!0})],d.prototype,"indeterminate");u([i.zt({type:Boolean,reflect:!0})],d.prototype,"autofocus");u([i.zt({type:Boolean,reflect:!0})],d.prototype,"invalid");u([i.zt({type:Boolean,reflect:!0})],d.prototype,"emphasized");u([i.zt({reflect:!0,type:Number,attribute:"tabindex"})],d.prototype,"tabIndex");customElements.get("luzmo-checkbox")||customElements.define("luzmo-checkbox",d);const L={none:()=>t.msg("None",{desc:"Period option"}),past:()=>t.msg("Past value",{desc:"Period option"}),absoluteChange:()=>t.msg("Absolute change",{desc:"Period option"}),percentageChange:()=>t.msg("% change",{desc:"Period option"})},z=[{key:"periods",i18n:()=>t.msg("Periods",{desc:"Period option"})},{key:"years",i18n:()=>t.msg("Years",{desc:"Period option"})},{key:"quarters",i18n:()=>t.msg("Quarters",{desc:"Period option"})},{key:"months",i18n:()=>t.msg("Months",{desc:"Period option"})},{key:"weeks",i18n:()=>t.msg("Weeks",{desc:"Period option"})},{key:"days",i18n:()=>t.msg("Days",{desc:"Period option"})},{key:"hours",i18n:()=>t.msg("Hours",{desc:"Period option"})},{key:"minutes",i18n:()=>t.msg("Minutes",{desc:"Period option"})},{key:"seconds",i18n:()=>t.msg("Seconds",{desc:"Period option"})}],A=":host{font-family:var(--luzmo-display-settings-period-over-period-font-family, var(--luzmo-font-family));font-size:var(--luzmo-display-settings-period-over-period-font-size, var(--display-settings-period-over-period-font-size));color:var(--luzmo-display-settings-period-over-period-color, var(--luzmo-font-color))}:host .settings-container{display:flex;flex-direction:column;gap:var(--luzmo-display-settings-vertical-gap, var(--luzmo-spacing-2))}:host .settings-row{display:flex;justify-content:flex-start;align-items:center;gap:var(--luzmo-display-settings-period-over-period-gap, var(--display-settings-period-over-period-gap))}:host .setting.period-number-setting{display:flex;align-items:center}:host{--display-settings-period-over-period-gap: var(--luzmo-spacing-3);--display-settings-period-over-period-font-size: var(--luzmo-font-size)}:host([size=s]){--display-settings-period-over-period-gap: var(--luzmo-spacing-3);--display-settings-period-over-period-font-size: var(--luzmo-font-size-s)}:host([size=l]){--display-settings-period-over-period-gap: var(--luzmo-spacing-4);--display-settings-period-over-period-font-size: var(--luzmo-font-size-l)}:host([size=xl]){--display-settings-period-over-period-gap: var(--luzmo-spacing-5);--display-settings-period-over-period-font-size: var(--luzmo-font-size-xl)}";var N=Object.defineProperty,B=Object.getOwnPropertyDescriptor,h=(n,o,e,c)=>{for(var r=c>1?void 0:c?B(o,e):o,l=n.length-1,a;l>=0;l--)(a=n[l])&&(r=(c?a(o,e,r):a(r))||r);return c&&r&&N(o,e,r),r};exports.LuzmoDisplaySettingsPeriodOverPeriod=class extends _.SizedMixin(I.LuzmoElement,{validSizes:Object.values(_.ElementSizes)}){constructor(){super(...arguments),this.language="en",this.slotContent={}}static get styles(){return[s.r(A)]}willUpdate(o){var e,c,r,l,a,m,b,v,f,k,y,P,w,C;if(o.has("slotContent")){this._periodComparison=(c=(e=this.slotContent)==null?void 0:e.periodOverPeriod)==null?void 0:c.type,this._numberPeriods=(l=(r=this.slotContent)==null?void 0:r.periodOverPeriod)==null?void 0:l.quantity;const p=(m=(a=this.slotContent)==null?void 0:a.periodOverPeriod)==null?void 0:m.level;this._periodLevel=typeof p=="number"&&p>=0&&p<z.length?z[p].key:((v=(b=this.slotContent)==null?void 0:b.periodOverPeriod)==null?void 0:v.level)||"periods",this._incompletePeriods=(k=(f=this.slotContent)==null?void 0:f.periodOverPeriod)==null?void 0:k.periodToDate,this._minLevel=((P=(y=this.slotContent)==null?void 0:y.periodOverPeriod)==null?void 0:P.minLevel)??((w=this.slotContent)==null?void 0:w.lowestLevel)??(((C=this.slotContent)==null?void 0:C.subtype)==="date"?5:9)}this._periodComparison=this._periodComparison??"none",this._numberPeriods=this._numberPeriods??1,this._periodLevel=this._periodLevel??"periods",this._incompletePeriods=this._incompletePeriods??!1,this._minLevel=this._minLevel??9,o.has("language")&&this.language!==t.getLocale()&&([...t.targetLocales].includes(this.language??"en")||this.language==="en")&&t.setLocale(this.language)}setPeriodComparison(){var v;const o={...this.slotContent};this._periodComparison=this._periodComparisonElement.value;const e=S.decomposeNumericFormat((v=this.slotContent)==null?void 0:v.format),c=["%","y","a%","ay"].includes(e.typeFormat),r=e.typeFormat.includes("a"),l=r?"a":"",a=e.comma===","||r?",":"",m=e.precision?Number.parseInt(e.precision.replace(".",""),10):0,b=["z","az","y","ay","w","aw"].includes(e.typeFormat);this._periodComparison==="percentageChange"&&!c?o.format=`${a}.${m}${l}${b?"y":"%"}`:this._periodComparison!=="percentageChange"&&o.subtype==="currency"&&c&&(o.format=`${a}.${m}${l}${b?"z":"f"}`),this.sendEvent(o)}setNumberOfPeriods(){this._numberPeriods=Number.parseInt(this._numberPeriodsElement.value,10);const o={...this.slotContent};this.sendEvent(o)}setPeriodLevel(){this._periodLevel=this._periodLevelElement.value;const o={...this.slotContent};this.sendEvent(o)}setIncompletePeriods(){this._incompletePeriods=this._incompletePeriodsElement.checked;const o={...this.slotContent};this.sendEvent(o)}sendEvent(o){const e={...o},c=z.findIndex(r=>r.key===this._periodLevel);e.periodOverPeriod={type:this._periodComparison,level:Math.max(c,0),quantity:this._numberPeriods,periodToDate:this._incompletePeriods,minLevel:this._minLevel},this._periodComparison==="none"&&delete e.periodOverPeriod,this.dispatchEvent(new CustomEvent("slot-content-changed",{bubbles:!0,composed:!0,cancelable:!0,detail:{slotContent:e}}))}renderPeriodSettings(){const o=z.slice(0,(this._minLevel??0)+1).map(e=>s.x`<luzmo-menu-item value=${e.key}>
|
|
44
44
|
${e.i18n()}
|
|
45
45
|
</luzmo-menu-item>`);return s.x` <div class="settings-row">
|
|
46
|
-
<div class="setting">
|
|
46
|
+
<div class="setting period-number-setting">
|
|
47
47
|
${["percentageChange","absoluteChange"].includes(this._periodComparison??"")?s.x`<luzmo-field-label for="number-periods" side-aligned="start">
|
|
48
48
|
${t.msg("From",{desc:"Label for number of periods"})}
|
|
49
49
|
</luzmo-field-label>`:""}
|
|
50
50
|
<luzmo-number-field
|
|
51
51
|
id="number-periods"
|
|
52
52
|
min="1"
|
|
53
|
+
.size=${this.size}
|
|
53
54
|
max="9999999999"
|
|
54
55
|
value=${this._numberPeriods??1}
|
|
55
56
|
@change=${this.setNumberOfPeriods}
|
|
@@ -143,7 +143,7 @@ const _ = {
|
|
|
143
143
|
{ key: "hours", i18n: () => t("Hours", { desc: "Period option" }) },
|
|
144
144
|
{ key: "minutes", i18n: () => t("Minutes", { desc: "Period option" }) },
|
|
145
145
|
{ key: "seconds", i18n: () => t("Seconds", { desc: "Period option" }) }
|
|
146
|
-
], K = ":host{font-family:var(--luzmo-display-settings-period-over-period-font-family, var(--luzmo-font-family));font-size:var(--luzmo-display-settings-period-over-period-font-size, var(--display-settings-period-over-period-font-size));color:var(--luzmo-display-settings-period-over-period-color, var(--luzmo-font-color))}:host .settings-container{display:flex;flex-direction:column;gap:var(--luzmo-display-settings-vertical-gap, var(--luzmo-spacing-2))}:host .settings-row{display:flex;justify-content:flex-start;align-items:center;gap:var(--luzmo-display-settings-period-over-period-gap, var(--display-settings-period-over-period-gap))}:host{--display-settings-period-over-period-gap: var(--luzmo-spacing-3);--display-settings-period-over-period-font-size: var(--luzmo-font-size)}:host([size=s]){--display-settings-period-over-period-gap: var(--luzmo-spacing-3);--display-settings-period-over-period-font-size: var(--luzmo-font-size-s)}:host([size=l]){--display-settings-period-over-period-gap: var(--luzmo-spacing-4);--display-settings-period-over-period-font-size: var(--luzmo-font-size-l)}:host([size=xl]){--display-settings-period-over-period-gap: var(--luzmo-spacing-5);--display-settings-period-over-period-font-size: var(--luzmo-font-size-xl)}";
|
|
146
|
+
], K = ":host{font-family:var(--luzmo-display-settings-period-over-period-font-family, var(--luzmo-font-family));font-size:var(--luzmo-display-settings-period-over-period-font-size, var(--display-settings-period-over-period-font-size));color:var(--luzmo-display-settings-period-over-period-color, var(--luzmo-font-color))}:host .settings-container{display:flex;flex-direction:column;gap:var(--luzmo-display-settings-vertical-gap, var(--luzmo-spacing-2))}:host .settings-row{display:flex;justify-content:flex-start;align-items:center;gap:var(--luzmo-display-settings-period-over-period-gap, var(--display-settings-period-over-period-gap))}:host .setting.period-number-setting{display:flex;align-items:center}:host{--display-settings-period-over-period-gap: var(--luzmo-spacing-3);--display-settings-period-over-period-font-size: var(--luzmo-font-size)}:host([size=s]){--display-settings-period-over-period-gap: var(--luzmo-spacing-3);--display-settings-period-over-period-font-size: var(--luzmo-font-size-s)}:host([size=l]){--display-settings-period-over-period-gap: var(--luzmo-spacing-4);--display-settings-period-over-period-font-size: var(--luzmo-font-size-l)}:host([size=xl]){--display-settings-period-over-period-gap: var(--luzmo-spacing-5);--display-settings-period-over-period-font-size: var(--luzmo-font-size-xl)}";
|
|
147
147
|
var X = Object.defineProperty, oo = Object.getOwnPropertyDescriptor, s = (e, o, i, l) => {
|
|
148
148
|
for (var r = l > 1 ? void 0 : l ? oo(o, i) : o, c = e.length - 1, a; c >= 0; c--)
|
|
149
149
|
(a = e[c]) && (r = (l ? a(o, i, r) : a(r)) || r);
|
|
@@ -225,7 +225,7 @@ let n = class extends V(
|
|
|
225
225
|
</luzmo-menu-item>`
|
|
226
226
|
);
|
|
227
227
|
return z` <div class="settings-row">
|
|
228
|
-
<div class="setting">
|
|
228
|
+
<div class="setting period-number-setting">
|
|
229
229
|
${["percentageChange", "absoluteChange"].includes(
|
|
230
230
|
this._periodComparison ?? ""
|
|
231
231
|
) ? z`<luzmo-field-label for="number-periods" side-aligned="start">
|
|
@@ -234,6 +234,7 @@ let n = class extends V(
|
|
|
234
234
|
<luzmo-number-field
|
|
235
235
|
id="number-periods"
|
|
236
236
|
min="1"
|
|
237
|
+
.size=${this.size}
|
|
237
238
|
max="9999999999"
|
|
238
239
|
value=${this._numberPeriods ?? 1}
|
|
239
240
|
@change=${this.setNumberOfPeriods}
|