@streamscloud/kit 0.1.12-1772032209109 → 0.1.12

package/dist/core/toastr/index.d.ts

@@ -1,3 +1,3 @@
 import './toastr.scss';
 export { Toastr } from './toastr.svelte';
-export type { ToastrAction, ToastrOptions, ToastrPromiseMessages, ToastrTheme } from './types';
+export type { ToastrAction, ToastrOptions, ToastrPromiseMessages } from './types';

package/dist/core/toastr/toastr.scss

@@ -26,41 +26,3 @@
     color: var(--info-bg);
   }
 }
-
-// Theme classes — override svelte-sonner color variables per-toast.
-// Applied via the `class` option when an explicit theme is passed to Toastr methods.
-.sc-toast--light {
-  --normal-bg: #fff;
-  --normal-border: hsl(0, 0%, 93%);
-  --normal-text: hsl(0, 0%, 9%);
-  --success-bg: hsl(143, 85%, 96%);
-  --success-border: hsl(145, 92%, 87%);
-  --success-text: hsl(140, 100%, 27%);
-  --info-bg: hsl(208, 100%, 97%);
-  --info-border: hsl(221, 91%, 93%);
-  --info-text: hsl(210, 92%, 45%);
-  --warning-bg: hsl(49, 100%, 97%);
-  --warning-border: hsl(49, 91%, 84%);
-  --warning-text: hsl(31, 92%, 45%);
-  --error-bg: hsl(359, 100%, 97%);
-  --error-border: hsl(359, 100%, 94%);
-  --error-text: hsl(360, 100%, 45%);
-}
-
-.sc-toast--dark {
-  --normal-bg: #000;
-  --normal-border: hsl(0, 0%, 20%);
-  --normal-text: hsl(0, 0%, 99%);
-  --success-bg: hsl(150, 100%, 6%);
-  --success-border: hsl(147, 100%, 12%);
-  --success-text: hsl(150, 86%, 65%);
-  --info-bg: hsl(215, 100%, 6%);
-  --info-border: hsl(223, 43%, 17%);
-  --info-text: hsl(216, 87%, 65%);
-  --warning-bg: hsl(64, 100%, 6%);
-  --warning-border: hsl(60, 100%, 9%);
-  --warning-text: hsl(46, 87%, 65%);
-  --error-bg: hsl(358, 76%, 10%);
-  --error-border: hsl(357, 89%, 16%);
-  --error-text: hsl(358, 100%, 81%);
-}

package/dist/core/toastr/toastr.svelte.d.ts

@@ -4,5 +4,5 @@ export declare class Toastr {
     static success(message: string, options?: ToastrOptions): Promise<void>;
     static warning(message: string, options?: ToastrOptions): Promise<void>;
     static info(message: string, options?: ToastrOptions): Promise<void>;
-    static promise<T>(promise: Promise<T> | (() => Promise<T>), messages: ToastrPromiseMessages<T>, options?: ToastrOptions): Promise<void>;
+    static promise<T>(promise: Promise<T> | (() => Promise<T>), messages: ToastrPromiseMessages<T>): Promise<void>;
 }

package/dist/core/toastr/toastr.svelte.js

@@ -1,30 +1,23 @@
 import { ToasterHost } from './toaster-host.svelte';
-const toExternalToast = (options) => {
-    if (!options) {
-        return {};
-    }
-    const { theme, ...rest } = options;
-    return { ...rest, class: theme ? `sc-toast--${theme}` : undefined };
-};
 export class Toastr {
     static async error(message, options) {
         const toast = await ToasterHost.ensure();
-        toast.error(message, toExternalToast(options));
+        toast.error(message, options);
     }
     static async success(message, options) {
         const toast = await ToasterHost.ensure();
-        toast.success(message, toExternalToast(options));
+        toast.success(message, options);
     }
     static async warning(message, options) {
         const toast = await ToasterHost.ensure();
-        toast.warning(message, toExternalToast(options));
+        toast.warning(message, options);
     }
     static async info(message, options) {
         const toast = await ToasterHost.ensure();
-        toast.info(message, toExternalToast(options));
+        toast.info(message, options);
     }
-    static async promise(promise, messages, options) {
+    static async promise(promise, messages) {
         const toast = await ToasterHost.ensure();
-        toast.promise(promise, { ...messages, ...toExternalToast(options) });
+        toast.promise(promise, messages);
     }
 }

package/dist/core/toastr/types.d.ts

@@ -2,12 +2,10 @@ export interface ToastrAction {
     label: string;
     onClick: () => void;
 }
-export type ToastrTheme = 'light' | 'dark';
 export interface ToastrOptions {
     action?: ToastrAction;
     description?: string;
     duration?: number;
-    theme?: ToastrTheme;
 }
 export interface ToastrPromiseMessages<T> {
     loading: string;

package/dist/ui/cropper/image-editor-dialog/cmp.image-editor-dialog.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">import { FileWithBlobDataHelper } from '../../../core/files';
 import { Toastr } from '../../../core/toastr';
-import { Dialog, DialogButton, DialogCancelButton } from '../../dialog';
+import { Dialog, DialogButton, DialogCancelButton, DialogSize } from '../../dialog';
 import { ImgCropper, ImgCropperControls, ImgCropperToolbar, ImgCropperView } from '../img-cropper';
 import { ImageEditorDialogLocalization } from './image-editor-dialog-localization';
 import { untrack } from 'svelte';
@@ -37,7 +37,7 @@ const cancel = () => {
 };
 $effect(() => untrack(() => {
     controller.updateSettings({ closeOnClickOutside: false, closeOnEsc: true });
-    controller.updateContainerSettings({ size: 'fullhd' });
+    controller.updateContainerSettings({ size: DialogSize.FullHD });
 }));
 </script>
 

package/dist/ui/dialog/cmp.dialog-container.svelte

@@ -1,5 +1,5 @@
 <script lang="ts" generics="TResult = void, TCancelResult = void, TData = void">import { Dialogs } from './dialogs.svelte';
-import { DIALOG_SIZES } from './types.svelte';
+import { DialogPosition, DialogSize } from './types.svelte';
 import { untrack } from 'svelte';
 let { dialog } = $props();
 let dialogElement = $state();
@@ -57,7 +57,7 @@ $effect(() => {
 });
 const size = $derived(dialog.controller.containerSettings.size);
 const position = $derived(dialog.controller.containerSettings.position);
-const isCustomWidth = $derived(!DIALOG_SIZES.includes(size));
+const isCustomWidth = $derived(!Object.values(DialogSize).includes(size));
 const customWidth = $derived(isCustomWidth ? size : null);
 </script>
 
@@ -65,16 +65,16 @@ const customWidth = $derived(isCustomWidth ? size : null);
   bind:this={dialogElement}
   class="dialog-container"
   class:dialog-container--inactive={!isActive}
-  class:dialog-container--size-small={size === 'small'}
-  class:dialog-container--size-medium={size === 'medium'}
-  class:dialog-container--size-default={size === 'default'}
-  class:dialog-container--size-large={size === 'large'}
-  class:dialog-container--size-fullhd={size === 'fullhd'}
-  class:dialog-container--size-auto={size === 'auto'}
-  class:dialog-container--position-center={position === 'center'}
-  class:dialog-container--position-center-top={position === 'center-top'}
-  class:dialog-container--position-full-screen={position === 'full-screen'}
-  class:dialog-container--position-full-height={position === 'full-height'}
+  class:dialog-container--size-small={size === DialogSize.Small}
+  class:dialog-container--size-medium={size === DialogSize.Medium}
+  class:dialog-container--size-default={size === DialogSize.Default}
+  class:dialog-container--size-large={size === DialogSize.Large}
+  class:dialog-container--size-fullhd={size === DialogSize.FullHD}
+  class:dialog-container--size-auto={size === DialogSize.Auto}
+  class:dialog-container--position-center={position === DialogPosition.Center}
+  class:dialog-container--position-center-top={position === DialogPosition.CenterTop}
+  class:dialog-container--position-full-screen={position === DialogPosition.FullScreen}
+  class:dialog-container--position-full-height={position === DialogPosition.FullHeight}
   onkeydown={handleKeydown}
   oncancel={handleCancel}
   onclick={handleBackdropClick}

package/dist/ui/dialog/dialog-data.d.ts

@@ -23,7 +23,5 @@ export type DialogInit<TData = void, TResult = void, TCancelResult = void> = {
     data?: TData;
     explicitSettings?: Partial<DialogSettings>;
     containerSettings?: Partial<DialogContainerSettings>;
-    /** Mount target for the dialog element. Useful for shadow DOM isolation. Defaults to `document.body`. */
-    host?: ParentNode;
 };
 export {};

package/dist/ui/dialog/dialog-mount.d.ts

@@ -1,3 +1,3 @@
 import type { AnyDialogData } from './dialog-data';
-export declare const mountDialog: (dialog: AnyDialogData, host?: ParentNode) => void;
+export declare const mountDialog: (dialog: AnyDialogData) => void;
 export declare const unmountDialog: (dialog: AnyDialogData) => void;

package/dist/ui/dialog/dialog-mount.js

@@ -1,9 +1,9 @@
 import { default as DialogContainer } from './cmp.dialog-container.svelte';
 import { mount, unmount } from 'svelte';
-export const mountDialog = (dialog, host) => {
+export const mountDialog = (dialog) => {
     const hostElement = document.createElement('div');
     hostElement.setAttribute('data-dialog-host', String(dialog.id));
-    (host ?? document.body).appendChild(hostElement);
+    document.body.appendChild(hostElement);
     const component = mount(DialogContainer, {
         target: hostElement,
         props: { dialog }

package/dist/ui/dialog/dialogs.svelte.d.ts

@@ -3,14 +3,11 @@ import { type DialogResult } from './types.svelte';
 export declare class DialogsContainer {
     private _dialogs;
     private _mountModule;
-    private _savedOverflow;
     get all(): ReadonlyArray<AnyDialogData>;
     get active(): AnyDialogData | null;
     get count(): number;
     open: <TData = void, TResult = void, TCancelResult = void>(init: DialogInit<TData, TResult, TCancelResult>, id?: number) => Promise<DialogResult<TResult, TCancelResult>>;
     close: (id: number) => void;
     closeAll: () => void;
-    private lockBodyScroll;
-    private unlockBodyScroll;
 }
 export declare const Dialogs: DialogsContainer;

package/dist/ui/dialog/dialogs.svelte.js

@@ -5,7 +5,6 @@ import {} from './types.svelte';
 export class DialogsContainer {
     _dialogs = $state.raw([]);
     _mountModule = null;
-    _savedOverflow = null;
     get all() {
         return this._dialogs;
     }
@@ -19,7 +18,7 @@ export class DialogsContainer {
         if (!this._mountModule) {
             this._mountModule = await import('./dialog-mount');
         }
-        const { view, data, explicitSettings, containerSettings, host } = init;
+        const { view, data, explicitSettings, containerSettings } = init;
         const controller = new DialogController({
             id,
             onClose: () => {
@@ -27,9 +26,6 @@ export class DialogsContainer {
                 if (dialog) {
                     this._mountModule?.unmountDialog(dialog);
                     this._dialogs = this._dialogs.filter((d) => d.id !== id);
-                    if (this._dialogs.length === 0) {
-                        this.unlockBodyScroll();
-                    }
                 }
             },
             settings: explicitSettings,
@@ -42,8 +38,7 @@ export class DialogsContainer {
             controller
         };
         this._dialogs = [...this._dialogs, newDialog];
-        this.lockBodyScroll();
-        this._mountModule.mountDialog(newDialog, host);
+        this._mountModule.mountDialog(newDialog);
         return controller.openedPromise;
     };
     close = (id) => {
@@ -58,20 +53,6 @@ export class DialogsContainer {
             dialog.controller.cancel();
         }
     };
-    lockBodyScroll = () => {
-        if (this._savedOverflow !== null) {
-            return;
-        }
-        this._savedOverflow = document.body.style.overflow;
-        document.body.style.overflow = 'hidden';
-    };
-    unlockBodyScroll = () => {
-        if (this._savedOverflow === null) {
-            return;
-        }
-        document.body.style.overflow = this._savedOverflow;
-        this._savedOverflow = null;
-    };
 }
 const createDialogsSingleton = () => {
     if (!isBrowser()) {

package/dist/ui/dialog/index.d.ts

@@ -1,6 +1,6 @@
 export { Dialogs } from './dialogs.svelte';
 export { DialogController } from './dialog-controller';
-export { DIALOG_SIZES, type DialogPosition, type DialogResult, type DialogSize } from './types.svelte';
+export { DialogSize, DialogPosition, type DialogResult } from './types.svelte';
 export { default as Dialog } from './cmp.dialog.svelte';
 export { default as DialogButton } from './cmp.dialog-button.svelte';
 export { default as DialogCancelButton } from './cmp.dialog-cancel-button.svelte';

package/dist/ui/dialog/index.js

@@ -1,6 +1,6 @@
 export { Dialogs } from './dialogs.svelte';
 export { DialogController } from './dialog-controller';
-export { DIALOG_SIZES } from './types.svelte';
+export { DialogSize, DialogPosition } from './types.svelte';
 export { default as Dialog } from './cmp.dialog.svelte';
 export { default as DialogButton } from './cmp.dialog-button.svelte';
 export { default as DialogCancelButton } from './cmp.dialog-cancel-button.svelte';

package/dist/ui/dialog/types.svelte.d.ts

@@ -1,6 +1,17 @@
-export type DialogSize = 'small' | 'medium' | 'default' | 'large' | 'fullhd' | 'auto';
-export type DialogPosition = 'center' | 'center-top' | 'full-screen' | 'full-height';
-export declare const DIALOG_SIZES: readonly DialogSize[];
+export declare enum DialogSize {
+    Small = "small",
+    Medium = "medium",
+    Default = "default",
+    Large = "large",
+    FullHD = "fullhd",
+    Auto = "auto"
+}
+export declare enum DialogPosition {
+    Center = "center",
+    CenterTop = "center-top",
+    FullScreen = "full-screen",
+    FullHeight = "full-height"
+}
 export declare class DialogSettings {
     closeOnClickOutside: boolean;
     closeOnEsc: boolean;

package/dist/ui/dialog/types.svelte.js

@@ -1,10 +1,25 @@
-export const DIALOG_SIZES = ['small', 'medium', 'default', 'large', 'fullhd', 'auto'];
+export var DialogSize;
+(function (DialogSize) {
+    DialogSize["Small"] = "small";
+    DialogSize["Medium"] = "medium";
+    DialogSize["Default"] = "default";
+    DialogSize["Large"] = "large";
+    DialogSize["FullHD"] = "fullhd";
+    DialogSize["Auto"] = "auto";
+})(DialogSize || (DialogSize = {}));
+export var DialogPosition;
+(function (DialogPosition) {
+    DialogPosition["Center"] = "center";
+    DialogPosition["CenterTop"] = "center-top";
+    DialogPosition["FullScreen"] = "full-screen";
+    DialogPosition["FullHeight"] = "full-height";
+})(DialogPosition || (DialogPosition = {}));
 export class DialogSettings {
     closeOnClickOutside = $state(false);
     closeOnEsc = $state(false);
     nonCancelable = $state(false);
 }
 export class DialogContainerSettings {
-    size = $state('default');
-    position = $state('center-top');
+    size = $state(DialogSize.Default);
+    position = $state(DialogPosition.CenterTop);
 }

package/dist/ui/player/carousel/cmp.carousel.svelte

@@ -260,7 +260,7 @@ A horizontal slide carousel with infinite looping, touch swipe support, keyboard
 ### CSS Custom Properties
 | Property | Description | Default |
 |---|---|---|
-| `--sc-kit--carousel--button-color` | Navigation arrow button background | `rgba(255, 255, 255, 0.2)` |
+| `--sc-kit--carousel--button-color` | Navigation arrow button background | `neutral-400` |
 | `--sc-kit--carousel--dot-color` | Dot indicator color (fill when active, border when inactive) | `white` |
 | `--sc-kit--carousel--dot-size` | Dot indicator diameter | `0.5rem` |
 | `--sc-kit--carousel--text-color` | Arrow button icon and counter text color | `white` |
@@ -269,7 +269,7 @@ A horizontal slide carousel with infinite looping, touch swipe support, keyboard
 <style>@charset "UTF-8";
 .carousel {
   /* Public API */
-  --_carousel--button-color: var(--sc-kit--carousel--button-color, rgba(255, 255, 255, 0.2));
+  --_carousel--button-color: var(--sc-kit--carousel--button-color, #9ca3af);
   --_carousel--dot-color: var(--sc-kit--carousel--dot-color, #ffffff);
   --_carousel--dot-size: var(--sc-kit--carousel--dot-size, 0.5rem);
   --_carousel--text-color: var(--sc-kit--carousel--text-color, #ffffff);

package/dist/ui/player/carousel/cmp.carousel.svelte.d.ts

@@ -46,7 +46,7 @@ interface $$IsomorphicComponent {
  * ### CSS Custom Properties
  * | Property | Description | Default |
  * |---|---|---|
- * | `--sc-kit--carousel--button-color` | Navigation arrow button background | `rgba(255, 255, 255, 0.2)` |
+ * | `--sc-kit--carousel--button-color` | Navigation arrow button background | `neutral-400` |
  * | `--sc-kit--carousel--dot-color` | Dot indicator color (fill when active, border when inactive) | `white` |
  * | `--sc-kit--carousel--dot-size` | Dot indicator diameter | `0.5rem` |
  * | `--sc-kit--carousel--text-color` | Arrow button icon and counter text color | `white` |

package/dist/ui/video/cmp.video.svelte

@@ -8,11 +8,10 @@ import IconSpeaker from '@fluentui/svg-icons/icons/speaker_2_20_regular.svg?raw'
 import IconSpeakerMute from '@fluentui/svg-icons/icons/speaker_mute_20_regular.svg?raw';
 import { untrack } from 'svelte';
 import { fade } from 'svelte/transition';
-let { src, poster, id = randomNanoid(), controls = false, autoplay = false, loop = false, inert = false, allowPreloading = false, hideSpeaker = false, hidePlayButton = false, intersectionContainer, scrubberPosition = 'bottom', on } = $props();
+let { src, poster, id = randomNanoid(), controls = true, autoplay = false, loop = false, inert = false, allowPreloading = false, hideSpeaker = false, hidePlayButton = false, intersectionContainer, scrubberPosition = 'bottom', on } = $props();
 let video = $state(null);
 let videoContainerRef = $state(null);
 let showControlsOnHover = $state(false);
-let showProgressOnHover = $state(false);
 let isVideoPaused = $state(true);
 let percentageCompleted = $state(0);
 let everActivated = $state(false);
@@ -247,13 +246,7 @@ const handleSeek = (percent) => {
     <img class="video__poster" src={poster} alt="" />
   {/if}
   {#if !controls || !everActivated}
-    <div
-      class="video__overlay"
-      onclick={togglePlay}
-      onkeydown={() => ({})}
-      onmouseenter={() => (showControlsOnHover = true)}
-      onmouseleave={() => (showControlsOnHover = false)}
-      role="none">
+    <div class="video__overlay" onclick={togglePlay} onkeydown={() => ({})} role="none">
       {#if isVideoPaused && !hidePlayButton}
         <button type="button" aria-label="play" class="video__playback-button" onclick={togglePlay} onkeydown={() => ({})}>
           <Icon src={IconPlay} color="white" />
@@ -263,7 +256,6 @@ const handleSeek = (percent) => {
           <Icon src={IconPause} color="white" />
         </button>
       {/if}
-
       {#if (showControlsOnHover || MediaVolumeManager.isMuted) && !hideSpeaker}
         <button type="button" aria-label={MediaVolumeManager.isMuted ? 'mute' : 'unmute'} class="video__mute-button" onclick={toggleMute}>
           {#if MediaVolumeManager.isMuted}
@@ -279,10 +271,10 @@ const handleSeek = (percent) => {
           class="video__progress-container"
           class:video__progress-container--top={scrubberPosition === 'top'}
           class:video__progress-container--bottom={scrubberPosition === 'bottom'}
-          onmouseenter={() => (showProgressOnHover = true)}
-          onmouseleave={() => (showProgressOnHover = false)}
+          onmouseenter={() => (showControlsOnHover = true)}
+          onmouseleave={() => (showControlsOnHover = false)}
           role="none">
-          {#if showProgressOnHover || (!showProgressOnHover && isVideoPaused)}
+          {#if showControlsOnHover || (!showControlsOnHover && isVideoPaused)}
             <div
               class="video__seek-bar"
               transition:fade={{ duration: isVideoPaused ? 0 : 300 }}
@@ -329,12 +321,12 @@ A full-featured video player with custom overlay controls, play/pause, mute, see
   background: var(--_video--background-color);
 }
 .video__playback-button {
-  --sc-kit--icon--size: 2.5rem;
   --sc-kit--icon--filter: drop-shadow(1px 1px #000000);
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
+  font-size: 2em;
 }
 .video__playback-button--pause {
   /* Set 'container-type: inline-size;' to reference container*/
@@ -345,11 +337,10 @@ A full-featured video player with custom overlay controls, play/pause, mute, see
   }
 }
 .video__mute-button {
-  --sc-kit--icon--size: 1.25rem;
-  --sc-kit--icon--filter: drop-shadow(1px 1px #000000);
   position: absolute;
   top: 0.625em;
   right: 0.625em;
+  font-size: 1em;
   z-index: 1;
 }
 .video__poster {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamscloud/kit",
-  "version": "0.1.12-1772032209109",
+  "version": "0.1.12",
   "author": "StreamsCloud",
   "repository": {
     "type": "git",
@@ -17,7 +17,6 @@
     "pack": "npm run build && npm pack",
     "preview": "vite preview",
     "check": "svelte-check --tsconfig ./tsconfig.app.json && tsc -p tsconfig.node.json",
-    "check:strict": "svelte-check --tsconfig ./tsconfig.app.json --fail-on-warnings --output machine && eslint . --format codeframe --max-warnings 0 && prettier --check --plugin prettier-plugin-svelte --cache .",
     "lint": "prettier --check --plugin prettier-plugin-svelte . && eslint .",
     "lint-format": "prettier --write --plugin prettier-plugin-svelte . && eslint --fix .",
     "format": "prettier --write --plugin prettier-plugin-svelte ."
@@ -105,10 +104,6 @@
       "types": "./dist/ui/dialog/index.d.ts",
       "svelte": "./dist/ui/dialog/index.js"
     },
-    "./ui/form-group": {
-      "types": "./dist/ui/form-group/index.d.ts",
-      "svelte": "./dist/ui/form-group/index.js"
-    },
     "./ui/dropdown": {
       "types": "./dist/ui/dropdown/index.d.ts",
       "svelte": "./dist/ui/dropdown/index.js"
@@ -117,10 +112,6 @@
       "types": "./dist/ui/dynamic-component/index.d.ts",
       "svelte": "./dist/ui/dynamic-component/index.js"
     },
-    "./ui/html-block": {
-      "types": "./dist/ui/html-block/index.d.ts",
-      "svelte": "./dist/ui/html-block/index.js"
-    },
     "./ui/icon": {
       "types": "./dist/ui/icon/index.d.ts",
       "svelte": "./dist/ui/icon/index.js"
@@ -153,10 +144,6 @@
       "types": "./dist/ui/media-playback/index.d.ts",
       "svelte": "./dist/ui/media-playback/index.js"
     },
-    "./ui/media-viewer-dialog": {
-      "types": "./dist/ui/media-viewer-dialog/index.d.ts",
-      "svelte": "./dist/ui/media-viewer-dialog/index.js"
-    },
     "./ui/player/buttons": {
       "types": "./dist/ui/player/buttons/index.d.ts",
       "svelte": "./dist/ui/player/buttons/index.js"

package/dist/ui/form-group/cmp.form-group-label.svelte

@@ -1,25 +0,0 @@
-<script lang="ts">let { withTooltip = false, children } = $props();
-export {};
-</script>
-
-<div class="form-group-label" class:form-group-label--with-tooltip={withTooltip}>
-  {@render children()}
-</div>
-
-<style>.form-group-label {
-  --_form-group--label--font-size: var(--sc-kit--form-group--label--font-size, 0.875rem);
-  --_form-group--label--font-weight: var(--sc-kit--form-group--label--font-weight, 400);
-  --_form-group--label--color: var(--sc-kit--form-group--label--color);
-  --_form-group--label--margin-bottom: var(--sc-kit--form-group--label--margin-bottom, 0.5rem);
-  font-size: var(--_form-group--label--font-size);
-  padding: 0;
-  margin-bottom: var(--_form-group--label--margin-bottom);
-  font-weight: var(--_form-group--label--font-weight);
-  display: block;
-  color: var(--_form-group--label--color);
-}
-.form-group-label--with-tooltip {
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-}</style>

package/dist/ui/form-group/cmp.form-group-label.svelte.d.ts

@@ -1,8 +0,0 @@
-import type { Snippet } from 'svelte';
-type Props = {
-    withTooltip?: boolean;
-    children: Snippet;
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;

package/dist/ui/form-group/cmp.form-group-note.svelte

@@ -1,16 +0,0 @@
-<script lang="ts">let { children } = $props();
-export {};
-</script>
-
-<div class="form-group-note">
-  {@render children()}
-</div>
-
-<style>.form-group-note {
-  --_form-group--note--font-size: var(--sc-kit--form-group--note--font-size, 0.875rem);
-  --_form-group--note--font-weight: var(--sc-kit--form-group--note--font-weight, 300);
-  margin-top: 0.5rem;
-  color: #9ca3af;
-  font-size: var(--_form-group--note--font-size);
-  font-weight: var(--_form-group--note--font-weight);
-}</style>

package/dist/ui/form-group/cmp.form-group-note.svelte.d.ts

@@ -1,7 +0,0 @@
-import type { Snippet } from 'svelte';
-type Props = {
-    children: Snippet;
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;

package/dist/ui/form-group/cmp.form-group.svelte

@@ -1,16 +0,0 @@
-<script lang="ts">let { noMargin = false, children } = $props();
-export {};
-</script>
-
-<div class="form-group" class:form-group--no-margin={noMargin}>
-  {@render children()}
-</div>
-
-<style>.form-group {
-  --_form-group--margin-bottom: var(--sc-kit--form-group--margin-bottom, 1.25rem);
-  display: block;
-  margin-bottom: var(--_form-group--margin-bottom);
-}
-.form-group--no-margin {
-  margin-bottom: 0;
-}</style>

package/dist/ui/form-group/cmp.form-group.svelte.d.ts

@@ -1,8 +0,0 @@
-import type { Snippet } from 'svelte';
-type Props = {
-    noMargin?: boolean;
-    children: Snippet;
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;

package/dist/ui/form-group/index.d.ts

@@ -1,3 +0,0 @@
-export { default as FormGroup } from './cmp.form-group.svelte';
-export { default as FormGroupLabel } from './cmp.form-group-label.svelte';
-export { default as FormGroupNote } from './cmp.form-group-note.svelte';

package/dist/ui/form-group/index.js

@@ -1,3 +0,0 @@
-export { default as FormGroup } from './cmp.form-group.svelte';
-export { default as FormGroupLabel } from './cmp.form-group-label.svelte';
-export { default as FormGroupNote } from './cmp.form-group-note.svelte';

package/dist/ui/html-block/cmp.html-block.svelte

@@ -1,112 +0,0 @@
-<script lang="ts">let { children } = $props();
-export {};
-</script>
-
-<div class="html-block">
-  {@render children()}
-</div>
-
-<style>.html-block {
-  display: contents;
-  word-break: break-word;
-  font-size: 0.875em;
-  line-height: 1.4;
-  font-weight: normal;
-  color: light-dark(#2e2e2e, #ffffff);
-}
-.html-block :global(h1) {
-  font-size: 1.5em;
-  line-height: 1.4;
-  font-weight: 600;
-  color: light-dark(#2e2e2e, #ffffff);
-}
-.html-block :global(h2) {
-  font-size: 1.375em;
-  line-height: 1.4;
-  font-weight: 600;
-  color: light-dark(#2e2e2e, #ffffff);
-}
-.html-block :global(h3) {
-  font-size: 1.25em;
-  line-height: 1.4;
-  font-weight: 600;
-  color: light-dark(#2e2e2e, #ffffff);
-}
-.html-block :global(h4) {
-  font-size: 1.125em;
-  line-height: 1.4;
-  font-weight: 500;
-  color: light-dark(#2e2e2e, #ffffff);
-}
-.html-block :global(h5) {
-  font-size: 1.0625em;
-  line-height: 1.4;
-  font-weight: 500;
-  color: light-dark(#2e2e2e, #ffffff);
-}
-.html-block :global(h6) {
-  font-size: 1em;
-  line-height: 1.4;
-  font-weight: 500;
-  color: light-dark(#2e2e2e, #ffffff);
-}
-.html-block :global(a) {
-  font-size: 1em;
-  line-height: 1.4;
-  font-weight: normal;
-  color: light-dark(#2e2e2e, #ffffff);
-  color: light-dark(#144ab0, #5a8dec);
-}
-.html-block :global(pre) {
-  font-family: monospace;
-  white-space: pre-wrap;
-  margin: 1em 0;
-  font-size: 1em;
-  line-height: 1;
-  font-weight: normal;
-  color: light-dark(#2e2e2e, #ffffff);
-}
-.html-block :global(ul) :global(> li),
-.html-block :global(ol) :global(> li) {
-  list-style: inherit;
-  margin-left: 1em;
-  position: relative;
-  font-size: 1em;
-  line-height: 1.4;
-  font-weight: normal;
-  color: light-dark(#2e2e2e, #ffffff);
-}
-.html-block :global(ol) {
-  list-style-type: decimal;
-}
-.html-block :global(ol) :global(> li > ol) {
-  list-style-type: lower-alpha;
-}
-.html-block :global(table) {
-  max-width: 100%;
-}
-.html-block :global(table),
-.html-block :global(tbody),
-.html-block :global(thead),
-.html-block :global(tr),
-.html-block :global(th),
-.html-block :global(td) {
-  border-width: initial;
-  border-style: inherit;
-  border-color: inherit;
-}
-.html-block :global(ul:not([style*='list-style-type'])),
-.html-block :global(ul:not([style*='list-style-type']) > li > ul:not([style*='list-style-type'])) {
-  list-style-type: none;
-}
-.html-block :global(ul:not([style*='list-style-type']) > li:before),
-.html-block :global(ul:not([style*='list-style-type']) > li > ul:not([style*='list-style-type']) > li:before) {
-  content: "-";
-  text-indent: -1em;
-  position: absolute;
-  font-weight: bold;
-}
-.html-block :global(ul[style*='list-style-type'] > li:before),
-.html-block :global(ul > li > ul[style*='list-style-type'] > li:before) {
-  content: none;
-}</style>

package/dist/ui/html-block/cmp.html-block.svelte.d.ts

@@ -1,7 +0,0 @@
-import type { Snippet } from 'svelte';
-type Props = {
-    children: Snippet;
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;

package/dist/ui/html-block/index.d.ts

@@ -1 +0,0 @@
-export { default as HtmlBlock } from './cmp.html-block.svelte';

package/dist/ui/html-block/index.js

@@ -1 +0,0 @@
-export { default as HtmlBlock } from './cmp.html-block.svelte';

package/dist/ui/media-viewer-dialog/cmp.media-viewer-dialog.svelte

@@ -1,50 +0,0 @@
-<script lang="ts">import { DialogCloseButton } from '../dialog';
-import { Carousel } from '../player/carousel';
-import { default as MediaViewerItem } from './media-viewer-item.svelte';
-import { untrack } from 'svelte';
-const { controller, data } = $props();
-$effect(() => untrack(() => {
-    controller.updateSettings({ closeOnEsc: true, closeOnClickOutside: true });
-    controller.updateContainerSettings({ position: 'full-screen' });
-}));
-</script>
-
-<div class="media-viewer-dialog" style:--media-viewer-dialog--background--opacity={data.backgroundOpacity}>
-  <div class="media-viewer-dialog__close">
-    <DialogCloseButton controller={controller} />
-  </div>
-
-  <div class="media-viewer-dialog__content">
-    {#if data.items.length === 1}
-      <MediaViewerItem item={data.items[0]} />
-    {:else}
-      <Carousel items={data.items} initialIndex={data.index} mode="arrows-with-counts" on={{ indexChanged: () => {} }}>
-        {#snippet children(item)}
-          <MediaViewerItem item={item} />
-        {/snippet}
-      </Carousel>
-    {/if}
-  </div>
-</div>
-
-<style>.media-viewer-dialog {
-  --_media-viewer-dialog--background--opacity: var(--media-viewer-dialog--background--opacity, 0.6);
-  --sc-kit--dialog-close-button--color: #ffffff;
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-  background: rgba(0, 0, 0, var(--_media-viewer-dialog--background--opacity));
-  position: relative;
-  padding: 0.625rem;
-}
-.media-viewer-dialog__close {
-  position: absolute;
-  top: 0.75rem;
-  right: 0.75rem;
-  z-index: 10;
-}
-.media-viewer-dialog__content {
-  flex: 1;
-  min-height: 0;
-}</style>

package/dist/ui/media-viewer-dialog/cmp.media-viewer-dialog.svelte.d.ts

@@ -1,9 +0,0 @@
-import { type DialogController } from '../dialog';
-import type { MediaViewerData } from './types';
-type Props = {
-    controller: DialogController;
-    data: MediaViewerData;
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;

package/dist/ui/media-viewer-dialog/index.d.ts

@@ -1,13 +0,0 @@
-import { type DialogResult } from '../dialog';
-import type { MediaViewerData } from './types';
-/**
- * Opens a full-screen media viewer dialog for images and videos.
- * Single item renders directly; multiple items display in a carousel with arrow navigation.
- *
- * ### Options
- * - `items` — array of media items to display
- * - `index` — zero-based index of the initially visible item
- * - `backgroundOpacity` — backdrop opacity (default `0.6`)
- */
-export declare const openMediaViewer: (data: MediaViewerData) => Promise<DialogResult<void>>;
-export type { MediaViewerData, MediaViewerItem, MediaViewerItemType } from './types';

package/dist/ui/media-viewer-dialog/index.js

@@ -1,17 +0,0 @@
-import { Dialogs } from '../dialog';
-import { default as MediaViewerDialog } from './cmp.media-viewer-dialog.svelte';
-/**
- * Opens a full-screen media viewer dialog for images and videos.
- * Single item renders directly; multiple items display in a carousel with arrow navigation.
- *
- * ### Options
- * - `items` — array of media items to display
- * - `index` — zero-based index of the initially visible item
- * - `backgroundOpacity` — backdrop opacity (default `0.6`)
- */
-export const openMediaViewer = (data) => {
-    return Dialogs.open({
-        view: MediaViewerDialog,
-        data
-    });
-};

package/dist/ui/media-viewer-dialog/media-viewer-item.svelte

@@ -1,61 +0,0 @@
-<script lang="ts">import { Image } from '../image';
-import { Video } from '../video';
-const { item } = $props();
-let containerWidth = $state(0);
-let containerHeight = $state(0);
-const fittedSize = $derived.by(() => {
-    if (containerWidth === 0 || containerHeight === 0) {
-        return { width: 0, height: 0 };
-    }
-    const aspectRatio = item.width / item.height;
-    const containerRatio = containerWidth / containerHeight;
-    if (aspectRatio > containerRatio) {
-        const width = containerWidth;
-        const height = width / aspectRatio;
-        return { width, height };
-    }
-    const height = containerHeight;
-    const width = height * aspectRatio;
-    return { width, height };
-});
-const observeResize = (node) => {
-    const observer = new ResizeObserver((entries) => {
-        const entry = entries[0];
-        if (entry) {
-            containerWidth = entry.contentRect.width;
-            containerHeight = entry.contentRect.height;
-        }
-    });
-    observer.observe(node);
-    return {
-        destroy: () => observer.disconnect()
-    };
-};
-</script>
-
-<div class="media-viewer-item" use:observeResize>
-  {#if fittedSize.width > 0 && fittedSize.height > 0}
-    <div class="media-viewer-item__media" style:width="{fittedSize.width}px" style:height="{fittedSize.height}px">
-      {#if item.type === 'image'}
-        <Image src={item.url} alt="" />
-      {:else}
-        <Video src={item.url} poster={item.thumbnailUrl} autoplay="on-appearance" />
-      {/if}
-    </div>
-  {/if}
-</div>
-
-<style>.media-viewer-item {
-  --sc-kit--image--object-fit: contain;
-  --sc-kit--video--media-fit: contain;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 100%;
-  height: 100%;
-}
-.media-viewer-item__media {
-  flex-shrink: 0;
-  overflow: hidden;
-  border-radius: 0.375rem;
-}</style>

package/dist/ui/media-viewer-dialog/media-viewer-item.svelte.d.ts

@@ -1,7 +0,0 @@
-import type { MediaViewerItem } from './types';
-type Props = {
-    item: MediaViewerItem;
-};
-declare const MediaViewerItem: import("svelte").Component<Props, {}, "">;
-type MediaViewerItem = ReturnType<typeof MediaViewerItem>;
-export default MediaViewerItem;

package/dist/ui/media-viewer-dialog/types.d.ts

@@ -1,13 +0,0 @@
-export type MediaViewerItemType = 'image' | 'video';
-export type MediaViewerItem = {
-    url: string;
-    thumbnailUrl: string | null;
-    type: MediaViewerItemType;
-    width: number;
-    height: number;
-};
-export type MediaViewerData = {
-    items: MediaViewerItem[];
-    index: number;
-    backgroundOpacity?: number;
-};

package/dist/ui/media-viewer-dialog/types.js

@@ -1 +0,0 @@
-export {};