@popsure/dirty-swan 0.31.1 → 0.32.0

package/dist/esm/components/autocompleteAddress/index.stories.js

@@ -0,0 +1,110 @@
+import { jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { AutocompleteAddress } from './index.js';
+import '../../tslib.es6-5bc94358.js';
+import '../../index-e9e37a34.js';
+import '../../index-1463d5e9.js';
+import '../../_commonjsHelpers-e7f67fd8.js';
+import '../input/index.js';
+import '../../index-fb46adf9.js';
+import '../../style-inject.es-1f59c1d0.js';
+
+var story = {
+    title: 'JSX/AutocompleteAddress',
+    component: AutocompleteAddress,
+    argTypes: {
+        address: {
+            description: 'The address properties',
+            table: {
+                type: {
+                    summary: 'Partial<Address>'
+                },
+            },
+        },
+        apiKey: {
+            defaultValue: 'AIzaSyDg0DSrjYKt5smmsjkVasDz7c4T5rbOXT8',
+            description: 'Your private API key for the [Google Places API](https://developers.google.com/maps/documentation/places/web-service/overview)',
+            table: {
+                type: {
+                    summary: 'Partial<Address>'
+                },
+            },
+        },
+        onAddressChange: {
+            description: 'Callback with the updated address, this function will get called everytime the address gets updated',
+            action: true,
+            table: {
+                category: "Callbacks",
+            },
+        },
+        manualAddressEntryTexts: {
+            description: 'The CTA that enables manual address entry and the text preceding it',
+            table: {
+                type: {
+                    summary: '{ preText?: string; cta: string?; }'
+                }
+            }
+        },
+        placeholders: {
+            description: 'Placeholder text',
+            table: {
+                type: {
+                    summary: '{ manualAddressEntry?: string; street: string?; houseNumber?: string; additionalInformation?: string; postcode?: string; city?: string; }'
+                }
+            }
+        }
+    },
+    parameters: {
+        componentSubtitle: 'Autocomplete Address are user interface elements which allow users start typing an address and get autocompletion suggestions on the address.',
+        docs: {
+            description: {
+                component: 'This component is for now only restricted to "address" types and will restrict every query to Germany.',
+            },
+        },
+        customTypes: {
+            Address: "interface Address {\n          street: string;\n          houseNumber: string;\n          postcode: string;\n          city: string;\n          additionalInformation?: string;\n          country: string;\n      }"
+        }
+    },
+};
+var AutocompleteAddressStory = function (_a) {
+    var defaultAddress = _a.address, apiKey = _a.apiKey, manualAddressEntryTexts = _a.manualAddressEntryTexts, onAddressChange = _a.onAddressChange, placeholders = _a.placeholders;
+    var _b = useState(defaultAddress), address = _b[0], setAddress = _b[1];
+    var handleOnAddressChange = function (newAddress) {
+        onAddressChange(newAddress);
+        setAddress(newAddress);
+    };
+    return (jsx(AutocompleteAddress, { address: address, apiKey: apiKey, manualAddressEntryTexts: manualAddressEntryTexts, onAddressChange: handleOnAddressChange, placeholders: placeholders }, void 0));
+};
+AutocompleteAddressStory.storyName = "AutocompleteAddress";
+var WithAddress = function (_a) {
+    var apiKey = _a.apiKey, onAddressChange = _a.onAddressChange; _a.placeholders;
+    return (jsx(AutocompleteAddress, { address: {
+            street: 'Lohmuehlenstraße',
+            houseNumber: '65',
+            city: 'Berlin',
+            country: 'DE',
+            additionalInformation: 'c/o Factory',
+        }, apiKey: apiKey, onAddressChange: onAddressChange }, void 0));
+};
+var WithLocalisationEntryText = function (_a) {
+    var apiKey = _a.apiKey, onAddressChange = _a.onAddressChange;
+    return (jsx(AutocompleteAddress, { apiKey: apiKey, manualAddressEntryTexts: {
+            preText: 'Oder ',
+            cta: 'Adresse direkt eingeben',
+        }, onAddressChange: onAddressChange }, void 0));
+};
+var WithLocalisationPlaceholders = function (_a) {
+    var apiKey = _a.apiKey, onAddressChange = _a.onAddressChange;
+    return (jsx(AutocompleteAddress, { address: {}, apiKey: apiKey, placeholders: {
+            manualAddressEntry: 'Adresse suchen',
+            street: 'Straße',
+            houseNumber: 'Hausnummer',
+            additionalInformation: 'Adresszusatz (c/o, z.Hd., o.V.i.A, ...)',
+            postcode: 'PLZ',
+            city: 'Stadt',
+        }, onAddressChange: onAddressChange }, void 0));
+};
+
+export default story;
+export { AutocompleteAddressStory, WithAddress, WithLocalisationEntryText, WithLocalisationPlaceholders };
+//# sourceMappingURL=index.stories.js.map

package/dist/esm/components/autocompleteAddress/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/autocompleteAddress/index.stories.tsx"],"sourcesContent":["import { Address } from '@popsure/public-models';\nimport { useState } from 'react';\nimport { AutocompleteAddress, AutocompleteAddressProps } from '.';\n\nconst story = {\n  title: 'JSX/AutocompleteAddress',\n  component: AutocompleteAddress,\n  argTypes: {\n    address: {\n      description: 'The address properties',\n      table: {\n        type: { \n          summary: 'Partial<Address>'\n        },\n      },\n    },\n    apiKey: {\n      defaultValue: 'AIzaSyDg0DSrjYKt5smmsjkVasDz7c4T5rbOXT8',\n      description: 'Your private API key for the [Google Places API](https://developers.google.com/maps/documentation/places/web-service/overview)',\n      table: {\n        type: { \n          summary: 'Partial<Address>'\n        },\n      },\n    },\n    onAddressChange: {\n      description: 'Callback with the updated address, this function will get called everytime the address gets updated',\n      action: true,\n      table: {\n        category: \"Callbacks\",\n      },\n    },\n    manualAddressEntryTexts: {\n      description: 'The CTA that enables manual address entry and the text preceding it',\n      table: {\n        type: {\n            summary: '{ preText?: string; cta: string?; }'\n        }\n      }\n    },\n    placeholders: {\n      description: 'Placeholder text',\n      table: {\n        type: {\n            summary: '{ manualAddressEntry?: string; street: string?; houseNumber?: string; additionalInformation?: string; postcode?: string; city?: string; }'\n        }\n      }\n    }\n  },\n  parameters: {\n    componentSubtitle: 'Autocomplete Address are user interface elements which allow users start typing an address and get autocompletion suggestions on the address.',\n    docs: {\n      description: {\n          component: 'This component is for now only restricted to \"address\" types and will restrict every query to Germany.',\n      },\n    },\n    customTypes: {\n      Address: `interface Address {\n          street: string;\n          houseNumber: string;\n          postcode: string;\n          city: string;\n          additionalInformation?: string;\n          country: string;\n      }`\n    }\n  },\n};\n\nexport const AutocompleteAddressStory = ({\n  address: defaultAddress,\n  apiKey,\n  manualAddressEntryTexts,\n  onAddressChange,\n  placeholders,\n}: AutocompleteAddressProps) => {\n  const [address, setAddress] = useState<Partial<Address> | undefined>(defaultAddress);\n  const handleOnAddressChange = (newAddress: Partial<Address>) => {\n    onAddressChange(newAddress);\n    setAddress(newAddress);\n  };\n\n  return (\n    <AutocompleteAddress\n      address={address}\n      apiKey={apiKey}\n      manualAddressEntryTexts={manualAddressEntryTexts}\n      onAddressChange={handleOnAddressChange}\n      placeholders={placeholders}\n    />\n  );\n};\n\nAutocompleteAddressStory.storyName = \"AutocompleteAddress\";\n\nexport const WithAddress = ({\n  apiKey,\n  onAddressChange,\n  placeholders,\n}: AutocompleteAddressProps) => (\n    <AutocompleteAddress\n      address={{\n        street: 'Lohmuehlenstraße',\n        houseNumber: '65',\n        city: 'Berlin',\n        country: 'DE',\n        additionalInformation: 'c/o Factory',\n      }}\n      apiKey={apiKey}\n      onAddressChange={onAddressChange}\n    />\n);\n\nexport const WithLocalisationEntryText = ({\n  apiKey,\n  onAddressChange,\n}: AutocompleteAddressProps) => (\n  <AutocompleteAddress\n    apiKey={apiKey}\n    manualAddressEntryTexts={{\n      preText: 'Oder ',\n      cta: 'Adresse direkt eingeben',\n    }}\n    onAddressChange={onAddressChange}\n  />\n);\n\nexport const WithLocalisationPlaceholders = ({\n  apiKey,\n  onAddressChange,\n}: AutocompleteAddressProps) => (\n  <AutocompleteAddress\n    address={{}}\n    apiKey={apiKey}\n    placeholders={{\n      manualAddressEntry: 'Adresse suchen',\n      street: 'Straße',\n      houseNumber: 'Hausnummer',\n      additionalInformation: 'Adresszusatz (c/o, z.Hd., o.V.i.A, ...)',\n      postcode: 'PLZ',\n      city: 'Stadt',\n    }}\n    onAddressChange={onAddressChange}\n  />\n);\n\nexport default story;\n"],"names":["_jsx"],"mappings":"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"}

package/dist/esm/components/autocompleteAddress/index.test.js

@@ -1,7 +1,7 @@
 import { b as __awaiter, c as __generator } from '../../tslib.es6-5bc94358.js';
 import { jsx } from 'react/jsx-runtime';
 import { c as customRender, f as fireEvent } from '../../customRender-4157fcff.js';
-import AutoCompleteAddress from './index.js';
+import { AutocompleteAddress } from './index.js';
 import 'react';
 import 'react-dom';
 import '../../_commonjsHelpers-e7f67fd8.js';
@@ -22,7 +22,7 @@ var address = {
 var setup = function (address, onAddressChange) {
     if (address === void 0) { address = undefined; }
     if (onAddressChange === void 0) { onAddressChange = function () { }; }
-    return customRender(jsx(AutoCompleteAddress, { address: address, apiKey: '', onAddressChange: onAddressChange }, void 0));
+    return customRender(jsx(AutocompleteAddress, { address: address, apiKey: '', onAddressChange: onAddressChange }, void 0));
 };
 var inputTestId = 'ds-input-input';
 describe('AutocompleteAddress component', function () {

package/dist/esm/components/autocompleteAddress/index.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.test.js","sources":["../../../../../src/lib/components/autocompleteAddress/index.test.tsx"],"sourcesContent":["import { Address } from '@popsure/public-models';\nimport { fireEvent, render } from '../../util/testUtils';\n\nimport AutoCompleteAddress from '.';\n\nconst address = {\n  street: 'Köpeniker Strasse',\n  houseNumber: '4000',\n  postcode: '10179',\n  city: 'Berlin',\n  country: 'DE',\n};\n\nconst setup = (\n  address: Partial<Address> | undefined = undefined,\n  onAddressChange: (address: Partial<Address>) => void = () => {}\n) => {\n  return render(\n    <AutoCompleteAddress\n      address={address}\n      apiKey={''}\n      onAddressChange={onAddressChange}\n    />\n  );\n};\n\nconst inputTestId = 'ds-input-input';\n\ndescribe('AutocompleteAddress component', () => {\n  it('Should show all address fields once a search is completed', async () => {\n    // @ts-ignore\n    window.google.maps.places.Autocomplete = class {\n      reference: HTMLElement;\n      constructor(reference: HTMLElement) {\n        this.reference = reference;\n      }\n      // @ts-ignore\n      addListener(_action, callback) {\n        this.reference.addEventListener('change', (e: Event) =>\n          (e.target as HTMLInputElement).value !== ''\n            ? callback({\n                geometry: {\n                  location: class {},\n                },\n                address_components: [\n                  {\n                    long_name: 'Köpeniker Strasse',\n                    short_name: 'Köpeniker Strasse',\n                    types: ['route'],\n                  },\n                ],\n              })\n            : null\n        );\n      }\n    };\n\n    const { getAllByTestId, getByDisplayValue, getByTestId } = setup();\n\n    fireEvent.change(getByTestId(inputTestId), {\n      target: { value: 'Köpeniker' },\n    });\n\n    expect(getAllByTestId(inputTestId).length).toEqual(5);\n    expect(getByDisplayValue(\"Köpeniker Strasse\")).toBeVisible();\n  });\n\n  it('Should enable to enter the address manually', async () => {\n    const callback = jest.fn();\n    const { findByText, getAllByTestId, user } = setup(undefined, callback);\n    const btn = await findByText('Enter address manually');\n\n    await user.click(btn);\n\n    // fill out all fields\n    const inputs = getAllByTestId(inputTestId);\n\n    await user.type(inputs[0], 'Köpeniker Strasse');\n    await user.type(inputs[1], '4000');\n    await user.type(inputs[3], '10179');\n    await user.type(inputs[4], 'Berlin');\n\n    // callback should be called with a complete address\n    expect(callback).toHaveBeenCalledWith(address);\n  });\n\n  it('Should prefill fields if an address is provided', async () => {\n    const { getByDisplayValue } = setup(address);\n\n    expect(getByDisplayValue(\"Köpeniker Strasse\")).toBeVisible();\n    expect(getByDisplayValue(\"4000\")).toBeVisible();\n    expect(getByDisplayValue(\"10179\")).toBeVisible();\n    expect(getByDisplayValue(\"Berlin\")).toBeVisible();\n  });\n});\n"],"names":["render","_jsx"],"mappings":"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"}
+{"version":3,"file":"index.test.js","sources":["../../../../../src/lib/components/autocompleteAddress/index.test.tsx"],"sourcesContent":["import { Address } from '@popsure/public-models';\nimport { fireEvent, render } from '../../util/testUtils';\n\nimport { AutocompleteAddress } from '.';\n\nconst address = {\n  street: 'Köpeniker Strasse',\n  houseNumber: '4000',\n  postcode: '10179',\n  city: 'Berlin',\n  country: 'DE',\n};\n\nconst setup = (\n  address: Partial<Address> | undefined = undefined,\n  onAddressChange: (address: Partial<Address>) => void = () => {}\n) => {\n  return render(\n    <AutocompleteAddress\n      address={address}\n      apiKey={''}\n      onAddressChange={onAddressChange}\n    />\n  );\n};\n\nconst inputTestId = 'ds-input-input';\n\ndescribe('AutocompleteAddress component', () => {\n  it('Should show all address fields once a search is completed', async () => {\n    // @ts-ignore\n    window.google.maps.places.Autocomplete = class {\n      reference: HTMLElement;\n      constructor(reference: HTMLElement) {\n        this.reference = reference;\n      }\n      // @ts-ignore\n      addListener(_action, callback) {\n        this.reference.addEventListener('change', (e: Event) =>\n          (e.target as HTMLInputElement).value !== ''\n            ? callback({\n                geometry: {\n                  location: class {},\n                },\n                address_components: [\n                  {\n                    long_name: 'Köpeniker Strasse',\n                    short_name: 'Köpeniker Strasse',\n                    types: ['route'],\n                  },\n                ],\n              })\n            : null\n        );\n      }\n    };\n\n    const { getAllByTestId, getByDisplayValue, getByTestId } = setup();\n\n    fireEvent.change(getByTestId(inputTestId), {\n      target: { value: 'Köpeniker' },\n    });\n\n    expect(getAllByTestId(inputTestId).length).toEqual(5);\n    expect(getByDisplayValue(\"Köpeniker Strasse\")).toBeVisible();\n  });\n\n  it('Should enable to enter the address manually', async () => {\n    const callback = jest.fn();\n    const { findByText, getAllByTestId, user } = setup(undefined, callback);\n    const btn = await findByText('Enter address manually');\n\n    await user.click(btn);\n\n    // fill out all fields\n    const inputs = getAllByTestId(inputTestId);\n\n    await user.type(inputs[0], 'Köpeniker Strasse');\n    await user.type(inputs[1], '4000');\n    await user.type(inputs[3], '10179');\n    await user.type(inputs[4], 'Berlin');\n\n    // callback should be called with a complete address\n    expect(callback).toHaveBeenCalledWith(address);\n  });\n\n  it('Should prefill fields if an address is provided', async () => {\n    const { getByDisplayValue } = setup(address);\n\n    expect(getByDisplayValue(\"Köpeniker Strasse\")).toBeVisible();\n    expect(getByDisplayValue(\"4000\")).toBeVisible();\n    expect(getByDisplayValue(\"10179\")).toBeVisible();\n    expect(getByDisplayValue(\"Berlin\")).toBeVisible();\n  });\n});\n"],"names":["render","_jsx"],"mappings":"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"}

package/dist/esm/components/comparisonTable/components/Row/index.js

@@ -3,7 +3,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import React__default from 'react';
 import { s as styleInject } from '../../../../style-inject.es-1f59c1d0.js';
 
-var css_248z = ".style-module_header__32rw- {\n  position: relative;\n}\n.style-module_header__32rw- > div {\n  width: var(--tableWidth);\n  max-width: var(--tableWidth);\n}\n.style-module_header__32rw- > div:nth-child(n+3) {\n  margin: 0;\n}\n@media (min-width: 34rem) {\n  .style-module_header__32rw- > div {\n    width: 256px;\n    width: var(--cellWidth, 256px);\n    scroll-snap-align: unset;\n  }\n}\n\n.style-module_cell__1NoZ6 {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  scroll-snap-align: end;\n  line-height: 24px;\n  padding: 16px;\n  color: #4c4c53;\n  width: 50vw;\n  max-width: calc(var(--tableWidth) / 2);\n}\n.style-module_cell__1NoZ6:first-child {\n  background-color: white;\n  /** Add scroll snap to every column except the first one */\n  scroll-snap-align: unset;\n}\n.style-module_cell__1NoZ6:nth-child(n+3) {\n  margin-left: 50vw;\n}\n@media (min-width: 34rem) {\n  .style-module_cell__1NoZ6:nth-child(n+3) {\n    margin-left: unset;\n  }\n}\n@media (min-width: 34rem) {\n  .style-module_cell__1NoZ6 {\n    flex: 1 0 256px;\n    flex: 1 0 var(--cellWidth, 256px);\n    width: 256px;\n    width: var(--cellWidth, 256px);\n    padding: 24px;\n  }\n  .style-module_cell__1NoZ6:last-child {\n    padding: 24px 8px 24px 24px;\n  }\n}\n\nh4.style-module_cell__1NoZ6 {\n  max-width: min(288px, calc(var(--tableWidth) / 2));\n  max-width: min(var(--firstColumnWidth, 288px), calc(var(--tableWidth) / 2));\n}\n\n.style-module_title__1xYvu {\n  position: relative;\n  color: #26262e;\n  display: none;\n}\n.style-module_title__1xYvu:after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  top: calc( 50% + 16px );\n  height: 4px;\n  width: 100%;\n  max-width: 140px;\n  background-color: #8e8cee;\n}\n@media (min-width: 34rem) {\n  .style-module_title__1xYvu {\n    display: flex;\n  }\n}\n\n.style-module_sticky__2T5jm {\n  position: sticky;\n  justify-content: flex-start;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  width: 50vw;\n}\n@media (min-width: 34rem) {\n  .style-module_sticky__2T5jm {\n    border-right: 1px solid #fafaff;\n    flex: 1 0 288px;\n  }\n}\n\nh4.style-module_addon__CPf60 {\n  border-right: none;\n  max-width: calc(100vw - 64px);\n  width: 100vw;\n}\n@media (min-width: 64rem) {\n  h4.style-module_addon__CPf60 {\n    max-width: 976px;\n  }\n}";
+var css_248z = ".style-module_header__32rw- {\n  position: relative;\n}\n.style-module_header__32rw- > div {\n  width: var(--tableWidth);\n  max-width: 100vw;\n}\n.style-module_header__32rw- > div:nth-child(n+3) {\n  margin: 0;\n}\n@media (min-width: 34rem) {\n  .style-module_header__32rw- > div {\n    width: 256px;\n    width: var(--cellWidth, 256px);\n    max-width: var(--tableWidth);\n    scroll-snap-align: unset;\n  }\n}\n\n.style-module_cell__1NoZ6 {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  scroll-snap-align: end;\n  line-height: 24px;\n  padding: 16px;\n  color: #4c4c53;\n  width: 50vw;\n  max-width: calc(var(--tableWidth) / 2);\n}\n.style-module_cell__1NoZ6:first-child {\n  background-color: white;\n  /** Add scroll snap to every column except the first one */\n  scroll-snap-align: unset;\n}\n.style-module_cell__1NoZ6:nth-child(n+3) {\n  margin-left: 50vw;\n}\n@media (min-width: 34rem) {\n  .style-module_cell__1NoZ6:nth-child(n+3) {\n    margin-left: unset;\n  }\n}\n@media (min-width: 34rem) {\n  .style-module_cell__1NoZ6 {\n    flex: 1 0 256px;\n    flex: 1 0 var(--cellWidth, 256px);\n    width: 256px;\n    width: var(--cellWidth, 256px);\n    padding: 24px;\n  }\n  .style-module_cell__1NoZ6:last-child {\n    padding: 24px 8px 24px 24px;\n  }\n}\n\nh4.style-module_cell__1NoZ6 {\n  max-width: min(288px, calc(var(--tableWidth) / 2));\n  max-width: min(var(--firstColumnWidth, 288px), calc(var(--tableWidth) / 2));\n}\n\n.style-module_title__1xYvu {\n  position: relative;\n  color: #26262e;\n  display: none;\n}\n.style-module_title__1xYvu:after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  top: calc( 50% + 16px );\n  height: 4px;\n  width: 100%;\n  max-width: 140px;\n  background-color: #8e8cee;\n}\n@media (min-width: 34rem) {\n  .style-module_title__1xYvu {\n    display: flex;\n  }\n}\n\n.style-module_sticky__2T5jm {\n  position: sticky;\n  justify-content: flex-start;\n  z-index: 1;\n  top: 0;\n  left: 0;\n  width: 50vw;\n}\n@media (min-width: 34rem) {\n  .style-module_sticky__2T5jm {\n    border-right: 1px solid #fafaff;\n    flex: 1 0 288px;\n  }\n}\n\nh4.style-module_addon__CPf60 {\n  border-right: none;\n  max-width: calc(100vw - 64px);\n  width: 100vw;\n}\n@media (min-width: 64rem) {\n  h4.style-module_addon__CPf60 {\n    max-width: 976px;\n  }\n}";
 var styles = {"header":"style-module_header__32rw-","cell":"style-module_cell__1NoZ6","title":"style-module_title__1xYvu","sticky":"style-module_sticky__2T5jm","addon":"style-module_addon__CPf60"};
 styleInject(css_248z);
 

package/dist/esm/components/segmentedControl/index.stories.js

@@ -31,11 +31,7 @@ var story = {
         selectedIndex: 0,
     },
     parameters: {
-        docs: {
-            description: {
-                component: 'A segmented control is a linear set of two or more segments, each of which functions as a mutually exclusive button.',
-            },
-        },
+        componentSubtitle: 'A segmented control is a linear set of two or more segments, each of which functions as a mutually exclusive button.',
     },
 };
 var SegmentedControlStory = function (_a) {

package/dist/esm/components/segmentedControl/index.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/segmentedControl/index.stories.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { SegmentedControl, SegmentedControlProps } from '.';\n\nconst story = {\n  title: 'JSX/SegmentedControl',\n  component: SegmentedControl,\n  argTypes: {\n    values: {\n      description: 'Array containing the text that needs to be displayed',\n      table: {\n        type: { \n          summary: 'string[] OR { title: string; subtitle: string;}[]'\n        },\n      },\n    },\n    selectedIndex: {\n      description: 'The currently selected index',\n    },\n    onChange: {\n      action: true,\n      table: {\n        category: \"Callbacks\",\n      },\n    },\n  },\n  args: {\n    values: ['Earth', 'Sun', 'Moon'],\n    selectedIndex: 0,\n  },\n  parameters: {\n    docs: {\n      description: {\n        component: 'A segmented control is a linear set of two or more segments, each of which functions as a mutually exclusive button.',\n      },\n    },\n  },\n};\n\nexport const SegmentedControlStory = ({\n  onChange,\n  selectedIndex,\n  values\n}: SegmentedControlProps) => {\n  const [index, setIndex] = useState(selectedIndex);\n\n  const handleOnChange = (newIndex: number) => {\n    onChange?.(newIndex);\n    setIndex(newIndex);\n  };\n\n  return (\n    <SegmentedControl\n      values={values}\n      selectedIndex={index}\n      onChange={handleOnChange}\n    />\n  );\n};\n\nSegmentedControlStory.storyName = \"SegmentedControl\";\n\nexport const SegmentedControlWithSubtitle = ({\n  onChange,\n  selectedIndex,\n  values\n}: SegmentedControlProps) => {\n  const [index, setIndex] = useState(selectedIndex);\n\n  const handleOnChange = (newIndex: number) => {\n    onChange?.(newIndex);\n    setIndex(newIndex);\n  };\n\n  return (\n    <SegmentedControl\n      values={[\n        { title: 'Basic', subtitle: '€288,65' },\n        { title: 'Premium', subtitle: '€288,65' },\n      ]}\n      selectedIndex={index}\n      onChange={handleOnChange}\n    />\n  );\n};\n\nexport default story;\n"],"names":["_jsx"],"mappings":";;;;;;IAGM,KAAK,GAAG;IACZ,KAAK,EAAE,sBAAsB;IAC7B,SAAS,EAAE,gBAAgB;IAC3B,QAAQ,EAAE;QACR,MAAM,EAAE;YACN,WAAW,EAAE,sDAAsD;YACnE,KAAK,EAAE;gBACL,IAAI,EAAE;oBACJ,OAAO,EAAE,mDAAmD;iBAC7D;aACF;SACF;QACD,aAAa,EAAE;YACb,WAAW,EAAE,8BAA8B;SAC5C;QACD,QAAQ,EAAE;YACR,MAAM,EAAE,IAAI;YACZ,KAAK,EAAE;gBACL,QAAQ,EAAE,WAAW;aACtB;SACF;KACF;IACD,IAAI,EAAE;QACJ,MAAM,EAAE,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC;QAChC,aAAa,EAAE,CAAC;KACjB;IACD,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE,sHAAsH;aAClI;SACF;KACF;EACD;IAEW,qBAAqB,GAAG,UAAC,EAId;QAHtB,QAAQ,cAAA,EACR,aAAa,mBAAA,EACb,MAAM,YAAA;IAEA,IAAA,KAAoB,QAAQ,CAAC,aAAa,CAAC,EAA1C,KAAK,QAAA,EAAE,QAAQ,QAA2B,CAAC;IAElD,IAAM,cAAc,GAAG,UAAC,QAAgB;QACtC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,QAAQ,CAAC,CAAC;QACrB,QAAQ,CAAC,QAAQ,CAAC,CAAC;KACpB,CAAC;IAEF,QACEA,IAAC,gBAAgB,IACf,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,KAAK,EACpB,QAAQ,EAAE,cAAc,WACxB,EACF;AACJ,EAAE;AAEF,qBAAqB,CAAC,SAAS,GAAG,kBAAkB,CAAC;IAExC,4BAA4B,GAAG,UAAC,EAIrB;QAHtB,QAAQ,cAAA,EACR,aAAa,mBAAA;IAGP,IAAA,KAAoB,QAAQ,CAAC,aAAa,CAAC,EAA1C,KAAK,QAAA,EAAE,QAAQ,QAA2B,CAAC;IAElD,IAAM,cAAc,GAAG,UAAC,QAAgB;QACtC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,QAAQ,CAAC,CAAC;QACrB,QAAQ,CAAC,QAAQ,CAAC,CAAC;KACpB,CAAC;IAEF,QACEA,IAAC,gBAAgB,IACf,MAAM,EAAE;YACN,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE;YACvC,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE;SAC1C,EACD,aAAa,EAAE,KAAK,EACpB,QAAQ,EAAE,cAAc,WACxB,EACF;AACJ;;;;;"}
+{"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/segmentedControl/index.stories.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { SegmentedControl, SegmentedControlProps } from '.';\n\nconst story = {\n  title: 'JSX/SegmentedControl',\n  component: SegmentedControl,\n  argTypes: {\n    values: {\n      description: 'Array containing the text that needs to be displayed',\n      table: {\n        type: { \n          summary: 'string[] OR { title: string; subtitle: string;}[]'\n        },\n      },\n    },\n    selectedIndex: {\n      description: 'The currently selected index',\n    },\n    onChange: {\n      action: true,\n      table: {\n        category: \"Callbacks\",\n      },\n    },\n  },\n  args: {\n    values: ['Earth', 'Sun', 'Moon'],\n    selectedIndex: 0,\n  },\n  parameters: {\n    componentSubtitle: 'A segmented control is a linear set of two or more segments, each of which functions as a mutually exclusive button.',\n  },\n};\n\nexport const SegmentedControlStory = ({\n  onChange,\n  selectedIndex,\n  values\n}: SegmentedControlProps) => {\n  const [index, setIndex] = useState(selectedIndex);\n\n  const handleOnChange = (newIndex: number) => {\n    onChange?.(newIndex);\n    setIndex(newIndex);\n  };\n\n  return (\n    <SegmentedControl\n      values={values}\n      selectedIndex={index}\n      onChange={handleOnChange}\n    />\n  );\n};\n\nSegmentedControlStory.storyName = \"SegmentedControl\";\n\nexport const SegmentedControlWithSubtitle = ({\n  onChange,\n  selectedIndex,\n  values\n}: SegmentedControlProps) => {\n  const [index, setIndex] = useState(selectedIndex);\n\n  const handleOnChange = (newIndex: number) => {\n    onChange?.(newIndex);\n    setIndex(newIndex);\n  };\n\n  return (\n    <SegmentedControl\n      values={[\n        { title: 'Basic', subtitle: '€288,65' },\n        { title: 'Premium', subtitle: '€288,65' },\n      ]}\n      selectedIndex={index}\n      onChange={handleOnChange}\n    />\n  );\n};\n\nexport default story;\n"],"names":["_jsx"],"mappings":";;;;;;IAGM,KAAK,GAAG;IACZ,KAAK,EAAE,sBAAsB;IAC7B,SAAS,EAAE,gBAAgB;IAC3B,QAAQ,EAAE;QACR,MAAM,EAAE;YACN,WAAW,EAAE,sDAAsD;YACnE,KAAK,EAAE;gBACL,IAAI,EAAE;oBACJ,OAAO,EAAE,mDAAmD;iBAC7D;aACF;SACF;QACD,aAAa,EAAE;YACb,WAAW,EAAE,8BAA8B;SAC5C;QACD,QAAQ,EAAE;YACR,MAAM,EAAE,IAAI;YACZ,KAAK,EAAE;gBACL,QAAQ,EAAE,WAAW;aACtB;SACF;KACF;IACD,IAAI,EAAE;QACJ,MAAM,EAAE,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC;QAChC,aAAa,EAAE,CAAC;KACjB;IACD,UAAU,EAAE;QACV,iBAAiB,EAAE,sHAAsH;KAC1I;EACD;IAEW,qBAAqB,GAAG,UAAC,EAId;QAHtB,QAAQ,cAAA,EACR,aAAa,mBAAA,EACb,MAAM,YAAA;IAEA,IAAA,KAAoB,QAAQ,CAAC,aAAa,CAAC,EAA1C,KAAK,QAAA,EAAE,QAAQ,QAA2B,CAAC;IAElD,IAAM,cAAc,GAAG,UAAC,QAAgB;QACtC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,QAAQ,CAAC,CAAC;QACrB,QAAQ,CAAC,QAAQ,CAAC,CAAC;KACpB,CAAC;IAEF,QACEA,IAAC,gBAAgB,IACf,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,KAAK,EACpB,QAAQ,EAAE,cAAc,WACxB,EACF;AACJ,EAAE;AAEF,qBAAqB,CAAC,SAAS,GAAG,kBAAkB,CAAC;IAExC,4BAA4B,GAAG,UAAC,EAIrB;QAHtB,QAAQ,cAAA,EACR,aAAa,mBAAA;IAGP,IAAA,KAAoB,QAAQ,CAAC,aAAa,CAAC,EAA1C,KAAK,QAAA,EAAE,QAAQ,QAA2B,CAAC;IAElD,IAAM,cAAc,GAAG,UAAC,QAAgB;QACtC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,QAAQ,CAAC,CAAC;QACrB,QAAQ,CAAC,QAAQ,CAAC,CAAC;KACpB,CAAC;IAEF,QACEA,IAAC,gBAAgB,IACf,MAAM,EAAE;YACN,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE;YACvC,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE;SAC1C,EACD,aAAa,EAAE,KAAK,EACpB,QAAQ,EAAE,cAAc,WACxB,EACF;AACJ;;;;;"}

package/dist/esm/index-db2e797f.js

@@ -0,0 +1,13 @@
+var images = {
+    aid: 'https://assets.cdn.feather-insurance.com/assets/images/aid.svg',
+    bed: 'https://assets.cdn.feather-insurance.com/assets/images/bed.svg',
+    bigDog: 'https://assets.cdn.feather-insurance.com/assets/images/bigDog.svg',
+    brokenAquarium: 'https://assets.cdn.feather-insurance.com/assets/images/brokenAquarium.svg',
+    brokenGlass: 'https://assets.cdn.feather-insurance.com/assets/images/brokenGlass.svg',
+    damagedLaptop: 'https://assets.cdn.feather-insurance.com/assets/images/damagedLaptop.svg',
+    moneyIncome: 'https://assets.cdn.feather-insurance.com/assets/images/moneyIncome.svg',
+    washingMachine: 'https://assets.cdn.feather-insurance.com/assets/images/washingMachine.svg',
+};
+
+export { images as i };
+//# sourceMappingURL=index-db2e797f.js.map

package/dist/esm/index-db2e797f.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-db2e797f.js","sources":["../../../src/lib/util/images/index.ts"],"sourcesContent":["const images = {\n  aid: 'https://assets.cdn.feather-insurance.com/assets/images/aid.svg',\n  bed: 'https://assets.cdn.feather-insurance.com/assets/images/bed.svg',\n  bigDog: 'https://assets.cdn.feather-insurance.com/assets/images/bigDog.svg',\n  brokenAquarium: 'https://assets.cdn.feather-insurance.com/assets/images/brokenAquarium.svg',\n  brokenGlass: 'https://assets.cdn.feather-insurance.com/assets/images/brokenGlass.svg',\n  damagedLaptop: 'https://assets.cdn.feather-insurance.com/assets/images/damagedLaptop.svg',\n  moneyIncome: 'https://assets.cdn.feather-insurance.com/assets/images/moneyIncome.svg',\n  washingMachine: 'https://assets.cdn.feather-insurance.com/assets/images/washingMachine.svg',\n} as const;\n\nexport { images };"],"names":[],"mappings":"IAAM,MAAM,GAAG;IACb,GAAG,EAAE,gEAAgE;IACrE,GAAG,EAAE,gEAAgE;IACrE,MAAM,EAAE,mEAAmE;IAC3E,cAAc,EAAE,2EAA2E;IAC3F,WAAW,EAAE,wEAAwE;IACrF,aAAa,EAAE,0EAA0E;IACzF,WAAW,EAAE,wEAAwE;IACrF,cAAc,EAAE,2EAA2E;;;;;"}

package/dist/esm/index.d.ts

@@ -1,2 +1,2 @@
-export { DateSelector, SignaturePad, AutocompleteAddress, Input, MultiDropzone, IbanInput, CurrencyInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, Button, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, SegmentedControl, DownloadButton, Markdown, } from './lib';
-export type { DownloadStatus, FileType, MultiDropzoneProps, TableHeader, UploadedFile, UploadStatus } from './lib';
+export { DateSelector, SignaturePad, AutocompleteAddress, Input, MultiDropzone, IbanInput, CurrencyInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, Button, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, SegmentedControl, DownloadButton, Markdown, images } from './lib';
+export type { DownloadStatus, FileType, MultiDropzoneProps, TableHeader, UploadedFile, UploadStatus, } from './lib';

package/dist/esm/index.js

@@ -1,6 +1,6 @@
 export { default as DateSelector } from './components/dateSelector/index.js';
 export { default as SignaturePad } from './components/signaturePad/index.js';
-export { default as AutocompleteAddress } from './components/autocompleteAddress/index.js';
+export { AutocompleteAddress } from './components/autocompleteAddress/index.js';
 export { default as Input } from './components/input/index.js';
 export { default as MultiDropzone } from './components/multiDropzone/index.js';
 export { default as DownloadButton } from './components/downloadButton/index.js';
@@ -18,6 +18,7 @@ export { default as AutoSuggestInput } from './components/input/autoSuggestInput
 export { ComparisonTable } from './components/comparisonTable/index.js';
 export { SegmentedControl } from './components/segmentedControl/index.js';
 export { default as Markdown } from './components/markdown/index.js';
+export { i as images } from './index-db2e797f.js';
 export { default as TableRating } from './components/comparisonTable/components/TableRating/index.js';
 export { default as TableTrueFalse } from './components/comparisonTable/components/TableTrueFalse.js';
 export { default as TableRowHeader } from './components/comparisonTable/components/TableRowHeader/index.js';

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/lib/components/autocompleteAddress/index.d.ts

@@ -1,19 +1,20 @@
 import { Address } from '@popsure/public-models';
-declare const AutoCompleteAddress: ({ apiKey, address: initialAddress, onAddressChange, placeholders, manualAddressEntryTexts, }: {
+export interface AutocompleteAddressProps {
     apiKey: string;
-    address?: Partial<Address> | undefined;
+    address?: Partial<Address>;
     onAddressChange: (address: Partial<Address>) => void;
     placeholders?: {
-        manualAddressEntry?: string | undefined;
-        street?: string | undefined;
-        houseNumber?: string | undefined;
-        additionalInformation?: string | undefined;
-        postcode?: string | undefined;
-        city?: string | undefined;
-    } | undefined;
+        manualAddressEntry?: string;
+        street?: string;
+        houseNumber?: string;
+        additionalInformation?: string;
+        postcode?: string;
+        city?: string;
+    };
     manualAddressEntryTexts?: {
-        preText?: string | undefined;
-        cta?: string | undefined;
-    } | undefined;
-}) => JSX.Element;
-export default AutoCompleteAddress;
+        preText?: string;
+        cta?: string;
+    };
+}
+declare const AutocompleteAddress: ({ apiKey, address: initialAddress, onAddressChange, placeholders, manualAddressEntryTexts, }: AutocompleteAddressProps) => JSX.Element;
+export { AutocompleteAddress };

package/dist/esm/lib/components/autocompleteAddress/index.stories.d.ts

@@ -0,0 +1,66 @@
+import { AutocompleteAddressProps } from '.';
+declare const story: {
+    title: string;
+    component: ({ apiKey, address: initialAddress, onAddressChange, placeholders, manualAddressEntryTexts, }: AutocompleteAddressProps) => JSX.Element;
+    argTypes: {
+        address: {
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        apiKey: {
+            defaultValue: string;
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        onAddressChange: {
+            description: string;
+            action: boolean;
+            table: {
+                category: string;
+            };
+        };
+        manualAddressEntryTexts: {
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        placeholders: {
+            description: string;
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+    };
+    parameters: {
+        componentSubtitle: string;
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+        customTypes: {
+            Address: string;
+        };
+    };
+};
+export declare const AutocompleteAddressStory: {
+    ({ address: defaultAddress, apiKey, manualAddressEntryTexts, onAddressChange, placeholders, }: AutocompleteAddressProps): JSX.Element;
+    storyName: string;
+};
+export declare const WithAddress: ({ apiKey, onAddressChange, placeholders, }: AutocompleteAddressProps) => JSX.Element;
+export declare const WithLocalisationEntryText: ({ apiKey, onAddressChange, }: AutocompleteAddressProps) => JSX.Element;
+export declare const WithLocalisationPlaceholders: ({ apiKey, onAddressChange, }: AutocompleteAddressProps) => JSX.Element;
+export default story;

package/dist/esm/lib/components/segmentedControl/index.stories.d.ts

@@ -26,11 +26,7 @@ declare const story: {
         selectedIndex: number;
     };
     parameters: {
-        docs: {
-            description: {
-                component: string;
-            };
-        };
+        componentSubtitle: string;
     };
 };
 export declare const SegmentedControlStory: {

package/dist/esm/lib/index.d.ts

@@ -1,6 +1,6 @@
 import DateSelector from './components/dateSelector';
 import SignaturePad from './components/signaturePad';
-import AutocompleteAddress from './components/autocompleteAddress';
+import { AutocompleteAddress } from './components/autocompleteAddress';
 import Input from './components/input';
 import MultiDropzone, { FileType, MultiDropzoneProps, UploadedFile, UploadStatus } from './components/multiDropzone';
 import DownloadButton from './components/downloadButton';
@@ -15,6 +15,7 @@ import AutoSuggestInput from './components/input/autoSuggestInput';
 import { ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, TableHeader } from './components/comparisonTable';
 import { SegmentedControl } from './components/segmentedControl';
 import Markdown from './components/markdown';
-export { DateSelector, SignaturePad, AutocompleteAddress, Input, MultiDropzone, DownloadButton, IbanInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, Button, CurrencyInput, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, SegmentedControl, Markdown, };
+import { images } from './util/images';
+export { DateSelector, SignaturePad, AutocompleteAddress, Input, MultiDropzone, DownloadButton, IbanInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, Button, CurrencyInput, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, SegmentedControl, Markdown, images, };
 export type { FileType, MultiDropzoneProps, TableHeader, UploadedFile, UploadStatus };
 export type { DownloadStatus } from './models/download';

package/dist/esm/lib/util/images/index.d.ts

@@ -0,0 +1,11 @@
+declare const images: {
+    readonly aid: "https://assets.cdn.feather-insurance.com/assets/images/aid.svg";
+    readonly bed: "https://assets.cdn.feather-insurance.com/assets/images/bed.svg";
+    readonly bigDog: "https://assets.cdn.feather-insurance.com/assets/images/bigDog.svg";
+    readonly brokenAquarium: "https://assets.cdn.feather-insurance.com/assets/images/brokenAquarium.svg";
+    readonly brokenGlass: "https://assets.cdn.feather-insurance.com/assets/images/brokenGlass.svg";
+    readonly damagedLaptop: "https://assets.cdn.feather-insurance.com/assets/images/damagedLaptop.svg";
+    readonly moneyIncome: "https://assets.cdn.feather-insurance.com/assets/images/moneyIncome.svg";
+    readonly washingMachine: "https://assets.cdn.feather-insurance.com/assets/images/washingMachine.svg";
+};
+export { images };

package/dist/esm/lib/util/images/index.stories.d.ts

@@ -0,0 +1,12 @@
+declare const story: {
+    title: string;
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export declare const Images: () => JSX.Element;
+export default story;

package/dist/esm/util/images/index.stories.js

@@ -0,0 +1,23 @@
+import { _ as __assign } from '../../tslib.es6-5bc94358.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { i as images } from '../../index-db2e797f.js';
+
+var story = {
+    title: 'Utils/Images',
+    parameters: {
+        docs: {
+            description: {
+                component: 'Use the `images` object export to access our list of available images.',
+            },
+        },
+    }
+};
+var Images = function () { return (jsx("div", __assign({ className: 'd-flex gap8 f-wrap' }, { children: Object.entries(images).map(function (_a) {
+        var key = _a[0], value = _a[1];
+        return (jsxs("div", __assign({ className: "ws3 d-flex fd-column ai-center br4 p24 pt16 pb16 bg-grey-100" }, { children: [jsx("span", __assign({ className: 'p-p--small mb8' }, { children: key }), void 0),
+                jsx("img", { alt: key, src: value }, void 0)] }), key));
+    }) }), void 0)); };
+
+export default story;
+export { Images };
+//# sourceMappingURL=index.stories.js.map

package/dist/esm/util/images/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/util/images/index.stories.tsx"],"sourcesContent":["import { images } from \"../../util/images\";\n\nconst story = {\n  title: 'Utils/Images',\n  parameters: {\n    docs: {\n      description: {\n        component: 'Use the `images` object export to access our list of available images.',\n      },\n    },\n  }\n};\n\n\nexport const Images = () => (\n  <div className='d-flex gap8 f-wrap'>\n    {Object.entries(images).map(([key, value]) => (\n      <div key={key} className=\"ws3 d-flex fd-column ai-center br4 p24 pt16 pb16 bg-grey-100\">\n        <span className='p-p--small mb8'>{key}</span>\n        \n        <img alt={key} src={value} />\n      </div>\n    ))}\n  </div>\n);\n\nexport default story;\n"],"names":["_jsx","_jsxs"],"mappings":";;;;IAEM,KAAK,GAAG;IACZ,KAAK,EAAE,cAAc;IACrB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE,wEAAwE;aACpF;SACF;KACF;EACD;IAGW,MAAM,GAAG,cAAM,QAC1BA,sBAAK,SAAS,EAAC,oBAAoB,gBAChC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,UAAC,EAAY;YAAX,GAAG,QAAA,EAAE,KAAK,QAAA;QAAM,QAC5CC,uBAAe,SAAS,EAAC,8DAA8D,iBACrFD,uBAAM,SAAS,EAAC,gBAAgB,gBAAE,GAAG,YAAQ;gBAE7CA,aAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,WAAI,MAHrB,GAAG,CAIP;KACP,CAAC,YACE;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@popsure/dirty-swan",
-  "version": "0.31.1",
+  "version": "0.32.0",
   "author": "Vincent Audoire <vincent@getpopsure.com>",
   "license": "MIT",
   "private": false,

package/src/index.tsx

@@ -30,6 +30,7 @@ export {
   SegmentedControl,
   DownloadButton,
   Markdown,
+  images
 } from './lib';
 
 export type {
@@ -38,7 +39,7 @@ export type {
   MultiDropzoneProps,
   TableHeader,
   UploadedFile,
-  UploadStatus
+  UploadStatus,
  } from './lib';
 
 ReactDOM.render(<App />, document.getElementById('root'));