@coyalabs/bts-style 1.3.10 → 1.3.12

package/dist/Components/ScrollContainer.svelte.d.ts

@@ -0,0 +1,59 @@
+export default ScrollContainer;
+type ScrollContainer = SvelteComponent<$$__sveltets_2_PropsWithChildren<{
+    height?: string | undefined;
+    width?: string | undefined;
+    overflowX?: "scroll" | "auto" | "hidden" | "visible" | undefined;
+    overflowY?: "scroll" | "auto" | "hidden" | "visible" | undefined;
+    maxWidth?: string | undefined;
+    maxHeight?: string | undefined;
+    scrollbarSize?: string | undefined;
+    trackColor?: string | undefined;
+    thumbColor?: string | undefined;
+    thumbHoverColor?: string | undefined;
+    borderRadius?: string | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}> & {
+    $$bindings?: string | undefined;
+};
+declare const ScrollContainer: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    height?: string | undefined;
+    width?: string | undefined;
+    overflowX?: "scroll" | "auto" | "hidden" | "visible" | undefined;
+    overflowY?: "scroll" | "auto" | "hidden" | "visible" | undefined;
+    maxWidth?: string | undefined;
+    maxHeight?: string | undefined;
+    scrollbarSize?: string | undefined;
+    trackColor?: string | undefined;
+    thumbColor?: string | undefined;
+    thumbHoverColor?: string | undefined;
+    borderRadius?: string | undefined;
+}, {
+    default: {};
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {};
+}, {}, string>;
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+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: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}

package/dist/Components/Special/SpecialAction.svelte

@@ -20,15 +20,19 @@
         icon={icons.any_ai}
         iconToned={false}
         actionIcon={null}
+        hideLabel={!label}
+        {...$$restProps}
         on:click
     >
-        {label}
+        {#if label}
+            {label}
+            {#if tooltipText}
+            <div class="tooltip-container" style="margin-left: 10px;">
+                <Tooltip text={tooltipText} iconSize="14px" />
+            </div>
+            {/if}
+        {/if}
     </Button>
-    {#if tooltipText}
-        <div class="tooltip-container">
-            <Tooltip text={tooltipText} iconSize="14px" />
-        </div>
-    {/if}
 </div>
 
 <style>
@@ -36,12 +40,6 @@
         position: relative;
         display: block;
         width: 100%;
-    }
-
-    .tooltip-container {
-        position: absolute;
-        right: 1rem;
-        top: 50%;
-        transform: translateY(-50%);
+        height: 100%;
     }
 </style>

package/dist/Components/Special/SpecialAction.svelte.d.ts

@@ -1,5 +1,6 @@
 export default SpecialAction;
 type SpecialAction = SvelteComponent<{
+    [x: string]: any;
     label?: string | undefined;
     tooltipText?: string | undefined;
 }, {
@@ -10,6 +11,7 @@ type SpecialAction = SvelteComponent<{
     $$bindings?: string | undefined;
 };
 declare const SpecialAction: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: any;
     label?: string | undefined;
     tooltipText?: string | undefined;
 }, {

package/dist/Components/TabBar.svelte

@@ -3,7 +3,7 @@
   import BaseText from '../Base/BaseText.svelte';
 
   /**
-   * @type {Array<{id?: string, label: string, icon?: string, type?: 'tab' | 'separator'}>}
+   * @type {Array<{id?: string, label: string, type?: 'tab' | 'separator', icon?: string, iconRotation?: number, iconSize?: string, iconToned?: boolean, [key: string]: any}>}
    */
   export let tabs = [];
 
@@ -74,10 +74,11 @@
       <div class="category-buttons">
         {#each category.tabs as {tab, originalIndex}}
           {@const corners = getCornerRadius(originalIndex)}
+          {@const { id: _id, label: _label, type: _type, ...iconProps } = tab}
           <div class="tab-button">
             <Button
-              theme={activeTab === tab.id ? 'primary' : 'secondary'}
-              icon={tab.icon}
+              theme={activeTab === tab.id ? 'primary' : 'vague'}
+              {...iconProps}
               actionIcon={null}
               borderRadiusTopLeft={corners.topLeft}
               borderRadiusTopRight={corners.topRight}

package/dist/Components/TabBar.svelte.d.ts

@@ -1,10 +1,14 @@
 export default TabBar;
 type TabBar = SvelteComponent<{
     tabs?: {
+        [key: string]: any;
         id?: string | undefined;
         label: string;
-        icon?: string | undefined;
         type?: "separator" | "tab" | undefined;
+        icon?: string | undefined;
+        iconRotation?: number | undefined;
+        iconSize?: string | undefined;
+        iconToned?: boolean | undefined;
     }[] | undefined;
     activeTab?: string | undefined;
     onTabChange?: ((tabId: string) => void) | undefined;
@@ -15,10 +19,14 @@ type TabBar = SvelteComponent<{
 };
 declare const TabBar: $$__sveltets_2_IsomorphicComponent<{
     tabs?: {
+        [key: string]: any;
         id?: string;
         label: string;
-        icon?: string;
         type?: "tab" | "separator";
+        icon?: string;
+        iconRotation?: number;
+        iconSize?: string;
+        iconToned?: boolean;
     }[] | undefined;
     activeTab?: string | undefined;
     onTabChange?: ((tabId: string) => void) | undefined;

package/dist/Components/Toast/Toast.svelte

@@ -1,9 +1,11 @@
 <script>
   import { fly } from 'svelte/transition';
   import { toastStore } from './toastStore.js';
-  import Button from '../Button.svelte';
+  import BaseContainer from '../../Base/BaseContainer.svelte';
+  import BaseText from '../../Base/BaseText.svelte';
+  import IconButton from '../IconButton.svelte';
   import { icons } from '../../icons.js';
-  import { VARIANT_SECONDARY } from '../../Base/variantTypes.js';
+  import { VARIANT_FILLED } from '../../Base/variantTypes.js';
 
   /** @type {Array<{id: string, message: string, duration?: number}>} */
   let toasts = [];
@@ -18,6 +20,13 @@
   function handleDismiss(id) {
     toastStore.dismiss(id);
   }
+
+  /**
+   * @param {string} message
+   */
+  function handleCopy(message) {
+    navigator.clipboard.writeText(message);
+  }
 </script>
 
 <div class="toast-container">
@@ -26,15 +35,21 @@
       class="toast"
       in:fly={{ x: 300, duration: 300 }}
       out:fly={{ x: 300, duration: 200 }}
+      on:click={() => handleCopy(toast.message)}
+      role="button"
+      tabindex="0"
+      on:keydown={(e) => e.key === 'Enter' && handleCopy(toast.message)}
+      title="Click to copy"
     >
-      <Button 
-        theme={VARIANT_SECONDARY}
-        icon={icons.help}
-        actionIcon={icons.crossb}
-        on:click={() => handleDismiss(toast.id)}
-      >
-        {toast.message}
-      </Button>
+      <BaseContainer theme={VARIANT_FILLED} padding="0.5rem 0.5rem 0.5rem 1rem">
+          <div class="toast-inner">
+            <BaseText variant="content" textModifier="-4px">{toast.message}</BaseText>
+            <!-- svelte-ignore a11y_interactive_supports_focus -->
+            <span role="button" on:click|stopPropagation on:keydown|stopPropagation>
+              <IconButton svg={icons.crossb} size="16px" on:click={() => handleDismiss(toast.id)} />
+            </span>
+          </div>
+        </BaseContainer>
     </div>
   {/each}
 </div>
@@ -47,11 +62,21 @@
     display: flex;
     flex-direction: column;
     gap: 0.75rem;
-    z-index: 10000;
+    z-index: 100000;
     pointer-events: none;
   }
 
   .toast {
     pointer-events: auto;
+    cursor: pointer;
   }
+
+  .toast-inner {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+  }
+
+
 </style>
+ 

package/dist/Components/Toast/Toast.svelte.d.ts

@@ -2,6 +2,9 @@ export default Toast;
 type Toast = SvelteComponent<{
     [x: string]: never;
 }, {
+    click: PointerEvent;
+    keydown: KeyboardEvent;
+} & {
     [evt: string]: CustomEvent<any>;
 }, {}> & {
     $$bindings?: string | undefined;
@@ -9,6 +12,9 @@ type Toast = SvelteComponent<{
 declare const Toast: $$__sveltets_2_IsomorphicComponent<{
     [x: string]: never;
 }, {
+    click: PointerEvent;
+    keydown: KeyboardEvent;
+} & {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, string>;
 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> {

package/dist/Components/Toggle.svelte

@@ -18,7 +18,7 @@
     all: unset;
     cursor: pointer;
     position: relative;
-    width: 50px;
+    width: 45px;
     height: 25px;
     border-radius: 25px;
     border: 2px solid rgba(255, 255, 255, 0.13);
@@ -36,10 +36,10 @@
 
   /* On state */
   .toggle.checked {
-    background: #ffa1cb6c;
+    background: #fdc0db4f;
     box-shadow: 
       0px 0px 13px 0px rgba(255, 255, 255, 0.07),
-      inset 0px 0px 9px 2px rgba(193, 182, 212, 0.5);
+      inset 0px 0px 9px 2px rgba(102, 88, 128, 0.48);
   }
 
   .pill {

package/dist/Components/TreeDirectory.svelte

@@ -10,7 +10,7 @@
   
   /** @typedef {import('../Base/variantTypes.js').BaseContainerVariant} BaseContainerVariant */
   
-  /** @type {{ name: string, type: 'file' | 'folder', children?: any[], data?: any, variant?: BaseContainerVariant, suffixIcon?: string }[]} */
+  /** @type {{ name: string, type: 'file' | 'folder' | 'custom', children?: any[], data?: any, variant?: BaseContainerVariant, suffixIcon?: string, isPending?: boolean }[]} */
   export let items = [];
   
   /** @type {boolean} */  
@@ -249,6 +249,9 @@
     {@const id = `${level}-${i}`}
     {@const open = expanded.has(id)}
     {@const isLast = i === items.length - 1}
+    {@const nextItem = items[i + 1]}
+    {@const nextIsCustom = nextItem?.type === 'custom'}
+    {@const isEffectivelyLast = isLast || nextIsCustom}
     {@const isNested = level > 0}
     {@const isDragOver = dragOverFolder === item.name}
     
@@ -273,9 +276,10 @@
           actionIconSize="15px" 
           correctTextOffset={true}
           actionIconRotation={open ? 0 : -90}
-          borderRadiusTopLeft={isNested ? '15px' : '25px'}
-          borderRadiusTopRight={isNested ? '15px' : '25px'}
-          borderRadiusBottomRight="15px"
+          borderRadiusTopLeft={isNested ? '18px' : '25px'}
+          borderRadiusTopRight={isNested ? '18px' : '25px'}
+          borderRadiusBottomLeft={isNested && !isEffectivelyLast ? '18px' : '25px'}
+          borderRadiusBottomRight={isNested && !isEffectivelyLast ? '18px' : '25px'}
         >
           {item.name}
           {#if showCount && item.children}
@@ -283,7 +287,7 @@
           {/if}
           {#if item.suffixIcon}
             <span class="suffix-icon">
-              <BaseIcon svg={item.suffixIcon} size="15px" />
+              <BaseIcon svg={item.suffixIcon} size="18px" />
             </span>
           {/if}
         </Button>
@@ -301,14 +305,22 @@
             on:itemRightClick
             on:itemDrop
             on:dragStart
-          />
+          >
+            <slot name="custom" slot="custom" let:item let:level let:isNested let:isLast {item} {level} {isNested} {isLast} />
+          </svelte:self>
         </div>
       {/if}
+    {:else if item.type === 'custom'}
+      <!-- Custom item with slot -->
+      <div class="custom-item">
+        <slot name="custom" {item} {level} {isNested} isLast={isEffectivelyLast} />
+      </div>
     {:else}
       <!-- svelte-ignore a11y-no-static-element-interactions -->
       <div 
         class="file-item"
         class:dragging={draggable}
+        class:pending={item.isPending}
         draggable={draggable}
         on:dragstart={draggable ? (e) => handleDragStart(e, item) : undefined}
         on:click={() => handleItemClick(item)} 
@@ -322,10 +334,10 @@
           icon={itemIcon}
           correctTextOffset={true}
           actionIconSize="15px"
-          borderRadiusTopLeft={isNested ? '15px' : '25px'}
-          borderRadiusTopRight={isNested ? '15px' : '25px'}
-          borderRadiusBottomLeft={isNested && !isLast ? '15px' : '25px'}
-          borderRadiusBottomRight={isNested && !isLast ? '15px' : '25px'}
+          borderRadiusTopLeft={isNested ? '18px' : '25px'}
+          borderRadiusTopRight={isNested ? '18px' : '25px'}
+          borderRadiusBottomLeft={isNested && !isEffectivelyLast ? '18px' : '25px'}
+          borderRadiusBottomRight={isNested && !isEffectivelyLast ? '18px' : '25px'}
         >
           {item.name}
           {#if item.suffixIcon}
@@ -367,6 +379,9 @@
   .file-item {
     transition: opacity 0.15s ease;
   }
+  .file-item.pending {
+    opacity: 0.5;
+  }
   .file-item.dragging {
     cursor: grab;
   }
@@ -374,4 +389,7 @@
     cursor: grabbing;
     opacity: 0.6;
   }
+  .custom-item {
+    width: 100%;
+  }
 </style>

package/dist/Components/TreeDirectory.svelte.d.ts

@@ -2,11 +2,12 @@ export default TreeDirectory;
 type TreeDirectory = SvelteComponent<{
     items?: {
         name: string;
-        type: "file" | "folder";
+        type: "file" | "folder" | "custom";
         children?: any[] | undefined;
         data?: any;
         variant?: BaseContainerVariant | undefined;
         suffixIcon?: string | undefined;
+        isPending?: boolean | undefined;
     }[] | undefined;
     showCount?: boolean | undefined;
     itemIcon?: string | null | undefined;
@@ -25,7 +26,22 @@ type TreeDirectory = SvelteComponent<{
     itemDrop: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}> & {
+}, {
+    custom: {
+        item: {
+            name: string;
+            type: "file" | "folder" | "custom";
+            children?: any[] | undefined;
+            data?: any;
+            variant?: BaseContainerVariant | undefined;
+            suffixIcon?: string | undefined;
+            isPending?: boolean | undefined;
+        };
+        level: number;
+        isNested: any;
+        isLast: any;
+    };
+}> & {
     $$bindings?: string | undefined;
 } & {
     getState: () => string[];
@@ -36,11 +52,12 @@ type TreeDirectory = SvelteComponent<{
 declare const TreeDirectory: $$__sveltets_2_IsomorphicComponent<{
     items?: {
         name: string;
-        type: "file" | "folder";
+        type: "file" | "folder" | "custom";
         children?: any[];
         data?: any;
         variant?: import("../Base/variantTypes.js").BaseContainerVariant;
         suffixIcon?: string;
+        isPending?: boolean;
     }[] | undefined;
     showCount?: boolean | undefined;
     itemIcon?: string | null | undefined;
@@ -59,7 +76,22 @@ declare const TreeDirectory: $$__sveltets_2_IsomorphicComponent<{
     itemDrop: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}, {
+}, {
+    custom: {
+        item: {
+            name: string;
+            type: "file" | "folder" | "custom";
+            children?: any[];
+            data?: any;
+            variant?: import("../Base/variantTypes.js").BaseContainerVariant;
+            suffixIcon?: string;
+            isPending?: boolean;
+        };
+        level: number;
+        isNested: any;
+        isLast: any;
+    };
+}, {
     getState: () => string[];
     setState: (state: string[]) => void;
     expandAll: () => void;

package/dist/Structure/TextHeader.svelte

@@ -1,16 +1,39 @@
 <script>
   import BaseText from '../Base/BaseText.svelte';
+  import BaseIcon from '../Base/BaseIcon.svelte';
   
   export let title = '';
   export let subtitle = '';
+
+  /**
+   * @type {string | null}
+    */
+  export let titleSideIcon = null;
+
+  /**
+   * @type {string}
+   */
+  export let titleSideIconSize = '15px';
+
+  /**
+   * @type {'default' | 'compact'}
+   */
+  export let variant = 'default';
 </script>
 
 <div class="text-header">
-    {#if title}
-    <div class="title">
-        <BaseText variant="title">{title}</BaseText>
+    <div class="icon-text">
+      {#if titleSideIcon}
+        <BaseIcon svg={titleSideIcon} size={titleSideIconSize} />
+      {/if}
+
+      {#if title}
+      <div class="title">
+          <BaseText variant={variant === 'compact' ? 'button' : 'title'}>{title}</BaseText>
+      </div>
+      {/if}
     </div>
-    {/if}
+
     {#if subtitle}
     <div class="subtitle">
         <BaseText variant="content">{subtitle}</BaseText>
@@ -25,6 +48,12 @@
     gap: 10px;
   }
 
+  .icon-text {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+  }
+
   .title,
   .subtitle {
     margin: 0;

package/dist/Structure/TextHeader.svelte.d.ts

@@ -1,7 +1,10 @@
 export default TextHeader;
 type TextHeader = SvelteComponent<{
     title?: string | undefined;
+    variant?: "default" | "compact" | undefined;
     subtitle?: string | undefined;
+    titleSideIcon?: string | null | undefined;
+    titleSideIconSize?: string | undefined;
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}> & {
@@ -9,7 +12,10 @@ type TextHeader = SvelteComponent<{
 };
 declare const TextHeader: $$__sveltets_2_IsomorphicComponent<{
     title?: string | undefined;
+    variant?: "default" | "compact" | undefined;
     subtitle?: string | undefined;
+    titleSideIcon?: string | null | undefined;
+    titleSideIconSize?: string | undefined;
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}, {}, string>;

package/dist/icons.d.ts

@@ -11,4 +11,12 @@ export namespace icons {
     let active: string;
     let pause: string;
     let total: string;
+    let shield: string;
+    let statistics: string;
+    let restart: string;
+    let lines: string;
+    let add: string;
+    let copy: string;
+    let warning: string;
+    let globe: string;
 }

package/dist/icons.js

@@ -9,6 +9,14 @@ export const icons = {
   help: '<svg width="14" height="18" viewBox="0 0 14 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.12598 1C8.80364 1 10.2761 1.41608 11.3467 2.30859C12.441 3.22103 13 4.53608 13 6.07031C13 8.64914 11.1429 9.84464 10.0557 10.5439L10.0498 10.5479C9.59811 10.834 9.28616 11.0529 9.08203 11.2695C8.90303 11.4596 8.86426 11.5868 8.86426 11.7109V12.0938C8.86426 12.2909 8.80556 12.474 8.70703 12.6289C9.12558 13.0883 9.38867 13.687 9.38867 14.3574C9.38856 15.8568 8.05087 17 6.60156 17C5.13309 16.9998 3.81554 15.875 3.81543 14.3574C3.81543 13.7321 4.03654 13.1746 4.39648 12.7324C4.25235 12.5591 4.16504 12.3368 4.16504 12.0938V11.7109C4.16504 9.40212 5.70071 8.25591 6.67773 7.51758C7.09258 7.20371 7.37411 6.98167 7.56445 6.75684C7.72926 6.56215 7.7763 6.42236 7.77637 6.27148C7.77637 5.9518 7.68601 5.82933 7.63672 5.78223C7.58081 5.72894 7.42619 5.62896 7.04883 5.62891C6.69244 5.62891 6.4936 5.74276 6.37793 5.86816C6.25387 6.00289 6.12603 6.25977 6.12598 6.70898C6.12598 7.26127 5.67826 7.70898 5.12598 7.70898H2C1.44772 7.70898 1 7.26127 1 6.70898C1.00007 5.04942 1.6296 3.59897 2.75098 2.57031C3.86552 1.54796 5.40077 1.00005 7.12598 1Z" stroke-width="1.5" stroke-linejoin="round"/></svg>',
   any_ai: '<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.88735 4.12364C8.03771 0.625957 12.9862 0.625724 14.1366 4.12364C14.5667 5.43135 15.5924 6.45705 16.9001 6.88716L16.9167 6.89268L16.9319 6.89821L17.0299 6.93273L17.0423 6.93688L17.0555 6.94171C20.3467 8.17272 20.3465 12.8508 17.0555 14.0818L17.0251 14.0929L16.9277 14.1267L16.9132 14.1315L16.9001 14.1364C15.5925 14.5665 14.5667 15.5921 14.1366 16.8999C12.9862 20.3975 8.03863 20.3981 6.88804 16.9006L6.88735 16.8999C6.45723 15.5922 5.43157 14.5665 4.12383 14.1364L4.12314 14.1357C0.625653 12.9851 0.626209 8.03752 4.12383 6.88716C5.43159 6.45704 6.45725 5.43121 6.88735 4.12364ZM12.3115 10.161L12.2687 10.1472L12.2279 10.1313L12.143 10.0975L12.1023 10.0816L12.0622 10.0622C11.4966 9.79891 11.06 9.31206 10.8628 8.71224L10.512 7.64467L10.1612 8.71224C9.93579 9.39762 9.39782 9.9356 8.71243 10.161L7.64556 10.5111L8.71243 10.8626L8.83949 10.9081C9.42249 11.139 9.88476 11.6012 10.1156 12.1842L10.1612 12.3113L10.512 13.3775L10.8628 12.3113C11.06 11.7116 11.4966 11.2247 12.0622 10.9613L12.1016 10.9427L12.143 10.9261L12.2279 10.8923L12.2687 10.8764L12.3115 10.8626L13.3784 10.5111L12.3115 10.161Z" stroke-width="3"/></svg>',
   active: '<svg width="13" height="15" viewBox="0 0 13 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 4.00724C1 1.59184 3.70874 0.166494 5.69922 1.53459L10.6387 4.93107C12.3726 6.12312 12.3726 8.68239 10.6387 9.87443L5.69922 13.2709C3.70874 14.639 1 13.2137 1 10.7983V4.00724Z" stroke-width="1.7"/></svg>',
-  pause: '<svg width="15" height="14" viewBox="0 0 15 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.8125 3.26984C5.8125 2.01624 4.73519 1 3.40625 1C2.07731 1 1 2.01624 1 3.26984V10.0794C1 11.333 2.07731 12.3492 3.40625 12.3492C4.73519 12.3492 5.8125 11.333 5.8125 10.0794V3.26984Z" stroke-width="1.7"/><path d="M13.25 3.26984C13.25 2.01624 12.1727 1 10.8438 1C9.51481 1 8.4375 2.01624 8.4375 3.26984V10.0794C8.4375 11.333 9.51481 12.3492 10.8438 12.3492C12.1727 12.3492 13.25 11.333 13.25 10.0794V3.26984Z" stroke-width="1.7"/></svg>',
-  total: '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.0909 7.54545C14.0909 3.9305 11.1604 1 7.54545 1C3.9305 1 1 3.9305 1 7.54545C1 11.1604 3.9305 14.0909 7.54545 14.0909C11.1604 14.0909 14.0909 11.1604 14.0909 7.54545Z" stroke-width="1.7"/></svg>',
-};
+  pause: '<svg width="15" height="14" viewBox="0 0 15 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.8125 3.26984C5.8125 2.01624 4.73519 1 3.40625 1C2.07731 1 1 2.01624 1 3.26984V10.0794C1 11.333 2.07731 12.3492 3.40625 12.3492C4.73519 12.3492 5.8125 11.333 5.8125 10.0794V3.26984Z" stroke-width="1.5"/><path d="M13.25 3.26984C13.25 2.01624 12.1727 1 10.8438 1C9.51481 1 8.4375 2.01624 8.4375 3.26984V10.0794C8.4375 11.333 9.51481 12.3492 10.8438 12.3492C12.1727 12.3492 13.25 11.333 13.25 10.0794V3.26984Z" stroke-width="1.5"/></svg>',
+  total: '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.0909 7.54545C14.0909 3.9305 11.1604 1 7.54545 1C3.9305 1 1 3.9305 1 7.54545C1 11.1604 3.9305 14.0909 7.54545 14.0909C11.1604 14.0909 14.0909 11.1604 14.0909 7.54545Z" stroke-width="2"/></svg>',
+  shield: '<svg width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.17969 1.17587C6.70138 0.941268 7.29862 0.941268 7.82031 1.17587L11.8203 2.97568C12.538 3.29863 13 4.01292 13 4.7999V7.06552C13 9.30605 11.97 11.426 10.207 12.7481L8.2002 14.253C7.48908 14.7864 6.51092 14.7864 5.7998 14.253L3.79297 12.7481C2.03009 11.426 1 9.30606 1 7.06552V4.7999C1.00004 4.01292 1.46202 3.29863 2.17969 2.97568L6.17969 1.17587Z" stroke-width="1.5" stroke-linejoin="round"/></svg>',
+  statistics: '<svg width="16" height="15" viewBox="0 0 16 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.16125 8.83871C6.16125 7.27093 5.04197 6 3.66125 6C2.28054 6 1.16125 7.27093 1.16125 8.83871V11.1613C1.16125 12.7291 2.28054 14 3.66125 14C5.04197 14 6.16125 12.7291 6.16125 11.1613V8.83871Z" stroke-width="1.5"/><path d="M14.1613 3.86C14.1613 2.28047 13.042 1 11.6613 1C10.2805 1 9.16125 2.28047 9.16125 3.86V11.14C9.16125 12.7195 10.2805 14 11.6613 14C13.042 14 14.1613 12.7195 14.1613 11.14V3.86Z" stroke-width="1.5"/></svg>',
+  restart: '<svg width="21" height="16" viewBox="0 0 21 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.042 1.87012L15.9668 1.90332L18.4326 1.9248L16.6484 3.62695L16.2246 4.03125C17.2954 5.19269 17.953 6.7371 17.9531 8.43652C17.9531 12.0772 14.9522 15 11.29 15C11.1834 15 11.0803 14.9958 10.9951 14.9922L10.0381 14.9512V10.7988L11.1084 10.874C11.1793 10.879 11.2374 10.8808 11.29 10.8809C12.6912 10.8809 13.7969 9.77025 13.7969 8.43652C13.7968 7.85203 13.5852 7.31302 13.2285 6.88965L12.6416 7.4502L10.9004 9.1084L10.9512 6.70508L11.0332 2.84863L11.0547 1.8623L12.042 1.87012ZM10.8682 5.20117L9.79785 5.12598C9.72692 5.12102 9.66883 5.11915 9.61621 5.11914C8.21502 5.11914 7.10938 6.22975 7.10938 7.56348C7.10945 8.14749 7.32058 8.68616 7.67676 9.10938L8.26465 8.5498L10.0059 6.8916L9.95508 9.29492L9.87305 13.1514L9.85156 14.1377L8.86426 14.1299L4.93945 14.0967L2.47363 14.0752L4.25781 12.373L4.68066 11.9678C3.61042 10.8064 2.9532 9.26241 2.95312 7.56348C2.95312 3.9228 5.95402 1 9.61621 1C9.72288 1.00001 9.82593 1.00416 9.91113 1.00781L10.8682 1.04883V5.20117Z" stroke-width="2"/></svg>',
+  lines: '<svg width="17" height="15" viewBox="0 0 17 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13 1H3.4C2.07452 1 1 2.10612 1 3.47059C1 4.83506 2.07452 5.94118 3.4 5.94118H13C14.3255 5.94118 15.4 4.83506 15.4 3.47059C15.4 2.10612 14.3255 1 13 1Z" stroke-width="1.5"/><path d="M7.4 8.41174H3.4C2.07452 8.41174 1 9.51786 1 10.8823C1 12.2468 2.07452 13.3529 3.4 13.3529H7.4C8.72548 13.3529 9.8 12.2468 9.8 10.8823C9.8 9.51786 8.72548 8.41174 7.4 8.41174Z" stroke-width="1.5"/></svg>',
+  add: '<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7 1C8.47276 1 9.66667 2.19391 9.66667 3.66667V4.33333H10.3333C11.8061 4.33333 13 5.52724 13 7C13 8.47276 11.8061 9.66667 10.3333 9.66667H9.66667V10.3333C9.66667 11.8061 8.47276 13 7 13C5.52724 13 4.33333 11.8061 4.33333 10.3333V9.66667H3.66667C2.19391 9.66667 1 8.47276 1 7C1 5.52724 2.19391 4.33333 3.66667 4.33333H4.33333V3.66667C4.33333 2.19391 5.52724 1 7 1Z" stroke-width="2"/></svg>',
+  copy: '<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_2405_287)"><path d="M4.59998 6.7373V11.2178C4.59998 12.6165 5.76404 13.7503 7.19998 13.7503H11.2C12.6359 13.7503 13.8 12.6165 13.8 11.2178V6.7373C13.8 5.33866 12.6359 4.20483 11.2 4.20483H7.19998C5.76404 4.20483 4.59998 5.33866 4.59998 6.7373Z" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M4.29995 10.7143H3.79995C2.36401 10.7143 1.19995 9.58045 1.19995 8.18181V3.70129C1.19995 2.30265 2.36401 1.16882 3.79995 1.16882H7.99995C9.32543 1.16882 10.4 2.21543 10.4 3.50649" stroke-width="1.5" stroke-linejoin="round"/></g><defs><clipPath id="clip0_2405_287"><rect width="15" height="15" /></clipPath></defs></svg>',
+  warning: '<svg width="16" height="14" viewBox="0 0 16 14" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_2446_239)"><path d="M3.73917 12.9058C1.65966 12.9058 0.380245 10.6945 1.46017 8.96679L5.63794 2.28311C6.67655 0.621614 9.15698 0.621615 10.1956 2.28311L14.3734 8.96679C15.4533 10.6945 14.1739 12.9058 12.0944 12.9058H3.73917Z" stroke-width="1.5"/><path d="M8.62167 8.00578C8.56795 8.35633 8.25141 8.60315 7.88688 8.60315C7.51627 8.60315 7.19632 8.34819 7.14711 7.99107C7.03741 7.19469 6.9707 6.17663 6.9707 5.18229V4.45801C6.9707 3.96168 7.38455 3.55933 7.89508 3.55933C8.40558 3.55933 8.81945 3.96168 8.81945 4.45801V5.18229C8.81945 6.2047 8.74098 7.22714 8.62167 8.00578ZM7.88514 10.8772C7.37822 10.8772 6.9707 10.4788 6.9707 10.0026C6.9707 9.51669 7.37822 9.11823 7.88514 9.11823C8.37218 9.11823 8.79957 9.51669 8.79957 10.0026C8.79957 10.4788 8.37218 10.8772 7.88514 10.8772Z" /></g><defs><clipPath id="clip0_2446_239"><rect width="16" height="14" "/></clipPath></defs></svg>',
+  globe: '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.261 1.21603C13.0417 0.802801 14.0107 0.996383 14.5725 1.67795L14.6868 1.83224L14.7844 1.99631C15.1298 2.64899 15.0489 3.43138 14.6155 3.99924C14.8643 4.71807 15.0002 5.48894 15.0002 6.28928C15.0002 8.56895 13.9094 10.5915 12.2229 11.8694C12.5296 12.2021 12.719 12.6448 12.719 13.133C12.7188 14.1643 11.8829 15.0001 10.8518 15.0002H5.14868C4.18186 15.0001 3.3868 14.2652 3.29126 13.3235L3.28149 13.133L3.29126 12.9416C3.33317 12.5295 3.50996 12.158 3.77563 11.8694C3.62723 11.7569 3.48371 11.6385 3.34497 11.5149C2.59429 11.7135 1.76855 11.4294 1.31372 10.7473C0.741714 9.88919 0.9741 8.72956 1.83228 8.15744L2.68774 7.58713L2.80981 7.51193C2.99465 7.40815 3.1917 7.33997 3.39185 7.30392C3.32022 6.97709 3.2815 6.63761 3.28149 6.28928C3.2816 3.68322 5.39417 1.57053 8.00024 1.57053C9.00867 1.57053 9.94236 1.88812 10.7092 2.42697C10.8438 2.21793 11.0211 2.03095 11.2415 1.884L12.0969 1.31369L12.261 1.21603ZM8.00024 5.30588C7.45692 5.30588 7.01597 5.74596 7.01587 6.28928C7.01588 6.8326 7.4568 7.27365 8.00024 7.27365C8.54367 7.27364 8.98461 6.8326 8.98462 6.28928C8.98452 5.74596 8.54356 5.30588 8.00024 5.30588Z" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>',
+};

package/dist/index.d.ts

@@ -9,6 +9,7 @@ export { default as BGGears } from "./Structure/BG/BGGears.svelte";
 export { default as Button } from "./Components/Button.svelte";
 export { default as IconButton } from "./Components/IconButton.svelte";
 export { default as LinearList } from "./Components/LinearList.svelte";
+export { default as LoadingSpinner } from "./Components/LoadingSpinner.svelte";
 export { default as Separator } from "./Components/Separator.svelte";
 export { default as TreeDirectory } from "./Components/TreeDirectory.svelte";
 export { default as InputBox } from "./Components/InputBox.svelte";
@@ -17,6 +18,8 @@ export { default as Tooltip } from "./Components/Tooltip.svelte";
 export { default as TabBar } from "./Components/TabBar.svelte";
 export { default as Dropdown } from "./Components/Dropdown.svelte";
 export { default as ContextMenu } from "./Components/ContextMenu.svelte";
+export { default as CodeBlock } from "./Components/CodeBlock.svelte";
+export { default as ScrollContainer } from "./Components/ScrollContainer.svelte";
 export { default as Popup } from "./Components/Popup/Popup.svelte";
 export { popupStore } from "./Components/Popup/popupStore.js";
 export { default as Toast } from "./Components/Toast/Toast.svelte";

package/dist/index.js

@@ -12,6 +12,7 @@ export { default as BGGears } from "./Structure/BG/BGGears.svelte";
 export { default as Button } from "./Components/Button.svelte";
 export { default as IconButton } from "./Components/IconButton.svelte";
 export { default as LinearList } from "./Components/LinearList.svelte";
+export { default as LoadingSpinner } from "./Components/LoadingSpinner.svelte";
 export { default as Separator } from "./Components/Separator.svelte";
 export { default as TreeDirectory } from "./Components/TreeDirectory.svelte";
 export { default as InputBox } from "./Components/InputBox.svelte";
@@ -20,6 +21,8 @@ export { default as Tooltip } from "./Components/Tooltip.svelte";
 export { default as TabBar } from "./Components/TabBar.svelte";
 export { default as Dropdown } from "./Components/Dropdown.svelte";
 export { default as ContextMenu } from "./Components/ContextMenu.svelte";
+export { default as CodeBlock } from "./Components/CodeBlock.svelte";
+export { default as ScrollContainer } from "./Components/ScrollContainer.svelte";
 export { default as Popup } from "./Components/Popup/Popup.svelte";
 export { popupStore } from "./Components/Popup/popupStore.js";
 export { default as Toast } from "./Components/Toast/Toast.svelte";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coyalabs/bts-style",
-  "version": "1.3.10",
+  "version": "1.3.12",
   "description": "BTS Theme Svelte component templates",
   "type": "module",
   "exports": {
@@ -21,7 +21,7 @@
   ],
   "scripts": {
     "build": "svelte-kit sync && svelte-package -o dist",
-    "package": "npm run build && echo Copying package to node_modules... && xcopy /E /I /Y dist C:\\Users\\Alan\\Documents\\GitHub\\coya-api-backend\\subservice\\subservice_api\\cpaas_frontend\\node_modules\\@coyalabs\\bts-style\\dist && xcopy /E /I /Y public C:\\Users\\Alan\\Documents\\GitHub\\coya-api-backend\\subservice\\subservice_api\\cpaas_frontend\\node_modules\\@coyalabs\\bts-style\\public && copy /Y package.json C:\\Users\\Alan\\Documents\\GitHub\\coya-api-backend\\subservice\\subservice_api\\cpaas_frontend\\node_modules\\@coyalabs\\bts-style\\ && echo Copy complete!",
+    "package": "npm run build && echo Copying package to node_modules... && xcopy /E /I /Y dist C:\\Users\\Alan\\Documents\\GitHub\\coya-server-bck\\src\\subservice\\subservice_api\\cpaas_frontend\\node_modules\\@coyalabs\\bts-style\\dist && xcopy /E /I /Y public C:\\Users\\Alan\\Documents\\GitHub\\coya-server-bck\\src\\subservice\\subservice_api\\cpaas_frontend\\node_modules\\@coyalabs\\bts-style\\public && copy /Y package.json C:\\Users\\Alan\\Documents\\GitHub\\coya-server-bck\\src\\subservice\\subservice_api\\cpaas_frontend\\node_modules\\@coyalabs\\bts-style\\ && echo Copy complete!",
     "prepublishOnly": "npm run build",
     "release": "npm version patch && npm publish --access public"
   },