@oiz/stzh-components 2.11.0-beta1 → 2.11.1

package/dist/types/libraries/tom-select/types/types/settings.d.ts

@@ -0,0 +1,78 @@
+import { TomCreateFilter, TomCreate, TomLoadCallback, TomTemplates, TomOption } from './index';
+import { TPluginItem, TPluginHash } from '../contrib/microplugin';
+import * as SifterTypes from '@orchidjs/sifter/dist/types/types';
+export type TomSettings = {
+    options?: any[];
+    optgroups?: any[];
+    items?: string[];
+    plugins: string[] | TPluginItem[] | TPluginHash;
+    delimiter: string;
+    splitOn: RegExp | string;
+    persist: boolean;
+    diacritics: boolean;
+    create: boolean | TomCreate;
+    createOnBlur: boolean;
+    createFilter: RegExp | string | TomCreateFilter;
+    highlight: boolean;
+    openOnFocus: boolean;
+    shouldOpen: boolean;
+    maxOptions: number;
+    maxItems: null | number;
+    hideSelected: boolean;
+    duplicates: boolean;
+    addPrecedence: boolean;
+    selectOnTab: boolean;
+    preload: boolean | string;
+    allowEmptyOption: boolean;
+    closeAfterSelect: boolean;
+    loadThrottle: number;
+    loadingClass: string;
+    dataAttr: string;
+    optgroupField: string;
+    valueField: string;
+    labelField: string;
+    disabledField: string;
+    optgroupLabelField: string;
+    optgroupValueField: string;
+    lockOptgroupOrder: boolean;
+    sortField: string | SifterTypes.Sort[] | SifterTypes.SortFn;
+    searchField: string[];
+    searchConjunction: string;
+    nesting: boolean;
+    mode: string;
+    wrapperClass: string;
+    controlClass: string;
+    dropdownClass: string;
+    dropdownContentClass: string;
+    itemClass: string;
+    optionClass: string;
+    dropdownParent: string;
+    controlInput: string | HTMLInputElement;
+    copyClassesToDropdown: boolean;
+    placeholder: string;
+    hidePlaceholder: boolean;
+    load: (value: string, callback: TomLoadCallback) => void;
+    score?: (query: string) => () => any;
+    shouldLoad: (query: string) => boolean;
+    onInitialize: () => void;
+    onChange: (value: string | number) => void;
+    onItemAdd: (value: string | number, item: HTMLDivElement) => void;
+    onItemRemove: (value: string | number, item: HTMLDivElement) => void;
+    onClear: () => void;
+    onOptionAdd: (value: string | number, data: TomOption) => void;
+    onOptionRemove: (value: string | number) => void;
+    onOptionClear: () => void;
+    onOptionGroupAdd: (value: string | number, data: TomOption) => void;
+    onOptionGroupRemove: (value: string | number) => void;
+    onOptionGroupClear: () => void;
+    onDropdownOpen: (dropdown: HTMLDivElement) => void;
+    onDropdownClose: (dropdown: HTMLDivElement) => void;
+    onType: (str: string) => void;
+    onLoad: (options: TomOption[], optgroups: TomOption[]) => void;
+    onFocus: () => void;
+    onBlur: () => void;
+    onDelete: (values: string[], evt: KeyboardEvent | MouseEvent) => boolean;
+    render: TomTemplates;
+    firstUrl: (query: string) => any;
+    shouldLoadMore: () => boolean;
+};

package/dist/types/libraries/tom-select/types/utils.d.ts

@@ -0,0 +1,76 @@
+import TomSelect from './tom-select';
+import { TomLoadCallback } from './types/index';
+/**
+ * Converts a scalar to its best string representation
+ * for hash keys and HTML attribute values.
+ *
+ * Transformations:
+ *   'str'     -> 'str'
+ *   null      -> ''
+ *   undefined -> ''
+ *   true      -> '1'
+ *   false     -> '0'
+ *   0         -> '0'
+ *   1         -> '1'
+ *
+ */
+export declare const hash_key: (value: undefined | null | boolean | string | number) => string | null;
+export declare const get_hash: (value: boolean | string | number) => string;
+/**
+ * Escapes a string for use within HTML.
+ *
+ */
+export declare const escape_html: (str: string) => string;
+/**
+ * Debounce the user provided load function
+ *
+ */
+export declare const loadDebounce: (fn: (value: string, callback: TomLoadCallback) => void, delay: number) => (this: TomSelect, value: string, callback: TomLoadCallback) => void;
+/**
+ * Debounce all fired events types listed in `types`
+ * while executing the provided `fn`.
+ *
+ */
+export declare const debounce_events: (self: TomSelect, types: string[], fn: () => void) => void;
+/**
+ * Determines the current selection within a text input control.
+ * Returns an object containing:
+ *   - start
+ *   - length
+ *
+ */
+export declare const getSelection: (input: HTMLInputElement) => {
+    start: number;
+    length: number;
+};
+/**
+ * Prevent default
+ *
+ */
+export declare const preventDefault: (evt?: Event, stop?: boolean) => void;
+/**
+ * Add event helper
+ *
+ */
+export declare const addEvent: (target: EventTarget, type: string, callback: EventListenerOrEventListenerObject, options?: object) => void;
+/**
+ * Return true if the requested key is down
+ * Will return false if more than one control character is pressed ( when [ctrl+shift+a] != [ctrl+a] )
+ * The current evt may not always set ( eg calling advanceSelection() )
+ *
+ */
+export declare const isKeyDown: (key_name: keyof (KeyboardEvent | MouseEvent), evt?: KeyboardEvent | MouseEvent) => boolean;
+/**
+ * Get the id of an element
+ * If the id attribute is not set, set the attribute with the given id
+ *
+ */
+export declare const getId: (el: Element, id: string) => string;
+/**
+ * Returns a string with backslashes added before characters that need to be escaped.
+ */
+export declare const addSlashes: (str: string) => string;
+/**
+ *
+ */
+export declare const append: (parent: Element | DocumentFragment, node: string | Node | null | undefined) => void;

package/dist/types/libraries/tom-select/types/vanilla.d.ts

@@ -0,0 +1,76 @@
+/**
+ * Return a dom element from either a dom query string, jQuery object, a dom element or html string
+ * https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro/35385518#35385518
+ *
+ * param query should be {}
+ */
+export declare const getDom: (query: any) => HTMLElement;
+export declare const isHtmlString: (arg: any) => boolean;
+export declare const escapeQuery: (query: string) => string;
+/**
+ * Dispatch an event
+ *
+ */
+export declare const triggerEvent: (dom_el: HTMLElement, event_name: string) => void;
+/**
+ * Apply CSS rules to a dom element
+ *
+ */
+export declare const applyCSS: (dom_el: HTMLElement, css: {
+    [key: string]: string | number;
+}) => void;
+/**
+ * Add css classes
+ *
+ */
+export declare const addClasses: (elmts: HTMLElement | HTMLElement[], ...classes: string[] | string[][]) => void;
+/**
+ * Remove css classes
+ *
+ */
+export declare const removeClasses: (elmts: HTMLElement | HTMLElement[], ...classes: string[] | string[][]) => void;
+/**
+ * Return arguments
+ *
+ */
+export declare const classesArray: (args: string[] | string[][]) => string[];
+/**
+ * Create an array from arg if it's not already an array
+ *
+ */
+export declare const castAsArray: (arg: any) => Array<any>;
+/**
+ * Get the closest node to the evt.target matching the selector
+ * Stops at wrapper
+ *
+ */
+export declare const parentMatch: (target: null | HTMLElement, selector: string, wrapper?: HTMLElement) => HTMLElement | void;
+/**
+ * Get the first or last item from an array
+ *
+ * > 0 - right (last)
+ * <= 0 - left (first)
+ *
+ */
+export declare const getTail: (list: Array<any> | NodeList, direction?: number) => any;
+/**
+ * Return true if an object is empty
+ *
+ */
+export declare const isEmptyObject: (obj: object) => boolean;
+/**
+ * Get the index of an element amongst sibling nodes of the same type
+ *
+ */
+export declare const nodeIndex: (el: null | Element, amongst?: string) => number;
+/**
+ * Set attributes of an element
+ *
+ */
+export declare const setAttr: (el: Element, attrs: {
+    [key: string]: string | number | null;
+}) => void;
+/**
+ * Replace a node
+ */
+export declare const replaceNode: (existing: Node, replacement: Node) => void;

package/dist/types/types/svg.d.ts

@@ -0,0 +1,4 @@
+declare module "svg-tag-names" {
+  const SvgTagNames: string[];
+  export default SvgTagNames;
+}

package/dist/types/utils/utils.d.ts

@@ -4,3 +4,8 @@ export declare function isStzhElement(element: Element): boolean;
 export declare function getMeta(name: any): string;
 export declare function parents(node: Element | Node): any[];
 export declare function childNodes(node: Element): any[];
+export declare function isVisible(element: HTMLElement): boolean;
+export declare function offset(element: any): {
+  top: number;
+  left: number;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oiz/stzh-components",
-  "version": "2.11.0-beta1",
+  "version": "2.11.1",
   "description": "STZH Web Components Library",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -99,6 +99,7 @@
     "ol": "^4.6.5",
     "pannellum": "^2.5.6",
     "photoswipe": "^5.4.2",
+    "photoswipe-dynamic-caption-plugin": "^1.2.7",
     "proj4": "^2.4.4",
     "scroll-into-view-if-needed": "^3.1.0",
     "sszvis": "^2.6.4",

package/dist/cjs/stzh-figure.cjs.entry.js

@@ -1,40 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-45029280.js');
-const utils = require('./utils-77bc0ea1.js');
-require('./string-utils-5dd70320.js');
-
-const stzhFigureCss = ".sc-stzh-figure-h{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:var(--stzh-font-style-regular);color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block}[hidden].sc-stzh-figure-h{display:none}.sc-stzh-figure-h *.sc-stzh-figure,.sc-stzh-figure-h *.sc-stzh-figure::before,.sc-stzh-figure-h *.sc-stzh-figure::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-figure-h .has-focus.sc-stzh-figure{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.3125rem}.sc-stzh-figure-h .stzh-fylingfocus-focused.sc-stzh-figure{outline-style:none !important}.sc-stzh-figure-h .stzh-fylingfocus-focused.sc-stzh-figure::-moz-focus-inner{border:0 !important}.sc-stzh-figure-h .sc-stzh-figure-s>*{max-width:100%}.sc-stzh-figure-h[fullwidth]:not([fullwidth=false]) .sc-stzh-figure-s>*{width:100%}.stzh-figure.sc-stzh-figure{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:0}.stzh-figure__element.sc-stzh-figure{display:-ms-flexbox;display:flex}@media print{.stzh-figure__element.sc-stzh-figure{page-break-inside:avoid;-moz-column-break-inside:avoid;-webkit-column-break-inside:avoid;break-inside:avoid}}.stzh-figure__caption-wrapper.sc-stzh-figure{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-text-line-height, var(--stzh-font-nano-text-line-height));display:-ms-flexbox;display:flex}@media screen and (min-width: 1024px){.stzh-figure__caption-wrapper.sc-stzh-figure{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-text-line-height, var(--stzh-font-micro-text-line-height))}}.stzh-figure__counter.sc-stzh-figure:not(:empty){margin-right:var(--stzh-space-xsmall)}.stzh-figure__counter.sc-stzh-figure,.stzh-figure__heading.sc-stzh-figure{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy)}.stzh-figure__caption-text.sc-stzh-figure:not(:empty)+.stzh-figure__copyright.sc-stzh-figure:not(:empty){margin-left:var(--stzh-space-xxsmall)}.stzh-figure__copyright.sc-stzh-figure{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);font-size:var(--stzh-font-femto-font-size);line-height:var(--stzh-font-femto-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-figure--has-caption.sc-stzh-figure .stzh-figure__caption-wrapper.sc-stzh-figure{margin-top:var(--stzh-space-small)}";
-
-const StzhFigure = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.caption = "";
-    this.copyright = "";
-    this.counter = "";
-    this.heading = "";
-    this.fullwidth = true;
-  }
-  render() {
-    const captionSlotUsed = utils.hasSlot(this.element, 'caption');
-    const copyrightSlotUsed = utils.hasSlot(this.element, 'copyright');
-    const counterSlotUsed = utils.hasSlot(this.element, 'counter');
-    const headingSlotUsed = utils.hasSlot(this.element, 'heading');
-    const classes = {
-      "stzh-figure": true,
-      "stzh-figure--has-caption": !!this.caption || captionSlotUsed
-        || !!this.copyright || copyrightSlotUsed
-        || !!this.counter || counterSlotUsed
-        || !!this.heading || headingSlotUsed
-    };
-    return (index.h(index.Host, null, index.h("figure", { class: classes }, index.h("div", { class: "stzh-figure__element" }, index.h("slot", null)), index.h("figcaption", { class: "stzh-figure__caption-wrapper" }, index.h("div", { class: "stzh-figure__counter" }, this.counter ? this.counter : index.h("slot", { name: "counter" })), index.h("div", { class: "stzh-figure__text" }, index.h("div", { class: "stzh-figure__heading" }, this.heading ? this.heading : index.h("slot", { name: "heading" })), index.h("div", { class: "stzh-figure__caption" }, index.h("span", { class: "stzh-figure__caption-text" }, this.caption ? this.caption : index.h("slot", { name: "caption" })), index.h("span", { class: "stzh-figure__copyright" }, this.copyright ? this.copyright : index.h("slot", { name: "copyright" }))))))));
-  }
-  get element() { return index.getElement(this); }
-};
-StzhFigure.style = stzhFigureCss;
-
-exports.stzh_figure = StzhFigure;
-
-//# sourceMappingURL=stzh-figure.cjs.entry.js.map

package/dist/cjs/stzh-figure.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"stzh-figure.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,aAAa,GAAG,yvFAAyvF;;MCsBlwF,UAAU;;;mBAEK,EAAE;qBAGA,EAAE;mBAGJ,EAAE;mBAGF,EAAE;qBAGkB,IAAI;;EAIlD,MAAM;IACJ,MAAM,eAAe,GAAGA,aAAO,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IACzD,MAAM,iBAAiB,GAAGA,aAAO,CAAC,IAAI,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;IAC7D,MAAM,eAAe,GAAGA,aAAO,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IACzD,MAAM,eAAe,GAAGA,aAAO,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IAEzD,MAAM,OAAO,GAAG;MACd,aAAa,EAAE,IAAI;MACnB,0BAA0B,EACxB,CAAC,CAAC,IAAI,CAAC,OAAO,IAAI,eAAe;WAC9B,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,iBAAiB;WACrC,CAAC,CAAC,IAAI,CAAC,OAAO,IAAI,eAAe;WACjC,CAAC,CAAC,IAAI,CAAC,OAAO,IAAI,eAAe;KACvC,CAAC;IAEF,QACEC,QAACC,UAAI,QACHD,oBAAQ,KAAK,EAAE,OAAO,IACpBA,iBAAK,KAAK,EAAC,sBAAsB,IAC/BA,qBAAa,CACT,EACNA,wBAAY,KAAK,EAAC,8BAA8B,IAC9CA,iBAAK,KAAK,EAAC,sBAAsB,IAC9B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,GAAGA,kBAAM,IAAI,EAAC,SAAS,GAAQ,CACvD,EACNA,iBAAK,KAAK,EAAC,mBAAmB,IAC5BA,iBAAK,KAAK,EAAC,sBAAsB,IAC9B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,GAAGA,kBAAM,IAAI,EAAC,SAAS,GAAQ,CACvD,EACNA,iBAAK,KAAK,EAAC,sBAAsB,IAC/BA,kBAAM,KAAK,EAAC,2BAA2B,IACpC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,GAAGA,kBAAM,IAAI,EAAC,SAAS,GAAQ,CACtD,EACPA,kBAAM,KAAK,EAAC,wBAAwB,IACjC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,GAAGA,kBAAM,IAAI,EAAC,WAAW,GAAQ,CAC5D,CACH,CACF,CACK,CACN,CACJ,EACP;GACH;;;;;;;","names":["hasSlot","h","Host"],"sources":["src/components/stzh-figure/stzh-figure.scss?tag=stzh-figure&encapsulation=scoped","src/components/stzh-figure/stzh-figure.tsx"],"sourcesContent":[":host {\n  ::slotted(*) {\n    max-width: 100%;\n  }\n}\n\n:host([fullwidth]:not([fullwidth=\"false\"])) ::slotted(*) {\n  width: 100%;\n}\n\n.stzh-figure {\n  display: flex;\n  flex-direction: column;\n  margin: 0;\n\n  &__element {\n    display: flex;\n\n    @media print {\n      page-break-inside: avoid;\n      break-inside: avoid;\n    }\n  }\n\n  &__caption-wrapper {\n    @include fontCurve('caption');\n    display: flex;\n  }\n\n  &__counter {\n    &:not(:empty) {\n      margin-right: space('xsmall');\n    }\n  }\n\n  &__counter,\n  &__heading {\n    @include font('heavy');\n  }\n\n  &__caption-text:not(:empty) + &__copyright:not(:empty) {\n    margin-left: space('xxsmall');\n  }\n\n  &__copyright {\n    @include font('medium');\n    @include fontSize('femto');\n  }\n\n  /* Has caption content */\n\n  &--has-caption &__caption-wrapper {\n    margin-top: space('small');\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop,\n} from \"@stencil/core\";\n\nimport { hasSlot } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for e.g. image or video\n * @slot caption - Slot for a caption as alternative for attribute\n * @slot copyright - Slot for a copyright as alternative for attribute\n * @slot counter - Slot for a counter as alternative for attribute\n * @slot heading - Slot for a heading as alternative for attribute\n */\n@Component({\n  tag: \"stzh-figure\",\n  styleUrl: \"stzh-figure.scss\",\n  scoped: true\n})\nexport class StzhFigure {\n  /** Caption */\n  @Prop() caption: string = \"\";\n\n  /** Copyright */\n  @Prop() copyright: string = \"\";\n\n  /** Counter */\n  @Prop() counter: string = \"\";\n\n  /** Heading */\n  @Prop() heading: string = \"\";\n\n  /** Whether to stretch slotted content to fullwidth */\n  @Prop({ reflect: true }) fullwidth: boolean = true;\n\n  @Element() element: HTMLStzhFigureElement;\n\n  render() {\n    const captionSlotUsed = hasSlot(this.element, 'caption');\n    const copyrightSlotUsed = hasSlot(this.element, 'copyright');\n    const counterSlotUsed = hasSlot(this.element, 'counter');\n    const headingSlotUsed = hasSlot(this.element, 'heading');\n\n    const classes = {\n      \"stzh-figure\": true,\n      \"stzh-figure--has-caption\":\n        !!this.caption || captionSlotUsed\n        || !!this.copyright || copyrightSlotUsed\n        || !!this.counter || counterSlotUsed\n        || !!this.heading || headingSlotUsed\n    };\n\n    return (\n      <Host>\n        <figure class={classes}>\n          <div class=\"stzh-figure__element\">\n            <slot></slot>\n          </div>\n          <figcaption class=\"stzh-figure__caption-wrapper\">\n            <div class=\"stzh-figure__counter\">\n              {this.counter ? this.counter : <slot name=\"counter\"></slot>}\n            </div>\n            <div class=\"stzh-figure__text\">\n              <div class=\"stzh-figure__heading\">\n                {this.heading ? this.heading : <slot name=\"heading\"></slot>}\n              </div>\n              <div class=\"stzh-figure__caption\">\n                <span class=\"stzh-figure__caption-text\">\n                  {this.caption ? this.caption : <slot name=\"caption\"></slot>}\n                </span>\n                <span class=\"stzh-figure__copyright\">\n                  {this.copyright ? this.copyright : <slot name=\"copyright\"></slot>}\n                </span>\n              </div>\n            </div>\n          </figcaption>\n        </figure>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/stzh-hspace.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"stzh-hspace.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,8+aAA8+a;;MCiBv/a,UAAU;;;iBAES,MAAM;gBAGR,SAAS;qBAEJ,SAAS;sBAER,SAAS;qBAEV,SAAS;qBAET,SAAS;mBAGR,OAAO;iBAGX,OAAO;kBAGM,KAAK;sBAGD,KAAK;uBAGJ,KAAK;kBAGuB,MAAM;;EAElF,MAAM;IACJ,QACEA,QAACC,UAAI,QACHD,iBACE,KAAK,EAAE;QACL,aAAa,EAAE,IAAI;QACnB,CAAC,wBAAwB,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO;QACxD,CAAC,sBAAsB,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;OACnD,IAEDA,qBAAa,CACT,CACD,EACP;GACH;;;;;;","names":["h","Host"],"sources":["src/components/stzh-hspace/stzh-hspace.scss?tag=stzh-hspace&encapsulation=shadow","src/components/stzh-hspace/stzh-hspace.tsx"],"sourcesContent":[":host {\n  --h-space: #{space()};\n  --h-around-left: 0;\n  --h-around-right: 0;\n  --h-around: 0;\n\n  display: flex;\n\n  ::slotted(*) {\n    // fix IE11 not wrapping text\n    max-width: 100%;\n    padding-left: calc(var(--h-space) * var(--h-around-left));\n    padding-right: calc(var(--h-space) * var(--h-around-right));\n    margin: 0;\n  }\n\n  ::slotted(*:not(:last-child)) {\n    margin-right: calc(var(--h-space) * (1 - var(--h-around)));\n  }\n\n  ::slotted(stzh-vspace),\n  ::slotted(stzh-hspace),\n  ::slotted(stzh-row),\n  ::slotted(stzh-container),\n  ::slotted(stzh-section) {\n    align-self: stretch;\n    flex-grow: 1;\n  }\n}\n\n:host(:empty),\n:host([around]:not([around=\"false\"])) {\n  --h-around-left: 1;\n  --h-around-right: 1;\n  --h-around: 1;\n}\n\n:host(:empty) {\n  width: var(--h-space);\n}\n\n:host([around-left]:not([around-left=\"false\"])) {\n  --h-around-left: 1;\n  --h-around: 1;\n}\n\n:host([around-right]:not([around-right=\"false\"])) {\n  --h-around-right: 1;\n  --h-around: 1;\n}\n\n/* Border variants */\n\n:host([border=\"left\"]),\n:host([border=\"left-right\"]) {\n  border-left: 1px solid $baseBorderColor;\n}\n\n:host([border=\"right\"]),\n:host([border=\"left-right\"]) {\n  border-right: 1px solid $baseBorderColor;\n}\n\n/* Space variants */\n\n@each $spaceCurve, $value in $spaceCurves {\n  $defaultSize: map-get($value, 'size');\n  $breakpointSizes: map-get($value, 'sizes');\n\n  // :host([curve=\"#{$spaceCurve}\"]) > .stzh-h-space {\n  :host([curve=\"#{$spaceCurve}\"]) {\n    --h-space: #{space($defaultSize)};\n\n    @each $breakpoint, $size in $breakpointSizes {\n      @include mq($from: $breakpoint) {\n        --h-space: #{space($size)};\n      }\n    }\n  }\n}\n\n@mixin spaceProps($breakpoint: null) {\n  @each $space, $value in $spaceSizes {\n    @if $breakpoint {\n      // :host([size-#{$breakpoint}=\"#{$space}\"]) > .stzh-h-space {\n      :host([size-#{$breakpoint}=\"#{$space}\"]) {\n        @include mq($from: $breakpoint) {\n          --h-space: #{$value};\n        }\n      }\n    } @else {\n      // :host([size=\"#{$space}\"]) > .stzh-h-space {\n      :host([size=\"#{$space}\"]) {\n        --h-space: #{$value};\n      }\n    }\n  }\n}\n\n@include spaceProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include spaceProps($breakpoint);\n}\n\n.stzh-hspace {\n  flex-grow: 1;\n  width: 100%;\n  height: 100%;\n\n  display: flex;\n  justify-content: flex-start;\n  align-items: flex-start;\n  padding: 0;\n  margin: 0;\n\n  &--border-left {\n    border-left: 1px solid $baseBorderColor;\n  }\n\n  &--border-right {\n    border-right: 1px solid $baseBorderColor;\n  }\n\n  /* Justify content variants */\n\n  &--justify-center {\n    justify-content: center;\n  }\n\n  &--justify-end {\n    justify-content: flex-end;\n  }\n\n  &--justify-between {\n    justify-content: space-between;\n  }\n\n  &--justify-around {\n    justify-content: space-around;\n  }\n\n  &--justify-evenly {\n    justify-content: space-evenly;\n  }\n\n  /* Align items variants */\n\n  &--items-end {\n    align-items: flex-end;\n  }\n\n  &--items-center {\n    align-items: center;\n  }\n\n  &--items-baseline {\n    align-items: baseline;\n  }\n\n  &--items-stretch {\n    align-items: stretch;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n} from \"@stencil/core\";\n\nimport { Space, Layout } from \"../../index\";\n\n/**\n * @slot - Slot for any elements that should be horizontically spaced\n */\n@Component({\n  tag: \"stzh-hspace\",\n  styleUrl: \"stzh-hspace.scss\",\n  shadow: true\n})\nexport class StzhHspace {\n  /** Type of curve (see [Spacings docs page](/docs/tokens-spacings--docs#curves) for more info). */\n  @Prop() curve: Space.Curves = \"none\";\n\n  /** Type of size (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() size: Space.Sizes = \"inherit\";\n  /** Type of size above small breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() sizeSmall: Space.Sizes = \"inherit\";\n  /** Type of size above medium breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() sizeMedium: Space.Sizes = \"inherit\";\n  /** Type of size above large breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() sizeLarge: Space.Sizes = \"inherit\";\n  /** Type of size above ultra breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() sizeUltra: Space.Sizes = \"inherit\";\n\n  /** Alignment */\n  @Prop() justify: Layout.Justify = \"start\";\n\n  /** Control how cells items are positioned along a container's cross axis */\n  @Prop() items: Layout.Items = \"start\";\n\n  /** Apply spacing to slotted elements (padding instead of margin) */\n  @Prop({ reflect: true }) around: boolean = false;\n\n  /** Apply spacing to slotted elements (padding instead of margin, only left) */\n  @Prop({ reflect: true }) aroundLeft: boolean = false;\n\n  /** Apply spacing to slotted elements (padding instead of margin, only right) */\n  @Prop({ reflect: true }) aroundRight: boolean = false;\n\n  /** Add border */\n  @Prop({ reflect: true }) border: \"none\" | \"left\" | \"right\" | \"left-right\" = \"none\";\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            \"stzh-hspace\": true,\n            [`stzh-hspace--justify-${this.justify}`]: !!this.justify,\n            [`stzh-hspace--items-${this.items}`]: !!this.items\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/stzh-ratio.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"stzh-ratio.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,ysTAAysT;;MCkBjtT,SAAS;;;iBAEU,MAAM;sBAEW,SAAS;uBAER,SAAS;sBAEV,SAAS;sBAET,SAAS;oBAGX,KAAK;eAGE,OAAO;;EAI3D,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,YAAY,EAAE,IAAI;KACnB,CAAC;IAEF,QACEA,QAACC,UAAI,QACHD,iBAAK,KAAK,EAAE,OAAO,IACjBA,qBAAa,CACT,CACD,EACP;GACH;;;;;;;","names":["h","Host"],"sources":["src/components/stzh-ratio/stzh-ratio.scss?tag=stzh-ratio&encapsulation=scoped","src/components/stzh-ratio/stzh-ratio.tsx"],"sourcesContent":["/**\n * @prop --ratio: Ratio in reverse (e.g. for 16:9 use `9 / 16`)\n * @prop --background-color: Background color of ratio area\n *\n * @prop --stzh-ratio-background-color: **Global**: Background color of ratios\n */\n\n:host {\n  --background-color: #{$ratioBackgroundColor};\n  --ratio: #{\n    nth(map-get($ratios, $ratioDefault), 2)\n    / nth(map-get($ratios, $ratioDefault), 1)\n  };\n\n  ::slotted(*) {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: 0;\n    left: 0;\n    object-fit: cover;\n  }\n}\n\n:host([fit=\"contain\"]) ::slotted(*) {\n  object-fit: contain;\n}\n\n/* Ratio variants */\n\n:host([portrait]:not([portrait=\"false\"])) {\n  --ratio: #{\n    nth(map-get($ratios, $ratioDefault), 1)\n    / nth(map-get($ratios, $ratioDefault), 2)\n  };\n}\n\n@mixin ratioProps($breakpoint: null) {\n  @each $ratio, $value in $ratios {\n    $firstNr: nth($value, 1);\n    $secondNr: nth($value, 2);\n\n    @if $breakpoint {\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"]) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$secondNr / $firstNr};\n        }\n      }\n\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$firstNr / $secondNr};\n        }\n      }\n    } @else {\n      :host([ratio=\"#{$ratio}\"]) {\n        --ratio: #{$secondNr / $firstNr};\n      }\n\n      :host([ratio=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        --ratio: #{$firstNr / $secondNr};\n      }\n    }\n  }\n}\n\n@include ratioProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include ratioProps($breakpoint);\n}\n\n.stzh-ratio {\n  position: relative;\n  width: 100%;\n  padding-top: calc(var(--ratio) * 100%);\n  background: var(--background-color);\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop\n} from \"@stencil/core\";\n\nimport { Layout } from \"../../index\";\n\n/**\n * @slot - Slot for e.g. image or video\n */\n@Component({\n  tag: \"stzh-ratio\",\n  styleUrl: \"stzh-ratio.scss\",\n  scoped: true\n})\nexport class StzhRatio {\n  /** Aspect ratio */\n  @Prop() ratio: Layout.Ratio = \"16:9\";\n  /** Aspect ratio above small breakpoint */\n  @Prop() ratioSmall: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above medium breakpoint */\n  @Prop() ratioMedium: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above large breakpoint */\n  @Prop() ratioLarge: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above ultra breakpoint */\n  @Prop() ratioUltra: Layout.Ratio | \"inherit\" = \"inherit\";\n\n  /** Whether aspect ratio is in portrait mode */\n  @Prop({ reflect: true }) portrait: boolean = false;\n\n  /** Fit mode */\n  @Prop({ reflect: true }) fit: \"cover\" | \"contain\" = \"cover\";\n\n  @Element() element: HTMLStzhRatioElement;\n\n  render() {\n    const classes = {\n      \"stzh-ratio\": true\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/stzh-show.cjs.entry.js

@@ -1,43 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-45029280.js');
-const dateUtils = require('./date-utils-1c17ba9b.js');
-
-const stzhShowCss = ":host{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:var(--stzh-font-style-regular);color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block;}:host[hidden]{display:none}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.3125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{--show-display:block;--hide-display:none;display:var(--hide-display)}:host([mikro]){display:var(--show-display)}:host([mikro=false]){display:var(--hide-display)}@media screen and (min-width: 600px){:host([small]){display:var(--show-display)}}@media screen and (min-width: 600px){:host([small=false]){display:var(--hide-display)}}@media screen and (min-width: 1024px){:host([medium]){display:var(--show-display)}}@media screen and (min-width: 1024px){:host([medium=false]){display:var(--hide-display)}}@media screen and (min-width: 1260px){:host([large]){display:var(--show-display)}}@media screen and (min-width: 1260px){:host([large=false]){display:var(--hide-display)}}@media screen and (min-width: 1440px){:host([ultra]){display:var(--show-display)}}@media screen and (min-width: 1440px){:host([ultra=false]){display:var(--hide-display)}}";
-
-const StzhShow = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.mikro = undefined;
-    this.small = undefined;
-    this.medium = undefined;
-    this.large = undefined;
-    this.ultra = undefined;
-    this.hideFromDate = undefined;
-  }
-  hideFromDateWatcher(newValue) {
-    if (typeof newValue === "string") {
-      this._hideFromDate = dateUtils.parseISODate(newValue);
-    }
-    else {
-      this._hideFromDate = newValue;
-    }
-  }
-  componentWillLoad() {
-    this.hideFromDateWatcher(this.hideFromDate);
-  }
-  render() {
-    return (index.h(index.Host, { hidden: this._hideFromDate && Date.now() >= this._hideFromDate.getTime() }, index.h("slot", null)));
-  }
-  get element() { return index.getElement(this); }
-  static get watchers() { return {
-    "hideFromDate": ["hideFromDateWatcher"]
-  }; }
-};
-StzhShow.style = stzhShowCss;
-
-exports.stzh_show = StzhShow;
-
-//# sourceMappingURL=stzh-show.cjs.entry.js.map

package/dist/cjs/stzh-show.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"stzh-show.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,WAAW,GAAG,ohDAAohD;;MCmB3hD,QAAQ;;;;;;;;;;EAqBnB,mBAAmB,CAAC,QAAuB;IACzC,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MAChC,IAAI,CAAC,aAAa,GAAGA,sBAAY,CAAC,QAAQ,CAAC,CAAC;KAC7C;SAAM;MACL,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC;KAC/B;GACF;EAID,iBAAiB;IACf,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;GAC7C;EAED,MAAM;IACJ,QACEC,QAACC,UAAI,IAAC,MAAM,EAAE,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,GAAG,EAAE,IAAI,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,IAC5ED,qBAAa,CACR,EACP;GACH;;;;;;;;;;","names":["parseISODate","h","Host"],"sources":["src/components/stzh-show/stzh-show.scss?tag=stzh-show&encapsulation=shadow","src/components/stzh-show/stzh-show.tsx"],"sourcesContent":["/**\n * @prop --show-display: Display value that is used when content is shown (default `block`)\n * @prop --hide-display: Display value that is used when content is hidden (default `none`)\n */\n\n:host {\n  --show-display: block;\n  --hide-display: none;\n\n  display: var(--hide-display);\n}\n\n/* Mikro */\n\n:host([mikro]) {\n  display: var(--show-display);\n}\n\n:host([mikro=\"false\"]) {\n  display: var(--hide-display);\n}\n\n/* Small */\n\n:host([small]) {\n  @include mq($from: small) {\n    display: var(--show-display);\n  }\n}\n\n:host([small=\"false\"]) {\n  @include mq($from: small) {\n    display: var(--hide-display);\n  }\n}\n\n/* Medium */\n\n:host([medium]) {\n  @include mq($from: medium) {\n    display: var(--show-display);\n  }\n}\n\n:host([medium=\"false\"]) {\n  @include mq($from: medium) {\n    display: var(--hide-display);\n  }\n}\n\n/* Large */\n\n:host([large]) {\n  @include mq($from: large) {\n    display: var(--show-display);\n  }\n}\n\n:host([large=\"false\"]) {\n  @include mq($from: large) {\n    display: var(--hide-display);\n  }\n}\n\n/* Ultra */\n\n:host([ultra]) {\n  @include mq($from: ultra) {\n    display: var(--show-display);\n  }\n}\n\n:host([ultra=\"false\"]) {\n  @include mq($from: ultra) {\n    display: var(--hide-display);\n  }\n}","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop,\n  Watch\n} from \"@stencil/core\";\n\nimport { parseISODate } from \"../../utils/date-utils\";\n\n/**\n * @slot - Slot for any content\n */\n@Component({\n  tag: \"stzh-show\",\n  styleUrl: \"stzh-show.scss\",\n  shadow: true\n})\nexport class StzhShow {\n  /** Mikro */\n  @Prop() mikro: boolean;\n\n  /** Small */\n  @Prop() small: boolean;\n\n  /** Medium */\n  @Prop() medium: boolean;\n\n  /** Large */\n  @Prop() large: boolean;\n\n  /** Ultra */\n  @Prop() ultra: boolean;\n\n  /** Hide from date */\n  @Prop() hideFromDate: Date | string;\n  private _hideFromDate: Date;\n\n  @Watch(\"hideFromDate\")\n  hideFromDateWatcher(newValue: Date | string) {\n    if (typeof newValue === \"string\") {\n      this._hideFromDate = parseISODate(newValue);\n    } else {\n      this._hideFromDate = newValue;\n    }\n  }\n\n  @Element() element: HTMLStzhShowElement;\n\n  componentWillLoad() {\n    this.hideFromDateWatcher(this.hideFromDate);\n  }\n\n  render() {\n    return (\n      <Host hidden={this._hideFromDate && Date.now() >= this._hideFromDate.getTime()}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/utils-77bc0ea1.js.map

@@ -1 +0,0 @@
-{"file":"utils-77bc0ea1.js","mappings":";;;;AAEA;AACA;SACgB,OAAO,CAAC,EAAe,EAAE,IAAa;;EAEpD,IAAI,IAAI,EAAE;IACR,OAAO,EAAE,CAAC,aAAa,CAAC,UAAU,IAAI,IAAI,CAAC,KAAK,IAAI,CAAC;GACtD;;EAGD,OAAO,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI;IACzC,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;MACtE,OAAO,IAAI,CAAC;KACb;IAED,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE;MACvC,MAAM,EAAE,GAAG,IAAmB,CAAC;MAC/B,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE;QAC5B,OAAO,IAAI,CAAC;OACb;KACF;IAED,OAAO,KAAK,CAAC;GACd,CAAC,CAAC;AACL,CAAC;SAEe,cAAc,CAAC,OAAgB,EAAE,UAAe;EAC9D,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,SAAS;IACvC,IAAI,OAAO,CAAC,YAAY,CAACA,oBAAQ,CAAC,SAAS,CAAC,CAAC,KAAK,IAAI,EAAE;MACtD,OAAO,CAAC,SAAS,CAAC,GAAG,UAAU,CAAC,SAAS,CAAC,CAAC;KAC5C;GACF,CAAC,CAAA;AACJ,CAAC;SAEe,aAAa,CAAC,OAAgB;EAC5C,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,QAAQ,KAAK,CAAC,EAAE;IACtC,OAAO,KAAK,CAAC;GACd;EAED,OAAO,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AAC9D,CAAC;AAED;SACgB,OAAO,CAAC,IAAI;EAC1B,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,cAAc,IAAI,iBAAiB,IAAI,IAAI,CAAC,CAAC;EACjF,OAAO,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC;AAClD,CAAC;SAae,UAAU,CAAC,IAAa;EACtC,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;;;EAInC,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE;IAChB,MAAM,MAAM,GAAG,EAAE,CAAC;IAElB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;MAC1C,MAAM,IAAI,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;MAEnC,IAAI,IAAI,EAAE;QACR,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;OACnB;KACF;IAED,OAAO,MAAM,CAAC;GACf;EAED,OAAO,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;AAChC,CAAC;AAED;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;;;;;","names":["dashCase"],"sources":["src/utils/utils.ts"],"sourcesContent":["import { dashCase } from \"./string-utils\";\n\n// Determines whether an element has a slot. If name is specified, the function will look for a corresponding named\n// slot, otherwise it will look for a \"default\" slot (e.g. a non-empty text node or an element with no slot attribute).\nexport function hasSlot(el: HTMLElement, name?: string) {\n  // Look for a named slot\n  if (name) {\n    return el.querySelector(`[slot=\"${name}\"]`) !== null;\n  }\n\n  // Look for a default slot\n  return Array.from(childNodes(el)).some(node => {\n    if (node.nodeType === node.TEXT_NODE && node.textContent.trim() !== '') {\n      return true;\n    }\n\n    if (node.nodeType === node.ELEMENT_NODE) {\n      const el = node as HTMLElement;\n      if (!el.hasAttribute('slot')) {\n        return true;\n      }\n    }\n\n    return false;\n  });\n}\n\nexport function setPropsIfNull(element: Element, attributes: any) {\n  Object.keys(attributes).forEach(attribute => {\n    if (element.getAttribute(dashCase(attribute)) === null) {\n      element[attribute] = attributes[attribute];\n    }\n  })\n}\n\nexport function isStzhElement(element: Element) {\n  if (!element || element.nodeType !== 1) {\n    return false;\n  }\n\n  return element.tagName.toLowerCase().indexOf('stzh-') === 0;\n}\n\n// returns content of <meta name=\"\" content=\"\"> tags or '' if empty/non existant\nexport function getMeta(name) {\n  const meta = document.querySelector(`meta[name=\"${name}\"],[property=\"${name}\"]`);\n  return meta ? meta.getAttribute(\"content\") : \"\";\n}\n\nexport function parents(node: Element | Node) {\n  const parents = [];\n\n  while (node) {\n    parents.unshift(node);\n    node = node.parentNode;\n  }\n\n  return parents;\n}\n\nexport function childNodes(node: Element) {\n  const childNodes = node.childNodes;\n\n  // check if element is stencil element without shadow dom\n  // and then detect elements that were slotted into the element\n  if (node[\"s-sc\"]) {\n    const result = [];\n\n    for (let i = 0; i < childNodes.length; i++) {\n      const slot = childNodes[i][\"s-nr\"];\n\n      if (slot) {\n        result.push(slot);\n      }\n    }\n\n    return result;\n  }\n\n  return Array.from(childNodes);\n}\n\n// `extras.experimentalSlotFixes` stencil config flag resolves cloning light dom elements\n// so our own cloneElement / cloneWrappedStzhElement helpers are not needed right now\n// (used before in card-list and sortable component).\n\n// export function children(node: Element) {\n//   return childNodes(node).map((n: any) => n.nodeType === 1);\n// }\n\n// const nativeCloneNodeFn = Node.prototype.cloneNode;\n\n// export function cloneElement(node: Element, deep: boolean) {\n//   const clonedNode = nativeCloneNodeFn.call(node, false);\n//   const srcChildNodes = childNodes(node);\n\n//   if (deep) {\n//     for (let i = 0; i < srcChildNodes.length; i++) {\n//       if (srcChildNodes[i].nodeType !== 2) {\n//         const childClone = cloneElement(srcChildNodes[i], true);\n//         clonedNode.appendChild(childClone);\n//       }\n//     }\n//   }\n\n//   return clonedNode;\n// }\n\n// // Clone an stzh-* element that is using stencil polyfilled slots (no shadow dom)\n// // and potentially wrapped in normal elements (e.g. angular component)\n// export function cloneWrappedStzhElement(elementToClone: Element): [Element, Element, Element] {\n//   let clonedElement: Element;\n//   let clonedStzhElement: Element;\n//   let originalStzhElement: Element;\n\n//   if (isStzhElement(elementToClone)) {\n//     clonedElement = cloneElement(elementToClone, true);\n//     clonedStzhElement = clonedElement;\n//     originalStzhElement = elementToClone;\n//   } else {\n//     clonedElement = elementToClone.cloneNode() as Element;\n\n//     let clonedInnerElementLast: Element = clonedElement;\n//     let originalInnerElementLast: Element = elementToClone;\n\n//     // clone inner root elements separately until we find a stzh element\n//     while (originalInnerElementLast.children.length === 1 && !isStzhElement(originalInnerElementLast.children[0])) {\n//       originalInnerElementLast = originalInnerElementLast.children[0];\n//       const clonedInnerElementCurrent = originalInnerElementLast.cloneNode() as Element;\n\n//       clonedInnerElementLast.appendChild(clonedInnerElementCurrent);\n//       clonedInnerElementLast = clonedInnerElementCurrent;\n//     }\n\n//     if (isStzhElement(originalInnerElementLast.children[0])) {\n//       clonedStzhElement = cloneElement(originalInnerElementLast.children[0], true);\n//       originalStzhElement = originalInnerElementLast.children[0];\n//       clonedInnerElementLast.appendChild(clonedStzhElement);\n//     } else {\n//       // no root stzh element found, so we give up and just deep clone the root\n//       clonedElement = cloneElement(elementToClone, true);\n//     }\n//   }\n\n//   return [clonedElement, clonedStzhElement, originalStzhElement];\n// }\n"],"version":3}

package/dist/esm/stzh-figure.entry.js

@@ -1,36 +0,0 @@
-import { r as registerInstance, h, a as Host, g as getElement } from './index-bfb5b569.js';
-import { h as hasSlot } from './utils-107fad0f.js';
-import './string-utils-e252977e.js';
-
-const stzhFigureCss = ".sc-stzh-figure-h{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:var(--stzh-font-style-regular);color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block}[hidden].sc-stzh-figure-h{display:none}.sc-stzh-figure-h *.sc-stzh-figure,.sc-stzh-figure-h *.sc-stzh-figure::before,.sc-stzh-figure-h *.sc-stzh-figure::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-figure-h .has-focus.sc-stzh-figure{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.3125rem}.sc-stzh-figure-h .stzh-fylingfocus-focused.sc-stzh-figure{outline-style:none !important}.sc-stzh-figure-h .stzh-fylingfocus-focused.sc-stzh-figure::-moz-focus-inner{border:0 !important}.sc-stzh-figure-h .sc-stzh-figure-s>*{max-width:100%}.sc-stzh-figure-h[fullwidth]:not([fullwidth=false]) .sc-stzh-figure-s>*{width:100%}.stzh-figure.sc-stzh-figure{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:0}.stzh-figure__element.sc-stzh-figure{display:-ms-flexbox;display:flex}@media print{.stzh-figure__element.sc-stzh-figure{page-break-inside:avoid;-moz-column-break-inside:avoid;-webkit-column-break-inside:avoid;break-inside:avoid}}.stzh-figure__caption-wrapper.sc-stzh-figure{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-text-line-height, var(--stzh-font-nano-text-line-height));display:-ms-flexbox;display:flex}@media screen and (min-width: 1024px){.stzh-figure__caption-wrapper.sc-stzh-figure{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-text-line-height, var(--stzh-font-micro-text-line-height))}}.stzh-figure__counter.sc-stzh-figure:not(:empty){margin-right:var(--stzh-space-xsmall)}.stzh-figure__counter.sc-stzh-figure,.stzh-figure__heading.sc-stzh-figure{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy)}.stzh-figure__caption-text.sc-stzh-figure:not(:empty)+.stzh-figure__copyright.sc-stzh-figure:not(:empty){margin-left:var(--stzh-space-xxsmall)}.stzh-figure__copyright.sc-stzh-figure{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);font-size:var(--stzh-font-femto-font-size);line-height:var(--stzh-font-femto-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-figure--has-caption.sc-stzh-figure .stzh-figure__caption-wrapper.sc-stzh-figure{margin-top:var(--stzh-space-small)}";
-
-const StzhFigure = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.caption = "";
-    this.copyright = "";
-    this.counter = "";
-    this.heading = "";
-    this.fullwidth = true;
-  }
-  render() {
-    const captionSlotUsed = hasSlot(this.element, 'caption');
-    const copyrightSlotUsed = hasSlot(this.element, 'copyright');
-    const counterSlotUsed = hasSlot(this.element, 'counter');
-    const headingSlotUsed = hasSlot(this.element, 'heading');
-    const classes = {
-      "stzh-figure": true,
-      "stzh-figure--has-caption": !!this.caption || captionSlotUsed
-        || !!this.copyright || copyrightSlotUsed
-        || !!this.counter || counterSlotUsed
-        || !!this.heading || headingSlotUsed
-    };
-    return (h(Host, null, h("figure", { class: classes }, h("div", { class: "stzh-figure__element" }, h("slot", null)), h("figcaption", { class: "stzh-figure__caption-wrapper" }, h("div", { class: "stzh-figure__counter" }, this.counter ? this.counter : h("slot", { name: "counter" })), h("div", { class: "stzh-figure__text" }, h("div", { class: "stzh-figure__heading" }, this.heading ? this.heading : h("slot", { name: "heading" })), h("div", { class: "stzh-figure__caption" }, h("span", { class: "stzh-figure__caption-text" }, this.caption ? this.caption : h("slot", { name: "caption" })), h("span", { class: "stzh-figure__copyright" }, this.copyright ? this.copyright : h("slot", { name: "copyright" }))))))));
-  }
-  get element() { return getElement(this); }
-};
-StzhFigure.style = stzhFigureCss;
-
-export { StzhFigure as stzh_figure };
-
-//# sourceMappingURL=stzh-figure.entry.js.map

package/dist/esm/stzh-figure.entry.js.map

@@ -1 +0,0 @@
-{"file":"stzh-figure.entry.js","mappings":";;;;AAAA,MAAM,aAAa,GAAG,yvFAAyvF;;MCsBlwF,UAAU;;;mBAEK,EAAE;qBAGA,EAAE;mBAGJ,EAAE;mBAGF,EAAE;qBAGkB,IAAI;;EAIlD,MAAM;IACJ,MAAM,eAAe,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IACzD,MAAM,iBAAiB,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;IAC7D,MAAM,eAAe,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IACzD,MAAM,eAAe,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IAEzD,MAAM,OAAO,GAAG;MACd,aAAa,EAAE,IAAI;MACnB,0BAA0B,EACxB,CAAC,CAAC,IAAI,CAAC,OAAO,IAAI,eAAe;WAC9B,CAAC,CAAC,IAAI,CAAC,SAAS,IAAI,iBAAiB;WACrC,CAAC,CAAC,IAAI,CAAC,OAAO,IAAI,eAAe;WACjC,CAAC,CAAC,IAAI,CAAC,OAAO,IAAI,eAAe;KACvC,CAAC;IAEF,QACE,EAAC,IAAI,QACH,cAAQ,KAAK,EAAE,OAAO,IACpB,WAAK,KAAK,EAAC,sBAAsB,IAC/B,eAAa,CACT,EACN,kBAAY,KAAK,EAAC,8BAA8B,IAC9C,WAAK,KAAK,EAAC,sBAAsB,IAC9B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,GAAG,YAAM,IAAI,EAAC,SAAS,GAAQ,CACvD,EACN,WAAK,KAAK,EAAC,mBAAmB,IAC5B,WAAK,KAAK,EAAC,sBAAsB,IAC9B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,GAAG,YAAM,IAAI,EAAC,SAAS,GAAQ,CACvD,EACN,WAAK,KAAK,EAAC,sBAAsB,IAC/B,YAAM,KAAK,EAAC,2BAA2B,IACpC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,GAAG,YAAM,IAAI,EAAC,SAAS,GAAQ,CACtD,EACP,YAAM,KAAK,EAAC,wBAAwB,IACjC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,GAAG,YAAM,IAAI,EAAC,WAAW,GAAQ,CAC5D,CACH,CACF,CACK,CACN,CACJ,EACP;GACH;;;;;;;","names":[],"sources":["src/components/stzh-figure/stzh-figure.scss?tag=stzh-figure&encapsulation=scoped","src/components/stzh-figure/stzh-figure.tsx"],"sourcesContent":[":host {\n  ::slotted(*) {\n    max-width: 100%;\n  }\n}\n\n:host([fullwidth]:not([fullwidth=\"false\"])) ::slotted(*) {\n  width: 100%;\n}\n\n.stzh-figure {\n  display: flex;\n  flex-direction: column;\n  margin: 0;\n\n  &__element {\n    display: flex;\n\n    @media print {\n      page-break-inside: avoid;\n      break-inside: avoid;\n    }\n  }\n\n  &__caption-wrapper {\n    @include fontCurve('caption');\n    display: flex;\n  }\n\n  &__counter {\n    &:not(:empty) {\n      margin-right: space('xsmall');\n    }\n  }\n\n  &__counter,\n  &__heading {\n    @include font('heavy');\n  }\n\n  &__caption-text:not(:empty) + &__copyright:not(:empty) {\n    margin-left: space('xxsmall');\n  }\n\n  &__copyright {\n    @include font('medium');\n    @include fontSize('femto');\n  }\n\n  /* Has caption content */\n\n  &--has-caption &__caption-wrapper {\n    margin-top: space('small');\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop,\n} from \"@stencil/core\";\n\nimport { hasSlot } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for e.g. image or video\n * @slot caption - Slot for a caption as alternative for attribute\n * @slot copyright - Slot for a copyright as alternative for attribute\n * @slot counter - Slot for a counter as alternative for attribute\n * @slot heading - Slot for a heading as alternative for attribute\n */\n@Component({\n  tag: \"stzh-figure\",\n  styleUrl: \"stzh-figure.scss\",\n  scoped: true\n})\nexport class StzhFigure {\n  /** Caption */\n  @Prop() caption: string = \"\";\n\n  /** Copyright */\n  @Prop() copyright: string = \"\";\n\n  /** Counter */\n  @Prop() counter: string = \"\";\n\n  /** Heading */\n  @Prop() heading: string = \"\";\n\n  /** Whether to stretch slotted content to fullwidth */\n  @Prop({ reflect: true }) fullwidth: boolean = true;\n\n  @Element() element: HTMLStzhFigureElement;\n\n  render() {\n    const captionSlotUsed = hasSlot(this.element, 'caption');\n    const copyrightSlotUsed = hasSlot(this.element, 'copyright');\n    const counterSlotUsed = hasSlot(this.element, 'counter');\n    const headingSlotUsed = hasSlot(this.element, 'heading');\n\n    const classes = {\n      \"stzh-figure\": true,\n      \"stzh-figure--has-caption\":\n        !!this.caption || captionSlotUsed\n        || !!this.copyright || copyrightSlotUsed\n        || !!this.counter || counterSlotUsed\n        || !!this.heading || headingSlotUsed\n    };\n\n    return (\n      <Host>\n        <figure class={classes}>\n          <div class=\"stzh-figure__element\">\n            <slot></slot>\n          </div>\n          <figcaption class=\"stzh-figure__caption-wrapper\">\n            <div class=\"stzh-figure__counter\">\n              {this.counter ? this.counter : <slot name=\"counter\"></slot>}\n            </div>\n            <div class=\"stzh-figure__text\">\n              <div class=\"stzh-figure__heading\">\n                {this.heading ? this.heading : <slot name=\"heading\"></slot>}\n              </div>\n              <div class=\"stzh-figure__caption\">\n                <span class=\"stzh-figure__caption-text\">\n                  {this.caption ? this.caption : <slot name=\"caption\"></slot>}\n                </span>\n                <span class=\"stzh-figure__copyright\">\n                  {this.copyright ? this.copyright : <slot name=\"copyright\"></slot>}\n                </span>\n              </div>\n            </div>\n          </figcaption>\n        </figure>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/stzh-hspace.entry.js.map

@@ -1 +0,0 @@
-{"file":"stzh-hspace.entry.js","mappings":";;AAAA,MAAM,aAAa,GAAG,8+aAA8+a;;MCiBv/a,UAAU;;;iBAES,MAAM;gBAGR,SAAS;qBAEJ,SAAS;sBAER,SAAS;qBAEV,SAAS;qBAET,SAAS;mBAGR,OAAO;iBAGX,OAAO;kBAGM,KAAK;sBAGD,KAAK;uBAGJ,KAAK;kBAGuB,MAAM;;EAElF,MAAM;IACJ,QACE,EAAC,IAAI,QACH,WACE,KAAK,EAAE;QACL,aAAa,EAAE,IAAI;QACnB,CAAC,wBAAwB,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO;QACxD,CAAC,sBAAsB,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;OACnD,IAED,eAAa,CACT,CACD,EACP;GACH;;;;;;","names":[],"sources":["src/components/stzh-hspace/stzh-hspace.scss?tag=stzh-hspace&encapsulation=shadow","src/components/stzh-hspace/stzh-hspace.tsx"],"sourcesContent":[":host {\n  --h-space: #{space()};\n  --h-around-left: 0;\n  --h-around-right: 0;\n  --h-around: 0;\n\n  display: flex;\n\n  ::slotted(*) {\n    // fix IE11 not wrapping text\n    max-width: 100%;\n    padding-left: calc(var(--h-space) * var(--h-around-left));\n    padding-right: calc(var(--h-space) * var(--h-around-right));\n    margin: 0;\n  }\n\n  ::slotted(*:not(:last-child)) {\n    margin-right: calc(var(--h-space) * (1 - var(--h-around)));\n  }\n\n  ::slotted(stzh-vspace),\n  ::slotted(stzh-hspace),\n  ::slotted(stzh-row),\n  ::slotted(stzh-container),\n  ::slotted(stzh-section) {\n    align-self: stretch;\n    flex-grow: 1;\n  }\n}\n\n:host(:empty),\n:host([around]:not([around=\"false\"])) {\n  --h-around-left: 1;\n  --h-around-right: 1;\n  --h-around: 1;\n}\n\n:host(:empty) {\n  width: var(--h-space);\n}\n\n:host([around-left]:not([around-left=\"false\"])) {\n  --h-around-left: 1;\n  --h-around: 1;\n}\n\n:host([around-right]:not([around-right=\"false\"])) {\n  --h-around-right: 1;\n  --h-around: 1;\n}\n\n/* Border variants */\n\n:host([border=\"left\"]),\n:host([border=\"left-right\"]) {\n  border-left: 1px solid $baseBorderColor;\n}\n\n:host([border=\"right\"]),\n:host([border=\"left-right\"]) {\n  border-right: 1px solid $baseBorderColor;\n}\n\n/* Space variants */\n\n@each $spaceCurve, $value in $spaceCurves {\n  $defaultSize: map-get($value, 'size');\n  $breakpointSizes: map-get($value, 'sizes');\n\n  // :host([curve=\"#{$spaceCurve}\"]) > .stzh-h-space {\n  :host([curve=\"#{$spaceCurve}\"]) {\n    --h-space: #{space($defaultSize)};\n\n    @each $breakpoint, $size in $breakpointSizes {\n      @include mq($from: $breakpoint) {\n        --h-space: #{space($size)};\n      }\n    }\n  }\n}\n\n@mixin spaceProps($breakpoint: null) {\n  @each $space, $value in $spaceSizes {\n    @if $breakpoint {\n      // :host([size-#{$breakpoint}=\"#{$space}\"]) > .stzh-h-space {\n      :host([size-#{$breakpoint}=\"#{$space}\"]) {\n        @include mq($from: $breakpoint) {\n          --h-space: #{$value};\n        }\n      }\n    } @else {\n      // :host([size=\"#{$space}\"]) > .stzh-h-space {\n      :host([size=\"#{$space}\"]) {\n        --h-space: #{$value};\n      }\n    }\n  }\n}\n\n@include spaceProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include spaceProps($breakpoint);\n}\n\n.stzh-hspace {\n  flex-grow: 1;\n  width: 100%;\n  height: 100%;\n\n  display: flex;\n  justify-content: flex-start;\n  align-items: flex-start;\n  padding: 0;\n  margin: 0;\n\n  &--border-left {\n    border-left: 1px solid $baseBorderColor;\n  }\n\n  &--border-right {\n    border-right: 1px solid $baseBorderColor;\n  }\n\n  /* Justify content variants */\n\n  &--justify-center {\n    justify-content: center;\n  }\n\n  &--justify-end {\n    justify-content: flex-end;\n  }\n\n  &--justify-between {\n    justify-content: space-between;\n  }\n\n  &--justify-around {\n    justify-content: space-around;\n  }\n\n  &--justify-evenly {\n    justify-content: space-evenly;\n  }\n\n  /* Align items variants */\n\n  &--items-end {\n    align-items: flex-end;\n  }\n\n  &--items-center {\n    align-items: center;\n  }\n\n  &--items-baseline {\n    align-items: baseline;\n  }\n\n  &--items-stretch {\n    align-items: stretch;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n} from \"@stencil/core\";\n\nimport { Space, Layout } from \"../../index\";\n\n/**\n * @slot - Slot for any elements that should be horizontically spaced\n */\n@Component({\n  tag: \"stzh-hspace\",\n  styleUrl: \"stzh-hspace.scss\",\n  shadow: true\n})\nexport class StzhHspace {\n  /** Type of curve (see [Spacings docs page](/docs/tokens-spacings--docs#curves) for more info). */\n  @Prop() curve: Space.Curves = \"none\";\n\n  /** Type of size (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() size: Space.Sizes = \"inherit\";\n  /** Type of size above small breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() sizeSmall: Space.Sizes = \"inherit\";\n  /** Type of size above medium breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() sizeMedium: Space.Sizes = \"inherit\";\n  /** Type of size above large breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() sizeLarge: Space.Sizes = \"inherit\";\n  /** Type of size above ultra breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop() sizeUltra: Space.Sizes = \"inherit\";\n\n  /** Alignment */\n  @Prop() justify: Layout.Justify = \"start\";\n\n  /** Control how cells items are positioned along a container's cross axis */\n  @Prop() items: Layout.Items = \"start\";\n\n  /** Apply spacing to slotted elements (padding instead of margin) */\n  @Prop({ reflect: true }) around: boolean = false;\n\n  /** Apply spacing to slotted elements (padding instead of margin, only left) */\n  @Prop({ reflect: true }) aroundLeft: boolean = false;\n\n  /** Apply spacing to slotted elements (padding instead of margin, only right) */\n  @Prop({ reflect: true }) aroundRight: boolean = false;\n\n  /** Add border */\n  @Prop({ reflect: true }) border: \"none\" | \"left\" | \"right\" | \"left-right\" = \"none\";\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            \"stzh-hspace\": true,\n            [`stzh-hspace--justify-${this.justify}`]: !!this.justify,\n            [`stzh-hspace--items-${this.items}`]: !!this.items\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/stzh-ratio.entry.js.map

@@ -1 +0,0 @@
-{"file":"stzh-ratio.entry.js","mappings":";;AAAA,MAAM,YAAY,GAAG,ysTAAysT;;MCkBjtT,SAAS;;;iBAEU,MAAM;sBAEW,SAAS;uBAER,SAAS;sBAEV,SAAS;sBAET,SAAS;oBAGX,KAAK;eAGE,OAAO;;EAI3D,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,YAAY,EAAE,IAAI;KACnB,CAAC;IAEF,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAE,OAAO,IACjB,eAAa,CACT,CACD,EACP;GACH;;;;;;;","names":[],"sources":["src/components/stzh-ratio/stzh-ratio.scss?tag=stzh-ratio&encapsulation=scoped","src/components/stzh-ratio/stzh-ratio.tsx"],"sourcesContent":["/**\n * @prop --ratio: Ratio in reverse (e.g. for 16:9 use `9 / 16`)\n * @prop --background-color: Background color of ratio area\n *\n * @prop --stzh-ratio-background-color: **Global**: Background color of ratios\n */\n\n:host {\n  --background-color: #{$ratioBackgroundColor};\n  --ratio: #{\n    nth(map-get($ratios, $ratioDefault), 2)\n    / nth(map-get($ratios, $ratioDefault), 1)\n  };\n\n  ::slotted(*) {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: 0;\n    left: 0;\n    object-fit: cover;\n  }\n}\n\n:host([fit=\"contain\"]) ::slotted(*) {\n  object-fit: contain;\n}\n\n/* Ratio variants */\n\n:host([portrait]:not([portrait=\"false\"])) {\n  --ratio: #{\n    nth(map-get($ratios, $ratioDefault), 1)\n    / nth(map-get($ratios, $ratioDefault), 2)\n  };\n}\n\n@mixin ratioProps($breakpoint: null) {\n  @each $ratio, $value in $ratios {\n    $firstNr: nth($value, 1);\n    $secondNr: nth($value, 2);\n\n    @if $breakpoint {\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"]) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$secondNr / $firstNr};\n        }\n      }\n\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$firstNr / $secondNr};\n        }\n      }\n    } @else {\n      :host([ratio=\"#{$ratio}\"]) {\n        --ratio: #{$secondNr / $firstNr};\n      }\n\n      :host([ratio=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        --ratio: #{$firstNr / $secondNr};\n      }\n    }\n  }\n}\n\n@include ratioProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include ratioProps($breakpoint);\n}\n\n.stzh-ratio {\n  position: relative;\n  width: 100%;\n  padding-top: calc(var(--ratio) * 100%);\n  background: var(--background-color);\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop\n} from \"@stencil/core\";\n\nimport { Layout } from \"../../index\";\n\n/**\n * @slot - Slot for e.g. image or video\n */\n@Component({\n  tag: \"stzh-ratio\",\n  styleUrl: \"stzh-ratio.scss\",\n  scoped: true\n})\nexport class StzhRatio {\n  /** Aspect ratio */\n  @Prop() ratio: Layout.Ratio = \"16:9\";\n  /** Aspect ratio above small breakpoint */\n  @Prop() ratioSmall: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above medium breakpoint */\n  @Prop() ratioMedium: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above large breakpoint */\n  @Prop() ratioLarge: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above ultra breakpoint */\n  @Prop() ratioUltra: Layout.Ratio | \"inherit\" = \"inherit\";\n\n  /** Whether aspect ratio is in portrait mode */\n  @Prop({ reflect: true }) portrait: boolean = false;\n\n  /** Fit mode */\n  @Prop({ reflect: true }) fit: \"cover\" | \"contain\" = \"cover\";\n\n  @Element() element: HTMLStzhRatioElement;\n\n  render() {\n    const classes = {\n      \"stzh-ratio\": true\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/stzh-show.entry.js.map

@@ -1 +0,0 @@
-{"file":"stzh-show.entry.js","mappings":";;;AAAA,MAAM,WAAW,GAAG,ohDAAohD;;MCmB3hD,QAAQ;;;;;;;;;;EAqBnB,mBAAmB,CAAC,QAAuB;IACzC,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MAChC,IAAI,CAAC,aAAa,GAAG,YAAY,CAAC,QAAQ,CAAC,CAAC;KAC7C;SAAM;MACL,IAAI,CAAC,aAAa,GAAG,QAAQ,CAAC;KAC/B;GACF;EAID,iBAAiB;IACf,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;GAC7C;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IAAC,MAAM,EAAE,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,GAAG,EAAE,IAAI,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,IAC5E,eAAa,CACR,EACP;GACH;;;;;;;;;;","names":[],"sources":["src/components/stzh-show/stzh-show.scss?tag=stzh-show&encapsulation=shadow","src/components/stzh-show/stzh-show.tsx"],"sourcesContent":["/**\n * @prop --show-display: Display value that is used when content is shown (default `block`)\n * @prop --hide-display: Display value that is used when content is hidden (default `none`)\n */\n\n:host {\n  --show-display: block;\n  --hide-display: none;\n\n  display: var(--hide-display);\n}\n\n/* Mikro */\n\n:host([mikro]) {\n  display: var(--show-display);\n}\n\n:host([mikro=\"false\"]) {\n  display: var(--hide-display);\n}\n\n/* Small */\n\n:host([small]) {\n  @include mq($from: small) {\n    display: var(--show-display);\n  }\n}\n\n:host([small=\"false\"]) {\n  @include mq($from: small) {\n    display: var(--hide-display);\n  }\n}\n\n/* Medium */\n\n:host([medium]) {\n  @include mq($from: medium) {\n    display: var(--show-display);\n  }\n}\n\n:host([medium=\"false\"]) {\n  @include mq($from: medium) {\n    display: var(--hide-display);\n  }\n}\n\n/* Large */\n\n:host([large]) {\n  @include mq($from: large) {\n    display: var(--show-display);\n  }\n}\n\n:host([large=\"false\"]) {\n  @include mq($from: large) {\n    display: var(--hide-display);\n  }\n}\n\n/* Ultra */\n\n:host([ultra]) {\n  @include mq($from: ultra) {\n    display: var(--show-display);\n  }\n}\n\n:host([ultra=\"false\"]) {\n  @include mq($from: ultra) {\n    display: var(--hide-display);\n  }\n}","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop,\n  Watch\n} from \"@stencil/core\";\n\nimport { parseISODate } from \"../../utils/date-utils\";\n\n/**\n * @slot - Slot for any content\n */\n@Component({\n  tag: \"stzh-show\",\n  styleUrl: \"stzh-show.scss\",\n  shadow: true\n})\nexport class StzhShow {\n  /** Mikro */\n  @Prop() mikro: boolean;\n\n  /** Small */\n  @Prop() small: boolean;\n\n  /** Medium */\n  @Prop() medium: boolean;\n\n  /** Large */\n  @Prop() large: boolean;\n\n  /** Ultra */\n  @Prop() ultra: boolean;\n\n  /** Hide from date */\n  @Prop() hideFromDate: Date | string;\n  private _hideFromDate: Date;\n\n  @Watch(\"hideFromDate\")\n  hideFromDateWatcher(newValue: Date | string) {\n    if (typeof newValue === \"string\") {\n      this._hideFromDate = parseISODate(newValue);\n    } else {\n      this._hideFromDate = newValue;\n    }\n  }\n\n  @Element() element: HTMLStzhShowElement;\n\n  componentWillLoad() {\n    this.hideFromDateWatcher(this.hideFromDate);\n  }\n\n  render() {\n    return (\n      <Host hidden={this._hideFromDate && Date.now() >= this._hideFromDate.getTime()}>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/utils-107fad0f.js.map

@@ -1 +0,0 @@
-{"file":"utils-107fad0f.js","mappings":";;AAEA;AACA;SACgB,OAAO,CAAC,EAAe,EAAE,IAAa;;EAEpD,IAAI,IAAI,EAAE;IACR,OAAO,EAAE,CAAC,aAAa,CAAC,UAAU,IAAI,IAAI,CAAC,KAAK,IAAI,CAAC;GACtD;;EAGD,OAAO,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI;IACzC,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;MACtE,OAAO,IAAI,CAAC;KACb;IAED,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,EAAE;MACvC,MAAM,EAAE,GAAG,IAAmB,CAAC;MAC/B,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE;QAC5B,OAAO,IAAI,CAAC;OACb;KACF;IAED,OAAO,KAAK,CAAC;GACd,CAAC,CAAC;AACL,CAAC;SAEe,cAAc,CAAC,OAAgB,EAAE,UAAe;EAC9D,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,SAAS;IACvC,IAAI,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,KAAK,IAAI,EAAE;MACtD,OAAO,CAAC,SAAS,CAAC,GAAG,UAAU,CAAC,SAAS,CAAC,CAAC;KAC5C;GACF,CAAC,CAAA;AACJ,CAAC;SAEe,aAAa,CAAC,OAAgB;EAC5C,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,QAAQ,KAAK,CAAC,EAAE;IACtC,OAAO,KAAK,CAAC;GACd;EAED,OAAO,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AAC9D,CAAC;AAED;SACgB,OAAO,CAAC,IAAI;EAC1B,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,cAAc,IAAI,iBAAiB,IAAI,IAAI,CAAC,CAAC;EACjF,OAAO,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC;AAClD,CAAC;SAae,UAAU,CAAC,IAAa;EACtC,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;;;EAInC,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE;IAChB,MAAM,MAAM,GAAG,EAAE,CAAC;IAElB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;MAC1C,MAAM,IAAI,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;MAEnC,IAAI,IAAI,EAAE;QACR,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;OACnB;KACF;IAED,OAAO,MAAM,CAAC;GACf;EAED,OAAO,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;AAChC,CAAC;AAED;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;;","names":[],"sources":["src/utils/utils.ts"],"sourcesContent":["import { dashCase } from \"./string-utils\";\n\n// Determines whether an element has a slot. If name is specified, the function will look for a corresponding named\n// slot, otherwise it will look for a \"default\" slot (e.g. a non-empty text node or an element with no slot attribute).\nexport function hasSlot(el: HTMLElement, name?: string) {\n  // Look for a named slot\n  if (name) {\n    return el.querySelector(`[slot=\"${name}\"]`) !== null;\n  }\n\n  // Look for a default slot\n  return Array.from(childNodes(el)).some(node => {\n    if (node.nodeType === node.TEXT_NODE && node.textContent.trim() !== '') {\n      return true;\n    }\n\n    if (node.nodeType === node.ELEMENT_NODE) {\n      const el = node as HTMLElement;\n      if (!el.hasAttribute('slot')) {\n        return true;\n      }\n    }\n\n    return false;\n  });\n}\n\nexport function setPropsIfNull(element: Element, attributes: any) {\n  Object.keys(attributes).forEach(attribute => {\n    if (element.getAttribute(dashCase(attribute)) === null) {\n      element[attribute] = attributes[attribute];\n    }\n  })\n}\n\nexport function isStzhElement(element: Element) {\n  if (!element || element.nodeType !== 1) {\n    return false;\n  }\n\n  return element.tagName.toLowerCase().indexOf('stzh-') === 0;\n}\n\n// returns content of <meta name=\"\" content=\"\"> tags or '' if empty/non existant\nexport function getMeta(name) {\n  const meta = document.querySelector(`meta[name=\"${name}\"],[property=\"${name}\"]`);\n  return meta ? meta.getAttribute(\"content\") : \"\";\n}\n\nexport function parents(node: Element | Node) {\n  const parents = [];\n\n  while (node) {\n    parents.unshift(node);\n    node = node.parentNode;\n  }\n\n  return parents;\n}\n\nexport function childNodes(node: Element) {\n  const childNodes = node.childNodes;\n\n  // check if element is stencil element without shadow dom\n  // and then detect elements that were slotted into the element\n  if (node[\"s-sc\"]) {\n    const result = [];\n\n    for (let i = 0; i < childNodes.length; i++) {\n      const slot = childNodes[i][\"s-nr\"];\n\n      if (slot) {\n        result.push(slot);\n      }\n    }\n\n    return result;\n  }\n\n  return Array.from(childNodes);\n}\n\n// `extras.experimentalSlotFixes` stencil config flag resolves cloning light dom elements\n// so our own cloneElement / cloneWrappedStzhElement helpers are not needed right now\n// (used before in card-list and sortable component).\n\n// export function children(node: Element) {\n//   return childNodes(node).map((n: any) => n.nodeType === 1);\n// }\n\n// const nativeCloneNodeFn = Node.prototype.cloneNode;\n\n// export function cloneElement(node: Element, deep: boolean) {\n//   const clonedNode = nativeCloneNodeFn.call(node, false);\n//   const srcChildNodes = childNodes(node);\n\n//   if (deep) {\n//     for (let i = 0; i < srcChildNodes.length; i++) {\n//       if (srcChildNodes[i].nodeType !== 2) {\n//         const childClone = cloneElement(srcChildNodes[i], true);\n//         clonedNode.appendChild(childClone);\n//       }\n//     }\n//   }\n\n//   return clonedNode;\n// }\n\n// // Clone an stzh-* element that is using stencil polyfilled slots (no shadow dom)\n// // and potentially wrapped in normal elements (e.g. angular component)\n// export function cloneWrappedStzhElement(elementToClone: Element): [Element, Element, Element] {\n//   let clonedElement: Element;\n//   let clonedStzhElement: Element;\n//   let originalStzhElement: Element;\n\n//   if (isStzhElement(elementToClone)) {\n//     clonedElement = cloneElement(elementToClone, true);\n//     clonedStzhElement = clonedElement;\n//     originalStzhElement = elementToClone;\n//   } else {\n//     clonedElement = elementToClone.cloneNode() as Element;\n\n//     let clonedInnerElementLast: Element = clonedElement;\n//     let originalInnerElementLast: Element = elementToClone;\n\n//     // clone inner root elements separately until we find a stzh element\n//     while (originalInnerElementLast.children.length === 1 && !isStzhElement(originalInnerElementLast.children[0])) {\n//       originalInnerElementLast = originalInnerElementLast.children[0];\n//       const clonedInnerElementCurrent = originalInnerElementLast.cloneNode() as Element;\n\n//       clonedInnerElementLast.appendChild(clonedInnerElementCurrent);\n//       clonedInnerElementLast = clonedInnerElementCurrent;\n//     }\n\n//     if (isStzhElement(originalInnerElementLast.children[0])) {\n//       clonedStzhElement = cloneElement(originalInnerElementLast.children[0], true);\n//       originalStzhElement = originalInnerElementLast.children[0];\n//       clonedInnerElementLast.appendChild(clonedStzhElement);\n//     } else {\n//       // no root stzh element found, so we give up and just deep clone the root\n//       clonedElement = cloneElement(elementToClone, true);\n//     }\n//   }\n\n//   return [clonedElement, clonedStzhElement, originalStzhElement];\n// }\n"],"version":3}

package/dist/esm-es5/stzh-figure.entry.js

@@ -1,2 +0,0 @@
-import{r as registerInstance,h,a as Host,g as getElement}from"./index-bfb5b569.js";import{h as hasSlot}from"./utils-107fad0f.js";import"./string-utils-e252977e.js";var stzhFigureCss=".sc-stzh-figure-h{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:var(--stzh-font-style-regular);color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block}[hidden].sc-stzh-figure-h{display:none}.sc-stzh-figure-h *.sc-stzh-figure,.sc-stzh-figure-h *.sc-stzh-figure::before,.sc-stzh-figure-h *.sc-stzh-figure::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}.sc-stzh-figure-h .has-focus.sc-stzh-figure{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.3125rem}.sc-stzh-figure-h .stzh-fylingfocus-focused.sc-stzh-figure{outline-style:none !important}.sc-stzh-figure-h .stzh-fylingfocus-focused.sc-stzh-figure::-moz-focus-inner{border:0 !important}.sc-stzh-figure-h .sc-stzh-figure-s>*{max-width:100%}.sc-stzh-figure-h[fullwidth]:not([fullwidth=false]) .sc-stzh-figure-s>*{width:100%}.stzh-figure.sc-stzh-figure{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:0}.stzh-figure__element.sc-stzh-figure{display:-ms-flexbox;display:flex}@media print{.stzh-figure__element.sc-stzh-figure{page-break-inside:avoid;-moz-column-break-inside:avoid;-webkit-column-break-inside:avoid;break-inside:avoid}}.stzh-figure__caption-wrapper.sc-stzh-figure{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-text-line-height, var(--stzh-font-nano-text-line-height));display:-ms-flexbox;display:flex}@media screen and (min-width: 1024px){.stzh-figure__caption-wrapper.sc-stzh-figure{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-text-line-height, var(--stzh-font-micro-text-line-height))}}.stzh-figure__counter.sc-stzh-figure:not(:empty){margin-right:var(--stzh-space-xsmall)}.stzh-figure__counter.sc-stzh-figure,.stzh-figure__heading.sc-stzh-figure{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy)}.stzh-figure__caption-text.sc-stzh-figure:not(:empty)+.stzh-figure__copyright.sc-stzh-figure:not(:empty){margin-left:var(--stzh-space-xxsmall)}.stzh-figure__copyright.sc-stzh-figure{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);font-size:var(--stzh-font-femto-font-size);line-height:var(--stzh-font-femto-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing)}.stzh-figure--has-caption.sc-stzh-figure .stzh-figure__caption-wrapper.sc-stzh-figure{margin-top:var(--stzh-space-small)}";var StzhFigure=function(){function t(t){registerInstance(this,t);this.caption="";this.copyright="";this.counter="";this.heading="";this.fullwidth=true}t.prototype.render=function(){var t=hasSlot(this.element,"caption");var e=hasSlot(this.element,"copyright");var s=hasSlot(this.element,"counter");var i=hasSlot(this.element,"heading");var r={"stzh-figure":true,"stzh-figure--has-caption":!!this.caption||t||!!this.copyright||e||!!this.counter||s||!!this.heading||i};return h(Host,null,h("figure",{class:r},h("div",{class:"stzh-figure__element"},h("slot",null)),h("figcaption",{class:"stzh-figure__caption-wrapper"},h("div",{class:"stzh-figure__counter"},this.counter?this.counter:h("slot",{name:"counter"})),h("div",{class:"stzh-figure__text"},h("div",{class:"stzh-figure__heading"},this.heading?this.heading:h("slot",{name:"heading"})),h("div",{class:"stzh-figure__caption"},h("span",{class:"stzh-figure__caption-text"},this.caption?this.caption:h("slot",{name:"caption"})),h("span",{class:"stzh-figure__copyright"},this.copyright?this.copyright:h("slot",{name:"copyright"})))))))};Object.defineProperty(t.prototype,"element",{get:function(){return getElement(this)},enumerable:false,configurable:true});return t}();StzhFigure.style=stzhFigureCss;export{StzhFigure as stzh_figure};
-//# sourceMappingURL=stzh-figure.entry.js.map

package/dist/esm-es5/stzh-figure.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stzhFigureCss","StzhFigure","prototype","render","captionSlotUsed","hasSlot","this","element","copyrightSlotUsed","counterSlotUsed","headingSlotUsed","classes","caption","copyright","counter","heading","h","Host","class","name"],"sources":["src/components/stzh-figure/stzh-figure.scss?tag=stzh-figure&encapsulation=scoped","src/components/stzh-figure/stzh-figure.tsx"],"sourcesContent":[":host {\n  ::slotted(*) {\n    max-width: 100%;\n  }\n}\n\n:host([fullwidth]:not([fullwidth=\"false\"])) ::slotted(*) {\n  width: 100%;\n}\n\n.stzh-figure {\n  display: flex;\n  flex-direction: column;\n  margin: 0;\n\n  &__element {\n    display: flex;\n\n    @media print {\n      page-break-inside: avoid;\n      break-inside: avoid;\n    }\n  }\n\n  &__caption-wrapper {\n    @include fontCurve('caption');\n    display: flex;\n  }\n\n  &__counter {\n    &:not(:empty) {\n      margin-right: space('xsmall');\n    }\n  }\n\n  &__counter,\n  &__heading {\n    @include font('heavy');\n  }\n\n  &__caption-text:not(:empty) + &__copyright:not(:empty) {\n    margin-left: space('xxsmall');\n  }\n\n  &__copyright {\n    @include font('medium');\n    @include fontSize('femto');\n  }\n\n  /* Has caption content */\n\n  &--has-caption &__caption-wrapper {\n    margin-top: space('small');\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n  Prop,\n} from \"@stencil/core\";\n\nimport { hasSlot } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for e.g. image or video\n * @slot caption - Slot for a caption as alternative for attribute\n * @slot copyright - Slot for a copyright as alternative for attribute\n * @slot counter - Slot for a counter as alternative for attribute\n * @slot heading - Slot for a heading as alternative for attribute\n */\n@Component({\n  tag: \"stzh-figure\",\n  styleUrl: \"stzh-figure.scss\",\n  scoped: true\n})\nexport class StzhFigure {\n  /** Caption */\n  @Prop() caption: string = \"\";\n\n  /** Copyright */\n  @Prop() copyright: string = \"\";\n\n  /** Counter */\n  @Prop() counter: string = \"\";\n\n  /** Heading */\n  @Prop() heading: string = \"\";\n\n  /** Whether to stretch slotted content to fullwidth */\n  @Prop({ reflect: true }) fullwidth: boolean = true;\n\n  @Element() element: HTMLStzhFigureElement;\n\n  render() {\n    const captionSlotUsed = hasSlot(this.element, 'caption');\n    const copyrightSlotUsed = hasSlot(this.element, 'copyright');\n    const counterSlotUsed = hasSlot(this.element, 'counter');\n    const headingSlotUsed = hasSlot(this.element, 'heading');\n\n    const classes = {\n      \"stzh-figure\": true,\n      \"stzh-figure--has-caption\":\n        !!this.caption || captionSlotUsed\n        || !!this.copyright || copyrightSlotUsed\n        || !!this.counter || counterSlotUsed\n        || !!this.heading || headingSlotUsed\n    };\n\n    return (\n      <Host>\n        <figure class={classes}>\n          <div class=\"stzh-figure__element\">\n            <slot></slot>\n          </div>\n          <figcaption class=\"stzh-figure__caption-wrapper\">\n            <div class=\"stzh-figure__counter\">\n              {this.counter ? this.counter : <slot name=\"counter\"></slot>}\n            </div>\n            <div class=\"stzh-figure__text\">\n              <div class=\"stzh-figure__heading\">\n                {this.heading ? this.heading : <slot name=\"heading\"></slot>}\n              </div>\n              <div class=\"stzh-figure__caption\">\n                <span class=\"stzh-figure__caption-text\">\n                  {this.caption ? this.caption : <slot name=\"caption\"></slot>}\n                </span>\n                <span class=\"stzh-figure__copyright\">\n                  {this.copyright ? this.copyright : <slot name=\"copyright\"></slot>}\n                </span>\n              </div>\n            </div>\n          </figcaption>\n        </figure>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oKAAA,IAAMA,cAAgB,0vF,ICsBTC,WAAU,W,oDAEK,G,eAGE,G,aAGF,G,aAGA,G,eAGoB,I,CAI9CA,EAAAC,UAAAC,OAAA,WACE,IAAMC,EAAkBC,QAAQC,KAAKC,QAAS,WAC9C,IAAMC,EAAoBH,QAAQC,KAAKC,QAAS,aAChD,IAAME,EAAkBJ,QAAQC,KAAKC,QAAS,WAC9C,IAAMG,EAAkBL,QAAQC,KAAKC,QAAS,WAE9C,IAAMI,EAAU,CACd,cAAe,KACf,6BACIL,KAAKM,SAAWR,KACbE,KAAKO,WAAaL,KAClBF,KAAKQ,SAAWL,KAChBH,KAAKS,SAAWL,GAGzB,OACEM,EAACC,KAAI,KACHD,EAAA,UAAQE,MAAOP,GACbK,EAAA,OAAKE,MAAM,wBACTF,EAAA,cAEFA,EAAA,cAAYE,MAAM,gCAChBF,EAAA,OAAKE,MAAM,wBACRZ,KAAKQ,QAAUR,KAAKQ,QAAUE,EAAA,QAAMG,KAAK,aAE5CH,EAAA,OAAKE,MAAM,qBACTF,EAAA,OAAKE,MAAM,wBACRZ,KAAKS,QAAUT,KAAKS,QAAUC,EAAA,QAAMG,KAAK,aAE5CH,EAAA,OAAKE,MAAM,wBACTF,EAAA,QAAME,MAAM,6BACTZ,KAAKM,QAAUN,KAAKM,QAAUI,EAAA,QAAMG,KAAK,aAE5CH,EAAA,QAAME,MAAM,0BACTZ,KAAKO,UAAYP,KAAKO,UAAYG,EAAA,QAAMG,KAAK,mB,qIApDzC,G"}

package/dist/esm-es5/stzh-hspace.entry.js

@@ -1,2 +0,0 @@
-import{r as registerInstance,h,a as Host}from"./index-bfb5b569.js";var stzhHspaceCss=":host{font-family:var(--stzh-font-family-regular);font-weight:var(--stzh-font-weight-regular);font-style:var(--stzh-font-style-regular);color:var(--stzh-base-color);-webkit-box-sizing:border-box;box-sizing:border-box;display:block;}:host[hidden]{display:none}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.3125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{--h-space:var(--stzh-space-default);--h-around-left:0;--h-around-right:0;--h-around:0;display:-ms-flexbox;display:flex}:host ::slotted(*){max-width:100%;padding-left:calc(var(--h-space) * var(--h-around-left));padding-right:calc(var(--h-space) * var(--h-around-right));margin:0}:host ::slotted(*:not(:last-child)){margin-right:calc(var(--h-space) * (1 - var(--h-around)))}:host ::slotted(stzh-vspace),:host ::slotted(stzh-hspace),:host ::slotted(stzh-row),:host ::slotted(stzh-container),:host ::slotted(stzh-section){-ms-flex-item-align:stretch;align-self:stretch;-ms-flex-positive:1;flex-grow:1}:host(:empty),:host([around]:not([around=false])){--h-around-left:1;--h-around-right:1;--h-around:1}:host(:empty){width:var(--h-space)}:host([around-left]:not([around-left=false])){--h-around-left:1;--h-around:1}:host([around-right]:not([around-right=false])){--h-around-right:1;--h-around:1}:host([border=left]),:host([border=left-right]){border-left:0.0625rem solid var(--stzh-base-border-color)}:host([border=right]),:host([border=left-right]){border-right:0.0625rem solid var(--stzh-base-border-color)}:host([curve=tiny]){--h-space:var(--stzh-space-xsmall)}@media screen and (min-width: 1024px){:host([curve=tiny]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1260px){:host([curve=tiny]){--h-space:var(--stzh-space-medium)}}:host([curve=small]){--h-space:var(--stzh-space-small)}@media screen and (min-width: 1024px){:host([curve=small]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([curve=small]){--h-space:var(--stzh-space-large)}}:host([curve=regular]){--h-space:var(--stzh-space-medium)}@media screen and (min-width: 1024px){:host([curve=regular]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 1260px){:host([curve=regular]){--h-space:var(--stzh-space-xlarge)}}:host([curve=medium]){--h-space:var(--stzh-space-xlarge)}@media screen and (min-width: 1024px){:host([curve=medium]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([curve=medium]){--h-space:var(--stzh-space-xxxlarge)}}:host([curve=large]){--h-space:var(--stzh-space-xxlarge)}@media screen and (min-width: 1024px){:host([curve=large]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([curve=large]){--h-space:var(--stzh-space-xxxxlarge)}}:host([curve=big]){--h-space:var(--stzh-space-xxxlarge)}@media screen and (min-width: 600px){:host([curve=big]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1024px){:host([curve=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1260px){:host([curve=big]){--h-space:var(--stzh-space-xbig)}}:host([curve=huge]){--h-space:var(--stzh-space-xxxxlarge)}@media screen and (min-width: 600px){:host([curve=huge]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1024px){:host([curve=huge]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 1260px){:host([curve=huge]){--h-space:var(--stzh-space-huge)}}:host([size=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}:host([size=xxsmall]){--h-space:var(--stzh-space-xxsmall)}:host([size=xsmall]){--h-space:var(--stzh-space-xsmall)}:host([size=small]){--h-space:var(--stzh-space-small)}:host([size=medium]){--h-space:var(--stzh-space-medium)}:host([size=large]){--h-space:var(--stzh-space-large)}:host([size=xlarge]){--h-space:var(--stzh-space-xlarge)}:host([size=xxlarge]){--h-space:var(--stzh-space-xxlarge)}:host([size=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}:host([size=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}:host([size=big]){--h-space:var(--stzh-space-big)}:host([size=xbig]){--h-space:var(--stzh-space-xbig)}:host([size=huge]){--h-space:var(--stzh-space-huge)}:host([size=xhuge]){--h-space:var(--stzh-space-xhuge)}:host([size=none]){--h-space:var(--stzh-space-none)}:host([size=default]){--h-space:var(--stzh-space-default)}@media screen and (min-width: 600px){:host([size-small=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 600px){:host([size-small=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 600px){:host([size-small=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 600px){:host([size-small=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 600px){:host([size-small=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 600px){:host([size-small=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 600px){:host([size-small=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){:host([size-small=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([size-small=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){:host([size-small=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 600px){:host([size-small=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 600px){:host([size-small=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){:host([size-small=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 600px){:host([size-small=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 600px){:host([size-small=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 600px){:host([size-small=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 800px){:host([size-smallheader=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 800px){:host([size-smallheader=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 800px){:host([size-smallheader=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 800px){:host([size-smallheader=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 800px){:host([size-smallheader=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 800px){:host([size-smallheader=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 800px){:host([size-smallheader=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 800px){:host([size-smallheader=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 800px){:host([size-smallheader=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 800px){:host([size-smallheader=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 800px){:host([size-smallheader=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 800px){:host([size-smallheader=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 800px){:host([size-smallheader=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 800px){:host([size-smallheader=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 800px){:host([size-smallheader=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 800px){:host([size-smallheader=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 1024px){:host([size-medium=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1024px){:host([size-medium=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1024px){:host([size-medium=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1024px){:host([size-medium=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1024px){:host([size-medium=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1024px){:host([size-medium=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 1024px){:host([size-medium=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1024px){:host([size-medium=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1024px){:host([size-medium=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1024px){:host([size-medium=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1024px){:host([size-medium=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1024px){:host([size-medium=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 1024px){:host([size-medium=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 1024px){:host([size-medium=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1024px){:host([size-medium=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 1024px){:host([size-medium=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 1260px){:host([size-large=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1260px){:host([size-large=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1260px){:host([size-large=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){:host([size-large=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1260px){:host([size-large=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([size-large=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 1260px){:host([size-large=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){:host([size-large=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1260px){:host([size-large=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 1260px){:host([size-large=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 1260px){:host([size-large=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1260px){:host([size-large=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 1260px){:host([size-large=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 1440px){:host([size-ultra=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1440px){:host([size-ultra=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1440px){:host([size-ultra=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1440px){:host([size-ultra=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1440px){:host([size-ultra=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1440px){:host([size-ultra=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 1440px){:host([size-ultra=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1440px){:host([size-ultra=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1440px){:host([size-ultra=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1440px){:host([size-ultra=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1440px){:host([size-ultra=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1440px){:host([size-ultra=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 1440px){:host([size-ultra=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 1440px){:host([size-ultra=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1440px){:host([size-ultra=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 1440px){:host([size-ultra=default]){--h-space:var(--stzh-space-default)}}.stzh-hspace{-ms-flex-positive:1;flex-grow:1;width:100%;height:100%;display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:start;align-items:flex-start;padding:0;margin:0;}.stzh-hspace--border-left{border-left:0.0625rem solid var(--stzh-base-border-color)}.stzh-hspace--border-right{border-right:0.0625rem solid var(--stzh-base-border-color)}.stzh-hspace--justify-center{-ms-flex-pack:center;justify-content:center}.stzh-hspace--justify-end{-ms-flex-pack:end;justify-content:flex-end}.stzh-hspace--justify-between{-ms-flex-pack:justify;justify-content:space-between}.stzh-hspace--justify-around{-ms-flex-pack:distribute;justify-content:space-around}.stzh-hspace--justify-evenly{-ms-flex-pack:space-evenly;justify-content:space-evenly}.stzh-hspace--items-end{-ms-flex-align:end;align-items:flex-end}.stzh-hspace--items-center{-ms-flex-align:center;align-items:center}.stzh-hspace--items-baseline{-ms-flex-align:baseline;align-items:baseline}.stzh-hspace--items-stretch{-ms-flex-align:stretch;align-items:stretch}";var StzhHspace=function(){function e(e){registerInstance(this,e);this.curve="none";this.size="inherit";this.sizeSmall="inherit";this.sizeMedium="inherit";this.sizeLarge="inherit";this.sizeUltra="inherit";this.justify="start";this.items="start";this.around=false;this.aroundLeft=false;this.aroundRight=false;this.border="none"}e.prototype.render=function(){var e;return h(Host,null,h("div",{class:(e={"stzh-hspace":true},e["stzh-hspace--justify-".concat(this.justify)]=!!this.justify,e["stzh-hspace--items-".concat(this.items)]=!!this.items,e)},h("slot",null)))};return e}();StzhHspace.style=stzhHspaceCss;export{StzhHspace as stzh_hspace};
-//# sourceMappingURL=stzh-hspace.entry.js.map