@streamscloud/embeddable 2.1.1 → 2.1.2

package/dist/short-videos/short-video-viewer/cmp.short-video-heading.svelte

@@ -0,0 +1,86 @@
+<script lang="ts">import { ImageRound } from '../../ui/image';
+import { TimeAgo } from '../../ui/time-ago';
+import { ShortVideoViewerLocalization } from './short-video-viewer-localization.svelte';
+let { model, localization: localizationInit } = $props();
+const localization = $derived(new ShortVideoViewerLocalization(localizationInit));
+</script>
+
+<div class="short-video-heading">
+  <div class="short-video-heading__source-image">
+    <ImageRound src={model.image} alt={`${model.name} profilbilde`} noBorders={true} />
+  </div>
+
+  <div class="short-video-heading__info">
+    <div class="short-video-heading__source-name">{model.name}</div>
+    <p class="short-video-heading__metadata">
+      <TimeAgo date={model.displayDate} localization={localization.timeAgoLocalization} />
+      {#if Number.isInteger(model.viewsCount)}
+        <span>&middot;</span>
+        {localization.viewsCount(model.viewsCount)}
+      {/if}
+    </p>
+  </div>
+</div>
+
+<style>@keyframes fadeIn {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.4;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+.short-video-heading {
+  --_short-video-heading--container--font-size: var(--short-video-heading--container--font-size, 1em);
+  --_short-video-heading--text--color: var(--short-video-heading--text--color, #374151);
+  --_short-video-heading--meta--color: var(--short-video-heading--meta--color, #6b7280);
+  --_short-video-heading--padding: var(--short-video-heading--padding, 0);
+  display: flex;
+  align-items: center;
+  padding: var(--_short-video-heading--padding);
+  min-width: 0;
+  font-size: var(--_short-video-heading--container--font-size);
+}
+.short-video-heading__source-image {
+  width: 2em;
+  min-width: 2em;
+  max-width: 2em;
+  height: 2em;
+  min-height: 2em;
+  max-height: 2em;
+  margin-right: 0.625em;
+  --image--rounded--outer--border-radius: 0.5em;
+  --image--rounded--inner--border-width: 0;
+  --rounded-img-background: none;
+}
+.short-video-heading__info {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+.short-video-heading__source-name {
+  font-size: 0.75em;
+  line-height: 1.25em;
+  font-weight: 500;
+  color: var(--_short-video-heading--text--color);
+  text-overflow: ellipsis;
+  width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+}
+:global([data-theme="dark"]) .short-video-heading__source-name {
+  --_short-video-heading--text--color: var(--short-video-heading--text--color, #ffffff);
+}
+.short-video-heading__metadata {
+  margin: 0;
+  font-size: 0.625em;
+  line-height: 1.2em;
+  font-weight: 400;
+  color: var(--_short-video-heading--meta--color);
+}
+:global([data-theme="dark"]) .short-video-heading__metadata {
+  --_short-video-heading--meta--color: var(--short-video-heading--meta--color, #d1d5db);
+}</style>

package/dist/short-videos/short-video-viewer/cmp.short-video-heading.svelte.d.ts

@@ -0,0 +1,9 @@
+import { type IShortVideoViewerLocalization } from './short-video-viewer-localization.svelte';
+import type { ShortVideoViewerHeadingModel } from './types';
+type Props = {
+    model: ShortVideoViewerHeadingModel;
+    localization: IShortVideoViewerLocalization;
+};
+declare const Cmp: import("svelte").Component<Props, {}, "">;
+type Cmp = ReturnType<typeof Cmp>;
+export default Cmp;

package/dist/short-videos/short-video-viewer/cmp.short-video-viewer.svelte

@@ -0,0 +1,133 @@
+<script lang="ts">import { Image } from '../../ui/image';
+import { Video } from '../../ui/video';
+import { default as AttachmentsInline } from './cmp.attachments-inline.svelte';
+import { default as ShortVideoDescription } from './description.svelte';
+import { ShortVideoViewerLocalization } from './short-video-viewer-localization.svelte';
+import { ShortVideoViewerUiManager } from './ui-manager.svelte';
+let { model, availableSideSpace = 0, showAttachments = true, autoplay = 'on-appearance', localization: localizationInit, on } = $props();
+const localization = $derived(new ShortVideoViewerLocalization(localizationInit));
+let actionsPanelRef = $state.raw(null);
+const uiManager = new ShortVideoViewerUiManager();
+$effect(() => {
+    if (actionsPanelRef) {
+        const resizeObserver = new ResizeObserver(() => {
+            if (actionsPanelRef) {
+                uiManager.updateActionsPanelWidth(actionsPanelRef.clientWidth);
+            }
+        });
+        resizeObserver.observe(actionsPanelRef);
+        return () => {
+            resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();
+        };
+    }
+});
+$effect(() => {
+    uiManager.updateAvailableSideSpace(availableSideSpace);
+});
+$effect(() => {
+    uiManager.updateCanShowAttachments(showAttachments);
+});
+</script>
+
+<div class="short-video-viewer" style={uiManager.globalCssVariables}>
+  <div class="short-video-viewer__media">
+    {#if !model.media.isImage}
+      <Video controls={false} autoplay={autoplay} src={model.media.url} loop={true} poster={model.media.thumbnailUrl} id={model.id} on={on} />
+    {:else}
+      <Image src={model.media.url} />
+    {/if}
+  </div>
+
+  <div
+    class="short-video-viewer__actions-panel"
+    class:short-video-viewer__actions-panel--inside-frame={uiManager.showActionsInsideFrame}
+    bind:this={actionsPanelRef}>
+    {#if uiManager.showAttachments}
+      <AttachmentsInline model={model} />
+    {/if}
+  </div>
+  <div class="short-video-viewer__description">
+    <ShortVideoDescription model={model} localization={localization} />
+  </div>
+</div>
+
+<style>@keyframes fadeIn {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.4;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+.short-video-viewer {
+  --_short-video-viewer--actions-panel--top: var(--short-video-viewer--actions-panel--top, 0.9375rem);
+  --_short-video-viewer--actions-panel--bottom: var(--short-video-viewer--actions-panel--bottom, 0.9375rem);
+  --_short-video-viewer--button--background-color: #f3f4f6;
+  --_short-video-viewer--button--font-color: #2e2e2e;
+  --video--media-fit: cover;
+  width: 100%;
+  min-width: 100%;
+  max-width: 100%;
+  height: 100%;
+  min-height: 100%;
+  max-height: 100%;
+  position: relative;
+  /* Set 'container-type: inline-size;' to reference container*/
+}
+@container (width < 576px) {
+  .short-video-viewer {
+    --_short-video-viewer--button--background-color: #ffffff;
+    --_short-video-viewer--button--font-color: #2e2e2e;
+  }
+}
+.short-video-viewer__media {
+  height: 100%;
+  min-height: 100%;
+  max-height: 100%;
+  border-radius: 0.375rem;
+  overflow: hidden;
+  /* Set 'container-type: inline-size;' to reference container*/
+}
+@container (width < 576px) {
+  .short-video-viewer__media {
+    border-radius: 0;
+    position: relative;
+  }
+}
+.short-video-viewer__actions-panel {
+  position: absolute;
+  left: calc(100% + 0.625rem);
+  top: var(--_short-video-viewer--actions-panel--top);
+  bottom: var(--_short-video-viewer--actions-panel--bottom);
+  gap: 2.5rem;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+  /* Set 'container-type: inline-size;' to reference container*/
+}
+@container (width < 576px) {
+  .short-video-viewer__actions-panel {
+    left: auto;
+    right: 0.625rem;
+    align-items: flex-end;
+  }
+}
+.short-video-viewer__actions-panel--inside-frame {
+  left: auto;
+  right: 0.625rem;
+  align-items: flex-end;
+}
+.short-video-viewer__description {
+  position: absolute;
+  bottom: 0.9375rem;
+  left: 0.625rem;
+  right: calc(1.25rem + var(--_short-video-viewer--button--size));
+  --short-video-viewer--description--font--primary-color: #ffffff;
+  --short-video-viewer--description--font--secondary-color: #ffffff;
+}
+:global([data-theme="dark"]) .short-video-viewer__description {
+  --short-video-viewer--description--font--primary-color: #ffffff;
+}</style>

package/dist/short-videos/short-video-viewer/cmp.short-video-viewer.svelte.d.ts

@@ -0,0 +1,15 @@
+import { type IShortVideoViewerLocalization } from './short-video-viewer-localization.svelte';
+import type { ShortVideoViewerModel } from './types';
+type Props = {
+    model: ShortVideoViewerModel;
+    availableSideSpace?: number;
+    showAttachments?: boolean;
+    autoplay?: true | false | 'on-appearance';
+    localization?: IShortVideoViewerLocalization;
+    on?: {
+        progress?: (progress: number) => void;
+    };
+};
+declare const Cmp: import("svelte").Component<Props, {}, "">;
+type Cmp = ReturnType<typeof Cmp>;
+export default Cmp;

package/dist/short-videos/short-video-viewer/description.svelte

@@ -0,0 +1,46 @@
+<script lang="ts">import { LineClamp } from '../../ui/line-clamp';
+import { default as ShortVideoHeading } from './cmp.short-video-heading.svelte';
+let { model, localization } = $props();
+</script>
+
+<div class="short-video-description">
+  <div class="short-video-description__heading">
+    <ShortVideoHeading model={model.heading} localization={localization} />
+  </div>
+  <div class="short-video-description__text">
+    {#if model.text}
+      <LineClamp value={model.text} maxLines={2} />
+    {/if}
+  </div>
+</div>
+
+<style>@keyframes fadeIn {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.4;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+.short-video-description {
+  --_short-video-viewer--description--font--primary-color: var(--short-video-viewer--description--font--primary-color);
+  --_short-video-viewer--description--font--secondary-color: var(--short-video-viewer--description--font--secondary-color);
+  display: flex;
+  flex-direction: column;
+  padding-top: 0.75rem;
+}
+.short-video-description__heading {
+  --short-video-heading--padding: 0 0 0.875rem 0;
+  --short-video-heading--text--color: var(--_short-video-viewer--description--font--primary-color);
+  --short-video-heading--meta--color: var(--_short-video-viewer--description--font--secondary-color);
+}
+.short-video-description__text {
+  color: var(--_short-video-viewer--description--font--primary-color);
+  font-size: 0.9375rem;
+  line-height: 1.25rem;
+  font-weight: 400;
+  height: 2.5rem;
+}</style>

package/dist/short-videos/short-video-viewer/description.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { ShortVideoViewerLocalization } from './short-video-viewer-localization.svelte';
+import type { ShortVideoViewerModel } from './types';
+type Props = {
+    model: ShortVideoViewerModel;
+    localization: ShortVideoViewerLocalization;
+};
+declare const Description: import("svelte").Component<Props, {}, "">;
+type Description = ReturnType<typeof Description>;
+export default Description;

package/dist/short-videos/short-video-viewer/index.d.ts

@@ -0,0 +1,9 @@
+export { default as ShortVideoViewer } from './cmp.short-video-viewer.svelte';
+export { default as ShortVideoAdViewer } from './cmp.ad.svelte';
+export { default as ShortVideoProductViewer } from './cmp.product.svelte';
+export { default as ShortVideoViewerAttachments } from './cmp.attachments.svelte';
+export { default as ShortVideoViewerAttachmentsInline } from './cmp.attachments-inline.svelte';
+export { default as ShortVideoDetails } from './cmp.short-video-details.svelte';
+export type { ShortVideoViewerModel, ShortVideoViewerAdModel, ShortVideoViewerProductModel } from './types';
+export type { IShortVideoViewerLocalization } from './short-video-viewer-localization.svelte';
+export type { IShortVideoDetailsLocalization } from './short-video-details-localization.svelte';

package/dist/short-videos/short-video-viewer/index.js

@@ -0,0 +1,6 @@
+export { default as ShortVideoViewer } from './cmp.short-video-viewer.svelte';
+export { default as ShortVideoAdViewer } from './cmp.ad.svelte';
+export { default as ShortVideoProductViewer } from './cmp.product.svelte';
+export { default as ShortVideoViewerAttachments } from './cmp.attachments.svelte';
+export { default as ShortVideoViewerAttachmentsInline } from './cmp.attachments-inline.svelte';
+export { default as ShortVideoDetails } from './cmp.short-video-details.svelte';

package/dist/short-videos/short-video-viewer/mapper.d.ts

@@ -0,0 +1,3 @@
+import type { ShortVideoViewerPayloadFragment } from './operations.generated';
+import type { ShortVideoViewerModel } from './types';
+export declare const mapShortVideoViewerModel: (payload: ShortVideoViewerPayloadFragment) => ShortVideoViewerModel;

package/dist/short-videos/short-video-viewer/mapper.js

@@ -0,0 +1,56 @@
+import { MediaType } from '../../core/enums';
+import { getMediaItemImageUrl } from '../../core/media';
+import { shouldUseSalePrice } from '../../products/price-helper';
+export const mapShortVideoViewerModel = (payload) => {
+    const mediaBlob = payload.postData.media[0];
+    return {
+        id: payload.id,
+        media: mediaBlob.type === MediaType.Image
+            ? { isImage: true, url: mediaBlob.url }
+            : {
+                isImage: false,
+                url: mediaBlob.url,
+                thumbnailUrl: mediaBlob.thumbnailUrl
+            },
+        text: payload.postData.shortVideoData.text,
+        heading: {
+            image: payload.postHeading.sourceImage,
+            name: payload.postHeading.sourceName,
+            displayDate: payload.postHeading.postDisplayDate,
+            viewsCount: payload.postHeading.postViewsCount
+        },
+        ad: payload.ad ? mapToShortVideoViewerAdModel(payload.ad) : null,
+        products: payload.allProducts.map(mapToShortVideoViewerProductModel)
+        // uncomment if you want to test many products behavior
+        /*.flatMap((x) => [
+          { ...x, id: x.id + '1' },
+          { ...x, id: x.id + '2' },
+          { ...x, id: x.id + '3' },
+          { ...x, id: x.id + '4' },
+          { ...x, id: x.id + '5' }
+        ])*/
+    };
+};
+const mapToShortVideoViewerAdModel = (payload) => {
+    return {
+        id: payload.id,
+        image: getMediaItemImageUrl(payload.media[0]),
+        title: payload.title,
+        description: payload.description,
+        buttonText: payload.buttonText,
+        buttonUrl: payload.buttonUrl,
+        openLinkInNewWindow: payload.openLinkInNewWindow
+    };
+};
+const mapToShortVideoViewerProductModel = (payload) => {
+    const effectiveSalePrice = payload.priceAndAvailability.productSalePrices?.find((x) => shouldUseSalePrice(payload.priceAndAvailability.price, x.salePrice, x.salePriceEffectiveDateFrom, x.salePriceEffectiveDateTo));
+    return {
+        id: payload.id,
+        title: payload.title,
+        image: getMediaItemImageUrl(payload.media[0]),
+        link: payload.link,
+        currency: payload.priceAndAvailability.currency,
+        price: payload.priceAndAvailability.price,
+        salePrice: effectiveSalePrice?.salePrice ?? null
+    };
+};

package/dist/short-videos/short-video-viewer/operations.generated.d.ts

@@ -0,0 +1,56 @@
+import type * as SchemaTypes from '../../../gql/types';
+import type { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/core';
+export type ShortVideoViewerPayloadFragment = {
+    id: string;
+    enableSocialInteractions: boolean;
+    postHeading: {
+        sourceImage: string | null;
+        sourceName: string;
+        postDisplayDate: any;
+        postViewsCount: number;
+    };
+    allProducts: Array<{
+        title: string;
+        id: string;
+        link: string | null;
+        media: Array<{
+            url: string;
+            thumbnailUrl: string | null;
+            type: SchemaTypes.MediaType;
+        }>;
+        priceAndAvailability: {
+            currency: SchemaTypes.Currency;
+            price: number;
+            productSalePrices: Array<{
+                salePrice: number;
+                salePriceEffectiveDateFrom: any | null;
+                salePriceEffectiveDateTo: any | null;
+            }> | null;
+        };
+    }>;
+    ad: {
+        id: string;
+        title: string;
+        description: string | null;
+        buttonText: string | null;
+        buttonUrl: string | null;
+        openLinkInNewWindow: boolean | null;
+        type: SchemaTypes.AdType;
+        media: Array<{
+            url: string;
+            thumbnailUrl: string | null;
+            type: SchemaTypes.MediaType;
+        }>;
+    } | null;
+    postData: {
+        media: Array<{
+            url: string;
+            thumbnailUrl: string | null;
+            type: SchemaTypes.MediaType;
+        }>;
+        shortVideoData: {
+            text: string | null;
+        } | null;
+    };
+};
+export declare const ShortVideoViewerPayloadFragmentDoc: DocumentNode<ShortVideoViewerPayloadFragment, unknown>;

package/dist/short-videos/short-video-viewer/operations.generated.js

@@ -0,0 +1,151 @@
+export const ShortVideoViewerPayloadFragmentDoc = {
+    kind: 'Document',
+    definitions: [
+        {
+            kind: 'FragmentDefinition',
+            name: { kind: 'Name', value: 'ShortVideoViewerPayloadFragment' },
+            typeCondition: { kind: 'NamedType', name: { kind: 'Name', value: 'Post' } },
+            selectionSet: {
+                kind: 'SelectionSet',
+                selections: [
+                    { kind: 'Field', name: { kind: 'Name', value: 'id' } },
+                    { kind: 'Field', name: { kind: 'Name', value: 'enableSocialInteractions' } },
+                    {
+                        kind: 'Field',
+                        name: { kind: 'Name', value: 'postHeading' },
+                        selectionSet: {
+                            kind: 'SelectionSet',
+                            selections: [
+                                { kind: 'Field', name: { kind: 'Name', value: 'sourceImage' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'sourceName' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'postDisplayDate' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'postViewsCount' } }
+                            ]
+                        }
+                    },
+                    {
+                        kind: 'Field',
+                        name: { kind: 'Name', value: 'allProducts' },
+                        selectionSet: {
+                            kind: 'SelectionSet',
+                            selections: [
+                                {
+                                    kind: 'Field',
+                                    name: { kind: 'Name', value: 'media' },
+                                    selectionSet: {
+                                        kind: 'SelectionSet',
+                                        selections: [
+                                            { kind: 'Field', name: { kind: 'Name', value: 'url' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'thumbnailUrl' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'type' } }
+                                        ]
+                                    }
+                                },
+                                { kind: 'Field', name: { kind: 'Name', value: 'title' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'id' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'link' } },
+                                {
+                                    kind: 'Field',
+                                    name: { kind: 'Name', value: 'priceAndAvailability' },
+                                    selectionSet: {
+                                        kind: 'SelectionSet',
+                                        selections: [
+                                            { kind: 'Field', name: { kind: 'Name', value: 'currency' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'price' } },
+                                            {
+                                                kind: 'Field',
+                                                name: { kind: 'Name', value: 'productSalePrices' },
+                                                selectionSet: {
+                                                    kind: 'SelectionSet',
+                                                    selections: [
+                                                        { kind: 'Field', name: { kind: 'Name', value: 'salePrice' } },
+                                                        { kind: 'Field', name: { kind: 'Name', value: 'salePriceEffectiveDateFrom' } },
+                                                        { kind: 'Field', name: { kind: 'Name', value: 'salePriceEffectiveDateTo' } }
+                                                    ]
+                                                }
+                                            }
+                                        ]
+                                    }
+                                }
+                            ]
+                        }
+                    },
+                    {
+                        kind: 'Field',
+                        name: { kind: 'Name', value: 'ad' },
+                        selectionSet: {
+                            kind: 'SelectionSet',
+                            selections: [
+                                { kind: 'Field', name: { kind: 'Name', value: 'id' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'title' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'description' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'buttonText' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'buttonUrl' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'openLinkInNewWindow' } },
+                                { kind: 'Field', name: { kind: 'Name', value: 'type' } },
+                                {
+                                    kind: 'Field',
+                                    name: { kind: 'Name', value: 'media' },
+                                    selectionSet: {
+                                        kind: 'SelectionSet',
+                                        selections: [
+                                            { kind: 'Field', name: { kind: 'Name', value: 'url' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'thumbnailUrl' } },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'type' } }
+                                        ]
+                                    }
+                                }
+                            ]
+                        }
+                    },
+                    {
+                        kind: 'Field',
+                        name: { kind: 'Name', value: 'postData' },
+                        selectionSet: {
+                            kind: 'SelectionSet',
+                            selections: [
+                                {
+                                    kind: 'Field',
+                                    name: { kind: 'Name', value: 'media' },
+                                    selectionSet: {
+                                        kind: 'SelectionSet',
+                                        selections: [
+                                            {
+                                                kind: 'Field',
+                                                name: { kind: 'Name', value: 'url' },
+                                                arguments: [
+                                                    {
+                                                        kind: 'Argument',
+                                                        name: { kind: 'Name', value: 'scale' },
+                                                        value: { kind: 'Variable', name: { kind: 'Name', value: 'image_scale' } }
+                                                    }
+                                                ]
+                                            },
+                                            {
+                                                kind: 'Field',
+                                                name: { kind: 'Name', value: 'thumbnailUrl' },
+                                                arguments: [
+                                                    {
+                                                        kind: 'Argument',
+                                                        name: { kind: 'Name', value: 'scale' },
+                                                        value: { kind: 'Variable', name: { kind: 'Name', value: 'image_scale' } }
+                                                    }
+                                                ]
+                                            },
+                                            { kind: 'Field', name: { kind: 'Name', value: 'type' } }
+                                        ]
+                                    }
+                                },
+                                {
+                                    kind: 'Field',
+                                    name: { kind: 'Name', value: 'shortVideoData' },
+                                    selectionSet: { kind: 'SelectionSet', selections: [{ kind: 'Field', name: { kind: 'Name', value: 'text' } }] }
+                                }
+                            ]
+                        }
+                    }
+                ]
+            }
+        }
+    ]
+};

package/dist/short-videos/short-video-viewer/operations.graphql

@@ -0,0 +1,53 @@
+fragment ShortVideoViewerPayloadFragment on Post {
+  id
+  enableSocialInteractions
+  postHeading {
+    sourceImage
+    sourceName
+    postDisplayDate
+    postViewsCount
+  }
+  allProducts {
+    media {
+      url
+      thumbnailUrl
+      type
+    }
+    title
+    id
+    link
+    priceAndAvailability {
+      currency
+      price
+      productSalePrices {
+        salePrice
+        salePriceEffectiveDateFrom
+        salePriceEffectiveDateTo
+      }
+    }
+  }
+  ad {
+    id
+    title
+    description
+    buttonText
+    buttonUrl
+    openLinkInNewWindow
+    type
+    media {
+      url
+      thumbnailUrl
+      type
+    }
+  }
+  postData {
+    media {
+      url(scale: $image_scale)
+      thumbnailUrl(scale: $image_scale)
+      type
+    }
+    shortVideoData {
+      text
+    }
+  }
+}

package/dist/short-videos/short-video-viewer/short-video-attachments-localization.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { IShortVideoProductLocalization } from './short-video-product-localization.svelte';
+export interface IShortVideoAttachmentsLocalization {
+    productsSection?: string;
+    offersSection?: string;
+    productLocalization?: IShortVideoProductLocalization;
+}
+export declare class ShortVideoAttachmentsLocalizationSvelte {
+    productsSection: string;
+    offersSection: string;
+    productLocalization: IShortVideoProductLocalization | undefined;
+    constructor(init?: IShortVideoAttachmentsLocalization);
+}

package/dist/short-videos/short-video-viewer/short-video-attachments-localization.svelte.js

@@ -0,0 +1,10 @@
+export class ShortVideoAttachmentsLocalizationSvelte {
+    productsSection = $state('Products');
+    offersSection = $state('Offers');
+    productLocalization = $state(undefined);
+    constructor(init) {
+        this.productsSection = init?.productsSection || this.productsSection;
+        this.offersSection = init?.offersSection || this.offersSection;
+        this.productLocalization = init?.productLocalization;
+    }
+}