@zanichelli/albe-web-components 15.1.1 → 15.1.3

package/dist/collection/components/z-input/styles-general.css

@@ -1,154 +0,0 @@
-:host {
-  display: inline-block;
-  width: inherit;
-}
-
-input::-ms-clear,
-input::-ms-reveal {
-  display: none;
-}
-
-/* GENERAL */
-:host input::-ms-clear,
-:host input::-ms-reveal {
-  display: none;
-}
-
-input,
-textarea,
-.textarea-wrapper {
-  box-sizing: border-box;
-  border: var(--border-size-small) solid var(--gray700);
-  background: var(--color-input-field01);
-  border-radius: var(--border-radius-small);
-  color: var(--gray900);
-  fill: var(--gray900);
-  font-family: var(--font-family-sans);
-  font-size: var(--font-size-3);
-  font-weight: var(--font-rg);
-  outline: none;
-}
-
-:host([size="small"]) input,
-:host([size="small"]) textarea,
-:host([size="small"]) .textarea-wrapper,
-:host([size="x-small"]) input,
-:host([size="x-small"]) textarea,
-:host([size="x-small"]) .textarea-wrapper {
-  font-size: var(--font-size-2);
-}
-
-:host.cursor-select input {
-  cursor: pointer;
-}
-
-/* FOCUS */
-:host:not(.active-select) input:focus:focus-visible,
-:host:not([readonly="true"]) .textarea-wrapper:focus-within {
-  box-shadow: var(--shadow-focus-primary);
-}
-
-input:focus:focus-visible,
-textarea:focus:focus-visible {
-  color: var(--color-input-field02);
-}
-
-:host.active-select input {
-  border: var(--border-size-small) solid var(--color-primary01);
-}
-
-:host.cursor-select input:focus:focus-visible {
-  box-shadow: var(--shadow-focus-primary);
-}
-
-:host input[readonly]:focus:focus-visible {
-  box-shadow: none;
-}
-
-/* FILLED */
-.filled {
-  border-color: var(--color-surface05);
-}
-
-/* STATUSES (success, warning, error) */
-.input-success {
-  border-color: var(--color-success01);
-  background: var(--color-success-inverse);
-  fill: var(--color-success01);
-}
-
-.input-error {
-  border-color: var(--color-error01);
-  background: var(--color-error-inverse);
-  fill: var(--color-error01);
-}
-
-.input-warning {
-  border-color: var(--color-warning01);
-  background: var(--color-warning-inverse);
-  fill: var(--color-warning01);
-}
-
-/* HOVER */
-input:not([readonly]):hover,
-.textarea-wrapper:hover {
-  outline: var(--border-size-medium) solid var(--gray700);
-  outline-offset: -2px;
-}
-
-/* READONLY */
-:host:not(.active-select) input[readonly],
-.readonly {
-  border-color: var(--color-disabled01);
-  fill: var(--color-disabled01);
-  pointer-events: none;
-}
-
-/* DISABLED */
-:host([disabled]:not([disabled="false"])) input,
-:host([disabled]:not([disabled="false"])) .textarea-wrapper,
-:host([disabled]:not([disabled="false"])) z-icon {
-  border-color: var(--color-disabled01);
-  box-shadow: none;
-  color: var(--color-disabled03);
-  fill: var(--color-disabled01);
-  pointer-events: none;
-}
-
-:host([disabled]:not([disabled="false"])) input:hover {
-  border-width: var(--border-size-small);
-}
-
-/* PLACEHOLDER */
-input::placeholder,
-textarea::placeholder {
-  color: var(--color-text05);
-}
-
-::-webkit-textarea-placeholder {
-  color: var(--color-text05);
-}
-
-:-ms-textarea-placeholder {
-  color: var(--color-text05);
-}
-
-::placeholder {
-  color: var(--color-text05);
-}
-
-/* LABEL */
-label.input-label {
-  display: block;
-  padding-bottom: var(--space-unit);
-  color: var(--color-default-text);
-  font-family: var(--font-family-sans);
-  font-size: var(--font-size-1);
-  font-weight: var(--font-sb);
-  text-align: left;
-  text-transform: uppercase;
-}
-
-:host([disabled]:not([disabled="false"])) label.input-label {
-  color: var(--color-disabled03);
-}

package/dist/collection/components/z-input/styles-text.css

@@ -1,86 +0,0 @@
-.text-wrapper > div {
-  position: relative;
-  z-index: 1;
-  fill: var(--gray900);
-}
-
-.text-wrapper > div > input {
-  width: 100%;
-  height: calc(var(--space-unit) * 5.5);
-  box-sizing: border-box;
-  padding: 0 calc(var(--space-unit) * 1.5);
-  margin: 0;
-}
-
-:host([size="small"]) .text-wrapper > div > input {
-  height: calc(var(--space-unit) * 4.5);
-}
-
-:host([size="x-small"]) .text-wrapper > div > input {
-  height: calc(var(--space-unit) * 4);
-}
-
-.text-wrapper > div > input.has-icon,
-.text-wrapper > div > input.has-clear-icon {
-  padding-right: calc(var(--space-unit) * 5.25);
-}
-
-.text-wrapper > div > input.has-icon.has-clear-icon {
-  padding-right: calc(var(--space-unit) * 8);
-}
-
-.text-wrapper .icons-wrapper {
-  position: absolute;
-  z-index: 2;
-  top: 50%;
-  right: calc(var(--space-unit) * 1.5);
-  display: flex;
-  pointer-events: none;
-  transform: translateY(-50%);
-}
-
-.text-wrapper .icons-wrapper > button.icon-button {
-  padding: 0;
-  border: 0;
-  background: none;
-  color: inherit;
-  font: inherit;
-  pointer-events: initial;
-}
-
-.text-wrapper .icons-wrapper > button.icon-button + button.icon-button {
-  margin-left: calc(var(--space-unit) * 0.5);
-}
-
-.text-wrapper .icons-wrapper > button.icon-button.hidden {
-  display: none;
-}
-
-.text-wrapper .icons-wrapper > button.icon-button.reset-icon,
-.text-wrapper .icons-wrapper > button.icon-button.toggle-password-icon {
-  cursor: pointer;
-}
-
-.text-wrapper .icons-wrapper > button.icon-button > z-icon {
-  --z-icon-width: 18px;
-  --z-icon-height: 18px;
-
-  display: block;
-}
-
-.text-wrapper .icons-wrapper > button.icon-button > z-icon.small,
-.text-wrapper .icons-wrapper > button.icon-button > z-icon.x-small {
-  --z-icon-width: 16px;
-  --z-icon-height: 16px;
-}
-
-.text-wrapper .icons-wrapper > button.icon-button:focus {
-  box-shadow: var(--shadow-focus-primary);
-  outline: none !important;
-}
-
-/* stylelint-disable property-no-vendor-prefix */
-.text-wrapper > div > input:-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px #fff inset;
-  -webkit-text-fill-color: currentcolor;
-}

package/dist/collection/components/z-input/styles-textarea.css

@@ -1,35 +0,0 @@
-.textarea-wrapper {
-  padding: calc(var(--space-unit) * 1.5);
-
-  /* Firefox scrollbar */
-  scrollbar-color: var(--color-primary01) transparent;
-}
-
-textarea::-webkit-scrollbar {
-  width: 10px;
-  background: linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);
-  border-radius: var(--border-radius);
-}
-
-textarea::-webkit-scrollbar-track {
-  background-color: transparent;
-}
-
-textarea::-webkit-scrollbar-thumb {
-  width: 10px;
-  background-color: var(--color-primary01);
-  border-radius: var(--border-radius);
-}
-
-textarea::-webkit-scrollbar-thumb:hover {
-  background-color: var(--color-hover-primary);
-}
-
-textarea {
-  width: 100%;
-  min-height: 132px;
-  padding: 0;
-  border: none;
-  margin: 0;
-  resize: none;
-}

package/dist/web-components-library/p-0108191f.system.entry.js

@@ -1,2 +0,0 @@
-System.register(["./p-d8fcaf1f.system.js","./p-c39f227f.system.js"],(function(o){"use strict";var t,a,e,i,r;return{setters:[function(o){t=o.r;a=o.h;e=o.a;i=o.g},function(o){r=o.C}],execute:function(){var s=':host{--aspect-ratio:1.62;--z-card--border-color:var(--gray200);--z-card--color-cover-background:var(--color-surface01);--z-card--text-background:var(--color-surface01);--z-card--text-border-radius:none;--z-card--text-border:none;--z-card--text-padding:calc(var(--space-unit) * 2) var(--space-unit);position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}*,::slotted(*){-webkit-box-sizing:border-box;box-sizing:border-box}*:focus{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host(:not([variant="overlay"])) .cover-container{position:relative;width:100%}.cover-container{padding-bottom:calc(100% / var(--aspect-ratio))}::slotted([slot="cover"]),.color-cover{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.cover-container>z-icon{--z-icon-width:calc(var(--space-unit) * 11);--z-icon-height:var(--z-icon-width);position:absolute;top:calc(50% - calc(var(--z-icon-height) / 2));left:calc(50% - calc(var(--z-icon-width) / 2));fill:var(--color-primary01)}.color-cover{background-color:var(--z-card--color-cover-background)}.content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding-top:var(--space-unit)}.color-cover .cover-content{display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:end;justify-content:flex-end;padding:var(--space-unit)}::slotted([slot="metadata"]),::slotted([slot="title"]),::slotted([slot="text"]){display:-webkit-inline-box;overflow:hidden;-webkit-box-orient:vertical}::slotted([slot="title"]:not(:last-child)),::slotted([slot="text"]:not(:last-child)){margin-bottom:var(--space-unit)}::slotted([slot="title"])::before{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;content:""}::slotted([slot="metadata"]:not(:last-child)){margin:0 0 calc(var(--space-unit) * 0.25);-webkit-line-clamp:1;text-transform:uppercase}::slotted([slot="title"]){margin:0;color:inherit;font-size:inherit;font-weight:var(--font-sb);-webkit-line-clamp:2;text-decoration:none}::slotted([slot="title"]:focus){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}::slotted([slot="text"]){margin:0;-webkit-line-clamp:3}.actions{position:relative;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}::slotted([slot="action"]:not(:last-child)){margin-right:calc(var(--space-unit) * 2)}::slotted([slot="action"]:focus){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible)::before{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible){-webkit-box-shadow:none !important;box-shadow:none !important;outline:none !important}:host([variant="text"]){border:var(--z-card--text-border);background-color:var(--z-card--text-background);border-radius:var(--z-card--text-border-radius)}:host([show-shadow])>.content,:host([variant="border"])>.content,:host([variant="shadow"])>.content{height:100%;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2)}:host([variant="text"])>.content{padding:var(--z-card--text-padding)}:host([variant="border"]) .actions,:host([variant="shadow"]) .actions{margin-top:auto}:host([variant="border"]){border:var(--border-size-small) solid var(--z-card--border-color)}:host([variant="border"][clickable]:hover)>.content{background:var(--color-background)}:host([variant="border"][clickable]:focus:focus-visible){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([variant="border"][clickable]:active){border-color:transparent}:host([variant="shadow"]),:host([show-shadow]){-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2)}:host([variant="shadow"][clickable]:hover),:host([clickable][show-shadow]:hover){-webkit-box-shadow:var(--shadow-4);box-shadow:var(--shadow-4)}:host([variant="shadow"][clickable]:focus:focus-visible),:host([clickable][show-shadow]:focus:focus-visible){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([variant="shadow"][clickable]:active),:host([clickable][show-shadow]:active){-webkit-box-shadow:none;box-shadow:none}:host([variant="overlay"]) .content{position:absolute;top:0;right:0;bottom:0;left:0;-ms-flex-pack:end;justify-content:flex-end;padding:var(--space-unit);background-image:-webkit-gradient(linear, left bottom, left top, from(rgb(0 0 0 / 100%)), to(rgb(0 0 0 / 0%)));background-image:linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));color:var(--color-text-inverse);fill:var(--color-text-inverse)}';var n=s;var c=o("z_card",function(){function o(o){t(this,o);this.variant=undefined;this.coverIcon=undefined;this.showShadow=false;this.clickable=false;this.hasCoverImage=undefined}o.prototype.componentWillLoad=function(){this.hasCoverImage=this.host.querySelector('[slot="cover"]')!==null};o.prototype.renderColorCoverCard=function(){return[a("div",{class:"cover-container"},a("div",{class:"color-cover"},a("div",{class:"cover-content"},a("slot",{name:"metadata"}),a("slot",{name:"title"})))),a("div",{class:"content"},a("slot",{name:"text"}),a("div",{class:"actions"},a("slot",{name:"action"})))]};o.prototype.renderContentDiv=function(){return a("div",{class:"content"},a("slot",{name:"metadata"}),a("slot",{name:"title"}),a("slot",{name:"text"}),a("div",{class:"actions"},a("slot",{name:"action"})))};o.prototype.render=function(){if(this.variant===r.TEXT){return a(e,null,this.renderContentDiv())}if(this.variant===r.OVERLAY||this.hasCoverImage){return a(e,null,a("div",{class:"cover-container"},this.hasCoverImage&&[a("slot",{name:"cover"}),this.variant!==r.OVERLAY&&this.coverIcon&&a("z-icon",{name:this.coverIcon})],!this.hasCoverImage&&a("div",{class:"color-cover"})),this.renderContentDiv())}return a(e,null,this.renderColorCoverCard())};Object.defineProperty(o.prototype,"host",{get:function(){return i(this)},enumerable:false,configurable:true});return o}());c.style=n}}}));
-//# sourceMappingURL=p-0108191f.system.entry.js.map

package/dist/web-components-library/p-0108191f.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZCardStyle0","ZCard","exports","class_1","prototype","componentWillLoad","this","hasCoverImage","host","querySelector","renderColorCoverCard","h","class","name","renderContentDiv","render","variant","CardVariant","TEXT","Host","OVERLAY","coverIcon"],"sources":["src/components/z-card/styles.css?tag=z-card&encapsulation=shadow","src/components/z-card/index.tsx"],"sourcesContent":["/* The width of the card must be set by its container,\nrespecting the grid indications of the design. */\n\n:host {\n  /* Override this var to change the cover's aspect ratio */\n  --aspect-ratio: 1.62;\n  --z-card--border-color: var(--gray200);\n  --z-card--color-cover-background: var(--color-surface01);\n  --z-card--text-background: var(--color-surface01);\n  --z-card--text-border-radius: none;\n  --z-card--text-border: none;\n  --z-card--text-padding: calc(var(--space-unit) * 2) var(--space-unit);\n\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n*,\n::slotted(*) {\n  box-sizing: border-box;\n}\n\n*:focus {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n:host(:not([variant=\"overlay\"])) .cover-container {\n  position: relative;\n  width: 100%;\n}\n\n/* Old good trick with percentage padding to keep the aspect ratio.\nUnfortunately the `aspect-ratio` property is still experimental */\n.cover-container {\n  padding-bottom: calc(100% / var(--aspect-ratio));\n}\n\n::slotted([slot=\"cover\"]),\n.color-cover {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n\n.cover-container > z-icon {\n  --z-icon-width: calc(var(--space-unit) * 11);\n  --z-icon-height: var(--z-icon-width);\n\n  position: absolute;\n  top: calc(50% - calc(var(--z-icon-height) / 2));\n  left: calc(50% - calc(var(--z-icon-width) / 2));\n  fill: var(--color-primary01);\n}\n\n.color-cover {\n  background-color: var(--z-card--color-cover-background);\n}\n\n.content {\n  display: flex;\n  flex-direction: column;\n  padding-top: var(--space-unit);\n}\n\n.color-cover .cover-content {\n  display: flex;\n  height: 100%;\n  flex-direction: column;\n  justify-content: flex-end;\n  padding: var(--space-unit);\n}\n\n/* Truncates overflowing text */\n::slotted([slot=\"metadata\"]),\n::slotted([slot=\"title\"]),\n::slotted([slot=\"text\"]) {\n  display: -webkit-inline-box;\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n}\n\n::slotted([slot=\"title\"]:not(:last-child)),\n::slotted([slot=\"text\"]:not(:last-child)) {\n  margin-bottom: var(--space-unit);\n}\n\n::slotted([slot=\"title\"])::before {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  content: \"\";\n}\n\n::slotted([slot=\"metadata\"]:not(:last-child)) {\n  margin: 0 0 calc(var(--space-unit) * 0.25);\n  -webkit-line-clamp: 1;\n  text-transform: uppercase;\n}\n\n::slotted([slot=\"title\"]) {\n  margin: 0;\n  color: inherit;\n  font-size: inherit;\n  font-weight: var(--font-sb);\n  -webkit-line-clamp: 2;\n  text-decoration: none;\n}\n\n::slotted([slot=\"title\"]:focus) {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n::slotted([slot=\"text\"]) {\n  margin: 0;\n  -webkit-line-clamp: 3;\n}\n\n.actions {\n  position: relative;\n  z-index: 2;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n\n::slotted([slot=\"action\"]:not(:last-child)) {\n  margin-right: calc(var(--space-unit) * 2);\n}\n\n::slotted([slot=\"action\"]:focus) {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible)::before {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible) {\n  box-shadow: none !important;\n  outline: none !important;\n}\n\n:host([variant=\"text\"]) {\n  border: var(--z-card--text-border);\n  background-color: var(--z-card--text-background);\n  border-radius: var(--z-card--text-border-radius);\n}\n\n:host([show-shadow]) > .content,\n:host([variant=\"border\"]) > .content,\n:host([variant=\"shadow\"]) > .content {\n  height: 100%;\n  padding: var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2);\n}\n\n:host([variant=\"text\"]) > .content {\n  padding: var(--z-card--text-padding);\n}\n\n:host([variant=\"border\"]) .actions,\n:host([variant=\"shadow\"]) .actions {\n  margin-top: auto;\n}\n\n/* Border */\n:host([variant=\"border\"]) {\n  border: var(--border-size-small) solid var(--z-card--border-color);\n}\n\n:host([variant=\"border\"][clickable]:hover) > .content {\n  background: var(--color-background);\n}\n\n:host([variant=\"border\"][clickable]:focus:focus-visible) {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"border\"][clickable]:active) {\n  border-color: transparent;\n}\n\n/* Shadow */\n:host([variant=\"shadow\"]),\n:host([show-shadow]) {\n  box-shadow: var(--shadow-2);\n}\n\n:host([variant=\"shadow\"][clickable]:hover),\n:host([clickable][show-shadow]:hover) {\n  box-shadow: var(--shadow-4);\n}\n\n:host([variant=\"shadow\"][clickable]:focus:focus-visible),\n:host([clickable][show-shadow]:focus:focus-visible) {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"shadow\"][clickable]:active),\n:host([clickable][show-shadow]:active) {\n  box-shadow: none;\n}\n\n/* Overlay */\n:host([variant=\"overlay\"]) .content {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  justify-content: flex-end;\n  padding: var(--space-unit);\n  background-image: linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));\n  color: var(--color-text-inverse);\n  fill: var(--color-text-inverse);\n}\n","import {Component, Element, Host, Prop, State, h} from \"@stencil/core\";\nimport {CardVariant} from \"../../beans\";\n\n/**\n * ZCard component.\n * @cssprop --aspect-ratio - Cover aspect ratio. Default: `1.62`\n * @cssprop --z-card--border-color - Default: `var(--gray200)`\n * @cssprop --z-card--color-cover-background - Cover color. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-background - Background color for the `text` variant. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-border-radius - Default: `none`\n * @cssprop --z-card--text-border - Configure CSS `border`. Default: `none`\n * @cssprop --z-card--text-padding - Configure CSS `padding`. Default: `none`\n * @slot cover - Image cover\n * @slot metadata - Metadata\n * @slot title - Title\n * @slot text - Text content\n * @slot action - Actions\n */\n@Component({\n  tag: \"z-card\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZCard {\n  /**\n   * Card variant.\n   * Can be one of \"text\", \"border\", \"shadow\", \"overlay\".\n   * Leave it undefined for the default card.\n   */\n  @Prop({reflect: true})\n  variant: CardVariant;\n\n  /** Name of the icon to place over the image cover */\n  @Prop()\n  coverIcon: string;\n\n  /** Enable shadow. Default: false. */\n  @Prop({reflect: true})\n  showShadow = false;\n\n  /** Enable 'clickable' style like hover and focus style. */\n  @Prop({reflect: true})\n  clickable = false;\n\n  @Element() host: HTMLZCardElement;\n\n  @State()\n  hasCoverImage: boolean;\n\n  componentWillLoad(): void {\n    this.hasCoverImage = this.host.querySelector('[slot=\"cover\"]') !== null;\n  }\n\n  /**\n   * Template for a card without image cover.\n   * A colored background replaces the image and some data is moved over it.\n   */\n  private renderColorCoverCard(): HTMLDivElement[] {\n    return [\n      <div class=\"cover-container\">\n        <div class=\"color-cover\">\n          <div class=\"cover-content\">\n            <slot name=\"metadata\"></slot>\n            <slot name=\"title\"></slot>\n          </div>\n        </div>\n      </div>,\n      <div class=\"content\">\n        <slot name=\"text\"></slot>\n        <div class=\"actions\">\n          <slot name=\"action\"></slot>\n        </div>\n      </div>,\n    ];\n  }\n\n  /**\n   * Template for the content div.\n   */\n  private renderContentDiv(): HTMLDivElement {\n    return (\n      <div class=\"content\">\n        <slot name=\"metadata\"></slot>\n        <slot name=\"title\"></slot>\n        <slot name=\"text\"></slot>\n        <div class=\"actions\">\n          <slot name=\"action\"></slot>\n        </div>\n      </div>\n    );\n  }\n\n  render(): HTMLZCardElement {\n    if (this.variant === CardVariant.TEXT) {\n      return <Host>{this.renderContentDiv()}</Host>;\n    }\n\n    if (this.variant === CardVariant.OVERLAY || this.hasCoverImage) {\n      return (\n        <Host>\n          <div class=\"cover-container\">\n            {this.hasCoverImage && [\n              <slot name=\"cover\"></slot>,\n              this.variant !== CardVariant.OVERLAY && this.coverIcon && <z-icon name={this.coverIcon}></z-icon>,\n            ]}\n            {!this.hasCoverImage && <div class=\"color-cover\"></div>}\n          </div>\n          {this.renderContentDiv()}\n        </Host>\n      );\n    }\n\n    return <Host>{this.renderColorCoverCard()}</Host>;\n  }\n}\n"],"mappings":"wMAAA,IAAMA,EAAY,q3JAClB,IAAAC,EAAeD,E,ICsBFE,EAAKC,EAAA,oB,wFAeH,M,eAID,M,6BAOZC,EAAAC,UAAAC,kBAAA,WACEC,KAAKC,cAAgBD,KAAKE,KAAKC,cAAc,oBAAsB,I,EAO7DN,EAAAC,UAAAM,qBAAA,WACN,MAAO,CACLC,EAAA,OAAKC,MAAM,mBACTD,EAAA,OAAKC,MAAM,eACTD,EAAA,OAAKC,MAAM,iBACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,aAIjBF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,a,EASXV,EAAAC,UAAAU,iBAAA,WACN,OACEH,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,UACXF,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,Y,EAMnBV,EAAAC,UAAAW,OAAA,WACE,GAAIT,KAAKU,UAAYC,EAAYC,KAAM,CACrC,OAAOP,EAACQ,EAAI,KAAEb,KAAKQ,mB,CAGrB,GAAIR,KAAKU,UAAYC,EAAYG,SAAWd,KAAKC,cAAe,CAC9D,OACEI,EAACQ,EAAI,KACHR,EAAA,OAAKC,MAAM,mBACRN,KAAKC,eAAiB,CACrBI,EAAA,QAAME,KAAK,UACXP,KAAKU,UAAYC,EAAYG,SAAWd,KAAKe,WAAaV,EAAA,UAAQE,KAAMP,KAAKe,cAE7Ef,KAAKC,eAAiBI,EAAA,OAAKC,MAAM,iBAEpCN,KAAKQ,mB,CAKZ,OAAOH,EAACQ,EAAI,KAAEb,KAAKI,uB,yHAzFL,I","ignoreList":[]}

package/dist/web-components-library/p-0bde1f0e.entry.js

@@ -1,2 +0,0 @@
-import{r as o,h as t,a,g as e}from"./p-cc3c02fe.js";import{C as r}from"./p-025f494e.js";const i=':host{--aspect-ratio:1.62;--z-card--border-color:var(--gray200);--z-card--color-cover-background:var(--color-surface01);--z-card--text-background:var(--color-surface01);--z-card--text-border-radius:none;--z-card--text-border:none;--z-card--text-padding:calc(var(--space-unit) * 2) var(--space-unit);position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}*,::slotted(*){-webkit-box-sizing:border-box;box-sizing:border-box}*:focus{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host(:not([variant="overlay"])) .cover-container{position:relative;width:100%}.cover-container{padding-bottom:calc(100% / var(--aspect-ratio))}::slotted([slot="cover"]),.color-cover{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.cover-container>z-icon{--z-icon-width:calc(var(--space-unit) * 11);--z-icon-height:var(--z-icon-width);position:absolute;top:calc(50% - calc(var(--z-icon-height) / 2));left:calc(50% - calc(var(--z-icon-width) / 2));fill:var(--color-primary01)}.color-cover{background-color:var(--z-card--color-cover-background)}.content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding-top:var(--space-unit)}.color-cover .cover-content{display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:end;justify-content:flex-end;padding:var(--space-unit)}::slotted([slot="metadata"]),::slotted([slot="title"]),::slotted([slot="text"]){display:-webkit-inline-box;overflow:hidden;-webkit-box-orient:vertical}::slotted([slot="title"]:not(:last-child)),::slotted([slot="text"]:not(:last-child)){margin-bottom:var(--space-unit)}::slotted([slot="title"])::before{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;content:""}::slotted([slot="metadata"]:not(:last-child)){margin:0 0 calc(var(--space-unit) * 0.25);-webkit-line-clamp:1;text-transform:uppercase}::slotted([slot="title"]){margin:0;color:inherit;font-size:inherit;font-weight:var(--font-sb);-webkit-line-clamp:2;text-decoration:none}::slotted([slot="title"]:focus){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}::slotted([slot="text"]){margin:0;-webkit-line-clamp:3}.actions{position:relative;z-index:2;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}::slotted([slot="action"]:not(:last-child)){margin-right:calc(var(--space-unit) * 2)}::slotted([slot="action"]:focus){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible)::before{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible){-webkit-box-shadow:none !important;box-shadow:none !important;outline:none !important}:host([variant="text"]){border:var(--z-card--text-border);background-color:var(--z-card--text-background);border-radius:var(--z-card--text-border-radius)}:host([show-shadow])>.content,:host([variant="border"])>.content,:host([variant="shadow"])>.content{height:100%;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2)}:host([variant="text"])>.content{padding:var(--z-card--text-padding)}:host([variant="border"]) .actions,:host([variant="shadow"]) .actions{margin-top:auto}:host([variant="border"]){border:var(--border-size-small) solid var(--z-card--border-color)}:host([variant="border"][clickable]:hover)>.content{background:var(--color-background)}:host([variant="border"][clickable]:focus:focus-visible){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([variant="border"][clickable]:active){border-color:transparent}:host([variant="shadow"]),:host([show-shadow]){-webkit-box-shadow:var(--shadow-2);box-shadow:var(--shadow-2)}:host([variant="shadow"][clickable]:hover),:host([clickable][show-shadow]:hover){-webkit-box-shadow:var(--shadow-4);box-shadow:var(--shadow-4)}:host([variant="shadow"][clickable]:focus:focus-visible),:host([clickable][show-shadow]:focus:focus-visible){-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host([variant="shadow"][clickable]:active),:host([clickable][show-shadow]:active){-webkit-box-shadow:none;box-shadow:none}:host([variant="overlay"]) .content{position:absolute;top:0;right:0;bottom:0;left:0;-ms-flex-pack:end;justify-content:flex-end;padding:var(--space-unit);background-image:-webkit-gradient(linear, left bottom, left top, from(rgb(0 0 0 / 100%)), to(rgb(0 0 0 / 0%)));background-image:linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));color:var(--color-text-inverse);fill:var(--color-text-inverse)}';const s=i;const n=class{constructor(t){o(this,t);this.variant=undefined;this.coverIcon=undefined;this.showShadow=false;this.clickable=false;this.hasCoverImage=undefined}componentWillLoad(){this.hasCoverImage=this.host.querySelector('[slot="cover"]')!==null}renderColorCoverCard(){return[t("div",{class:"cover-container"},t("div",{class:"color-cover"},t("div",{class:"cover-content"},t("slot",{name:"metadata"}),t("slot",{name:"title"})))),t("div",{class:"content"},t("slot",{name:"text"}),t("div",{class:"actions"},t("slot",{name:"action"})))]}renderContentDiv(){return t("div",{class:"content"},t("slot",{name:"metadata"}),t("slot",{name:"title"}),t("slot",{name:"text"}),t("div",{class:"actions"},t("slot",{name:"action"})))}render(){if(this.variant===r.TEXT){return t(a,null,this.renderContentDiv())}if(this.variant===r.OVERLAY||this.hasCoverImage){return t(a,null,t("div",{class:"cover-container"},this.hasCoverImage&&[t("slot",{name:"cover"}),this.variant!==r.OVERLAY&&this.coverIcon&&t("z-icon",{name:this.coverIcon})],!this.hasCoverImage&&t("div",{class:"color-cover"})),this.renderContentDiv())}return t(a,null,this.renderColorCoverCard())}get host(){return e(this)}};n.style=s;export{n as z_card};
-//# sourceMappingURL=p-0bde1f0e.entry.js.map

package/dist/web-components-library/p-0bde1f0e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZCardStyle0","ZCard","componentWillLoad","this","hasCoverImage","host","querySelector","renderColorCoverCard","h","class","name","renderContentDiv","render","variant","CardVariant","TEXT","Host","OVERLAY","coverIcon"],"sources":["src/components/z-card/styles.css?tag=z-card&encapsulation=shadow","src/components/z-card/index.tsx"],"sourcesContent":["/* The width of the card must be set by its container,\nrespecting the grid indications of the design. */\n\n:host {\n  /* Override this var to change the cover's aspect ratio */\n  --aspect-ratio: 1.62;\n  --z-card--border-color: var(--gray200);\n  --z-card--color-cover-background: var(--color-surface01);\n  --z-card--text-background: var(--color-surface01);\n  --z-card--text-border-radius: none;\n  --z-card--text-border: none;\n  --z-card--text-padding: calc(var(--space-unit) * 2) var(--space-unit);\n\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n*,\n::slotted(*) {\n  box-sizing: border-box;\n}\n\n*:focus {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n:host(:not([variant=\"overlay\"])) .cover-container {\n  position: relative;\n  width: 100%;\n}\n\n/* Old good trick with percentage padding to keep the aspect ratio.\nUnfortunately the `aspect-ratio` property is still experimental */\n.cover-container {\n  padding-bottom: calc(100% / var(--aspect-ratio));\n}\n\n::slotted([slot=\"cover\"]),\n.color-cover {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n\n.cover-container > z-icon {\n  --z-icon-width: calc(var(--space-unit) * 11);\n  --z-icon-height: var(--z-icon-width);\n\n  position: absolute;\n  top: calc(50% - calc(var(--z-icon-height) / 2));\n  left: calc(50% - calc(var(--z-icon-width) / 2));\n  fill: var(--color-primary01);\n}\n\n.color-cover {\n  background-color: var(--z-card--color-cover-background);\n}\n\n.content {\n  display: flex;\n  flex-direction: column;\n  padding-top: var(--space-unit);\n}\n\n.color-cover .cover-content {\n  display: flex;\n  height: 100%;\n  flex-direction: column;\n  justify-content: flex-end;\n  padding: var(--space-unit);\n}\n\n/* Truncates overflowing text */\n::slotted([slot=\"metadata\"]),\n::slotted([slot=\"title\"]),\n::slotted([slot=\"text\"]) {\n  display: -webkit-inline-box;\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n}\n\n::slotted([slot=\"title\"]:not(:last-child)),\n::slotted([slot=\"text\"]:not(:last-child)) {\n  margin-bottom: var(--space-unit);\n}\n\n::slotted([slot=\"title\"])::before {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  content: \"\";\n}\n\n::slotted([slot=\"metadata\"]:not(:last-child)) {\n  margin: 0 0 calc(var(--space-unit) * 0.25);\n  -webkit-line-clamp: 1;\n  text-transform: uppercase;\n}\n\n::slotted([slot=\"title\"]) {\n  margin: 0;\n  color: inherit;\n  font-size: inherit;\n  font-weight: var(--font-sb);\n  -webkit-line-clamp: 2;\n  text-decoration: none;\n}\n\n::slotted([slot=\"title\"]:focus) {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n::slotted([slot=\"text\"]) {\n  margin: 0;\n  -webkit-line-clamp: 3;\n}\n\n.actions {\n  position: relative;\n  z-index: 2;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n\n::slotted([slot=\"action\"]:not(:last-child)) {\n  margin-right: calc(var(--space-unit) * 2);\n}\n\n::slotted([slot=\"action\"]:focus) {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible)::before {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible) {\n  box-shadow: none !important;\n  outline: none !important;\n}\n\n:host([variant=\"text\"]) {\n  border: var(--z-card--text-border);\n  background-color: var(--z-card--text-background);\n  border-radius: var(--z-card--text-border-radius);\n}\n\n:host([show-shadow]) > .content,\n:host([variant=\"border\"]) > .content,\n:host([variant=\"shadow\"]) > .content {\n  height: 100%;\n  padding: var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2);\n}\n\n:host([variant=\"text\"]) > .content {\n  padding: var(--z-card--text-padding);\n}\n\n:host([variant=\"border\"]) .actions,\n:host([variant=\"shadow\"]) .actions {\n  margin-top: auto;\n}\n\n/* Border */\n:host([variant=\"border\"]) {\n  border: var(--border-size-small) solid var(--z-card--border-color);\n}\n\n:host([variant=\"border\"][clickable]:hover) > .content {\n  background: var(--color-background);\n}\n\n:host([variant=\"border\"][clickable]:focus:focus-visible) {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"border\"][clickable]:active) {\n  border-color: transparent;\n}\n\n/* Shadow */\n:host([variant=\"shadow\"]),\n:host([show-shadow]) {\n  box-shadow: var(--shadow-2);\n}\n\n:host([variant=\"shadow\"][clickable]:hover),\n:host([clickable][show-shadow]:hover) {\n  box-shadow: var(--shadow-4);\n}\n\n:host([variant=\"shadow\"][clickable]:focus:focus-visible),\n:host([clickable][show-shadow]:focus:focus-visible) {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"shadow\"][clickable]:active),\n:host([clickable][show-shadow]:active) {\n  box-shadow: none;\n}\n\n/* Overlay */\n:host([variant=\"overlay\"]) .content {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  justify-content: flex-end;\n  padding: var(--space-unit);\n  background-image: linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));\n  color: var(--color-text-inverse);\n  fill: var(--color-text-inverse);\n}\n","import {Component, Element, Host, Prop, State, h} from \"@stencil/core\";\nimport {CardVariant} from \"../../beans\";\n\n/**\n * ZCard component.\n * @cssprop --aspect-ratio - Cover aspect ratio. Default: `1.62`\n * @cssprop --z-card--border-color - Default: `var(--gray200)`\n * @cssprop --z-card--color-cover-background - Cover color. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-background - Background color for the `text` variant. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-border-radius - Default: `none`\n * @cssprop --z-card--text-border - Configure CSS `border`. Default: `none`\n * @cssprop --z-card--text-padding - Configure CSS `padding`. Default: `none`\n * @slot cover - Image cover\n * @slot metadata - Metadata\n * @slot title - Title\n * @slot text - Text content\n * @slot action - Actions\n */\n@Component({\n  tag: \"z-card\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZCard {\n  /**\n   * Card variant.\n   * Can be one of \"text\", \"border\", \"shadow\", \"overlay\".\n   * Leave it undefined for the default card.\n   */\n  @Prop({reflect: true})\n  variant: CardVariant;\n\n  /** Name of the icon to place over the image cover */\n  @Prop()\n  coverIcon: string;\n\n  /** Enable shadow. Default: false. */\n  @Prop({reflect: true})\n  showShadow = false;\n\n  /** Enable 'clickable' style like hover and focus style. */\n  @Prop({reflect: true})\n  clickable = false;\n\n  @Element() host: HTMLZCardElement;\n\n  @State()\n  hasCoverImage: boolean;\n\n  componentWillLoad(): void {\n    this.hasCoverImage = this.host.querySelector('[slot=\"cover\"]') !== null;\n  }\n\n  /**\n   * Template for a card without image cover.\n   * A colored background replaces the image and some data is moved over it.\n   */\n  private renderColorCoverCard(): HTMLDivElement[] {\n    return [\n      <div class=\"cover-container\">\n        <div class=\"color-cover\">\n          <div class=\"cover-content\">\n            <slot name=\"metadata\"></slot>\n            <slot name=\"title\"></slot>\n          </div>\n        </div>\n      </div>,\n      <div class=\"content\">\n        <slot name=\"text\"></slot>\n        <div class=\"actions\">\n          <slot name=\"action\"></slot>\n        </div>\n      </div>,\n    ];\n  }\n\n  /**\n   * Template for the content div.\n   */\n  private renderContentDiv(): HTMLDivElement {\n    return (\n      <div class=\"content\">\n        <slot name=\"metadata\"></slot>\n        <slot name=\"title\"></slot>\n        <slot name=\"text\"></slot>\n        <div class=\"actions\">\n          <slot name=\"action\"></slot>\n        </div>\n      </div>\n    );\n  }\n\n  render(): HTMLZCardElement {\n    if (this.variant === CardVariant.TEXT) {\n      return <Host>{this.renderContentDiv()}</Host>;\n    }\n\n    if (this.variant === CardVariant.OVERLAY || this.hasCoverImage) {\n      return (\n        <Host>\n          <div class=\"cover-container\">\n            {this.hasCoverImage && [\n              <slot name=\"cover\"></slot>,\n              this.variant !== CardVariant.OVERLAY && this.coverIcon && <z-icon name={this.coverIcon}></z-icon>,\n            ]}\n            {!this.hasCoverImage && <div class=\"color-cover\"></div>}\n          </div>\n          {this.renderContentDiv()}\n        </Host>\n      );\n    }\n\n    return <Host>{this.renderColorCoverCard()}</Host>;\n  }\n}\n"],"mappings":"wFAAA,MAAMA,EAAY,q3JAClB,MAAAC,EAAeD,E,MCsBFE,EAAK,M,yFAeH,M,eAID,M,6BAOZ,iBAAAC,GACEC,KAAKC,cAAgBD,KAAKE,KAAKC,cAAc,oBAAsB,I,CAO7D,oBAAAC,GACN,MAAO,CACLC,EAAA,OAAKC,MAAM,mBACTD,EAAA,OAAKC,MAAM,eACTD,EAAA,OAAKC,MAAM,iBACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,aAIjBF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,a,CASX,gBAAAC,GACN,OACEH,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,UACXF,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,Y,CAMnB,MAAAE,GACE,GAAIT,KAAKU,UAAYC,EAAYC,KAAM,CACrC,OAAOP,EAACQ,EAAI,KAAEb,KAAKQ,mB,CAGrB,GAAIR,KAAKU,UAAYC,EAAYG,SAAWd,KAAKC,cAAe,CAC9D,OACEI,EAACQ,EAAI,KACHR,EAAA,OAAKC,MAAM,mBACRN,KAAKC,eAAiB,CACrBI,EAAA,QAAME,KAAK,UACXP,KAAKU,UAAYC,EAAYG,SAAWd,KAAKe,WAAaV,EAAA,UAAQE,KAAMP,KAAKe,cAE7Ef,KAAKC,eAAiBI,EAAA,OAAKC,MAAM,iBAEpCN,KAAKQ,mB,CAKZ,OAAOH,EAACQ,EAAI,KAAEb,KAAKI,uB","ignoreList":[]}

package/dist/web-components-library/p-12008903.system.entry.js

@@ -1,2 +0,0 @@
-var __awaiter=this&&this.__awaiter||function(t,i,n,e){function r(t){return t instanceof n?t:new n((function(i){i(t)}))}return new(n||(n=Promise))((function(n,a){function s(t){try{c(e.next(t))}catch(t){a(t)}}function o(t){try{c(e["throw"](t))}catch(t){a(t)}}function c(t){t.done?n(t.value):r(t.value).then(s,o)}c((e=e.apply(t,i||[])).next())}))};var __generator=this&&this.__generator||function(t,i){var n={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},e,r,a,s;return s={next:o(0),throw:o(1),return:o(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function o(t){return function(i){return c([t,i])}}function c(o){if(e)throw new TypeError("Generator is already executing.");while(s&&(s=0,o[0]&&(n=0)),n)try{if(e=1,r&&(a=o[0]&2?r["return"]:o[0]?r["throw"]||((a=r["return"])&&a.call(r),0):r.next)&&!(a=a.call(r,o[1])).done)return a;if(r=0,a)o=[o[0]&2,a.value];switch(o[0]){case 0:case 1:a=o;break;case 4:n.label++;return{value:o[1],done:false};case 5:n.label++;r=o[1];o=[0];continue;case 7:o=n.ops.pop();n.trys.pop();continue;default:if(!(a=n.trys,a=a.length>0&&a[a.length-1])&&(o[0]===6||o[0]===2)){n=0;continue}if(o[0]===3&&(!a||o[1]>a[0]&&o[1]<a[3])){n.label=o[1];break}if(o[0]===6&&n.label<a[1]){n.label=a[1];a=o;break}if(a&&n.label<a[2]){n.label=a[2];n.ops.push(o);break}if(a[2])n.ops.pop();n.trys.pop();continue}o=i.call(t,n)}catch(t){o=[6,t];r=0}finally{e=a=0}if(o[0]&5)throw o[1];return{value:o[0]?o[1]:void 0,done:true}}};var __spreadArray=this&&this.__spreadArray||function(t,i,n){if(n||arguments.length===2)for(var e=0,r=i.length,a;e<r;e++){if(a||!(e in i)){if(!a)a=Array.prototype.slice.call(i,0,e);a[e]=i[e]}}return t.concat(a||Array.prototype.slice.call(i))};System.register(["./p-d8fcaf1f.system.js","./p-c39f227f.system.js","./p-1fe56b25.system.js","./p-ad6b3f77.system.js"],(function(t){"use strict";var i,n,e,r,a,s,o,c,u;return{setters:[function(t){i=t.r;n=t.c;e=t.h;r=t.a;a=t.g},function(t){s=t.w;o=t.p;c=t.D},function(t){u=t.g},function(){}],execute:function(){var l='*:focus{-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host{color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .modal-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:calc(var(--space-unit) * 2)}:host .modal-wrapper>.files-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:calc(var(--space-unit) * 4);gap:var(--space-unit)}:host .text-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:auto}:host .text-container .body-1{text-align:center}:host .text-container .upload-link{color:var(--color-link-primary);cursor:pointer}:host .text-container .upload-link-text{margin-bottom:var(--space-unit)}input#file-elem{display:none}#title{display:inline-block;margin:calc(var(--space-unit) * 2.5) 0 calc(var(--space-unit) * 4);font-size:calc(var(--space-unit) * 3);font-weight:var(--font-sb)}:host>.container>z-button{display:inline-block;margin-top:calc(var(--space-unit) * 3)}:host>.container>.files-container.hidden{display:none}:host>.container>.files-container>.heading-4-sb{display:inline-block;margin:calc(var(--space-unit) * 3) 0;font-size:calc(var(--space-unit) * 2);font-weight:var(--font-sb)}:host([type="dragdrop"])>.container>.files-container>.heading-4-sb{margin-top:0;margin-bottom:calc(var(--space-unit) * 3)}:host>.container>.files-container>.files-wrapper{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-column-gap:calc(var(--space-unit) * 2);-moz-column-gap:calc(var(--space-unit) * 2);column-gap:calc(var(--space-unit) * 2);row-gap:calc(var(--space-unit) * 2)}:host>.container>.files-container>z-divider{margin-top:calc(var(--space-unit) * 3);margin-bottom:0}:host([type="dragdrop"])>.container>.files-container>z-divider{margin:calc(var(--space-unit) * 3) 0}:host .error-message{font-size:14px;font-weight:400;letter-spacing:0.16%;line-height:20px;text-align:left}:host .error-message>.file-name{font-weight:600}@media only screen and (min-width: 768px){:host>.container>z-button{-ms-flex-item-align:start;align-self:flex-start}:host .modal-wrapper{padding:calc(var(--space-unit) * 3)}}@media only screen and (min-width: 1152px){:host .modal-wrapper{padding:calc(var(--space-unit) * 4)}}';var f=l;var h=t("z_file_upload",function(){function t(t){i(this,t);this.fileInput=n(this,"fileInput",7);this.inputAttributes={type:"file",id:"file-elem",multiple:true};this.type=s.DEFAULT;this.buttonVariant=undefined;this.acceptedFormat=undefined;this.fileMaxSize=undefined;this.mainTitle=undefined;this.description=undefined;this.files=[];this.uploadBtnLabel="allega";this.dragAndDropLabel="Rilascia i file in questa area per allegarli.";this.allowedFilesMessage=undefined;this.uploadClickableMessage="Carica";this.uploadMessage="o trascina dal tuo computer";this.errorModalTitle="Errore di caricamento";this.errorModalMessage=undefined;this.uploadedFilesLabel="File appena caricati";this.hasFileSection=true;this.invalidFiles=undefined}t.prototype.removeFileListener=function(t){this.removeFileHandler(t.detail)};t.prototype.fileDroppedListener=function(t){this.input.files=t.detail;this.fileInputHandler()};t.prototype.componentDidUpdate=function(){this.handleAccessibility();this.invalidFiles.size&&this.errorModal.focus()};t.prototype.componentWillLoad=function(){this.invalidFiles=new Map};t.prototype.fileInputHandler=function(){if(this.input.files.length){this.invalidFiles=this.checkFiles(Array.from(this.input.files))}};t.prototype.getFiles=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.files]}))}))};t.prototype.removeFile=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(i){this.removeFileHandler(t);return[2]}))}))};t.prototype.removeFileHandler=function(t){var i=this.files;var n=i.find((function(i){return i.name===t}));if(n){var e=i.indexOf(n);if(e>=0){i.splice(e,1);this.files=__spreadArray([],i,true)}}};t.prototype.getType=function(){if(u()!==o.DESKTOP&&u()!==o.DESKTOP_WIDE){return s.DEFAULT}return this.type};t.prototype.handleAccessibility=function(){var t=this.el.querySelector("z-file:last-child z-chip button");if(this.files.length>0&&t){t.focus()}else{this.getType()===s.DEFAULT?this.button.querySelector("button").focus():this.uploadLink.focus()}};t.prototype.checkFiles=function(t){var i=this;var n=new Map;var e="supera il limite di ".concat(this.fileMaxSize,"MB");var r=" ha un formato non supportato";t.forEach((function(t){var a=t.size/1024/1024;var s=i.acceptedFormat.split(",").some((function(i){return t.name.toLowerCase().endsWith(i.trim())}));var o=a<=i.fileMaxSize;if(o&&s){if(!i.files.find((function(i){return i.name===t.name}))){i.files.push(t);i.fileInput.emit(t);i.input.value=""}return}n.set(t.name,[]);if(!o){n.get(t.name).push(e)}if(!s){n.get(t.name).push(r)}}));return n};t.prototype.renderTitle=function(){return e("span",{id:"title"},this.mainTitle)};t.prototype.renderDescription=function(t){return e("span",{class:t},this.description)};t.prototype.renderAllowedFileExtensions=function(){var t="";var i="";if(this.acceptedFormat){var n=this.acceptedFormat.split(", ").map((function(t){return t.substring(1).toUpperCase()})).join(", ");t=" nei formati ".concat(n)}if(this.fileMaxSize){i=" per un massimo di ".concat(this.fileMaxSize,"MB di peso")}var r="Puoi allegare file".concat(t).concat(i,".");return e("span",{class:"body-3"},this.allowedFilesMessage?this.allowedFilesMessage:t||i?r:null)};t.prototype.renderFileSection=function(){if(!this.hasFileSection){return}return e("section",{class:"files-container ".concat(!this.files.length?"hidden":"")},e("span",{class:"heading-4-sb"},this.uploadedFilesLabel),e("div",{class:"files-wrapper"},e("slot",{name:"files"})),e("z-divider",{size:c.MEDIUM}))};t.prototype.renderInput=function(){var t=this;return e("input",Object.assign({},this.inputAttributes,{onChange:function(){return t.fileInputHandler()},accept:this.acceptedFormat,ref:function(i){return t.input=i}}))};t.prototype.renderUploadButton=function(){var t=this;return[this.renderInput(),e("z-button",{onClick:function(){return t.input.click()},onKeyPress:function(i){if(i.code=="Space"||i.code=="Enter"){i.preventDefault();t.input.click()}},id:"fileSelect",variant:this.buttonVariant,icon:"upload",ref:function(i){return t.button=i}},this.uploadBtnLabel)]};t.prototype.renderUploadLink=function(){var t=this;return[this.renderInput(),e("span",{class:"body-1 upload-link-text"},e("span",{tabIndex:0,class:"body-1-sb upload-link",onClick:function(){return t.input.click()},onKeyPress:function(i){if(i.code=="Space"||i.code=="Enter"){i.preventDefault();t.input.click()}},ref:function(i){return t.uploadLink=i}},this.uploadClickableMessage)," ",this.uploadMessage)]};t.prototype.renderDefaultMode=function(){return[this.renderDescription("body-3-sb"),this.renderAllowedFileExtensions(),this.renderFileSection(),this.renderUploadButton()]};t.prototype.renderDragDropMode=function(){return[this.renderFileSection(),e("z-dragdrop-area",{"drag-and-drop-label":this.dragAndDropLabel},e("div",{class:"text-container"},this.renderDescription("body-1"),this.renderUploadLink(),this.renderAllowedFileExtensions()))]};t.prototype.formatErrorString=function(t,i){var n,r;var a=i[0]&&i[1]?" e ":"";return e("span",{class:"error-message"},"Il file ",e("span",{class:"file-name"},t)," ",(n=i[1])!==null&&n!==void 0?n:"",a,(r=i[0])!==null&&r!==void 0?r:"",".")};t.prototype.handleErrorModalContent=function(){var t=this;return e("div",{slot:"modalContent"},e("div",{class:"modal-wrapper"},e("div",{class:"files"},this.errorModalMessage?e("span",{class:"body-3"},this.errorModalMessage):Array.from(this.invalidFiles).map((function(i){var n=i[0],r=i[1];return e("span",{class:"body-3"},t.formatErrorString(n,r))})))))};t.prototype.render=function(){var t=this;return e(r,{key:"30d78f7ce88aa6e994de1355cf4bb8bbc79e6f85"},e("div",{key:"b95129c709a9161cb1c08bc39a308196fc26644d",class:"container ".concat(this.getType())},this.mainTitle&&this.renderTitle(),this.getType()==s.DEFAULT?this.renderDefaultMode():this.renderDragDropMode()),!!this.invalidFiles.size&&e("z-modal",{key:"2e0db26fa301fa0141ac14fe92f2a222f2a5f2c8",modalid:"file-upload-".concat(this.type,"-error-modal"),tabIndex:0,ref:function(i){return t.errorModal=i},modaltitle:this.errorModalTitle,onModalClose:function(){return t.invalidFiles=new Map},onModalBackgroundClick:function(){return t.invalidFiles=new Map}},this.handleErrorModalContent()))};Object.defineProperty(t.prototype,"el",{get:function(){return a(this)},enumerable:false,configurable:true});return t}());h.style=f}}}));
-//# sourceMappingURL=p-12008903.system.entry.js.map

package/dist/web-components-library/p-12008903.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZFileUploadStyle0","ZFileUpload","exports","this","inputAttributes","type","id","multiple","ZFileUploadType","DEFAULT","class_1","prototype","removeFileListener","e","removeFileHandler","detail","fileDroppedListener","input","files","fileInputHandler","componentDidUpdate","handleAccessibility","invalidFiles","size","errorModal","focus","componentWillLoad","Map","length","checkFiles","Array","from","getFiles","removeFile","fileName","file","find","name","index","indexOf","splice","__spreadArray","getType","getDevice","Device","DESKTOP","DESKTOP_WIDE","lastFile","el","querySelector","button","uploadLink","_this","errors","sizeErrorString","concat","fileMaxSize","formatErrorString","forEach","fileSize","fileFormatOk","acceptedFormat","split","some","ext","toLowerCase","endsWith","trim","fileSizeOk","f","push","fileInput","emit","value","set","get","renderTitle","h","mainTitle","renderDescription","cssClass","class","description","renderAllowedFileExtensions","fileFormatString","fileWeightString","fileFormat","map","string","substring","toUpperCase","join","finalString","allowedFilesMessage","renderFileSection","hasFileSection","uploadedFilesLabel","DividerSize","MEDIUM","renderInput","Object","assign","onChange","accept","ref","val","renderUploadButton","onClick","click","onKeyPress","code","preventDefault","variant","buttonVariant","icon","uploadBtnLabel","renderUploadLink","tabIndex","uploadClickableMessage","uploadMessage","renderDefaultMode","renderDragDropMode","dragAndDropLabel","key","bothErrors","_a","_b","handleErrorModalContent","slot","errorModalMessage","_c","render","Host","modalid","modaltitle","errorModalTitle","onModalClose","onModalBackgroundClick"],"sources":["src/components/file-upload/z-file-upload/styles.css?tag=z-file-upload&encapsulation=shadow","src/components/file-upload/z-file-upload/index.tsx"],"sourcesContent":["*:focus {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n:host {\n  color: var(--color-default-text);\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n:host > .container {\n  display: flex;\n  flex-direction: column;\n}\n\n:host .modal-wrapper {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: calc(var(--space-unit) * 2);\n}\n\n:host .modal-wrapper > .files-wrapper {\n  display: flex;\n  flex-direction: column;\n  margin: calc(var(--space-unit) * 4);\n  gap: var(--space-unit);\n}\n\n:host .text-container {\n  display: flex;\n  flex-direction: column;\n  margin: auto;\n}\n\n:host .text-container .body-1 {\n  text-align: center;\n}\n\n:host .text-container .upload-link {\n  color: var(--color-link-primary);\n  cursor: pointer;\n}\n\n:host .text-container .upload-link-text {\n  margin-bottom: var(--space-unit);\n}\n\ninput#file-elem {\n  display: none;\n}\n\n#title {\n  display: inline-block;\n  margin: calc(var(--space-unit) * 2.5) 0 calc(var(--space-unit) * 4);\n  font-size: calc(var(--space-unit) * 3);\n  font-weight: var(--font-sb);\n}\n\n:host > .container > z-button {\n  display: inline-block;\n  margin-top: calc(var(--space-unit) * 3);\n}\n\n:host > .container > .files-container.hidden {\n  display: none;\n}\n\n:host > .container > .files-container > .heading-4-sb {\n  display: inline-block;\n  margin: calc(var(--space-unit) * 3) 0;\n  font-size: calc(var(--space-unit) * 2);\n  font-weight: var(--font-sb);\n}\n\n:host([type=\"dragdrop\"]) > .container > .files-container > .heading-4-sb {\n  margin-top: 0;\n  margin-bottom: calc(var(--space-unit) * 3);\n}\n\n:host > .container > .files-container > .files-wrapper {\n  display: flex;\n  flex-wrap: wrap;\n  column-gap: calc(var(--space-unit) * 2);\n  row-gap: calc(var(--space-unit) * 2);\n}\n\n:host > .container > .files-container > z-divider {\n  margin-top: calc(var(--space-unit) * 3);\n  margin-bottom: 0;\n}\n\n:host([type=\"dragdrop\"]) > .container > .files-container > z-divider {\n  margin: calc(var(--space-unit) * 3) 0;\n}\n\n:host .error-message {\n  font-size: 14px;\n  font-weight: 400;\n  letter-spacing: 0.16%;\n  line-height: 20px;\n  text-align: left;\n}\n\n:host .error-message > .file-name {\n  font-weight: 600;\n}\n\n/* Tablet breakpoint */\n@media only screen and (min-width: 768px) {\n  :host > .container > z-button {\n    align-self: flex-start;\n  }\n\n  :host .modal-wrapper {\n    padding: calc(var(--space-unit) * 3);\n  }\n}\n\n@media only screen and (min-width: 1152px) {\n  :host .modal-wrapper {\n    padding: calc(var(--space-unit) * 4);\n  }\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, h} from \"@stencil/core\";\nimport {ButtonVariant, Device, DividerSize, ZFileUploadType} from \"../../../beans\";\nimport {getDevice} from \"../../../utils/utils\";\n\n@Component({\n  tag: \"z-file-upload\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZFileUpload {\n  /** Prop indicating the file upload type - can be default or dragdrop */\n  @Prop({reflect: true})\n  type: ZFileUploadType = ZFileUploadType.DEFAULT;\n\n  /** Prop indicating the button variant*/\n  @Prop()\n  buttonVariant?: ButtonVariant;\n\n  /** Prop indicating the accepted file type: ex \".pdf, .doc, .jpg\" */\n  @Prop()\n  acceptedFormat?: string;\n\n  /** Max file dimension in Megabyte */\n  @Prop()\n  fileMaxSize?: number;\n\n  /** Title */\n  @Prop()\n  mainTitle?: string;\n\n  /** Description */\n  @Prop()\n  description?: string;\n\n  /** Files added by the user */\n  @State()\n  files: File[] = [];\n\n  /** upoload button label */\n  @Prop()\n  uploadBtnLabel?: string = \"allega\";\n\n  /** drag & drop button label */\n  @Prop()\n  dragAndDropLabel?: string = \"Rilascia i file in questa area per allegarli.\";\n\n  /** allowed file message */\n  @Prop()\n  allowedFilesMessage?: string;\n\n  /** upload clickable message */\n  @Prop()\n  uploadClickableMessage?: string = \"Carica\";\n\n  /** upload message */\n  @Prop()\n  uploadMessage?: string = \"o trascina dal tuo computer\";\n\n  /** error modal title */\n  @Prop()\n  errorModalTitle?: string = \"Errore di caricamento\";\n\n  /** error modal message */\n  @Prop()\n  errorModalMessage?: string;\n\n  /** loaded files label */\n  @Prop()\n  uploadedFilesLabel?: string = \"File appena caricati\";\n\n  /** uploaded files history rendering */\n  @Prop()\n  hasFileSection?: boolean = true;\n\n  /** List of files not allowed to be uploaded */\n  @State()\n  invalidFiles: Map<string, string[]>;\n\n  @Element() el: HTMLZFileUploadElement;\n\n  private input: HTMLInputElement;\n\n  private button: HTMLZButtonElement;\n\n  private errorModal: HTMLZModalElement;\n\n  private uploadLink: HTMLSpanElement;\n\n  private inputAttributes = {\n    type: \"file\",\n    id: \"file-elem\",\n    multiple: true,\n  };\n\n  /** Listen removeFile event sent from z-file component */\n  @Listen(\"removeFile\")\n  removeFileListener(e: CustomEvent): void {\n    this.removeFileHandler(e.detail);\n  }\n\n  /** Listen fileDropped event sent from z-dragdrop-area component */\n  @Listen(\"fileDropped\")\n  fileDroppedListener(e: CustomEvent): void {\n    this.input.files = e.detail;\n    this.fileInputHandler();\n  }\n\n  componentDidUpdate(): void {\n    this.handleAccessibility();\n    this.invalidFiles.size && this.errorModal.focus();\n  }\n\n  componentWillLoad(): void {\n    this.invalidFiles = new Map<string, string[]>();\n  }\n\n  /** Emitted when user select one or more files */\n  @Event()\n  fileInput: EventEmitter;\n\n  private fileInputHandler(): void {\n    if (this.input.files.length) {\n      this.invalidFiles = this.checkFiles(Array.from(this.input.files));\n    }\n  }\n\n  /** get array of uploaded files */\n  @Method()\n  async getFiles(): Promise<File[]> {\n    return this.files;\n  }\n\n  /** remove file from the array */\n  @Method()\n  async removeFile(fileName: string): Promise<void> {\n    this.removeFileHandler(fileName);\n  }\n\n  private removeFileHandler(fileName: string): void {\n    const files = this.files;\n    const file = files.find((file) => file.name === fileName);\n    if (file) {\n      const index = files.indexOf(file);\n      if (index >= 0) {\n        files.splice(index, 1);\n        this.files = [...files];\n      }\n    }\n  }\n\n  private getType(): ZFileUploadType {\n    if (getDevice() !== Device.DESKTOP && getDevice() !== Device.DESKTOP_WIDE) {\n      return ZFileUploadType.DEFAULT;\n    }\n\n    return this.type;\n  }\n\n  private handleAccessibility(): void {\n    const lastFile = this.el.querySelector(\"z-file:last-child z-chip button\");\n    if (this.files.length > 0 && lastFile) {\n      (lastFile as HTMLElement).focus();\n    } else {\n      this.getType() === ZFileUploadType.DEFAULT\n        ? this.button.querySelector(\"button\").focus()\n        : this.uploadLink.focus();\n    }\n  }\n\n  private checkFiles(files: File[]): Map<string, string[]> {\n    const errors = new Map<string, string[]>();\n    const sizeErrorString = `supera il limite di ${this.fileMaxSize}MB`;\n    const formatErrorString = \" ha un formato non supportato\";\n    files.forEach((file: File) => {\n      const fileSize = file.size / 1024 / 1024;\n      const fileFormatOk = this.acceptedFormat\n        .split(\",\")\n        .some((ext: string) => file.name.toLowerCase().endsWith(ext.trim()));\n      const fileSizeOk = fileSize <= this.fileMaxSize;\n      if (fileSizeOk && fileFormatOk) {\n        if (!this.files.find((f) => f.name === file.name)) {\n          this.files.push(file);\n          this.fileInput.emit(file);\n          this.input.value = \"\";\n        }\n\n        return;\n      }\n      errors.set(file.name, []);\n      if (!fileSizeOk) {\n        errors.get(file.name).push(sizeErrorString);\n      }\n      if (!fileFormatOk) {\n        errors.get(file.name).push(formatErrorString);\n      }\n    });\n\n    return errors;\n  }\n\n  private renderTitle(): HTMLElement {\n    return <span id=\"title\">{this.mainTitle}</span>;\n  }\n\n  private renderDescription(cssClass): HTMLElement {\n    return <span class={cssClass}>{this.description}</span>;\n  }\n\n  private renderAllowedFileExtensions(): HTMLElement {\n    let fileFormatString = \"\";\n    let fileWeightString = \"\";\n\n    if (this.acceptedFormat) {\n      const fileFormat = this.acceptedFormat\n        .split(\", \")\n        .map((string) => string.substring(1).toUpperCase())\n        .join(\", \");\n      fileFormatString = ` nei formati ${fileFormat}`;\n    }\n\n    if (this.fileMaxSize) {\n      fileWeightString = ` per un massimo di ${this.fileMaxSize}MB di peso`;\n    }\n\n    const finalString = `Puoi allegare file${fileFormatString}${fileWeightString}.`;\n\n    return (\n      <span class=\"body-3\">\n        {this.allowedFilesMessage\n          ? this.allowedFilesMessage\n          : fileFormatString || fileWeightString\n            ? finalString\n            : null}\n      </span>\n    );\n  }\n\n  private renderFileSection(): HTMLElement {\n    if (!this.hasFileSection) {\n      return;\n    }\n\n    return (\n      <section class={`files-container ${!this.files.length ? \"hidden\" : \"\"}`}>\n        <span class=\"heading-4-sb\">{this.uploadedFilesLabel}</span>\n        <div class=\"files-wrapper\">\n          <slot name=\"files\" />\n        </div>\n        <z-divider size={DividerSize.MEDIUM} />\n      </section>\n    );\n  }\n\n  private renderInput(): HTMLInputElement {\n    return (\n      <input\n        {...this.inputAttributes}\n        onChange={() => this.fileInputHandler()}\n        accept={this.acceptedFormat}\n        ref={(val) => (this.input = val)}\n      />\n    );\n  }\n\n  private renderUploadButton(): unknown[] {\n    return [\n      this.renderInput(),\n      <z-button\n        onClick={() => this.input.click()}\n        onKeyPress={(e) => {\n          if (e.code == \"Space\" || e.code == \"Enter\") {\n            e.preventDefault();\n            this.input.click();\n          }\n        }}\n        id=\"fileSelect\"\n        variant={this.buttonVariant}\n        icon=\"upload\"\n        ref={(val) => (this.button = val)}\n      >\n        {this.uploadBtnLabel}\n      </z-button>,\n    ];\n  }\n\n  private renderUploadLink(): unknown[] {\n    return [\n      this.renderInput(),\n      <span class=\"body-1 upload-link-text\">\n        <span\n          tabIndex={0}\n          class=\"body-1-sb upload-link\"\n          onClick={() => this.input.click()}\n          onKeyPress={(e) => {\n            if (e.code == \"Space\" || e.code == \"Enter\") {\n              e.preventDefault();\n              this.input.click();\n            }\n          }}\n          ref={(val) => (this.uploadLink = val)}\n        >\n          {this.uploadClickableMessage}\n        </span>{\" \"}\n        {this.uploadMessage}\n      </span>,\n    ];\n  }\n\n  private renderDefaultMode(): unknown[] {\n    return [\n      this.renderDescription(\"body-3-sb\"),\n      this.renderAllowedFileExtensions(),\n      this.renderFileSection(),\n      this.renderUploadButton(),\n    ];\n  }\n\n  private renderDragDropMode(): unknown[] {\n    return [\n      this.renderFileSection(),\n      <z-dragdrop-area drag-and-drop-label={this.dragAndDropLabel}>\n        <div class=\"text-container\">\n          {this.renderDescription(\"body-1\")}\n          {this.renderUploadLink()}\n          {this.renderAllowedFileExtensions()}\n        </div>\n      </z-dragdrop-area>,\n    ];\n  }\n\n  private formatErrorString(key, value): string {\n    const bothErrors = value[0] && value[1] ? \" e \" : \"\";\n\n    return (\n      <span class=\"error-message\">\n        Il file <span class=\"file-name\">{key}</span> {value[1] ?? \"\"}\n        {bothErrors}\n        {value[0] ?? \"\"}.\n      </span>\n    );\n  }\n\n  private handleErrorModalContent(): HTMLDivElement {\n    return (\n      <div slot=\"modalContent\">\n        <div class=\"modal-wrapper\">\n          <div class=\"files\">\n            {this.errorModalMessage ? (\n              <span class=\"body-3\">{this.errorModalMessage}</span>\n            ) : (\n              Array.from(this.invalidFiles).map(([key, value]) => {\n                return <span class=\"body-3\">{this.formatErrorString(key, value)}</span>;\n              })\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  render(): HTMLZFileUploadElement {\n    return (\n      <Host>\n        <div class={`container ${this.getType()}`}>\n          {this.mainTitle && this.renderTitle()}\n          {this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()}\n        </div>\n        {!!this.invalidFiles.size && (\n          <z-modal\n            modalid={`file-upload-${this.type}-error-modal`}\n            tabIndex={0}\n            ref={(val) => (this.errorModal = val)}\n            modaltitle={this.errorModalTitle}\n            onModalClose={() => (this.invalidFiles = new Map<string, string[]>())}\n            onModalBackgroundClick={() => (this.invalidFiles = new Map<string, string[]>())}\n          >\n            {this.handleErrorModalContent()}\n          </z-modal>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/web-components-library/p-21941767.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as i,g as o}from"./p-cc3c02fe.js";import{g as a}from"./p-025f494e.js";import{m as n}from"./p-2c886e8b.js";const r=":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.dragdrop{position:relative;display:-ms-flexbox;display:flex;height:228px;-ms-flex-direction:column;flex-direction:column;padding:calc(var(--space-unit) * 2);border-color:var(--color-surface04);background-color:var(--color-surface02);background-image:url(\"data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='2' ry='2' stroke='%23CACCCEFF' stroke-width='2' stroke-dasharray='15%2c 10%2c 14%2c 11' stroke-dashoffset='3' stroke-linecap='square'/%3e%3c/svg%3e\");border-radius:2px;color:var(--color-default-text)}:host>.dragdrop.dragover *{pointer-events:none}:host>.dragdrop .dragover-container{position:absolute;z-index:10;top:0;left:0;display:none;width:100%;height:100%;background-color:var(--color-primary03);-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary)}:host>.dragdrop .dragover-container .dragover-message{padding:10px 28px;background-color:var(--color-link-primary);color:var(--color-text-inverse)}:host>.dragdrop.dragover .dragover-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}";const s=r;const l=class{constructor(i){t(this,i);this.fileDropped=e(this,"fileDropped",7);this.dragAndDropLabel=undefined}fileDroppedHandler(t){this.fileDropped.emit(t)}renderOnDragOverMessage(){return i("div",{class:"dragover-container"},i("div",{class:"dragover-message"},i("span",{class:"body-2-sb"},this.dragAndDropLabel)))}render(){return i("div",{key:"41334ac77bca3fb0d30518480b702c815d95b125",tabIndex:0,ref:t=>this.dragDropContainer=t,class:"dragdrop",onDragOver:t=>{t.preventDefault();this.dragDropContainer.classList.add("dragover")},onDragLeave:()=>{this.dragDropContainer.classList.remove("dragover")},onDrop:t=>{t.preventDefault();if(t.dataTransfer.files.length){this.dragDropContainer.classList.remove("dragover");this.fileDroppedHandler(t.dataTransfer.files)}}},this.renderOnDragOverMessage(),i("slot",{key:"83344ee14fcec799690b644fe0a56cc86e1b4476"}))}};l.style=s;var d=window.CustomEvent;if(!d||typeof d==="object"){d=function t(e,i){i=i||{};var o=document.createEvent("CustomEvent");o.initCustomEvent(e,!!i.bubbles,!!i.cancelable,i.detail||null);return o};d.prototype=window.Event.prototype}function c(t,e){var i="on"+e.type.toLowerCase();if(typeof t[i]==="function"){t[i](e)}return t.dispatchEvent(e)}function h(t){while(t&&t!==document.body){var e=window.getComputedStyle(t);var i=function(t,i){return!(e[t]===undefined||e[t]===i)};if(e.opacity<1||i("zIndex","auto")||i("transform","none")||i("mixBlendMode","normal")||i("filter","none")||i("perspective","none")||e["isolation"]==="isolate"||e.position==="fixed"||e.webkitOverflowScrolling==="touch"){return true}t=t.parentElement}return false}function u(t){while(t){if(t.localName==="dialog"){return t}if(t.parentElement){t=t.parentElement}else if(t.parentNode){t=t.parentNode.host}else{t=null}}return null}function f(t){while(t&&t.shadowRoot&&t.shadowRoot.activeElement){t=t.shadowRoot.activeElement}if(t&&t.blur&&t!==document.body){t.blur()}}function m(t,e){for(var i=0;i<t.length;++i){if(t[i]===e){return true}}return false}function v(t){if(!t||!t.hasAttribute("method")){return false}return t.getAttribute("method").toLowerCase()==="dialog"}function b(t){var e=["button","input","keygen","select","textarea"];var i=e.map((function(t){return t+":not([disabled])"}));i.push('[tabindex]:not([disabled]):not([tabindex=""])');var o=t.querySelector(i.join(", "));if(!o&&"attachShadow"in Element.prototype){var a=t.querySelectorAll("*");for(var n=0;n<a.length;n++){if(a[n].tagName&&a[n].shadowRoot){o=b(a[n].shadowRoot);if(o){break}}}}return o}function p(t){return t.isConnected||document.body.contains(t)}function g(t){if(t.submitter){return t.submitter}var e=t.target;if(!(e instanceof HTMLFormElement)){return null}var i=k.formSubmitter;if(!i){var o=t.target;var a="getRootNode"in o&&o.getRootNode()||document;i=a.activeElement}if(!i||i.form!==e){return null}return i}function w(t){if(t.defaultPrevented){return}var e=t.target;var i=k.imagemapUseValue;var o=g(t);if(i===null&&o){i=o.value}var a=u(e);if(!a){return}var n=o&&o.getAttribute("formmethod")||e.getAttribute("method");if(n!=="dialog"){return}t.preventDefault();if(i!=null){a.close(i)}else{a.close()}}function y(t){this.dialog_=t;this.replacedStyleTop_=false;this.openAsModal_=false;if(!t.hasAttribute("role")){t.setAttribute("role","dialog")}t.show=this.show.bind(this);t.showModal=this.showModal.bind(this);t.close=this.close.bind(this);t.addEventListener("submit",w,false);if(!("returnValue"in t)){t.returnValue=""}if("MutationObserver"in window){var e=new MutationObserver(this.maybeHideModal.bind(this));e.observe(t,{attributes:true,attributeFilter:["open"]})}else{var i=false;var o=function(){i?this.downgradeModal():this.maybeHideModal();i=false}.bind(this);var a;var n=function(e){if(e.target!==t){return}var n="DOMNodeRemoved";i|=e.type.substr(0,n.length)===n;window.clearTimeout(a);a=window.setTimeout(o,0)};["DOMAttrModified","DOMNodeRemoved","DOMNodeRemovedFromDocument"].forEach((function(e){t.addEventListener(e,n)}))}Object.defineProperty(t,"open",{set:this.setOpen.bind(this),get:t.hasAttribute.bind(t,"open")});this.backdrop_=document.createElement("div");this.backdrop_.className="backdrop";this.backdrop_.addEventListener("mouseup",this.backdropMouseEvent_.bind(this));this.backdrop_.addEventListener("mousedown",this.backdropMouseEvent_.bind(this));this.backdrop_.addEventListener("click",this.backdropMouseEvent_.bind(this))}y.prototype={get dialog(){return this.dialog_},maybeHideModal:function(){if(this.dialog_.hasAttribute("open")&&p(this.dialog_)){return}this.downgradeModal()},downgradeModal:function(){if(!this.openAsModal_){return}this.openAsModal_=false;this.dialog_.style.zIndex="";if(this.replacedStyleTop_){this.dialog_.style.top="";this.replacedStyleTop_=false}this.backdrop_.parentNode&&this.backdrop_.parentNode.removeChild(this.backdrop_);k.dm.removeDialog(this)},setOpen:function(t){if(t){this.dialog_.hasAttribute("open")||this.dialog_.setAttribute("open","")}else{this.dialog_.removeAttribute("open");this.maybeHideModal()}},backdropMouseEvent_:function(t){if(!this.dialog_.hasAttribute("tabindex")){var e=document.createElement("div");this.dialog_.insertBefore(e,this.dialog_.firstChild);e.tabIndex=-1;e.focus();this.dialog_.removeChild(e)}else{this.dialog_.focus()}var i=document.createEvent("MouseEvents");i.initMouseEvent(t.type,t.bubbles,t.cancelable,window,t.detail,t.screenX,t.screenY,t.clientX,t.clientY,t.ctrlKey,t.altKey,t.shiftKey,t.metaKey,t.button,t.relatedTarget);this.dialog_.dispatchEvent(i);t.stopPropagation()},focus_:function(){var t=this.dialog_.querySelector("[autofocus]:not([disabled])");if(!t&&this.dialog_.tabIndex>=0){t=this.dialog_}if(!t){t=b(this.dialog_)}f(document.activeElement);t&&t.focus()},updateZIndex:function(t,e){if(t<e){throw new Error("dialogZ should never be < backdropZ")}this.dialog_.style.zIndex=t;this.backdrop_.style.zIndex=e},show:function(){if(!this.dialog_.open){this.setOpen(true);this.focus_()}},showModal:function(){if(this.dialog_.hasAttribute("open")){throw new Error("Failed to execute 'showModal' on dialog: The element is already open, and therefore cannot be opened modally.")}if(!p(this.dialog_)){throw new Error("Failed to execute 'showModal' on dialog: The element is not in a Document.")}if(!k.dm.pushDialog(this)){throw new Error("Failed to execute 'showModal' on dialog: There are too many open modal dialogs.")}if(h(this.dialog_.parentElement)){console.warn("A dialog is being shown inside a stacking context. "+"This may cause it to be unusable. For more information, see this link: "+"https://github.com/GoogleChrome/dialog-polyfill/#stacking-context")}this.setOpen(true);this.openAsModal_=true;if(k.needsCentering(this.dialog_)){k.reposition(this.dialog_);this.replacedStyleTop_=true}else{this.replacedStyleTop_=false}this.dialog_.parentNode.insertBefore(this.backdrop_,this.dialog_.nextSibling);this.focus_()},close:function(t){if(!this.dialog_.hasAttribute("open")){throw new Error("Failed to execute 'close' on dialog: The element does not have an 'open' attribute, and therefore cannot be closed.")}this.setOpen(false);if(t!==undefined){this.dialog_.returnValue=t}var e=new d("close",{bubbles:false,cancelable:false});c(this.dialog_,e)}};var k={};k.reposition=function(t){var e=document.body.scrollTop||document.documentElement.scrollTop;var i=e+(window.innerHeight-t.offsetHeight)/2;t.style.top=Math.max(e,i)+"px"};k.isInlinePositionSetByStylesheet=function(t){for(var e=0;e<document.styleSheets.length;++e){var i=document.styleSheets[e];var o=null;try{o=i.cssRules}catch(t){}if(!o){continue}for(var a=0;a<o.length;++a){var n=o[a];var r=null;try{r=document.querySelectorAll(n.selectorText)}catch(t){}if(!r||!m(r,t)){continue}var s=n.style.getPropertyValue("top");var l=n.style.getPropertyValue("bottom");if(s&&s!=="auto"||l&&l!=="auto"){return true}}}return false};k.needsCentering=function(t){var e=window.getComputedStyle(t);if(e.position!=="absolute"){return false}if(t.style.top!=="auto"&&t.style.top!==""||t.style.bottom!=="auto"&&t.style.bottom!==""){return false}return!k.isInlinePositionSetByStylesheet(t)};k.forceRegisterDialog=function(t){if(window.HTMLDialogElement||t.showModal){console.warn("This browser already supports <dialog>, the polyfill "+"may not work correctly",t)}if(t.localName!=="dialog"){throw new Error("Failed to register dialog: The element is not a dialog.")}new y(t)};k.registerDialog=function(t){if(!t.showModal){k.forceRegisterDialog(t)}};k.DialogManager=function(){this.pendingDialogStack=[];var t=this.checkDOM_.bind(this);this.overlay=document.createElement("div");this.overlay.className="_dialog_overlay";this.overlay.addEventListener("click",function(e){this.forwardTab_=undefined;e.stopPropagation();t([])}.bind(this));this.handleKey_=this.handleKey_.bind(this);this.handleFocus_=this.handleFocus_.bind(this);this.zIndexLow_=1e5;this.zIndexHigh_=1e5+150;this.forwardTab_=undefined;if("MutationObserver"in window){this.mo_=new MutationObserver((function(e){var i=[];e.forEach((function(t){for(var e=0,o;o=t.removedNodes[e];++e){if(!(o instanceof Element)){continue}else if(o.localName==="dialog"){i.push(o)}i=i.concat(o.querySelectorAll("dialog"))}}));i.length&&t(i)}))}};k.DialogManager.prototype.blockDocument=function(){document.documentElement.addEventListener("focus",this.handleFocus_,true);document.addEventListener("keydown",this.handleKey_);this.mo_&&this.mo_.observe(document,{childList:true,subtree:true})};k.DialogManager.prototype.unblockDocument=function(){document.documentElement.removeEventListener("focus",this.handleFocus_,true);document.removeEventListener("keydown",this.handleKey_);this.mo_&&this.mo_.disconnect()};k.DialogManager.prototype.updateStacking=function(){var t=this.zIndexHigh_;for(var e=0,i;i=this.pendingDialogStack[e];++e){i.updateZIndex(--t,--t);if(e===0){this.overlay.style.zIndex=--t}}var o=this.pendingDialogStack[0];if(o){var a=o.dialog.parentNode||document.body;a.appendChild(this.overlay)}else if(this.overlay.parentNode){this.overlay.parentNode.removeChild(this.overlay)}};k.DialogManager.prototype.containedByTopDialog_=function(t){while(t=u(t)){for(var e=0,i;i=this.pendingDialogStack[e];++e){if(i.dialog===t){return e===0}}t=t.parentElement}return false};k.DialogManager.prototype.handleFocus_=function(t){var e=t.composedPath?t.composedPath()[0]:t.target;if(this.containedByTopDialog_(e)){return}if(document.activeElement===document.documentElement){return}t.preventDefault();t.stopPropagation();f(e);if(this.forwardTab_===undefined){return}var i=this.pendingDialogStack[0];var o=i.dialog;var a=o.compareDocumentPosition(e);if(a&Node.DOCUMENT_POSITION_PRECEDING){if(this.forwardTab_){i.focus_()}else if(e!==document.documentElement){document.documentElement.focus()}}return false};k.DialogManager.prototype.handleKey_=function(t){this.forwardTab_=undefined;if(t.keyCode===27){t.preventDefault();t.stopPropagation();var e=new d("cancel",{bubbles:false,cancelable:true});var i=this.pendingDialogStack[0];if(i&&c(i.dialog,e)){i.dialog.close()}}else if(t.keyCode===9){this.forwardTab_=!t.shiftKey}};k.DialogManager.prototype.checkDOM_=function(t){var e=this.pendingDialogStack.slice();e.forEach((function(e){if(t.indexOf(e.dialog)!==-1){e.downgradeModal()}else{e.maybeHideModal()}}))};k.DialogManager.prototype.pushDialog=function(t){var e=(this.zIndexHigh_-this.zIndexLow_)/2-1;if(this.pendingDialogStack.length>=e){return false}if(this.pendingDialogStack.unshift(t)===1){this.blockDocument()}this.updateStacking();return true};k.DialogManager.prototype.removeDialog=function(t){var e=this.pendingDialogStack.indexOf(t);if(e===-1){return}this.pendingDialogStack.splice(e,1);if(this.pendingDialogStack.length===0){this.unblockDocument()}this.updateStacking()};k.dm=new k.DialogManager;k.formSubmitter=null;k.imagemapUseValue=null;if(window.HTMLDialogElement===undefined){var x=document.createElement("form");x.setAttribute("method","dialog");if(x.method!=="dialog"){var M=Object.getOwnPropertyDescriptor(HTMLFormElement.prototype,"method");if(M){var E=M.get;M.get=function(){if(v(this)){return"dialog"}return E.call(this)};var z=M.set;M.set=function(t){if(typeof t==="string"&&t.toLowerCase()==="dialog"){return this.setAttribute("method",t)}return z.call(this,t)};Object.defineProperty(HTMLFormElement.prototype,"method",M)}}document.addEventListener("click",(function(t){k.formSubmitter=null;k.imagemapUseValue=null;if(t.defaultPrevented){return}var e=t.target;if("composedPath"in t){var i=t.composedPath();e=i.shift()||e}if(!e||!v(e.form)){return}var o=e.type==="submit"&&["button","input"].indexOf(e.localName)>-1;if(!o){if(!(e.localName==="input"&&e.type==="image")){return}k.imagemapUseValue=t.offsetX+","+t.offsetY}var a=u(e);if(!a){return}k.formSubmitter=e}),false);document.addEventListener("submit",(function(t){var e=t.target;var i=u(e);if(i){return}var o=g(t);var a=o&&o.getAttribute("formmethod")||e.getAttribute("method");if(a==="dialog"){t.preventDefault()}}));var C=HTMLFormElement.prototype.submit;var O=function(){if(!v(this)){return C.call(this)}var t=u(this);t&&t.close()};HTMLFormElement.prototype.submit=O}const F='*:focus{border-radius:50%;-webkit-box-shadow:var(--shadow-focus-primary);box-shadow:var(--shadow-focus-primary);outline:none !important}:host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>dialog{padding:0;border:none;margin:0;background-color:transparent}:host>dialog:modal{width:100%;max-width:100%;max-height:100%}:host>dialog::-webkit-backdrop{display:none}:host>dialog::-ms-backdrop{display:none}:host>dialog::backdrop{display:none}:host>dialog+.backdrop{display:none}:host>dialog:not([open]){display:none}:host>dialog[open]{display:block}.modal-container{z-index:1010;display:-ms-flexbox;display:flex;overflow:-moz-scrollbars-none;width:100%;height:100vh;-ms-flex-direction:column;flex-direction:column}.modal-container>.modal-content-scroll-outside{overflow:auto;background:var(--color-surface01)}.modal-container>header{padding:calc(var(--space-unit) * 1.75) calc(var(--space-unit) * 2) calc(var(--space-unit) * 1.75)\n    calc(var(--space-unit) * 2);background:var(--color-surface02)}.modal-container>header button{padding:0;border:none;margin:0;margin-left:auto;background:transparent;cursor:pointer}.modal-container>header z-icon{--z-icon-width:calc(var(--space-unit) * 2.25);--z-icon-height:calc(var(--space-unit) * 2.25);display:-ms-flexbox;display:flex;fill:var(--color-primary01-icon)}.modal-container>header>div{display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:baseline;align-items:baseline;margin-right:calc(var(--space-unit) * 2)}.modal-container>header h1,.modal-container>header .subtitle{padding:0;margin:0;color:var(--color-default-text);font-weight:var(--font-sb)}.modal-container>header h1{font-size:var(--font-size-5);letter-spacing:0;line-height:1.4}.modal-container>header .subtitle{font-size:var(--font-size-3);font-weight:var(--font-rg);letter-spacing:0;line-height:1.5}.modal-container>header>div>h1 *:empty{display:none}.modal-container>header h1+.subtitle{margin-top:calc(var(--space-unit) * 0.5)}.modal-container-scroll-inside>.modal-content-scroll-inside{overflow:hidden auto;-ms-flex:1 auto;flex:1 auto;background:var(--color-surface01)}.modal-container-scroll-inside>.modal-content-scroll-inside::-webkit-scrollbar,.modal-container-scroll-outside>.modal-content-scroll-outside::-webkit-scrollbar{width:10px;background:linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);border-radius:var(--border-radius)}.modal-container-scroll-inside>.modal-content-scroll-inside::-webkit-scrollbar-thumb,.modal-container-scroll-outside>.modal-content-scroll-outside::-webkit-scrollbar-thumb{width:10px;background-color:var(--color-primary01)}.modal-container-scroll-inside>.modal-content-scroll-inside::-webkit-scrollbar-thumb:hover,.modal-container-scroll-outside>.modal-content-scroll-outside::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}.modal-container-scroll-inside .modal-content-scroll-inside,.modal-container-scroll-outside .modal-content-scroll-outside{scrollbar-color:var(--color-primary01) transparent}@media only screen and (min-width: 768px){.modal-background{position:fixed;top:0;left:0;overflow:hidden;width:100vw;height:100vh;background-color:var(--gray900);opacity:0.7}.modal-background.modal-background-scroll-outside{position:-webkit-sticky;position:sticky}.modal-container-scroll-inside{position:fixed;top:calc(var(--space-unit) * 6);left:50%;overflow:hidden;width:auto;min-width:calc(var(--space-unit) * 40);height:auto;min-height:calc(var(--space-unit) * 40);max-height:calc(100vh - calc(var(--space-unit) * 6 * 2));border-radius:var(--border-radius);-webkit-transform:translateX(-50%);transform:translateX(-50%)}.modal-container-scroll-outside{position:absolute;top:calc(var(--space-unit) * 6);left:50%;display:block;overflow:initial;width:auto;min-width:calc(var(--space-unit) * 40);height:auto;min-height:calc(var(--space-unit) * 40);max-height:calc(100vh - calc(var(--space-unit) * 6 * 2));-webkit-transform:translateX(-50%);transform:translateX(-50%)}.modal-container>.modal-content-scroll-outside{overflow:initial}.modal-container-scroll-outside>header,.modal-container-scroll-inside>header{border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.modal-container-scroll-outside::after{display:block;height:calc(var(--space-unit) * 6);content:" "}.modal-dialog{position:fixed;top:0;left:0;height:auto;overflow-x:hidden;overflow-y:auto}.modal-content-scroll-outside{border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}.modal-dialog::-webkit-scrollbar{display:none}}@media only screen and (min-width: 1152px){.modal-container>header{padding-top:calc(var(--space-unit) * 1.5);padding-bottom:calc(var(--space-unit) * 1.5)}.modal-container>header h1{font-size:var(--font-size-6);font-weight:var(--font-sb);letter-spacing:0;line-height:1.333}.modal-container>header .subtitle{font-size:var(--font-size-4);font-weight:var(--font-rg);letter-spacing:0;line-height:1.5}.modal-container>header h1+.subtitle{margin-top:0}}';const D=F;const T=':is(button, input, select, textarea, [contenteditable=""], [contenteditable="true"], a[href], [tabindex], summary):not([disabled], [disabled=""], [tabindex="-1"], [aria-hidden="true"], [hidden])';const j=class{constructor(i){t(this,i);this.modalClose=e(this,"modalClose",7);this.modalHeaderActive=e(this,"modalHeaderActive",7);this.modalBackgroundClick=e(this,"modalBackgroundClick",7);this.modalid=undefined;this.modaltitle=undefined;this.modalsubtitle=undefined;this.closeButtonLabel="chiudi modale";this.alertdialog=false;this.closable=true;this.scrollInside=true}emitModalClose(){if(this.closable){this.modalClose.emit({modalid:this.modalid})}}emitModalHeaderActive(){this.modalHeaderActive.emit({modalid:this.modalid})}emitBackgroundClick(){if(this.closable){this.modalBackgroundClick.emit({modalid:this.modalid})}}handlePageOverflow(){const t=window.matchMedia(`(max-width: ${n}px)`);document.body.style["overflow-y"]=t.matches?"hidden":""}componentDidLoad(){if(typeof window.HTMLDialogElement!=="function"){if(!this.dialog.localName){Object.defineProperty(this.dialog,"localName",{value:"dialog"})}k.registerDialog(this.dialog);this.dialog.setAttribute("open","true")}else{this.open()}this.handlePageOverflow()}async open(){var t;(t=this.dialog)===null||t===void 0?void 0:t.showModal()}async close(){var t;if(this.closable){(t=this.dialog)===null||t===void 0?void 0:t.close()}}get focusableElements(){return[...Array.from(this.host.shadowRoot.querySelectorAll(T)),...Array.from(this.host.querySelectorAll(T))].filter((t=>getComputedStyle(t).display!=="none"))}handleKeyDown(t){if(t.code===a.ESC&&!this.closable){t.preventDefault()}if(t.code!==a.TAB){return}const e=this.focusableElements;const i=this.host.shadowRoot.activeElement;const o=this.host.ownerDocument.activeElement;const n=e[0];const r=e[e.length-1];if(t.shiftKey&&(i==n||o==n)){t.preventDefault();r.focus()}else if(!t.shiftKey&&(i==r||o==r)){t.preventDefault();n.focus()}}closeButtonSlot(){if(this.closable){return i("slot",{name:"modalCloseButton"},i("button",{"aria-label":this.closeButtonLabel,onClick:()=>this.close()},i("z-icon",{name:"multiply-circle-filled"})))}}handleEscape(t){if(this.closable){return}t.preventDefault()}render(){return i("dialog",{key:"50df4e07a74c86679fd2243e6795da0eeaae9c2c",class:{"modal-dialog":!this.scrollInside},"aria-labelledby":"modal-title","aria-describedby":"modal-content",role:this.alertdialog?"alertdialog":undefined,ref:t=>this.dialog=t,onClose:()=>this.emitModalClose(),onCancel:t=>this.handleEscape(t)},i("div",{key:"035ad0b71a6726e43c1fb52dae69257afd054525",class:{"modal-container":true,"modal-container-scroll-inside":this.scrollInside,"modal-container-scroll-outside":!this.scrollInside},id:this.modalid},i("header",{key:"8f9e92a6c41e4dbff647c4140a1efc42adf258a9",onClick:this.emitModalHeaderActive.bind(this)},i("div",{key:"3521275e24a100ba06c2f259ef239a361a6841e5"},this.modaltitle&&i("h1",{key:"3c345754f355fbe4cb7c0515404b01a3ff647b26",id:"modal-title"},this.modaltitle),this.closeButtonSlot()),this.modalsubtitle&&i("div",{key:"5307334b7aca04ae351a0a69cbdaa6ec0ee32654",class:"subtitle",id:"modal-subtitle"},this.modalsubtitle)),i("div",{key:"fe5a158f3a0f0d6a06e83ce4cf32fb50ea5bf79f",class:{"modal-content-scroll-inside":this.scrollInside,"modal-content-scroll-outside":!this.scrollInside},id:"modal-content"},i("slot",{key:"c2e5855dc48026fda519ad69bf5a7f9c3c1a2773",name:"modalContent"}))),i("div",{key:"d7f80d8206c262bf5166ee1231d78eb0e55e4bb5",class:{"modal-background":true,"modal-background-scroll-outside":!this.scrollInside},"data-action":"modalBackground","data-modal":this.modalid,onClick:()=>{this.emitBackgroundClick();this.close()}}))}get host(){return o(this)}};j.style=D;export{l as z_dragdrop_area,j as z_modal};
-//# sourceMappingURL=p-21941767.entry.js.map