@streamscloud/embeddable 2.1.0 → 2.1.1

package/dist/ui/button/resources/button-theme.svelte

@@ -1,204 +0,0 @@
-<script lang="ts">import { ButtonStyle, ButtonSize } from './button-types';
-let { style = undefined, size = ButtonSize.Standard, children } = $props();
-</script>
-
-<div
-  class="button-theme"
-  class:button-theme--standard={style === ButtonStyle.Standard}
-  class:button-theme--primary={style === ButtonStyle.Primary}
-  class:button-theme--alert={style === ButtonStyle.Alert}
-  class:button-theme--white={style === ButtonStyle.White}
-  class:button-theme--gray={style === ButtonStyle.Gray}
-  class:button-theme--green={style === ButtonStyle.Green}
-  class:button-theme--black={style === ButtonStyle.Black}
-  class:button-theme--text-only={style === ButtonStyle.TextOnly}
-  class:button-theme--transparent-success={style === ButtonStyle.TransparentSuccess}
-  class:button-theme--transparent-primary={style === ButtonStyle.TransparentPrimary}
-  class:button-theme--transparent-gray={style === ButtonStyle.TransparentGray}
-  class:button-theme--transparent-white={style === ButtonStyle.TransparentWhite}
-  class:button-theme--transparent-warning={style === ButtonStyle.TransparentWarning}
-  class:button-theme--transparent-destructive={style === ButtonStyle.TransparentDestructive}
-  class:button-theme--size-standard={size === ButtonSize.Standard}
-  class:button-theme--size-large={size === ButtonSize.Large}
-  class:button-theme--size-small={size === ButtonSize.Small}>
-  {@render children()}
-</div>
-
-<style>@keyframes fadeIn {
-  0% {
-    opacity: 1;
-  }
-  50% {
-    opacity: 0.4;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-.button-theme {
-  /*Style*/
-  /*Size*/
-}
-.button-theme--primary {
-  --button--font--color: #ffffff;
-  --button--background: #144ab0;
-  --button--background--hover: #1244a0;
-  --button--background--active: #103a89;
-  --button--background--disabled: #91b3f3;
-}
-:global([data-theme="dark"]) .button-theme--primary {
-  --button--background--disabled: #91b3f3;
-}
-.button-theme--standard {
-  --button--font--color: #2e2e2e;
-  --button--background: #ffffff;
-  --button--background--hover: #f9fafb;
-  --button--background--active: #f3f4f6;
-  --button--background--disabled: #f3f4f6;
-  --button--border: 1px solid #e5e7eb;
-}
-:global([data-theme="dark"]) .button-theme--standard {
-  --button--font--color: #ffffff;
-  --button--background: #111827;
-  --button--background--hover: #1f2937;
-  --button--background--active: #374151;
-  --button--background--disabled: #374151;
-}
-:global([data-theme="dark"]) .button-theme--standard {
-  --button--border: 1px solid #4b5563;
-}
-.button-theme--white {
-  --button--font--color: #2e2e2e;
-  --button--background: #ffffff;
-  --button--background--hover: #f9fafb;
-  --button--background--active: #f3f4f6;
-  --button--background--disabled: #f3f4f6;
-}
-:global([data-theme="dark"]) .button-theme--white {
-  --button--font--color: #ffffff;
-  --button--background: #111827;
-  --button--background--hover: #1f2937;
-  --button--background--active: #374151;
-  --button--background--disabled: #374151;
-}
-.button-theme--gray {
-  --button--font--color: #2e2e2e;
-  --button--background: #f3f4f6;
-  --button--background--hover: #f9fafb;
-  --button--background--active: #f3f4f6;
-  --button--background--disabled: #f3f4f6;
-  --button--border: 1px solid #e5e7eb;
-}
-:global([data-theme="dark"]) .button-theme--gray {
-  --button--font--color: #ffffff;
-  --button--background: #374151;
-  --button--background--hover: #1f2937;
-  --button--background--active: #374151;
-  --button--background--disabled: #374151;
-  --button--border: 1px solid #4b5563;
-}
-.button-theme--green {
-  --button--font--color: #0cce6b;
-  --button--background: #066031;
-  --button--background--hover: #088745;
-  --button--background--active: #088745;
-  --button--background--disabled: #0aa454;
-  --button--border: 1px solid #066031;
-}
-:global([data-theme="dark"]) .button-theme--green {
-  --button--font--color: #ffffff;
-  --button--background: #374151;
-  --button--background--hover: #1f2937;
-  --button--background--active: #374151;
-  --button--background--disabled: #374151;
-  --button--border: 1px solid #4b5563;
-}
-.button-theme--black {
-  --button--font--color: #ffffff;
-  --button--background: #1c1c1c;
-  --button--background--hover: #1f2937;
-  --button--background--active: #374151;
-  --button--background--disabled: #374151;
-}
-:global([data-theme="dark"]) .button-theme--black {
-  --button--font--color: #2e2e2e;
-  --button--background: #fafafa;
-  --button--background--hover: #f3f4f6;
-  --button--background--active: #e5e7eb;
-  --button--background--disabled: #e5e7eb;
-}
-.button-theme--alert {
-  --button--font--color: #ffffff;
-  --button--background: #e71d36;
-  --button--background--hover: #d4172d;
-  --button--background--active: #b81427;
-  --button--background--disabled: #f6a7b1;
-}
-.button-theme--text-only {
-  --button--font--color: #2e2e2e;
-  --button--background: transparent;
-  --button--background--hover: #f3f4f6;
-  --button--background--active: #e5e7eb;
-  --button--border: none;
-}
-:global([data-theme="dark"]) .button-theme--text-only {
-  --button--font--color: #ffffff;
-  --button--background--hover: #111827;
-  --button--background--active: #1f2937;
-  --button--border: none;
-}
-.button-theme--transparent-success {
-  --button--font--color: #0cce6b;
-  --button--background: #ecfef4;
-  --button--border: 1px solid #0cce6b;
-  --button--background--active: #d4fce7;
-}
-.button-theme--transparent-primary {
-  --button--font--color: #144ab0;
-  --button--background: #f1f6fd;
-  --button--border: 1px solid #144ab0;
-  --button--background--active: #dfe9fb;
-}
-.button-theme--transparent-white {
-  --button--font--color: #ffffff;
-  --button--background: transparent;
-  --button--border: 1px solid #ffffff;
-}
-.button-theme--transparent-gray {
-  --button--font--color: #6b7280;
-  --button--background: #f9fafb;
-  --button--border: 1px solid #6b7280;
-  --button--background--active: #f3f4f6;
-}
-:global([data-theme="dark"]) .button-theme--transparent-gray {
-  --button--font--color: #e5e7eb;
-  --button--background: #1f2937;
-  --button--border: 1px solid #e5e7eb;
-  --button--background--active: #374151;
-}
-.button-theme--transparent-warning {
-  --button--font--color: #ffa62b;
-  --button--background: #fffbeb;
-  --button--border: 1px solid #ffa62b;
-  --button--background--active: #fef3c7;
-}
-.button-theme--transparent-destructive {
-  --button--font--color: #e71d36;
-  --button--background: #fef1f3;
-  --button--border: 1px solid #e71d36;
-  --button--background--active: #fde8ea;
-}
-.button-theme--size-standard {
-  --button--height: 2em;
-  --button--text--font-size: 0.75em;
-}
-.button-theme--size-large {
-  --button--height: 3em;
-  --button--font-weight: 500;
-  --icon--stroke-width: 0.4;
-  --button--text--font-size: 0.9375em;
-}
-.button-theme--size-small {
-  --button--height: 1.5em;
-  --button--text--font-size: 0.625em;
-}</style>

package/dist/ui/button/resources/button-theme.svelte.d.ts

@@ -1,10 +0,0 @@
-import { ButtonStyle, ButtonSize } from './button-types';
-import type { Snippet } from 'svelte';
-type Props = {
-    style?: ButtonStyle | null;
-    size?: ButtonSize | null;
-    children: Snippet;
-};
-declare const ButtonTheme: import("svelte").Component<Props, {}, "">;
-type ButtonTheme = ReturnType<typeof ButtonTheme>;
-export default ButtonTheme;

package/dist/ui/button/resources/button-types.d.ts

@@ -1,21 +0,0 @@
-export declare enum ButtonStyle {
-    Primary = "primary",
-    Standard = "standard",
-    Alert = "alert",
-    White = "white",
-    Gray = "gray",
-    Green = "green",
-    Black = "black",
-    TextOnly = "text-only",
-    TransparentSuccess = "transparent-success",
-    TransparentPrimary = "transparent-primary",
-    TransparentGray = "transparent-gray",
-    TransparentWhite = "transparent-white",
-    TransparentWarning = "transparent-warning",
-    TransparentDestructive = "transparent-destructive"
-}
-export declare enum ButtonSize {
-    Standard = "Standard",
-    Large = "Large",
-    Small = "Small"
-}

package/dist/ui/button/resources/button-types.js

@@ -1,23 +0,0 @@
-export var ButtonStyle;
-(function (ButtonStyle) {
-    ButtonStyle["Primary"] = "primary";
-    ButtonStyle["Standard"] = "standard";
-    ButtonStyle["Alert"] = "alert";
-    ButtonStyle["White"] = "white";
-    ButtonStyle["Gray"] = "gray";
-    ButtonStyle["Green"] = "green";
-    ButtonStyle["Black"] = "black";
-    ButtonStyle["TextOnly"] = "text-only";
-    ButtonStyle["TransparentSuccess"] = "transparent-success";
-    ButtonStyle["TransparentPrimary"] = "transparent-primary";
-    ButtonStyle["TransparentGray"] = "transparent-gray";
-    ButtonStyle["TransparentWhite"] = "transparent-white";
-    ButtonStyle["TransparentWarning"] = "transparent-warning";
-    ButtonStyle["TransparentDestructive"] = "transparent-destructive";
-})(ButtonStyle || (ButtonStyle = {}));
-export var ButtonSize;
-(function (ButtonSize) {
-    ButtonSize["Standard"] = "Standard";
-    ButtonSize["Large"] = "Large";
-    ButtonSize["Small"] = "Small";
-})(ButtonSize || (ButtonSize = {}));

package/dist/ui/dynamic-component/cmp.dynamic-component.svelte

@@ -1,5 +0,0 @@
-<script lang="ts">let { model: DynamicModel } = $props();
-export {};
-</script>
-
-<DynamicModel.component {...DynamicModel.props}></DynamicModel.component>

package/dist/ui/dynamic-component/cmp.dynamic-component.svelte.d.ts

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

package/dist/ui/dynamic-component/index.d.ts

@@ -1,2 +0,0 @@
-export { default as DynamicComponent } from './cmp.dynamic-component.svelte';
-export { DynamicComponentModel } from './types.svelte';

package/dist/ui/dynamic-component/index.js

@@ -1,2 +0,0 @@
-export { default as DynamicComponent } from './cmp.dynamic-component.svelte';
-export { DynamicComponentModel } from './types.svelte';

package/dist/ui/dynamic-component/types.svelte.d.ts

@@ -1,11 +0,0 @@
-import type { Component } from 'svelte';
-export type DynamicComponentProps<TComponent extends Component> = TComponent extends Component<infer Props> ? Props : never;
-export declare class DynamicComponentModel<TComponent extends Component<any> = Component<any>> {
-    component: TComponent;
-    props: DynamicComponentProps<TComponent>;
-    constructor(init: {
-        component: TComponent;
-        props: DynamicComponentProps<TComponent>;
-    });
-    updateProps(props: Partial<DynamicComponentProps<TComponent>>): void;
-}

package/dist/ui/dynamic-component/types.svelte.js

@@ -1,13 +0,0 @@
-// Define the DynamicComponentModel class
-/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
-export class DynamicComponentModel {
-    component;
-    props = $state(null);
-    constructor(init) {
-        this.component = init.component;
-        this.props = init.props;
-    }
-    updateProps(props) {
-        this.props = { ...this.props, ...props };
-    }
-}

package/dist/ui/icon/cmp.icon.svelte

@@ -1,113 +0,0 @@
-<script lang="ts">import { IconColor } from './types';
-import { inlineSvg } from '@svelte-put/inline-svg';
-let { src, color = null } = $props();
-let svgRef;
-$effect(() => {
-    if (svgRef && src) {
-        inlineSvg(svgRef, src);
-    }
-});
-const fillSvg = (node) => {
-    svgRef = node;
-    return inlineSvg(node, src);
-};
-</script>
-
-<div style="display: contents">
-  {#if src.startsWith('fa-')}
-    <i class="{src} font-awesome-icon-to-replace"></i>
-  {:else}
-    <svg
-      class="icon"
-      use:fillSvg
-      class:icon--white={color === IconColor.White}
-      class:icon--text={color === IconColor.Text}
-      class:icon--gray={color === IconColor.Gray}
-      class:icon--green={color === IconColor.Green}
-      class:icon--red={color === IconColor.Red}
-      class:icon--orange={color === IconColor.Orange}
-      class:icon--blue={color === IconColor.Blue}></svg>
-  {/if}
-</div>
-
-<style>@keyframes fadeIn {
-  0% {
-    opacity: 1;
-  }
-  50% {
-    opacity: 0.4;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-.icon {
-  --_icon--color: var(--icon--color);
-  --_icon--size: var(--icon--size, 1.25em);
-  --_icon--stroke-width: var(--icon--stroke-width, 0);
-  display: inline-block;
-  color: inherit;
-  fill: var(--_icon--color, currentColor);
-  height: var(--_icon--size);
-  min-height: var(--_icon--size);
-  max-height: var(--_icon--size);
-  width: var(--_icon--size);
-  min-width: var(--_icon--size);
-  max-width: var(--_icon--size);
-}
-.icon--white {
-  --_icon--color: #ffffff;
-}
-:global([data-theme="dark"]) .icon--white {
-  --_icon--color: #ffffff;
-}
-.icon--text {
-  --_icon--color: #2e2e2e;
-}
-:global([data-theme="dark"]) .icon--text {
-  --_icon--color: #ffffff;
-}
-.icon--gray {
-  --_icon--color: #6b7280;
-}
-:global([data-theme="dark"]) .icon--gray {
-  --_icon--color: #6b7280;
-}
-.icon--green {
-  --_icon--color: #0cce6b;
-}
-:global([data-theme="dark"]) .icon--green {
-  --_icon--color: #0cce6b;
-}
-.icon--red {
-  --_icon--color: #e71d36;
-}
-:global([data-theme="dark"]) .icon--red {
-  --_icon--color: #e71d36;
-}
-.icon--orange {
-  --_icon--color: #ffa62b;
-}
-:global([data-theme="dark"]) .icon--orange {
-  --_icon--color: #ffa62b;
-}
-.icon--blue {
-  --_icon--color: #144ab0;
-}
-:global([data-theme="dark"]) .icon--blue {
-  --_icon--color: #91b3f3;
-}
-.icon :global(path) {
-  stroke: var(--_icon--color);
-  stroke-width: var(--_icon--stroke-width);
-}
-:global([data-theme="dark"]) .icon :global(path) {
-  stroke: var(--_icon--color);
-  stroke-width: var(--_icon--stroke-width);
-}
-
-.font-awesome-icon-to-replace {
-  font-size: 1em;
-  transform: scale(2);
-  color: red;
-}</style>

package/dist/ui/icon/cmp.icon.svelte.d.ts

@@ -1,8 +0,0 @@
-import { IconColor } from './types';
-type Props = {
-    src: string;
-    color?: IconColor | null;
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;

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

@@ -1,2 +0,0 @@
-export { default as Icon } from './cmp.icon.svelte';
-export { IconColor } from './types';

package/dist/ui/icon/index.js

@@ -1,2 +0,0 @@
-export { default as Icon } from './cmp.icon.svelte';
-export { IconColor } from './types';

package/dist/ui/icon/types.d.ts

@@ -1,9 +0,0 @@
-export declare enum IconColor {
-    White = "white",
-    Blue = "blue",
-    Green = "green",
-    Gray = "gray",
-    Orange = "orange",
-    Red = "red",
-    Text = "text"
-}

package/dist/ui/icon/types.js

@@ -1,10 +0,0 @@
-export var IconColor;
-(function (IconColor) {
-    IconColor["White"] = "white";
-    IconColor["Blue"] = "blue";
-    IconColor["Green"] = "green";
-    IconColor["Gray"] = "gray";
-    IconColor["Orange"] = "orange";
-    IconColor["Red"] = "red";
-    IconColor["Text"] = "text";
-})(IconColor || (IconColor = {}));

package/dist/ui/image/cmp.image-round.svelte

@@ -1,41 +0,0 @@
-<script lang="ts">import RoundedImg from './cmp.image-rounded.svelte';
-let { src, alt = '', noBorders = false, on } = $props();
-</script>
-
-<div class="round-img">
-  <div class="round-img__placer">
-    <RoundedImg src={src} alt={alt} noBorders={noBorders} on={on} />
-  </div>
-</div>
-
-<style>@keyframes fadeIn {
-  0% {
-    opacity: 1;
-  }
-  50% {
-    opacity: 0.4;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-.round-img {
-  --_image--round--size: var(--image--round--size, 100%);
-  --image--rounded--inner--border-radius: 50%;
-  --image--rounded--outer--border-radius: 50%;
-  --image--rounded--image--border-radius: 50%;
-  --image--rounded--width: 100%;
-  --image--rounded--height: 100%;
-  display: inline-block;
-  width: var(--_image--round--size);
-  position: relative;
-  padding-bottom: var(--_image--round--size);
-}
-.round-img__placer {
-  position: absolute;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-}</style>

package/dist/ui/image/cmp.image-round.svelte.d.ts

@@ -1,11 +0,0 @@
-type Props = {
-    src: string | null | undefined;
-    alt?: string;
-    noBorders?: boolean;
-    on?: {
-        click: () => void;
-    };
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;

package/dist/ui/image/cmp.image-rounded.svelte

@@ -1,71 +0,0 @@
-<script lang="ts">import Image from './cmp.image.svelte';
-let { src, alt = '', noBorders = false, on } = $props();
-</script>
-
-<div class="rounded-img" class:rounded-img--stub={!src} class:rounded-img--clear={noBorders}>
-  <div class="rounded-img__placer" onclick={() => on?.click()} onkeydown={() => ({})} role="none">
-    <Image src={src} alt={alt} showStubOnError={true} />
-  </div>
-</div>
-
-<style>@keyframes fadeIn {
-  0% {
-    opacity: 1;
-  }
-  50% {
-    opacity: 0.4;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-.rounded-img {
-  --image--rounded--size_: var(--image--rounded--size, 100%);
-  --image--rounded--width_: var(--image--rounded--width, var(--image--rounded--size_));
-  --image--rounded--height_: var(--image--rounded--height, var(--image--rounded--size_));
-  --image--rounded--image--border-radius_: var(
-    --image--rounded--image--border-radius,
-    calc(var(--image--rounded--inner--border-radius_) - var(--image--rounded--inner--border-width_))
-  );
-  --image--rounded--inner--border-color_: var(--image--rounded--inner--border-color, #ffffff);
-  --image--rounded--inner--border-radius_: var(
-    --image--rounded--inner--border-radius,
-    calc(var(--image--rounded--outer--border-radius_) - var(--image--rounded--outer--border-width_))
-  );
-  --image--rounded--inner--border-width_: var(--image--rounded--inner--border-width, 4px);
-  --image--rounded--outer--border-color_: var(
-    --image--rounded--outer--border-color,
-    linear-gradient(#144ab0, #dfe9fb)
-  );
-  --image--rounded--outer--border-radius_: var(--image--rounded--outer--border-radius, 0);
-  --image--rounded--outer--border-width_: var(--image--rounded--outer--border-width, 2px);
-  --image--rounded--stub--background_: var(--image--rounded--stub--background, #f3f4f6);
-  width: var(--image--rounded--width_);
-  height: var(--image--rounded--height_);
-  border-radius: var(--image--rounded--outer--border-radius_);
-  padding: var(--image--rounded--outer--border-width_);
-  background: var(--image--rounded--outer--border-color_);
-  overflow: hidden;
-}
-:global([data-theme="dark"]) .rounded-img {
-  --image--rounded--inner--border-color_: var(--image--rounded--inner--border-color, #000000);
-  --image--rounded--stub--background_: var(--image--rounded--stub--background, #374151);
-}
-.rounded-img--stub {
-  background: var(--image--rounded--stub--background_);
-}
-.rounded-img--clear {
-  --image--rounded--outer--border-width_: 0;
-  --image--rounded--inner--border-width_: 0;
-  --image--rounded--outer--border-color_: transparent;
-  --image--rounded--inner--border-color_: transparent;
-}
-.rounded-img__placer {
-  width: 100%;
-  height: 100%;
-  border-radius: var(--image--rounded--inner--border-radius_);
-  padding: var(--image--rounded--inner--border-width_);
-  background: var(--image--rounded--inner--border-color_);
-  overflow: hidden;
-  --image--border-radius: var(--image--rounded--image--border-radius_);
-}</style>

package/dist/ui/image/cmp.image-rounded.svelte.d.ts

@@ -1,11 +0,0 @@
-type Props = {
-    src: string | null | undefined;
-    alt?: string;
-    noBorders?: boolean;
-    on?: {
-        click: () => void;
-    };
-};
-declare const Cmp: import("svelte").Component<Props, {}, "">;
-type Cmp = ReturnType<typeof Cmp>;
-export default Cmp;

package/dist/ui/image/cmp.image-stub.svelte

@@ -1,34 +0,0 @@
-<script lang="ts">import { Icon } from '../icon';
-import IconImage from '@fluentui/svg-icons/icons/image_20_regular.svg';
-</script>
-
-<div class="image-stub">
-  <Icon src={IconImage} />
-</div>
-
-<style>@keyframes fadeIn {
-  0% {
-    opacity: 1;
-  }
-  50% {
-    opacity: 0.4;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-.image-stub {
-  --_image-stub--color: var(--image-stub--color, #d1d5db);
-  width: 100%;
-  height: 100%;
-  z-index: 2;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  color: var(--_image-stub--color);
-  border: 1px solid var(--_image-stub--color);
-  border-radius: 0.25rem;
-}
-:global([data-theme="dark"]) .image-stub {
-  --_image-stub--color: var(--image-stub--color, #374151);
-}</style>

package/dist/ui/image/cmp.image-stub.svelte.d.ts

@@ -1,18 +0,0 @@
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const Cmp: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type Cmp = InstanceType<typeof Cmp>;
-export default Cmp;