@supersoniks/concorde 4.2.0 → 4.3.0

package/src/tsconfig-model.json

@@ -1,5 +1,5 @@
 {
-  "exclude": ["node_modules/**/*", "dist/**/*", "vite.config.mts", "docs.ts", "docs/*", "router-test.html"],
+  "exclude": ["node_modules/**/*", "dist/**/*", "vite.config.mts", "docs.ts", "docs/*", "router-test.html", "**/*.type-test.ts"],
   "compilerOptions": {
     "target": "es2021",
     "experimentalDecorators": true,

package/src/tsconfig.json

@@ -5,7 +5,8 @@
     "vite.config.mts",
     "docs.ts",
     "docs/*",
-    "router-test.html"
+    "router-test.html",
+    "**/*.type-test.ts"
   ],
   "compilerOptions": {
     "target": "es2021",
@@ -14,6 +15,12 @@
     "module": "esnext",
     "moduleResolution": "bundler",
     "paths": {
+      "./_types/endpoint": [
+        "/sites/concorde/src/core/_types/endpoint.ts"
+      ],
+      "./_types/key": [
+        "/sites/concorde/src/core/_types/key.ts"
+      ],
       "./_types/types": [
         "/sites/concorde/src/core/_types/types.ts"
       ],
@@ -605,15 +612,6 @@
       "./ui/modal/modal-title": [
         "/sites/concorde/src/core/components/ui/modal/modal-title.ts"
       ],
-      "./modal.stories": [
-        "/sites/concorde/src/core/components/ui/modal/modal.stories.ts"
-      ],
-      "./ui/modal.stories": [
-        "/sites/concorde/src/core/components/ui/modal/modal.stories.ts"
-      ],
-      "./ui/modal/modal.stories": [
-        "/sites/concorde/src/core/components/ui/modal/modal.stories.ts"
-      ],
       "./modal": [
         "/sites/concorde/src/core/components/ui/modal/modal.ts"
       ],
@@ -776,6 +774,12 @@
       "./decorators/Subscriber": [
         "/sites/concorde/src/core/decorators/Subscriber.ts"
       ],
+      "./decorators/api.spec": [
+        "/sites/concorde/src/core/decorators/api.spec.ts"
+      ],
+      "./decorators/api": [
+        "/sites/concorde/src/core/decorators/api.ts"
+      ],
       "./decorators/lifecycle": [
         "/sites/concorde/src/core/decorators/lifecycle.ts"
       ],
@@ -794,9 +798,33 @@
       "./decorators/subscriber/common": [
         "/sites/concorde/src/core/decorators/subscriber/common.ts"
       ],
+      "./decorators/subscriber/dynamicPath": [
+        "/sites/concorde/src/core/decorators/subscriber/dynamicPath.ts"
+      ],
+      "./decorators/subscriber/dynamicPropertyWatch": [
+        "/sites/concorde/src/core/decorators/subscriber/dynamicPropertyWatch.ts"
+      ],
       "./decorators/subscriber/onAssign": [
         "/sites/concorde/src/core/decorators/subscriber/onAssign.ts"
       ],
+      "./decorators/subscriber/publish.spec": [
+        "/sites/concorde/src/core/decorators/subscriber/publish.spec.ts"
+      ],
+      "./decorators/subscriber/publish": [
+        "/sites/concorde/src/core/decorators/subscriber/publish.ts"
+      ],
+      "./decorators/subscriber/publisherPath": [
+        "/sites/concorde/src/core/decorators/subscriber/publisherPath.ts"
+      ],
+      "./decorators/subscriber/subscribe.spec": [
+        "/sites/concorde/src/core/decorators/subscriber/subscribe.spec.ts"
+      ],
+      "./decorators/subscriber/subscribe": [
+        "/sites/concorde/src/core/decorators/subscriber/subscribe.ts"
+      ],
+      "./decorators/subscriber/subscribe.type-test": [
+        "/sites/concorde/src/core/decorators/subscriber/subscribe.type-test.ts"
+      ],
       "./directives/DataProvider": [
         "/sites/concorde/src/core/directives/DataProvider.ts"
       ],
@@ -857,6 +885,18 @@
       "./utils/api": [
         "/sites/concorde/src/core/utils/api.ts"
       ],
+      "./utils/dataProviderKey.spec": [
+        "/sites/concorde/src/core/utils/dataProviderKey.spec.ts"
+      ],
+      "./utils/dataProviderKey": [
+        "/sites/concorde/src/core/utils/dataProviderKey.ts"
+      ],
+      "./utils/endpoint.spec": [
+        "/sites/concorde/src/core/utils/endpoint.spec.ts"
+      ],
+      "./utils/endpoint": [
+        "/sites/concorde/src/core/utils/endpoint.ts"
+      ],
       "./utils/route.spec": [
         "/sites/concorde/src/core/utils/route.spec.ts"
       ],
@@ -872,6 +912,18 @@
       "./docs": [
         "/sites/concorde/src/docs/docs.ts"
       ],
+      "./example/decorators-demo-bind-demos": [
+        "/sites/concorde/src/docs/example/decorators-demo-bind-demos.ts"
+      ],
+      "./example/decorators-demo-geo": [
+        "/sites/concorde/src/docs/example/decorators-demo-geo.ts"
+      ],
+      "./example/decorators-demo-init": [
+        "/sites/concorde/src/docs/example/decorators-demo-init.ts"
+      ],
+      "./example/decorators-demo-subscribe-publish-get-demos": [
+        "/sites/concorde/src/docs/example/decorators-demo-subscribe-publish-get-demos.ts"
+      ],
       "./example/decorators-demo": [
         "/sites/concorde/src/docs/example/decorators-demo.ts"
       ],
@@ -911,6 +963,9 @@
       "./TestUtils": [
         "/sites/concorde/src/test-utils/TestUtils.ts"
       ],
+      "@supersoniks/concorde/dataProviderKey": [
+        "/sites/concorde/src/core/utils/dataProviderKey.ts"
+      ],
       "@supersoniks/concorde/*": [
         "./*"
       ],

package/src/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"root":["./components.ts","./concorde-loaded.ts","./dataprovider.ts","./decorators.ts","./directives.ts","./index.ts","./mixins.ts","./utils.ts","./core/core.ts","./core/_types/types.ts","./core/components/functional/functional.ts","./core/components/functional/date/date.ts","./core/components/functional/example/example.ts","./core/components/functional/fetch/fetch.ts","./core/components/functional/if/if.test.ts","./core/components/functional/if/if.ts","./core/components/functional/list/list.demo.ts","./core/components/functional/list/list.spec.ts","./core/components/functional/list/list.ts","./core/components/functional/mix/mix.ts","./core/components/functional/queue/queue.demo.ts","./core/components/functional/queue/queue.ts","./core/components/functional/router/redirect.ts","./core/components/functional/router/router.demo.ts","./core/components/functional/router/router.spec.ts","./core/components/functional/router/router.ts","./core/components/functional/sdui/SDUIDescriptorTransformer.ts","./core/components/functional/sdui/sdui-utils.ts","./core/components/functional/sdui/sdui.ts","./core/components/functional/sdui/types.ts","./core/components/functional/sonic-scope/sonic-scope.ts","./core/components/functional/states/states.demo.ts","./core/components/functional/states/states.spec.ts","./core/components/functional/states/states.ts","./core/components/functional/submit/submit.ts","./core/components/functional/subscriber/subscriber.ts","./core/components/functional/translation/translation.ts","./core/components/functional/value/value.ts","./core/components/ui/ui.ts","./core/components/ui/_css/scroll.ts","./core/components/ui/_css/shadow.ts","./core/components/ui/_css/size.ts","./core/components/ui/_css/type.ts","./core/components/ui/alert/alert.ts","./core/components/ui/alert-messages/alert-messages.ts","./core/components/ui/badge/badge.ts","./core/components/ui/button/button.ts","./core/components/ui/captcha/altchaStyles.ts","./core/components/ui/captcha/captcha.ts","./core/components/ui/card/card-footer.ts","./core/components/ui/card/card-header-descripton.ts","./core/components/ui/card/card-header.ts","./core/components/ui/card/card-main.ts","./core/components/ui/card/card.ts","./core/components/ui/divider/divider.ts","./core/components/ui/form/checkbox/checkbox.ts","./core/components/ui/form/css/form-control.ts","./core/components/ui/form/fieldset/fieldset.ts","./core/components/ui/form/fieldset/legend-description.ts","./core/components/ui/form/fieldset/legend.ts","./core/components/ui/form/form-actions/form-actions.ts","./core/components/ui/form/form-layout/form-layout.ts","./core/components/ui/form/input/input.ts","./core/components/ui/form/input/password-helper.ts","./core/components/ui/form/input/same-value-helper.ts","./core/components/ui/form/input-autocomplete/input-autocomplete.ts","./core/components/ui/form/radio/radio.ts","./core/components/ui/form/select/select.ts","./core/components/ui/form/switch/switch.ts","./core/components/ui/form/textarea/textarea.ts","./core/components/ui/group/group.ts","./core/components/ui/icon/icon.stories.ts","./core/components/ui/icon/icon.ts","./core/components/ui/icon/icons.ts","./core/components/ui/image/image.ts","./core/components/ui/link/link.ts","./core/components/ui/loader/loader.stories.ts","./core/components/ui/loader/loader.ts","./core/components/ui/loader/styles/fixed.ts","./core/components/ui/loader/styles/inline.ts","./core/components/ui/menu/menu-item.ts","./core/components/ui/menu/menu.ts","./core/components/ui/modal/modal-actions.ts","./core/components/ui/modal/modal-close.ts","./core/components/ui/modal/modal-content.ts","./core/components/ui/modal/modal-subtitle.ts","./core/components/ui/modal/modal-title.ts","./core/components/ui/modal/modal.stories.ts","./core/components/ui/modal/modal.ts","./core/components/ui/pop/pop.ts","./core/components/ui/progress/progress.ts","./core/components/ui/table/table-caption.ts","./core/components/ui/table/table-tbody.ts","./core/components/ui/table/table-td.ts","./core/components/ui/table/table-tfoot.ts","./core/components/ui/table/table-th.ts","./core/components/ui/table/table-thead.ts","./core/components/ui/table/table-tr.ts","./core/components/ui/table/table.ts","./core/components/ui/theme/theme.ts","./core/components/ui/theme/theme-collection/core-variables.ts","./core/components/ui/theme/theme-collection/dark.ts","./core/components/ui/theme/theme-collection/light.ts","./core/components/ui/toast/message-subscriber.ts","./core/components/ui/toast/toast-item.ts","./core/components/ui/toast/toast.ts","./core/components/ui/toast/types.ts","./core/components/ui/tooltip/tooltip.ts","./core/decorators/Subscriber.ts","./core/decorators/lifecycle.ts","./core/decorators/subscriber/ancestorAttribute.ts","./core/decorators/subscriber/autoFill.ts","./core/decorators/subscriber/autoSubscribe.ts","./core/decorators/subscriber/bind.ts","./core/decorators/subscriber/common.ts","./core/decorators/subscriber/onAssign.ts","./core/directives/DataProvider.ts","./core/directives/Wording.ts","./core/mixins/Fetcher.ts","./core/mixins/FormCheckable.ts","./core/mixins/FormElement.ts","./core/mixins/FormInput.ts","./core/mixins/Subscriber.ts","./core/mixins/TemplatesContainer.ts","./core/mixins/mixins.ts","./core/utils/Arrays.ts","./core/utils/DataBindObserver.ts","./core/utils/Electron.ts","./core/utils/Format.ts","./core/utils/HTML.ts","./core/utils/LocationHandler.ts","./core/utils/Objects.ts","./core/utils/PublisherProxy.ts","./core/utils/Utils.ts","./core/utils/aesCrypto.ts","./core/utils/api.ts","./core/utils/route.spec.ts","./core/utils/route.ts","./core/utils/url-pattern.ts","./test-utils/TestUtils.ts"],"version":"5.9.2"}
+{"root":["./components.ts","./concorde-loaded.ts","./dataprovider.ts","./decorators.ts","./directives.ts","./index.ts","./mixins.ts","./utils.ts","./core/core.ts","./core/_types/endpoint.ts","./core/_types/key.ts","./core/_types/types.ts","./core/components/functional/functional.ts","./core/components/functional/date/date.ts","./core/components/functional/example/example.ts","./core/components/functional/fetch/fetch.ts","./core/components/functional/if/if.test.ts","./core/components/functional/if/if.ts","./core/components/functional/list/list.demo.ts","./core/components/functional/list/list.spec.ts","./core/components/functional/list/list.ts","./core/components/functional/mix/mix.ts","./core/components/functional/queue/queue.demo.ts","./core/components/functional/queue/queue.ts","./core/components/functional/router/redirect.ts","./core/components/functional/router/router.demo.ts","./core/components/functional/router/router.spec.ts","./core/components/functional/router/router.ts","./core/components/functional/sdui/SDUIDescriptorTransformer.ts","./core/components/functional/sdui/sdui-utils.ts","./core/components/functional/sdui/sdui.ts","./core/components/functional/sdui/types.ts","./core/components/functional/sonic-scope/sonic-scope.ts","./core/components/functional/states/states.demo.ts","./core/components/functional/states/states.spec.ts","./core/components/functional/states/states.ts","./core/components/functional/submit/submit.ts","./core/components/functional/subscriber/subscriber.ts","./core/components/functional/translation/translation.ts","./core/components/functional/value/value.ts","./core/components/ui/ui.ts","./core/components/ui/_css/scroll.ts","./core/components/ui/_css/shadow.ts","./core/components/ui/_css/size.ts","./core/components/ui/_css/type.ts","./core/components/ui/alert/alert.ts","./core/components/ui/alert-messages/alert-messages.ts","./core/components/ui/badge/badge.ts","./core/components/ui/button/button.ts","./core/components/ui/captcha/altchaStyles.ts","./core/components/ui/captcha/captcha.ts","./core/components/ui/card/card-footer.ts","./core/components/ui/card/card-header-descripton.ts","./core/components/ui/card/card-header.ts","./core/components/ui/card/card-main.ts","./core/components/ui/card/card.ts","./core/components/ui/divider/divider.ts","./core/components/ui/form/checkbox/checkbox.ts","./core/components/ui/form/css/form-control.ts","./core/components/ui/form/fieldset/fieldset.ts","./core/components/ui/form/fieldset/legend-description.ts","./core/components/ui/form/fieldset/legend.ts","./core/components/ui/form/form-actions/form-actions.ts","./core/components/ui/form/form-layout/form-layout.ts","./core/components/ui/form/input/input.ts","./core/components/ui/form/input/password-helper.ts","./core/components/ui/form/input/same-value-helper.ts","./core/components/ui/form/input-autocomplete/input-autocomplete.ts","./core/components/ui/form/radio/radio.ts","./core/components/ui/form/select/select.ts","./core/components/ui/form/switch/switch.ts","./core/components/ui/form/textarea/textarea.ts","./core/components/ui/group/group.ts","./core/components/ui/icon/icon.stories.ts","./core/components/ui/icon/icon.ts","./core/components/ui/icon/icons.ts","./core/components/ui/image/image.ts","./core/components/ui/link/link.ts","./core/components/ui/loader/loader.stories.ts","./core/components/ui/loader/loader.ts","./core/components/ui/loader/styles/fixed.ts","./core/components/ui/loader/styles/inline.ts","./core/components/ui/menu/menu-item.ts","./core/components/ui/menu/menu.ts","./core/components/ui/modal/modal-actions.ts","./core/components/ui/modal/modal-close.ts","./core/components/ui/modal/modal-content.ts","./core/components/ui/modal/modal-subtitle.ts","./core/components/ui/modal/modal-title.ts","./core/components/ui/modal/modal.ts","./core/components/ui/pop/pop.ts","./core/components/ui/progress/progress.ts","./core/components/ui/table/table-caption.ts","./core/components/ui/table/table-tbody.ts","./core/components/ui/table/table-td.ts","./core/components/ui/table/table-tfoot.ts","./core/components/ui/table/table-th.ts","./core/components/ui/table/table-thead.ts","./core/components/ui/table/table-tr.ts","./core/components/ui/table/table.ts","./core/components/ui/theme/theme.ts","./core/components/ui/theme/theme-collection/core-variables.ts","./core/components/ui/theme/theme-collection/dark.ts","./core/components/ui/theme/theme-collection/light.ts","./core/components/ui/toast/message-subscriber.ts","./core/components/ui/toast/toast-item.ts","./core/components/ui/toast/toast.ts","./core/components/ui/toast/types.ts","./core/components/ui/tooltip/tooltip.ts","./core/decorators/Subscriber.ts","./core/decorators/api.spec.ts","./core/decorators/api.ts","./core/decorators/lifecycle.ts","./core/decorators/subscriber/ancestorAttribute.ts","./core/decorators/subscriber/autoFill.ts","./core/decorators/subscriber/autoSubscribe.ts","./core/decorators/subscriber/bind.ts","./core/decorators/subscriber/common.ts","./core/decorators/subscriber/dynamicPath.ts","./core/decorators/subscriber/dynamicPropertyWatch.ts","./core/decorators/subscriber/onAssign.ts","./core/decorators/subscriber/publish.spec.ts","./core/decorators/subscriber/publish.ts","./core/decorators/subscriber/publisherPath.ts","./core/decorators/subscriber/subscribe.spec.ts","./core/decorators/subscriber/subscribe.ts","./core/directives/DataProvider.ts","./core/directives/Wording.ts","./core/mixins/Fetcher.ts","./core/mixins/FormCheckable.ts","./core/mixins/FormElement.ts","./core/mixins/FormInput.ts","./core/mixins/Subscriber.ts","./core/mixins/TemplatesContainer.ts","./core/mixins/mixins.ts","./core/utils/Arrays.ts","./core/utils/DataBindObserver.ts","./core/utils/Electron.ts","./core/utils/Format.ts","./core/utils/HTML.ts","./core/utils/LocationHandler.ts","./core/utils/Objects.ts","./core/utils/PublisherProxy.ts","./core/utils/Utils.ts","./core/utils/aesCrypto.ts","./core/utils/api.ts","./core/utils/dataProviderKey.spec.ts","./core/utils/dataProviderKey.ts","./core/utils/endpoint.spec.ts","./core/utils/endpoint.ts","./core/utils/route.spec.ts","./core/utils/route.ts","./core/utils/url-pattern.ts","./test-utils/TestUtils.ts"],"version":"5.9.2"}

package/src/utils.ts

@@ -21,7 +21,12 @@ export const api = myApi.default;
 import * as myURLPattern from "@supersoniks/concorde/core/utils/url-pattern";
 export const URLPattern = myURLPattern.default;
 
-import {ConcordeWindow} from "./core/_types/types";
+import { Endpoint } from "./core/utils/endpoint";
+import { DataProviderKey } from "./core/utils/dataProviderKey";
+export { Endpoint, DataProviderKey };
+
+import { ConcordeWindow } from "./core/_types/types";
+
 declare const window: ConcordeWindow;
 
 window["concorde-utils"] = window["concorde-utils"] || {};
@@ -36,4 +41,6 @@ window["concorde-utils"] = {
   PublisherManager: PublisherManager,
   api: api,
   URLPattern: URLPattern,
+  Endpoint: Endpoint,
+  DataProviderKey: DataProviderKey,
 };

package/vite.config.mts

@@ -79,6 +79,17 @@ export default defineConfig({
   },
   resolve: {
     alias: [
+      {
+        find: "@supersoniks/concorde/dataProviderKey",
+        replacement: path.resolve(
+          __dirname,
+          "src/core/utils/dataProviderKey.ts",
+        ),
+      },
+      {
+        find: "@supersoniks/concorde/endpoint",
+        replacement: path.resolve(__dirname, "src/core/utils/endpoint.ts"),
+      },
       {
         find: "@supersoniks/concorde",
         replacement: path.resolve(__dirname, "src"),

package/src/core/components/ui/modal/modal.stories.ts

@@ -1,140 +0,0 @@
-import "./modal";
-import "./modal-actions";
-import "./modal-close";
-import "./modal-content";
-import "./modal-subtitle";
-import "./modal-title";
-import "../button/button";
-import { html } from "lit";
-
-// More on default export: https://storybook.js.org/docs/web-components/writing-stories/introduction#default-export
-export default {
-  component: "sonic-modal",
-  title: "core/components/ui/Modal",
-  argTypes: {
-    styles: { table: { category: "Internals or others" } },
-  },
-};
-
-const Template: any = ({}: any) => {
-  return html`
-    <sonic-button
-      onclick="
-       document.getElementById('modalExample').show()
-      "
-    >
-      Simple modal
-    </sonic-button>
-
-    <sonic-modal id="modalExample">
-      <sonic-modal-close></sonic-modal-close>
-      <sonic-modal-title
-        >Lorem ipsum dolor sit amet <sonic-badge type="danger" size="sm">+33</sonic-badge></sonic-modal-title
-      >
-      <sonic-modal-subtitle>Donec sed vestibulum augue.</sonic-modal-subtitle>
-      <sonic-modal-content>
-        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eget quam eu mi luctus faucibus.
-      </sonic-modal-content>
-      <sonic-modal-actions formDataProvider="youpla">
-        <sonic-button FormCheckable hideModal="false" minWidth="8rem" value="true" name="click">
-          Click don't close
-        </sonic-button>
-        <sonic-button minWidth="8rem" type="success">Confirmer</sonic-button>
-      </sonic-modal-actions>
-    </sonic-modal>
-  `;
-};
-
-export const Example = Template.bind({});
-
-const modalLongSize: any = () => {
-  return html`
-    <sonic-button onclick="document.getElementById('modalText').show()"> Long text </sonic-button>
-    <sonic-modal align="left" id="modalText">
-      <sonic-modal-close></sonic-modal-close>
-      <sonic-modal-title>Infos et tarifs </sonic-modal-title>
-      <sonic-modal-content>
-        <div class="prose">
-          <p>
-            <strong>Horaires d’ouverture </strong><br />
-            Du mercredi au samedi de 13h30 à 19h et le dimanche de 13h30 à 18h<br />
-            + horaires spécifiques pour événements ou festivals&nbsp;
-          </p>
-          <p>
-            <strong> Billetterie&nbsp;<br /></strong>
-            La participation à certains événements et activités est soumise à un système de billetterie avec achats ou
-            réservations disponibles en ligne ou au guichet.&nbsp;&nbsp;<strong><br /></strong>
-          </p>
-          <p>
-            Les tarifs (Tarif plein / Tarif Réduit / Tarif Spécifique) sont indiqués pour chaque événement et peuvent
-            varier selon la nature de l’événement. Les tarifs sont identiques en ligne et au guichet. Il est néanmoins
-            conseillé de réserver les billets en avance pour s’assurer une place.
-          </p>
-          <p>
-            L’accès au Skatepark, Fablab et Halle C sont soumis à adhésions. Les adhésions sont gratuites et
-            nominatives. Elle donnent accès aux espaces dans la limite des places disponibles.
-          </p>
-          <p>
-            <strong>+ d’infos <br /></strong>billetterie@laconditionpublique.com <br />+33 (0)328334833&nbsp;
-          </p>
-          <br />
-          <p>
-            <strong>Accès <br /></strong>14, place Faidherbe <br />59100 Roubaix <br />Métro / Tram : Arrêt
-            Eurotéléport, Ligne 2 <br />Bus / V’Lille : Arrêt Condition Publique&nbsp;
-          </p>
-          <p>
-            Accès handicapés : nous contacter avant votre venue au 03 28 33 48 33 ou par mail
-            billetterie@laconditionpublique.com
-          </p>
-        </div>
-      </sonic-modal-content>
-    </sonic-modal>
-  `;
-};
-export const LongTextScrollable = modalLongSize.bind({});
-
-const modalForceAction: any = () => {
-  return html`
-    <sonic-button onclick="document.getElementById('force').show()"> Action obligatoire </sonic-button>
-    <sonic-modal .hideOnOverlayClick=${false} .hideOnEscape=${false} id="force">
-      <sonic-modal-title>Voulez-vous accepter les cookies ? </sonic-modal-title>
-      <sonic-modal-content>
-        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eget quam eu mi luctus faucibus.
-      </sonic-modal-content>
-      <sonic-modal-actions formDataProvider="youpla">
-        <sonic-button> Nope </sonic-button>
-        <sonic-button minWidth="8rem" type="success">Carrément</sonic-button>
-      </sonic-modal-actions>
-    </sonic-modal>
-  `;
-};
-export const ForceAction = modalForceAction.bind({});
-
-const customWidthModal: any = () => {
-  return html`
-    <sonic-button onclick="document.getElementById('CustomWidth').show()"> Custom width </sonic-button>
-    <sonic-modal maxHeight="50vh" maxWidth="90vw" width="100%" height="100%" id="CustomWidth">
-      <sonic-modal-close></sonic-modal-close>
-      <sonic-image
-        cover
-        objectPosition="center 20%"
-        src="https://thegoodlife.thegoodhub.com/wp-content/uploads/sites/2/2022/03/compagnies-aeriennes-nostalgie-coeur-insert-03-dr.jpg"
-      ></sonic-image>
-    </sonic-modal>
-  `;
-};
-export const customWidth = customWidthModal.bind({});
-
-const modalFullscreen: any = () => {
-  return html`
-    <sonic-button onclick="document.getElementById('Fullscreen').show()"> Fullscreen </sonic-button>
-    <sonic-modal fullscreen id="Fullscreen">
-      <sonic-modal-close></sonic-modal-close>
-      <sonic-image
-        cover
-        src="https://thegoodlife.thegoodhub.com/wp-content/uploads/sites/2/2022/03/compagnies-aeriennes-nostalgie-coeur-insert-03-dr.jpg"
-      ></sonic-image>
-    </sonic-modal>
-  `;
-};
-export const Fullscreen = modalFullscreen.bind({});