@oiz/stzh-components 2.1.0 → 2.2.0

package/dist/collection/patterns/contact.stories.js

@@ -0,0 +1,144 @@
+import { h } from '../utils/h';
+import { withDesign } from 'storybook-addon-designs';
+import { getFigmaLink } from '../../figma';
+
+import {
+  OrganizationWithPobox as Contactaddress_OrganizationWithPobox,
+  FurtherContactOrganization as Contactaddress_FurtherContactOrganization,
+  WithImageAndAvailability as Contactaddress_WithImageAndAvailability,
+  MinimalOrganization as Contactaddress_MinimalOrganization,
+  FurtherContactPerson as Contactaddress_FurtherContactPerson
+} from '../components/stzh-contactaddress/stzh-contactaddress.stories';
+
+import {
+  Urls as Datalist_Urls
+} from '../components/stzh-datalist/stzh-datalist.stories';
+
+import {
+  Default as Contactform
+} from './contactform.stories';
+
+export default {
+  title: 'Patterns/Contact',
+  parameters: {
+    layout: 'padded',
+    docs: {
+      inlineStories: false,
+    },
+    design: {
+      type: 'figma',
+      url: getFigmaLink('contact'),
+      allowFullscreen: true
+    }
+  },
+  decorators: [
+    withDesign
+  ]
+};
+
+const Template = (args) => (
+  <div>
+    <stzh-heading level="2" with-border>Kontakt</stzh-heading>
+    <stzh-vspace curve="medium"></stzh-vspace>
+
+    <Contactaddress_OrganizationWithPobox {... {...Contactaddress_OrganizationWithPobox.args, 'with-border': false } }></Contactaddress_OrganizationWithPobox>
+    <stzh-vspace curve="small"></stzh-vspace>
+
+    <stzh-datalist>
+      <stzh-datalist-item value="Website" href="#"></stzh-datalist-item>
+      <stzh-details>
+        <stzh-datalist-item value="Kontaktformular"></stzh-datalist-item>
+        <Contactform {...Contactform.args} slot="content"></Contactform>
+      </stzh-details>
+    </stzh-datalist>
+
+    <stzh-vspace curve="medium"></stzh-vspace>
+    <stzh-olmap></stzh-olmap>
+
+    <stzh-vspace curve="medium"></stzh-vspace>
+    <Contactaddress_FurtherContactOrganization {... {...Contactaddress_FurtherContactOrganization.args, 'with-border': false } }></Contactaddress_FurtherContactOrganization>
+    <stzh-vspace curve="small"></stzh-vspace>
+
+    <stzh-datalist>
+      <stzh-datalist-item value="Website" href="#" target="_blank" rel="external nofollow"></stzh-datalist-item>
+    </stzh-datalist>
+  </div>
+);
+
+const TemplateFurtherContact = (args) => (
+  <div>
+    <stzh-heading level="2" with-border>Kontakt</stzh-heading>
+    <stzh-vspace curve="medium"></stzh-vspace>
+
+    <Contactaddress_MinimalOrganization {... {...Contactaddress_MinimalOrganization.args, 'with-border': false } }></Contactaddress_MinimalOrganization>
+    <stzh-vspace curve="small"></stzh-vspace>
+
+    <stzh-datalist>
+      <stzh-details>
+        <stzh-datalist-item value="Kontaktformular"></stzh-datalist-item>
+        <Contactform {...Contactform.args} slot="content"></Contactform>
+      </stzh-details>
+    </stzh-datalist>
+
+    <stzh-vspace curve="medium"></stzh-vspace>
+    <Contactaddress_FurtherContactPerson {... {...Contactaddress_FurtherContactPerson.args, 'with-border': false } }></Contactaddress_FurtherContactPerson>
+  </div>
+);
+
+const TemplateNew = (args) => (
+  <div>
+    <stzh-cspace>
+      <Contactaddress_WithImageAndAvailability {... {...Contactaddress_WithImageAndAvailability.args, 'with-border': false } }></Contactaddress_WithImageAndAvailability>
+
+      <stzh-datalist>
+        <stzh-details>
+          <stzh-datalist-item value="Kontaktformular"></stzh-datalist-item>
+          <Contactform {...Contactform.args} slot="content"></Contactform>
+        </stzh-details>
+      </stzh-datalist>
+
+      <stzh-richtext>
+        <p>
+          <b>Function</b><br />
+          Dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren
+        </p>
+        <p>
+          <b>Responsibility</b><br />
+          Dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren
+        </p>
+      </stzh-richtext>
+
+      <stzh-richtext>
+        <h3>Title</h3>
+        <ul>
+          <li>Dolor sit amet</li>
+          <li>Consetetur sadipscing elitr</li>
+          <li>Sed diam nonumy</li>
+        </ul>
+
+        <h3>Title</h3>
+        <ul>
+          <li>Dolor sit amet</li>
+          <li>Consetetur sadipscing elitr</li>
+          <li>Sed diam nonumy</li>
+        </ul>
+      </stzh-richtext>
+
+      <stzh-heading level="3" curve="h4">Linklist</stzh-heading>
+      <Datalist_Urls {...Datalist_Urls.args}></Datalist_Urls>
+
+    </stzh-cspace>
+  </div>
+);
+
+export const Default = Template.bind({});
+Default.args = {
+};
+
+export const FurtherContact = TemplateFurtherContact.bind({});
+FurtherContact.args = {
+};
+
+export const New = TemplateNew.bind({});
+New.args = {
+};

package/dist/collection/patterns/contactform.stories.js

@@ -0,0 +1,125 @@
+import { h } from '../utils/h';
+import { withDesign } from 'storybook-addon-designs';
+import { getFigmaLink } from '../../figma';
+
+export default {
+  title: 'Patterns/ContactForm',
+  parameters: {
+    layout: 'padded',
+    docs: {
+      inlineStories: false,
+    },
+    design: {
+      type: 'figma',
+      url: getFigmaLink('contactform'),
+      allowFullscreen: true
+    }
+  },
+  decorators: [
+    withDesign
+  ]
+};
+
+const Template = (args) => (
+  <form>
+    <stzh-cspace>
+      <stzh-fieldset>
+        <stzh-row>
+          <stzh-cell span-small="6">
+            <stzh-input show-marker name="organisation" label="To" value="Service Center" readonly required></stzh-input>
+          </stzh-cell>
+          <stzh-cell span-small="6">
+            <stzh-vspace size="large" size-small="none"></stzh-vspace>
+            <stzh-input show-marker name="subject" label="Subject" required></stzh-input>
+          </stzh-cell>
+        </stzh-row>
+
+        <stzh-input
+          show-marker
+          required
+          rows="4"
+          multiline
+          name="message"
+          label="Message"
+        ></stzh-input>
+
+        <stzh-upload
+          url="/upload"
+          description="Drag and drop files here to upload. Allowed file formats: [txt, pdf, docs] (max. 25 MB)."
+          accepted-files=".txt,.pdf,.docs"
+        ></stzh-upload>
+      </stzh-fieldset>
+
+      <stzh-fieldset>
+        <stzh-radiogroup
+          show-marker
+          name="r1"
+          legend="Salutation"
+          direction="horizontal"
+          required
+        >
+          <stzh-radio value="mrs">Mrs.</stzh-radio>
+          <stzh-radio value="mr">Mr</stzh-radio>
+        </stzh-radiogroup>
+
+        <stzh-row>
+          <stzh-cell span-small="6">
+            <stzh-input show-marker name="f1" label="First Name"></stzh-input>
+          </stzh-cell>
+          <stzh-cell span-small="6">
+            <stzh-vspace size="large" size-small="none"></stzh-vspace>
+            <stzh-input show-marker name="f2" label="Last Name" required></stzh-input>
+          </stzh-cell>
+        </stzh-row>
+
+        <stzh-row>
+          <stzh-cell span-small="6">
+            <stzh-input show-marker name="f3" label="Company/Organisation"></stzh-input>
+          </stzh-cell>
+          <stzh-cell span-small="6">
+            <stzh-vspace size="large" size-small="none"></stzh-vspace>
+            <stzh-input show-marker name="f4" label="Strasse / Nr."></stzh-input>
+          </stzh-cell>
+        </stzh-row>
+
+        <stzh-row>
+          <stzh-cell span-small="4">
+            <stzh-input show-marker name="f5" label="ZIP Code"></stzh-input>
+          </stzh-cell>
+          <stzh-cell span-small="8">
+            <stzh-vspace size="large" size-small="none"></stzh-vspace>
+            <stzh-input show-marker name="f6" label="City"></stzh-input>
+          </stzh-cell>
+        </stzh-row>
+
+        <stzh-row>
+          <stzh-cell span-small="6">
+            <stzh-input show-marker name="f7" label="E-Mail" required></stzh-input>
+          </stzh-cell>
+          <stzh-cell span-small="6">
+            <stzh-vspace size="large" size-small="none"></stzh-vspace>
+            <stzh-input show-marker name="f8" label="Phone"></stzh-input>
+          </stzh-cell>
+        </stzh-row>
+      </stzh-fieldset>
+
+      <stzh-saptcha numbers='["7", "9", "8"]' name="saptcha"></stzh-saptcha>
+
+      <stzh-checkbox show-marker checked name="copy" label="I would like an unencrypted copy of this message"></stzh-checkbox>
+
+      <stzh-message
+        label="A message with the wrong sender will not be answered and will be deleted."
+        description="The message is encrypted before it is sent to the city administration of Zurich."
+      ></stzh-message>
+
+      <stzh-actions variant="form" with-border>
+        <stzh-button slot="primary" type="submit">Send</stzh-button>
+        <stzh-button slot="secondary" type="reset">Cancel</stzh-button>
+      </stzh-actions>
+    </stzh-cspace>
+  </form>
+);
+
+export const Default = Template.bind({});
+Default.args = {
+};

package/dist/collection/patterns/subpages.stories.js

@@ -0,0 +1,98 @@
+import { h } from '../utils/h';
+import { withDesign } from 'storybook-addon-designs';
+import { getFigmaLink } from '../../figma';
+
+export default {
+  title: 'Patterns/Subpages',
+  parameters: {
+    layout: 'padded',
+    docs: {
+      inlineStories: false,
+    },
+    design: {
+      type: 'figma',
+      url: getFigmaLink('subpages'),
+      allowFullscreen: true
+    }
+  },
+  decorators: [
+    withDesign
+  ]
+};
+
+const Template = (args) => (
+  <stzh-cspace>
+    <stzh-heading level="2" with-border>Heading</stzh-heading>
+    <stzh-card-list layout="subpages">
+      <stzh-card href="#" hide-header-border hide-footer-border with-arrow>
+        <stzh-clamp lines="2" slot="heading">
+          Laboris laborum aute id laboris
+        </stzh-clamp>
+        {!args.hideImage &&
+          <img slot="image" src="media/images/teaser_01.png" />}
+        {!args.hideText &&
+          <stzh-clamp lines="3" slot="content">
+            Laboris laborum aute id laboris culpa esse aliquip nisi anim velit. Minim sunt eiusmod do laborum amet ut magna. Labore dolore id nostrud enim Lorem pariatur ad dolore id eiusmod adipisicing laboris laborum minim. Reprehenderit deserunt ut occaecat sit sit ullamco laborum deserunt. Eu pariatur est exercitation ea ut tempor laborum. Amet veniam consectetur cupidatat Lorem eu ipsum.
+          </stzh-clamp>}
+      </stzh-card>
+      <stzh-card href="#" hide-header-border hide-footer-border with-arrow>
+        <stzh-clamp lines="2" slot="heading">
+          Laboris laborum aute id laboris culpa esse aliquip nisi anim velit. Minim sunt eiusmod do laborum amet ut magna. Labore dolore id nostrud enim Lorem pariatur ad dolore id eiusmod adipisicing laboris laborum minim. Reprehenderit deserunt ut occaecat sit sit ullamco laborum deserunt. Eu pariatur est exercitation ea ut tempor laborum. Amet veniam consectetur cupidatat Lorem eu ipsum.
+        </stzh-clamp>
+        {!args.hideImage &&
+          <img slot="image" src="media/images/teaser_01.png" />}
+        {!args.hideText &&
+          <stzh-clamp lines="2" slot="content">
+            Laboris laborum aute id laboris culpa esse aliquip nisi anim velit. Minim sunt eiusmod do laborum amet ut magna. Labore dolore id nostrud enim Lorem pariatur ad dolore id eiusmod adipisicing laboris laborum minim. Reprehenderit deserunt ut occaecat sit sit ullamco laborum deserunt. Eu pariatur est exercitation ea ut tempor laborum. Amet veniam consectetur cupidatat Lorem eu ipsum.
+          </stzh-clamp>}
+      </stzh-card>
+      <stzh-card href="#" hide-header-border hide-footer-border with-arrow>
+        <stzh-clamp lines="2" slot="heading">
+          Laboris laborum aute id laboris
+        </stzh-clamp>
+        {!args.hideImage &&
+          <img slot="image" src="media/images/teaser_01.png" />}
+        {!args.hideText &&
+          <stzh-clamp lines="3" slot="content">
+            Laboris laborum aute id laboris culpa esse aliquip nisi anim velit. Minim sunt eiusmod do laborum amet ut magna. Labore dolore id nostrud enim Lorem pariatur ad dolore id eiusmod adipisicing laboris laborum minim. Reprehenderit deserunt ut occaecat sit sit ullamco laborum deserunt. Eu pariatur est exercitation ea ut tempor laborum. Amet veniam consectetur cupidatat Lorem eu ipsum.
+          </stzh-clamp>}
+      </stzh-card>
+      <stzh-card href="#" hide-header-border hide-footer-border with-arrow>
+        <stzh-clamp lines="2" slot="heading">
+          Laboris laborum aute id laboris
+        </stzh-clamp>
+        {!args.hideImage &&
+          <img slot="image" src="media/images/teaser_01.png" />}
+        {!args.hideText &&
+          <stzh-clamp lines="3" slot="content">
+            Laboris laborum aute id laboris culpa esse aliquip nisi anim velit. Minim sunt eiusmod do laborum amet ut magna. Labore dolore id nostrud enim Lorem pariatur ad dolore id eiusmod adipisicing laboris laborum minim. Reprehenderit deserunt ut occaecat sit sit ullamco laborum deserunt. Eu pariatur est exercitation ea ut tempor laborum. Amet veniam consectetur cupidatat Lorem eu ipsum.
+          </stzh-clamp>}
+      </stzh-card>
+      <stzh-card href="#" hide-header-border hide-footer-border with-arrow>
+        <stzh-clamp lines="2" slot="heading">
+          Laboris laborum aute id laboris
+        </stzh-clamp>
+        {!args.hideImage &&
+          <img slot="image" src="media/images/teaser_01.png" />}
+        {!args.hideText &&
+          <stzh-clamp lines="3" slot="content">
+            Laboris laborum aute id laboris culpa esse aliquip nisi anim velit. Minim sunt eiusmod do laborum amet ut magna. Labore dolore id nostrud enim Lorem pariatur ad dolore id eiusmod adipisicing laboris laborum minim. Reprehenderit deserunt ut occaecat sit sit ullamco laborum deserunt. Eu pariatur est exercitation ea ut tempor laborum. Amet veniam consectetur cupidatat Lorem eu ipsum.
+          </stzh-clamp>}
+      </stzh-card>
+    </stzh-card-list>
+  </stzh-cspace>
+);
+
+export const Default = Template.bind({});
+Default.args = {
+};
+
+export const WithoutText = Template.bind({});
+WithoutText.args = {
+  hideText: true
+};
+
+export const WithoutImage = Template.bind({});
+WithoutImage.args = {
+  hideImage: true
+};

package/dist/collection/utils/animation-utils.js

@@ -35,6 +35,9 @@ export function prefersReducedMotion() {
 // Stops all active animations on the target element. Returns a promise that resolves after all animations are canceled.
 //
 export function stopAnimations(el) {
+  if (!el) {
+    return;
+  }
   return Promise.all(el.getAnimations().map(animation => {
     return new Promise(resolve => {
       const handleAnimationEvent = requestAnimationFrame(resolve);

package/dist/components/animation-utils.js

@@ -22,6 +22,9 @@ function prefersReducedMotion() {
 // Stops all active animations on the target element. Returns a promise that resolves after all animations are canceled.
 //
 function stopAnimations(el) {
+  if (!el) {
+    return;
+  }
   return Promise.all(el.getAnimations().map(animation => {
     return new Promise(resolve => {
       const handleAnimationEvent = requestAnimationFrame(resolve);

package/dist/components/index.d.ts

@@ -23,10 +23,12 @@ export { StzhContactaddress as StzhContactaddress } from '../types/components/st
 export { StzhContainer as StzhContainer } from '../types/components/stzh-container/stzh-container';
 export { StzhCspace as StzhCspace } from '../types/components/stzh-cspace/stzh-cspace';
 export { StzhDatalist as StzhDatalist } from '../types/components/stzh-datalist/stzh-datalist';
+export { StzhDatalistItem as StzhDatalistItem } from '../types/components/stzh-datalist-item/stzh-datalist-item';
 export { StzhDatamessagelist as StzhDatamessagelist } from '../types/components/stzh-datamessagelist/stzh-datamessagelist';
 export { StzhDatamessagelistItem as StzhDatamessagelistItem } from '../types/components/stzh-datamessagelist-item/stzh-datamessagelist-item';
 export { StzhDatatable as StzhDatatable } from '../types/components/stzh-datatable/stzh-datatable';
 export { StzhDatepicker as StzhDatepicker } from '../types/components/stzh-datepicker/stzh-datepicker';
+export { StzhDetails as StzhDetails } from '../types/components/stzh-details/stzh-details';
 export { StzhDialog as StzhDialog } from '../types/components/stzh-dialog/stzh-dialog';
 export { StzhDropdown as StzhDropdown } from '../types/components/stzh-dropdown/stzh-dropdown';
 export { StzhFieldset as StzhFieldset } from '../types/components/stzh-fieldset/stzh-fieldset';
@@ -41,6 +43,7 @@ export { StzhHspace as StzhHspace } from '../types/components/stzh-hspace/stzh-h
 export { StzhIcon as StzhIcon } from '../types/components/stzh-icon/stzh-icon';
 export { StzhIconSprite as StzhIconSprite } from '../types/components/stzh-icon-sprite/stzh-icon-sprite';
 export { StzhInput as StzhInput } from '../types/components/stzh-input/stzh-input';
+export { StzhLangnav as StzhLangnav } from '../types/components/stzh-langnav/stzh-langnav';
 export { StzhLink as StzhLink } from '../types/components/stzh-link/stzh-link';
 export { StzhList as StzhList } from '../types/components/stzh-list/stzh-list';
 export { StzhListItem as StzhListItem } from '../types/components/stzh-list-item/stzh-list-item';
@@ -50,6 +53,7 @@ export { StzhMenu as StzhMenu } from '../types/components/stzh-menu/stzh-menu';
 export { StzhMenuItem as StzhMenuItem } from '../types/components/stzh-menu-item/stzh-menu-item';
 export { StzhMessage as StzhMessage } from '../types/components/stzh-message/stzh-message';
 export { StzhMetanav as StzhMetanav } from '../types/components/stzh-metanav/stzh-metanav';
+export { StzhMicrositeTeaserlist as StzhMicrositeTeaserlist } from '../types/components/stzh-microsite-teaserlist/stzh-microsite-teaserlist';
 export { StzhOlmap as StzhOlmap } from '../types/components/stzh-olmap/stzh-olmap';
 export { StzhOverlay as StzhOverlay } from '../types/components/stzh-overlay/stzh-overlay';
 export { StzhPageSkiplinks as StzhPageSkiplinks } from '../types/components/stzh-page-skiplinks/stzh-page-skiplinks';
@@ -68,12 +72,14 @@ export { StzhRow as StzhRow } from '../types/components/stzh-row/stzh-row';
 export { StzhSaptcha as StzhSaptcha } from '../types/components/stzh-saptcha/stzh-saptcha';
 export { StzhSection as StzhSection } from '../types/components/stzh-section/stzh-section';
 export { StzhShare as StzhShare } from '../types/components/stzh-share/stzh-share';
+export { StzhSitemap as StzhSitemap } from '../types/components/stzh-sitemap/stzh-sitemap';
 export { StzhSkiplink as StzhSkiplink } from '../types/components/stzh-skiplink/stzh-skiplink';
 export { StzhSortable as StzhSortable } from '../types/components/stzh-sortable/stzh-sortable';
 export { StzhStatus as StzhStatus } from '../types/components/stzh-status/stzh-status';
 export { StzhSticky as StzhSticky } from '../types/components/stzh-sticky/stzh-sticky';
 export { StzhTable as StzhTable } from '../types/components/stzh-table/stzh-table';
 export { StzhText as StzhText } from '../types/components/stzh-text/stzh-text';
+export { StzhTextandimage as StzhTextandimage } from '../types/components/stzh-textandimage/stzh-textandimage';
 export { StzhToggle as StzhToggle } from '../types/components/stzh-toggle/stzh-toggle';
 export { StzhTooltip as StzhTooltip } from '../types/components/stzh-tooltip/stzh-tooltip';
 export { StzhUpload as StzhUpload } from '../types/components/stzh-upload/stzh-upload';

package/dist/components/index.js

@@ -1,4 +1,5 @@
 export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
+export { V as VBZ } from './index2.js';
 export { StzhAccordion, defineCustomElement as defineCustomElementStzhAccordion } from './stzh-accordion.js';
 export { StzhAccordionItem, defineCustomElement as defineCustomElementStzhAccordionItem } from './stzh-accordion-item.js';
 export { StzhActions, defineCustomElement as defineCustomElementStzhActions } from './stzh-actions.js';
@@ -23,10 +24,12 @@ export { StzhContactaddress, defineCustomElement as defineCustomElementStzhConta
 export { StzhContainer, defineCustomElement as defineCustomElementStzhContainer } from './stzh-container.js';
 export { StzhCspace, defineCustomElement as defineCustomElementStzhCspace } from './stzh-cspace.js';
 export { StzhDatalist, defineCustomElement as defineCustomElementStzhDatalist } from './stzh-datalist.js';
+export { StzhDatalistItem, defineCustomElement as defineCustomElementStzhDatalistItem } from './stzh-datalist-item.js';
 export { StzhDatamessagelist, defineCustomElement as defineCustomElementStzhDatamessagelist } from './stzh-datamessagelist.js';
 export { StzhDatamessagelistItem, defineCustomElement as defineCustomElementStzhDatamessagelistItem } from './stzh-datamessagelist-item.js';
 export { StzhDatatable, defineCustomElement as defineCustomElementStzhDatatable } from './stzh-datatable.js';
 export { StzhDatepicker, defineCustomElement as defineCustomElementStzhDatepicker } from './stzh-datepicker.js';
+export { StzhDetails, defineCustomElement as defineCustomElementStzhDetails } from './stzh-details.js';
 export { StzhDialog, defineCustomElement as defineCustomElementStzhDialog } from './stzh-dialog.js';
 export { StzhDropdown, defineCustomElement as defineCustomElementStzhDropdown } from './stzh-dropdown.js';
 export { StzhFieldset, defineCustomElement as defineCustomElementStzhFieldset } from './stzh-fieldset.js';
@@ -41,6 +44,7 @@ export { StzhHspace, defineCustomElement as defineCustomElementStzhHspace } from
 export { StzhIcon, defineCustomElement as defineCustomElementStzhIcon } from './stzh-icon.js';
 export { StzhIconSprite, defineCustomElement as defineCustomElementStzhIconSprite } from './stzh-icon-sprite.js';
 export { StzhInput, defineCustomElement as defineCustomElementStzhInput } from './stzh-input.js';
+export { StzhLangnav, defineCustomElement as defineCustomElementStzhLangnav } from './stzh-langnav.js';
 export { StzhLink, defineCustomElement as defineCustomElementStzhLink } from './stzh-link.js';
 export { StzhList, defineCustomElement as defineCustomElementStzhList } from './stzh-list.js';
 export { StzhListItem, defineCustomElement as defineCustomElementStzhListItem } from './stzh-list-item.js';
@@ -50,6 +54,7 @@ export { StzhMenu, defineCustomElement as defineCustomElementStzhMenu } from './
 export { StzhMenuItem, defineCustomElement as defineCustomElementStzhMenuItem } from './stzh-menu-item.js';
 export { StzhMessage, defineCustomElement as defineCustomElementStzhMessage } from './stzh-message.js';
 export { StzhMetanav, defineCustomElement as defineCustomElementStzhMetanav } from './stzh-metanav.js';
+export { StzhMicrositeTeaserlist, defineCustomElement as defineCustomElementStzhMicrositeTeaserlist } from './stzh-microsite-teaserlist.js';
 export { StzhOlmap, defineCustomElement as defineCustomElementStzhOlmap } from './stzh-olmap.js';
 export { StzhOverlay, defineCustomElement as defineCustomElementStzhOverlay } from './stzh-overlay.js';
 export { StzhPageSkiplinks, defineCustomElement as defineCustomElementStzhPageSkiplinks } from './stzh-page-skiplinks.js';
@@ -68,12 +73,14 @@ export { StzhRow, defineCustomElement as defineCustomElementStzhRow } from './st
 export { StzhSaptcha, defineCustomElement as defineCustomElementStzhSaptcha } from './stzh-saptcha.js';
 export { StzhSection, defineCustomElement as defineCustomElementStzhSection } from './stzh-section.js';
 export { StzhShare, defineCustomElement as defineCustomElementStzhShare } from './stzh-share.js';
+export { StzhSitemap, defineCustomElement as defineCustomElementStzhSitemap } from './stzh-sitemap.js';
 export { StzhSkiplink, defineCustomElement as defineCustomElementStzhSkiplink } from './stzh-skiplink.js';
 export { StzhSortable, defineCustomElement as defineCustomElementStzhSortable } from './stzh-sortable.js';
 export { StzhStatus, defineCustomElement as defineCustomElementStzhStatus } from './stzh-status.js';
 export { StzhSticky, defineCustomElement as defineCustomElementStzhSticky } from './stzh-sticky.js';
 export { StzhTable, defineCustomElement as defineCustomElementStzhTable } from './stzh-table.js';
 export { StzhText, defineCustomElement as defineCustomElementStzhText } from './stzh-text.js';
+export { StzhTextandimage, defineCustomElement as defineCustomElementStzhTextandimage } from './stzh-textandimage.js';
 export { StzhToggle, defineCustomElement as defineCustomElementStzhToggle } from './stzh-toggle.js';
 export { StzhTooltip, defineCustomElement as defineCustomElementStzhTooltip } from './stzh-tooltip.js';
 export { StzhUpload, defineCustomElement as defineCustomElementStzhUpload } from './stzh-upload.js';
@@ -84,7 +91,7 @@ export { StzhVisuallyhidden, defineCustomElement as defineCustomElementStzhVisua
 export { StzhVspace, defineCustomElement as defineCustomElementStzhVspace } from './stzh-vspace.js';
 
 const name = "@oiz/stzh-components";
-const version = "2.1.0";
+const version = "2.2.0";
 
 const packageName = name.substring(name.indexOf('/')+1);