@paperless/core 1.38.7 → 1.38.9

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.
@@ -17,7 +17,9 @@ export declare class Stepper {
17
17
  private _el;
18
18
  private _rendering;
19
19
  private _loaded;
20
+ private _onSlotChange;
21
+ private _generateSteps;
20
22
  componentDidLoad(): void;
21
23
  render(): any;
22
- private _generateSteps;
24
+ protected _onActiveStepChange(): void;
23
25
  }
package/hydrate/index.js CHANGED
@@ -21377,97 +21377,103 @@ const stepperComponentCss = "/*!@.flex*/.flex.sc-p-stepper{display:flex!importan
21377
21377
  class Stepper {
21378
21378
  constructor(hostRef) {
21379
21379
  registerInstance(this, hostRef);
21380
- this._rendering = false;
21381
21380
  this._loaded = false;
21381
+ // private _steps: Array<HTMLPStepperItemElement>;
21382
+ this._onSlotChange = (_e) => this._generateSteps();
21383
+ this._generateSteps = async (firstLoad = false) => {
21384
+ if (!firstLoad && (!this._el || this._rendering || !this._loaded)) {
21385
+ return;
21386
+ }
21387
+ console.log('Start rendering');
21388
+ this._rendering = true;
21389
+ let activeStep = this.activeStep - 1 || 0;
21390
+ const items = this._el.querySelectorAll('p-stepper-item');
21391
+ if (!this.activeStep || activeStep < 0) {
21392
+ for (let i = 0; i < (items === null || items === void 0 ? void 0 : items.length); i++) {
21393
+ const item = items.item(i);
21394
+ if (item.active) {
21395
+ activeStep = i;
21396
+ }
21397
+ if (activeStep < 0 && item.finished) {
21398
+ activeStep = i + 1;
21399
+ }
21400
+ }
21401
+ }
21402
+ for (let i = 0; i < (items === null || items === void 0 ? void 0 : items.length); i++) {
21403
+ let directionChanged = false;
21404
+ const item = items.item(i);
21405
+ item.active = i === activeStep;
21406
+ item.finished = i < activeStep;
21407
+ if (item.direction !== this.direction) {
21408
+ directionChanged = true;
21409
+ }
21410
+ item.direction = this.direction;
21411
+ item.align =
21412
+ i === 0 ? 'start' : i === (items === null || items === void 0 ? void 0 : items.length) - 1 ? 'end' : 'center';
21413
+ item.contentPosition = this.contentPosition;
21414
+ if (i < items.length - 1) {
21415
+ const nextItem = item.nextElementSibling;
21416
+ if (nextItem &&
21417
+ nextItem.tagName.toLowerCase() === 'p-stepper-item') {
21418
+ // super hacky, but we want to wait for the css of the `item.direction` change to be applied before querying for the item.clientHeight
21419
+ // otherwise we always get the initial "16"
21420
+ if (directionChanged) {
21421
+ await new Promise((resolve) => setTimeout(resolve, 10));
21422
+ }
21423
+ const heightDiff = (item.clientHeight > 16
21424
+ ? item.clientHeight - 16
21425
+ : item.clientHeight) / 2;
21426
+ const stepperLine = document.createElement('p-stepper-line');
21427
+ stepperLine.direction = this.direction;
21428
+ stepperLine.active = i <= activeStep;
21429
+ if (heightDiff > 0 && this.direction === 'vertical') {
21430
+ stepperLine.style.marginTop = `-${heightDiff / 16}rem`;
21431
+ stepperLine.style.marginBottom = `-${heightDiff / 16}rem`;
21432
+ stepperLine.style.minHeight = `calc(1rem + ${(heightDiff * 2) / 16}rem)`;
21433
+ }
21434
+ this._el.insertBefore(stepperLine, nextItem);
21435
+ const previous = stepperLine.previousElementSibling;
21436
+ if (previous &&
21437
+ previous.tagName.toLowerCase() === 'p-stepper-line') {
21438
+ previous.remove();
21439
+ }
21440
+ continue;
21441
+ }
21442
+ }
21443
+ if (i > 0) {
21444
+ const previousItem = item.previousElementSibling;
21445
+ if (previousItem.tagName.toLowerCase() === 'p-stepper-line') {
21446
+ previousItem.direction = this.direction;
21447
+ previousItem.active = item.active || item.finished;
21448
+ }
21449
+ }
21450
+ }
21451
+ const lines = this._el.querySelectorAll('p-stepper-line + p-stepper-line, p-stepper-line:not(:has(+ p-stepper-item))');
21452
+ for (let j = lines.length - 1; j >= 0; j--) {
21453
+ const line = lines.item(j);
21454
+ line.remove();
21455
+ }
21456
+ console.log('Done rendering');
21457
+ setTimeout(() => (this._rendering = false), 100);
21458
+ };
21382
21459
  this.activeStep = 1;
21383
21460
  this.direction = 'horizontal';
21384
21461
  this.contentPosition = 'end';
21462
+ this._rendering = false;
21385
21463
  }
21386
- // private _steps: Array<HTMLPStepperItemElement>;
21387
21464
  componentDidLoad() {
21388
21465
  this._loaded = true;
21389
21466
  this._generateSteps(true);
21390
21467
  }
21391
21468
  render() {
21392
- return (hAsync(Host, { class: "p-stepper" }, hAsync("slot", { onSlotchange: () => this._generateSteps() })));
21469
+ return (hAsync(Host, { class: "p-stepper" }, hAsync("slot", { onSlotchange: this._onSlotChange })));
21393
21470
  }
21394
- async _generateSteps(firstLoad = false) {
21395
- if (!firstLoad && (!this._el || this._rendering || !this._loaded)) {
21396
- return;
21397
- }
21398
- this._rendering = true;
21399
- let activeStep = this.activeStep - 1 || 0;
21400
- const items = this._el.querySelectorAll('p-stepper-item');
21401
- if (!this.activeStep || activeStep < 0) {
21402
- for (let i = 0; i < (items === null || items === void 0 ? void 0 : items.length); i++) {
21403
- const item = items.item(i);
21404
- if (item.active) {
21405
- activeStep = i;
21406
- }
21407
- if (activeStep < 0 && item.finished) {
21408
- activeStep = i + 1;
21409
- }
21410
- }
21411
- }
21412
- for (let i = 0; i < (items === null || items === void 0 ? void 0 : items.length); i++) {
21413
- let directionChanged = false;
21414
- const item = items.item(i);
21415
- item.active = i === activeStep;
21416
- item.finished = i < activeStep;
21417
- if (item.direction !== this.direction) {
21418
- directionChanged = true;
21419
- }
21420
- item.direction = this.direction;
21421
- item.align =
21422
- i === 0 ? 'start' : i === (items === null || items === void 0 ? void 0 : items.length) - 1 ? 'end' : 'center';
21423
- item.contentPosition = this.contentPosition;
21424
- if (i < items.length - 1) {
21425
- const nextItem = item.nextElementSibling;
21426
- if (nextItem &&
21427
- nextItem.tagName.toLowerCase() === 'p-stepper-item') {
21428
- // super hacky, but we want to wait for the css of the `item.direction` change to be applied before querying for the item.clientHeight
21429
- // otherwise we always get the initial "16"
21430
- if (directionChanged) {
21431
- await new Promise((resolve) => setTimeout(resolve, 10));
21432
- }
21433
- const heightDiff = (item.clientHeight > 16
21434
- ? item.clientHeight - 16
21435
- : item.clientHeight) / 2;
21436
- const stepperLine = document.createElement('p-stepper-line');
21437
- stepperLine.direction = this.direction;
21438
- stepperLine.active = i <= activeStep;
21439
- if (heightDiff > 0 && this.direction === 'vertical') {
21440
- stepperLine.style.marginTop = `-${heightDiff / 16}rem`;
21441
- stepperLine.style.marginBottom = `-${heightDiff / 16}rem`;
21442
- stepperLine.style.minHeight = `calc(1rem + ${(heightDiff * 2) / 16}rem)`;
21443
- }
21444
- this._el.insertBefore(stepperLine, nextItem);
21445
- const previous = stepperLine.previousElementSibling;
21446
- if (previous &&
21447
- previous.tagName.toLowerCase() === 'p-stepper-line') {
21448
- previous.remove();
21449
- }
21450
- continue;
21451
- }
21452
- }
21453
- if (i > 0) {
21454
- const previousItem = item.previousElementSibling;
21455
- if (previousItem.tagName.toLowerCase() === 'p-stepper-line') {
21456
- previousItem.direction = this.direction;
21457
- previousItem.active = item.active || item.finished;
21458
- }
21459
- }
21460
- }
21461
- const lines = this._el.querySelectorAll('p-stepper-line + p-stepper-line, p-stepper-line:not(:has(+ p-stepper-item))');
21462
- for (let j = lines.length - 1; j >= 0; j--) {
21463
- const line = lines.item(j);
21464
- line.remove();
21465
- }
21466
- setTimeout(() => (this._rendering = false), 100);
21471
+ _onActiveStepChange() {
21472
+ this._generateSteps();
21467
21473
  }
21468
21474
  get _el() { return getElement(this); }
21469
21475
  static get watchers() { return {
21470
- "activeStep": ["_generateSteps"]
21476
+ "activeStep": ["_onActiveStepChange"]
21471
21477
  }; }
21472
21478
  static get style() { return stepperComponentCss; }
21473
21479
  static get cmpMeta() { return {
@@ -21476,7 +21482,8 @@ class Stepper {
21476
21482
  "$members$": {
21477
21483
  "activeStep": [2, "active-step"],
21478
21484
  "direction": [513],
21479
- "contentPosition": [513, "content-position"]
21485
+ "contentPosition": [513, "content-position"],
21486
+ "_rendering": [32]
21480
21487
  },
21481
21488
  "$listeners$": undefined,
21482
21489
  "$lazyBundleId$": "-",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@paperless/core",
3
- "version": "1.38.7",
3
+ "version": "1.38.9",
4
4
  "description": "Stencil Component Starter",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",
@@ -1,2 +0,0 @@
1
- import{r as t,h as e,H as i,g as s}from"./p-e4d5e7a7.js";const o=".flex{display:flex!important}.h-auto{height:auto!important}.w-full{width:100%!important}.flex-col{flex-direction:column!important}.flex-wrap{flex-wrap:wrap!important}*{box-sizing:border-box}:host{display:flex}:host([direction=horizontal]){align-items:flex-end;height:auto}:host([direction=vertical]){align-items:flex-start;flex-direction:column;flex-wrap:wrap;min-height:100%;width:100%}:host([direction=vertical][content-position=start]){align-items:flex-end}.static{position:static!important}";const r=class{constructor(e){t(this,e);this._rendering=false;this._loaded=false;this.activeStep=1;this.direction="horizontal";this.contentPosition="end"}componentDidLoad(){this._loaded=true;this._generateSteps(true)}render(){return e(i,{class:"p-stepper"},e("slot",{onSlotchange:()=>this._generateSteps()}))}async _generateSteps(t=false){if(!t&&(!this._el||this._rendering||!this._loaded)){return}this._rendering=true;let e=this.activeStep-1||0;const i=this._el.querySelectorAll("p-stepper-item");if(!this.activeStep||e<0){for(let t=0;t<(i===null||i===void 0?void 0:i.length);t++){const s=i.item(t);if(s.active){e=t}if(e<0&&s.finished){e=t+1}}}for(let t=0;t<(i===null||i===void 0?void 0:i.length);t++){let s=false;const o=i.item(t);o.active=t===e;o.finished=t<e;if(o.direction!==this.direction){s=true}o.direction=this.direction;o.align=t===0?"start":t===(i===null||i===void 0?void 0:i.length)-1?"end":"center";o.contentPosition=this.contentPosition;if(t<i.length-1){const i=o.nextElementSibling;if(i&&i.tagName.toLowerCase()==="p-stepper-item"){if(s){await new Promise((t=>setTimeout(t,10)))}const r=(o.clientHeight>16?o.clientHeight-16:o.clientHeight)/2;const n=document.createElement("p-stepper-line");n.direction=this.direction;n.active=t<=e;if(r>0&&this.direction==="vertical"){n.style.marginTop=`-${r/16}rem`;n.style.marginBottom=`-${r/16}rem`;n.style.minHeight=`calc(1rem + ${r*2/16}rem)`}this._el.insertBefore(n,i);const l=n.previousElementSibling;if(l&&l.tagName.toLowerCase()==="p-stepper-line"){l.remove()}continue}}if(t>0){const t=o.previousElementSibling;if(t.tagName.toLowerCase()==="p-stepper-line"){t.direction=this.direction;t.active=o.active||o.finished}}}const s=this._el.querySelectorAll("p-stepper-line + p-stepper-line, p-stepper-line:not(:has(+ p-stepper-item))");for(let t=s.length-1;t>=0;t--){const e=s.item(t);e.remove()}setTimeout((()=>this._rendering=false),100)}get _el(){return s(this)}static get watchers(){return{activeStep:["_generateSteps"]}}};r.style=o;export{r as p_stepper};
2
- //# sourceMappingURL=p-c7c6176b.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["stepperComponentCss","Stepper","this","_rendering","_loaded","componentDidLoad","_generateSteps","render","h","Host","class","onSlotchange","firstLoad","_el","activeStep","items","querySelectorAll","i","length","item","active","finished","directionChanged","direction","align","contentPosition","nextItem","nextElementSibling","tagName","toLowerCase","Promise","resolve","setTimeout","heightDiff","clientHeight","stepperLine","document","createElement","style","marginTop","marginBottom","minHeight","insertBefore","previous","previousElementSibling","remove","previousItem","lines","j","line"],"sources":["src/components/molecules/stepper/stepper.component.scss?tag=p-stepper&encapsulation=shadow","src/components/molecules/stepper/stepper.component.tsx"],"sourcesContent":[":host {\n\t@apply flex;\n}\n\n:host([direction='horizontal']) {\n\t@apply h-auto items-end;\n}\n\n:host([direction='vertical']) {\n\t@apply flex-col flex-wrap items-start;\n\t@apply w-full min-h-full;\n}\n\n:host([direction='vertical'][content-position='start']) {\n\t@apply items-end;\n}\n","import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\n\n@Component({\n\ttag: 'p-stepper',\n\tstyleUrl: 'stepper.component.scss',\n\tshadow: true,\n})\nexport class Stepper {\n\t/**\n\t * The currently active step\n\t */\n\t@Prop() activeStep: number = 1;\n\n\t/**\n\t * The direction of the stepper\n\t */\n\t@Prop({ reflect: true }) direction: 'horizontal' | 'vertical' =\n\t\t'horizontal';\n\n\t/**\n\t * The position of the content in case of vertical direction\n\t */\n\t@Prop({ reflect: true }) contentPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\tprivate _rendering = false;\n\tprivate _loaded = false;\n\n\t// private _steps: Array<HTMLPStepperItemElement>;\n\n\tcomponentDidLoad() {\n\t\tthis._loaded = true;\n\t\tthis._generateSteps(true);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-stepper\">\n\t\t\t\t<slot onSlotchange={() => this._generateSteps()} />\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Watch('activeStep')\n\tprivate async _generateSteps(firstLoad = false) {\n\t\tif (!firstLoad && (!this._el || this._rendering || !this._loaded)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._rendering = true;\n\n\t\tlet activeStep = this.activeStep - 1 || 0;\n\t\tconst items = this._el.querySelectorAll('p-stepper-item');\n\n\t\tif (!this.activeStep || activeStep < 0) {\n\t\t\tfor (let i = 0; i < items?.length; i++) {\n\t\t\t\tconst item = items.item(i) as any;\n\n\t\t\t\tif (item.active) {\n\t\t\t\t\tactiveStep = i;\n\t\t\t\t}\n\n\t\t\t\tif (activeStep < 0 && item.finished) {\n\t\t\t\t\tactiveStep = i + 1;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tfor (let i = 0; i < items?.length; i++) {\n\t\t\tlet directionChanged = false;\n\t\t\tconst item = items.item(i) as any;\n\n\t\t\titem.active = i === activeStep;\n\t\t\titem.finished = i < activeStep;\n\n\t\t\tif (item.direction !== this.direction) {\n\t\t\t\tdirectionChanged = true;\n\t\t\t}\n\n\t\t\titem.direction = this.direction;\n\t\t\titem.align =\n\t\t\t\ti === 0 ? 'start' : i === items?.length - 1 ? 'end' : 'center';\n\t\t\titem.contentPosition = this.contentPosition;\n\n\t\t\tif (i < items.length - 1) {\n\t\t\t\tconst nextItem = item.nextElementSibling;\n\n\t\t\t\tif (\n\t\t\t\t\tnextItem &&\n\t\t\t\t\tnextItem.tagName.toLowerCase() === 'p-stepper-item'\n\t\t\t\t) {\n\t\t\t\t\t// super hacky, but we want to wait for the css of the `item.direction` change to be applied before querying for the item.clientHeight\n\t\t\t\t\t// otherwise we always get the initial \"16\"\n\t\t\t\t\tif (directionChanged) {\n\t\t\t\t\t\tawait new Promise((resolve) => setTimeout(resolve, 10));\n\t\t\t\t\t}\n\n\t\t\t\t\tconst heightDiff =\n\t\t\t\t\t\t(item.clientHeight > 16\n\t\t\t\t\t\t\t? item.clientHeight - 16\n\t\t\t\t\t\t\t: item.clientHeight) / 2;\n\n\t\t\t\t\tconst stepperLine =\n\t\t\t\t\t\tdocument.createElement('p-stepper-line');\n\n\t\t\t\t\tstepperLine.direction = this.direction;\n\t\t\t\t\tstepperLine.active = i <= activeStep;\n\n\t\t\t\t\tif (heightDiff > 0 && this.direction === 'vertical') {\n\t\t\t\t\t\tstepperLine.style.marginTop = `-${heightDiff / 16}rem`;\n\t\t\t\t\t\tstepperLine.style.marginBottom = `-${\n\t\t\t\t\t\t\theightDiff / 16\n\t\t\t\t\t\t}rem`;\n\t\t\t\t\t\tstepperLine.style.minHeight = `calc(1rem + ${\n\t\t\t\t\t\t\t(heightDiff * 2) / 16\n\t\t\t\t\t\t}rem)`;\n\t\t\t\t\t}\n\n\t\t\t\t\tthis._el.insertBefore(stepperLine, nextItem);\n\n\t\t\t\t\tconst previous = stepperLine.previousElementSibling;\n\t\t\t\t\tif (\n\t\t\t\t\t\tprevious &&\n\t\t\t\t\t\tprevious.tagName.toLowerCase() === 'p-stepper-line'\n\t\t\t\t\t) {\n\t\t\t\t\t\tprevious.remove();\n\t\t\t\t\t}\n\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (i > 0) {\n\t\t\t\tconst previousItem = item.previousElementSibling;\n\t\t\t\tif (previousItem.tagName.toLowerCase() === 'p-stepper-line') {\n\t\t\t\t\tpreviousItem.direction = this.direction;\n\t\t\t\t\tpreviousItem.active = item.active || item.finished;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst lines = this._el.querySelectorAll(\n\t\t\t'p-stepper-line + p-stepper-line, p-stepper-line:not(:has(+ p-stepper-item))'\n\t\t);\n\t\tfor (let j = lines.length - 1; j >= 0; j--) {\n\t\t\tconst line = lines.item(j);\n\t\t\tline.remove();\n\t\t}\n\n\t\tsetTimeout(() => (this._rendering = false), 100);\n\t}\n}\n"],"mappings":"yDAAA,MAAMA,EAAsB,if,MCOfC,EAAO,M,yBAsBXC,KAAAC,WAAa,MACbD,KAAAE,QAAU,M,gBAnBW,E,eAM5B,a,qBAK2D,K,CAY5D,gBAAAC,GACCH,KAAKE,QAAU,KACfF,KAAKI,eAAe,K,CAGrB,MAAAC,GACC,OACCC,EAACC,EAAI,CAACC,MAAM,aACXF,EAAA,QAAMG,aAAc,IAAMT,KAAKI,mB,CAM1B,oBAAMA,CAAeM,EAAY,OACxC,IAAKA,KAAeV,KAAKW,KAAOX,KAAKC,aAAeD,KAAKE,SAAU,CAClE,M,CAGDF,KAAKC,WAAa,KAElB,IAAIW,EAAaZ,KAAKY,WAAa,GAAK,EACxC,MAAMC,EAAQb,KAAKW,IAAIG,iBAAiB,kBAExC,IAAKd,KAAKY,YAAcA,EAAa,EAAG,CACvC,IAAK,IAAIG,EAAI,EAAGA,GAAIF,IAAK,MAALA,SAAK,SAALA,EAAOG,QAAQD,IAAK,CACvC,MAAME,EAAOJ,EAAMI,KAAKF,GAExB,GAAIE,EAAKC,OAAQ,CAChBN,EAAaG,C,CAGd,GAAIH,EAAa,GAAKK,EAAKE,SAAU,CACpCP,EAAaG,EAAI,C,GAKpB,IAAK,IAAIA,EAAI,EAAGA,GAAIF,IAAK,MAALA,SAAK,SAALA,EAAOG,QAAQD,IAAK,CACvC,IAAIK,EAAmB,MACvB,MAAMH,EAAOJ,EAAMI,KAAKF,GAExBE,EAAKC,OAASH,IAAMH,EACpBK,EAAKE,SAAWJ,EAAIH,EAEpB,GAAIK,EAAKI,YAAcrB,KAAKqB,UAAW,CACtCD,EAAmB,I,CAGpBH,EAAKI,UAAYrB,KAAKqB,UACtBJ,EAAKK,MACJP,IAAM,EAAI,QAAUA,KAAMF,IAAK,MAALA,SAAK,SAALA,EAAOG,QAAS,EAAI,MAAQ,SACvDC,EAAKM,gBAAkBvB,KAAKuB,gBAE5B,GAAIR,EAAIF,EAAMG,OAAS,EAAG,CACzB,MAAMQ,EAAWP,EAAKQ,mBAEtB,GACCD,GACAA,EAASE,QAAQC,gBAAkB,iBAClC,CAGD,GAAIP,EAAkB,OACf,IAAIQ,SAASC,GAAYC,WAAWD,EAAS,K,CAGpD,MAAME,GACJd,EAAKe,aAAe,GAClBf,EAAKe,aAAe,GACpBf,EAAKe,cAAgB,EAEzB,MAAMC,EACLC,SAASC,cAAc,kBAExBF,EAAYZ,UAAYrB,KAAKqB,UAC7BY,EAAYf,OAASH,GAAKH,EAE1B,GAAImB,EAAa,GAAK/B,KAAKqB,YAAc,WAAY,CACpDY,EAAYG,MAAMC,UAAY,IAAIN,EAAa,QAC/CE,EAAYG,MAAME,aAAe,IAChCP,EAAa,QAEdE,EAAYG,MAAMG,UAAY,eAC5BR,EAAa,EAAK,Q,CAIrB/B,KAAKW,IAAI6B,aAAaP,EAAaT,GAEnC,MAAMiB,EAAWR,EAAYS,uBAC7B,GACCD,GACAA,EAASf,QAAQC,gBAAkB,iBAClC,CACDc,EAASE,Q,CAGV,Q,EAIF,GAAI5B,EAAI,EAAG,CACV,MAAM6B,EAAe3B,EAAKyB,uBAC1B,GAAIE,EAAalB,QAAQC,gBAAkB,iBAAkB,CAC5DiB,EAAavB,UAAYrB,KAAKqB,UAC9BuB,EAAa1B,OAASD,EAAKC,QAAUD,EAAKE,Q,GAK7C,MAAM0B,EAAQ7C,KAAKW,IAAIG,iBACtB,+EAED,IAAK,IAAIgC,EAAID,EAAM7B,OAAS,EAAG8B,GAAK,EAAGA,IAAK,CAC3C,MAAMC,EAAOF,EAAM5B,KAAK6B,GACxBC,EAAKJ,Q,CAGNb,YAAW,IAAO9B,KAAKC,WAAa,OAAQ,I"}
@@ -1,2 +0,0 @@
1
- import{r as t,h as e,H as i,g as s}from"./p-e4d5e7a7.js";const o=".flex{display:flex!important}.h-auto{height:auto!important}.w-full{width:100%!important}.flex-col{flex-direction:column!important}.flex-wrap{flex-wrap:wrap!important}*{box-sizing:border-box}:host{display:flex}:host([direction=horizontal]){align-items:flex-end;height:auto}:host([direction=vertical]){align-items:flex-start;flex-direction:column;flex-wrap:wrap;min-height:100%;width:100%}:host([direction=vertical][content-position=start]){align-items:flex-end}.static{position:static!important}";const r=class{constructor(e){t(this,e);this._rendering=false;this._loaded=false;this.activeStep=1;this.direction="horizontal";this.contentPosition="end"}componentDidLoad(){this._loaded=true;this._generateSteps(true)}render(){return e(i,{class:"p-stepper"},e("slot",{onSlotchange:()=>this._generateSteps()}))}async _generateSteps(t=false){if(!t&&(!this._el||this._rendering||!this._loaded)){return}this._rendering=true;let e=this.activeStep-1||0;const i=this._el.querySelectorAll("p-stepper-item");if(!this.activeStep||e<0){for(let t=0;t<(i===null||i===void 0?void 0:i.length);t++){const s=i.item(t);if(s.active){e=t}if(e<0&&s.finished){e=t+1}}}for(let t=0;t<(i===null||i===void 0?void 0:i.length);t++){let s=false;const o=i.item(t);o.active=t===e;o.finished=t<e;if(o.direction!==this.direction){s=true}o.direction=this.direction;o.align=t===0?"start":t===(i===null||i===void 0?void 0:i.length)-1?"end":"center";o.contentPosition=this.contentPosition;if(t<i.length-1){const i=o.nextElementSibling;if(i&&i.tagName.toLowerCase()==="p-stepper-item"){if(s){await new Promise((t=>setTimeout(t,10)))}const r=(o.clientHeight>16?o.clientHeight-16:o.clientHeight)/2;const n=document.createElement("p-stepper-line");n.direction=this.direction;n.active=t<=e;if(r>0&&this.direction==="vertical"){n.style.marginTop=`-${r/16}rem`;n.style.marginBottom=`-${r/16}rem`;n.style.minHeight=`calc(1rem + ${r*2/16}rem)`}this._el.insertBefore(n,i);const l=n.previousElementSibling;if(l&&l.tagName.toLowerCase()==="p-stepper-line"){l.remove()}continue}}if(t>0){const t=o.previousElementSibling;if(t.tagName.toLowerCase()==="p-stepper-line"){t.direction=this.direction;t.active=o.active||o.finished}}}const s=this._el.querySelectorAll("p-stepper-line + p-stepper-line, p-stepper-line:not(:has(+ p-stepper-item))");for(let t=s.length-1;t>=0;t--){const e=s.item(t);e.remove()}setTimeout((()=>this._rendering=false),100)}get _el(){return s(this)}static get watchers(){return{activeStep:["_generateSteps"]}}};r.style=o;export{r as p_stepper};
2
- //# sourceMappingURL=p-c7c6176b.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["stepperComponentCss","Stepper","this","_rendering","_loaded","componentDidLoad","_generateSteps","render","h","Host","class","onSlotchange","firstLoad","_el","activeStep","items","querySelectorAll","i","length","item","active","finished","directionChanged","direction","align","contentPosition","nextItem","nextElementSibling","tagName","toLowerCase","Promise","resolve","setTimeout","heightDiff","clientHeight","stepperLine","document","createElement","style","marginTop","marginBottom","minHeight","insertBefore","previous","previousElementSibling","remove","previousItem","lines","j","line"],"sources":["src/components/molecules/stepper/stepper.component.scss?tag=p-stepper&encapsulation=shadow","src/components/molecules/stepper/stepper.component.tsx"],"sourcesContent":[":host {\n\t@apply flex;\n}\n\n:host([direction='horizontal']) {\n\t@apply h-auto items-end;\n}\n\n:host([direction='vertical']) {\n\t@apply flex-col flex-wrap items-start;\n\t@apply w-full min-h-full;\n}\n\n:host([direction='vertical'][content-position='start']) {\n\t@apply items-end;\n}\n","import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\n\n@Component({\n\ttag: 'p-stepper',\n\tstyleUrl: 'stepper.component.scss',\n\tshadow: true,\n})\nexport class Stepper {\n\t/**\n\t * The currently active step\n\t */\n\t@Prop() activeStep: number = 1;\n\n\t/**\n\t * The direction of the stepper\n\t */\n\t@Prop({ reflect: true }) direction: 'horizontal' | 'vertical' =\n\t\t'horizontal';\n\n\t/**\n\t * The position of the content in case of vertical direction\n\t */\n\t@Prop({ reflect: true }) contentPosition: 'start' | 'end' = 'end';\n\n\t/**\n\t * The host element\n\t */\n\t@Element() private _el: HTMLElement;\n\n\tprivate _rendering = false;\n\tprivate _loaded = false;\n\n\t// private _steps: Array<HTMLPStepperItemElement>;\n\n\tcomponentDidLoad() {\n\t\tthis._loaded = true;\n\t\tthis._generateSteps(true);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-stepper\">\n\t\t\t\t<slot onSlotchange={() => this._generateSteps()} />\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Watch('activeStep')\n\tprivate async _generateSteps(firstLoad = false) {\n\t\tif (!firstLoad && (!this._el || this._rendering || !this._loaded)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._rendering = true;\n\n\t\tlet activeStep = this.activeStep - 1 || 0;\n\t\tconst items = this._el.querySelectorAll('p-stepper-item');\n\n\t\tif (!this.activeStep || activeStep < 0) {\n\t\t\tfor (let i = 0; i < items?.length; i++) {\n\t\t\t\tconst item = items.item(i) as any;\n\n\t\t\t\tif (item.active) {\n\t\t\t\t\tactiveStep = i;\n\t\t\t\t}\n\n\t\t\t\tif (activeStep < 0 && item.finished) {\n\t\t\t\t\tactiveStep = i + 1;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tfor (let i = 0; i < items?.length; i++) {\n\t\t\tlet directionChanged = false;\n\t\t\tconst item = items.item(i) as any;\n\n\t\t\titem.active = i === activeStep;\n\t\t\titem.finished = i < activeStep;\n\n\t\t\tif (item.direction !== this.direction) {\n\t\t\t\tdirectionChanged = true;\n\t\t\t}\n\n\t\t\titem.direction = this.direction;\n\t\t\titem.align =\n\t\t\t\ti === 0 ? 'start' : i === items?.length - 1 ? 'end' : 'center';\n\t\t\titem.contentPosition = this.contentPosition;\n\n\t\t\tif (i < items.length - 1) {\n\t\t\t\tconst nextItem = item.nextElementSibling;\n\n\t\t\t\tif (\n\t\t\t\t\tnextItem &&\n\t\t\t\t\tnextItem.tagName.toLowerCase() === 'p-stepper-item'\n\t\t\t\t) {\n\t\t\t\t\t// super hacky, but we want to wait for the css of the `item.direction` change to be applied before querying for the item.clientHeight\n\t\t\t\t\t// otherwise we always get the initial \"16\"\n\t\t\t\t\tif (directionChanged) {\n\t\t\t\t\t\tawait new Promise((resolve) => setTimeout(resolve, 10));\n\t\t\t\t\t}\n\n\t\t\t\t\tconst heightDiff =\n\t\t\t\t\t\t(item.clientHeight > 16\n\t\t\t\t\t\t\t? item.clientHeight - 16\n\t\t\t\t\t\t\t: item.clientHeight) / 2;\n\n\t\t\t\t\tconst stepperLine =\n\t\t\t\t\t\tdocument.createElement('p-stepper-line');\n\n\t\t\t\t\tstepperLine.direction = this.direction;\n\t\t\t\t\tstepperLine.active = i <= activeStep;\n\n\t\t\t\t\tif (heightDiff > 0 && this.direction === 'vertical') {\n\t\t\t\t\t\tstepperLine.style.marginTop = `-${heightDiff / 16}rem`;\n\t\t\t\t\t\tstepperLine.style.marginBottom = `-${\n\t\t\t\t\t\t\theightDiff / 16\n\t\t\t\t\t\t}rem`;\n\t\t\t\t\t\tstepperLine.style.minHeight = `calc(1rem + ${\n\t\t\t\t\t\t\t(heightDiff * 2) / 16\n\t\t\t\t\t\t}rem)`;\n\t\t\t\t\t}\n\n\t\t\t\t\tthis._el.insertBefore(stepperLine, nextItem);\n\n\t\t\t\t\tconst previous = stepperLine.previousElementSibling;\n\t\t\t\t\tif (\n\t\t\t\t\t\tprevious &&\n\t\t\t\t\t\tprevious.tagName.toLowerCase() === 'p-stepper-line'\n\t\t\t\t\t) {\n\t\t\t\t\t\tprevious.remove();\n\t\t\t\t\t}\n\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tif (i > 0) {\n\t\t\t\tconst previousItem = item.previousElementSibling;\n\t\t\t\tif (previousItem.tagName.toLowerCase() === 'p-stepper-line') {\n\t\t\t\t\tpreviousItem.direction = this.direction;\n\t\t\t\t\tpreviousItem.active = item.active || item.finished;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst lines = this._el.querySelectorAll(\n\t\t\t'p-stepper-line + p-stepper-line, p-stepper-line:not(:has(+ p-stepper-item))'\n\t\t);\n\t\tfor (let j = lines.length - 1; j >= 0; j--) {\n\t\t\tconst line = lines.item(j);\n\t\t\tline.remove();\n\t\t}\n\n\t\tsetTimeout(() => (this._rendering = false), 100);\n\t}\n}\n"],"mappings":"yDAAA,MAAMA,EAAsB,if,MCOfC,EAAO,M,yBAsBXC,KAAAC,WAAa,MACbD,KAAAE,QAAU,M,gBAnBW,E,eAM5B,a,qBAK2D,K,CAY5D,gBAAAC,GACCH,KAAKE,QAAU,KACfF,KAAKI,eAAe,K,CAGrB,MAAAC,GACC,OACCC,EAACC,EAAI,CAACC,MAAM,aACXF,EAAA,QAAMG,aAAc,IAAMT,KAAKI,mB,CAM1B,oBAAMA,CAAeM,EAAY,OACxC,IAAKA,KAAeV,KAAKW,KAAOX,KAAKC,aAAeD,KAAKE,SAAU,CAClE,M,CAGDF,KAAKC,WAAa,KAElB,IAAIW,EAAaZ,KAAKY,WAAa,GAAK,EACxC,MAAMC,EAAQb,KAAKW,IAAIG,iBAAiB,kBAExC,IAAKd,KAAKY,YAAcA,EAAa,EAAG,CACvC,IAAK,IAAIG,EAAI,EAAGA,GAAIF,IAAK,MAALA,SAAK,SAALA,EAAOG,QAAQD,IAAK,CACvC,MAAME,EAAOJ,EAAMI,KAAKF,GAExB,GAAIE,EAAKC,OAAQ,CAChBN,EAAaG,C,CAGd,GAAIH,EAAa,GAAKK,EAAKE,SAAU,CACpCP,EAAaG,EAAI,C,GAKpB,IAAK,IAAIA,EAAI,EAAGA,GAAIF,IAAK,MAALA,SAAK,SAALA,EAAOG,QAAQD,IAAK,CACvC,IAAIK,EAAmB,MACvB,MAAMH,EAAOJ,EAAMI,KAAKF,GAExBE,EAAKC,OAASH,IAAMH,EACpBK,EAAKE,SAAWJ,EAAIH,EAEpB,GAAIK,EAAKI,YAAcrB,KAAKqB,UAAW,CACtCD,EAAmB,I,CAGpBH,EAAKI,UAAYrB,KAAKqB,UACtBJ,EAAKK,MACJP,IAAM,EAAI,QAAUA,KAAMF,IAAK,MAALA,SAAK,SAALA,EAAOG,QAAS,EAAI,MAAQ,SACvDC,EAAKM,gBAAkBvB,KAAKuB,gBAE5B,GAAIR,EAAIF,EAAMG,OAAS,EAAG,CACzB,MAAMQ,EAAWP,EAAKQ,mBAEtB,GACCD,GACAA,EAASE,QAAQC,gBAAkB,iBAClC,CAGD,GAAIP,EAAkB,OACf,IAAIQ,SAASC,GAAYC,WAAWD,EAAS,K,CAGpD,MAAME,GACJd,EAAKe,aAAe,GAClBf,EAAKe,aAAe,GACpBf,EAAKe,cAAgB,EAEzB,MAAMC,EACLC,SAASC,cAAc,kBAExBF,EAAYZ,UAAYrB,KAAKqB,UAC7BY,EAAYf,OAASH,GAAKH,EAE1B,GAAImB,EAAa,GAAK/B,KAAKqB,YAAc,WAAY,CACpDY,EAAYG,MAAMC,UAAY,IAAIN,EAAa,QAC/CE,EAAYG,MAAME,aAAe,IAChCP,EAAa,QAEdE,EAAYG,MAAMG,UAAY,eAC5BR,EAAa,EAAK,Q,CAIrB/B,KAAKW,IAAI6B,aAAaP,EAAaT,GAEnC,MAAMiB,EAAWR,EAAYS,uBAC7B,GACCD,GACAA,EAASf,QAAQC,gBAAkB,iBAClC,CACDc,EAASE,Q,CAGV,Q,EAIF,GAAI5B,EAAI,EAAG,CACV,MAAM6B,EAAe3B,EAAKyB,uBAC1B,GAAIE,EAAalB,QAAQC,gBAAkB,iBAAkB,CAC5DiB,EAAavB,UAAYrB,KAAKqB,UAC9BuB,EAAa1B,OAASD,EAAKC,QAAUD,EAAKE,Q,GAK7C,MAAM0B,EAAQ7C,KAAKW,IAAIG,iBACtB,+EAED,IAAK,IAAIgC,EAAID,EAAM7B,OAAS,EAAG8B,GAAK,EAAGA,IAAK,CAC3C,MAAMC,EAAOF,EAAM5B,KAAK6B,GACxBC,EAAKJ,Q,CAGNb,YAAW,IAAO9B,KAAKC,WAAa,OAAQ,I"}