svseeds 0.3.3 → 0.3.5

package/_svseeds/_HotkeyCapture.svelte.d.ts

@@ -4,12 +4,12 @@ export type HotkeyCaptureProps = {
     active?: boolean;
     disabled?: boolean;
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
     element?: HTMLInputElement;
 };
 export type HotkeyCaptureReqdProps = never;
 export type HotkeyCaptureBindProps = "value" | "active" | "disable" | "status" | "element";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const HotkeyCapture: import("svelte").Component<HotkeyCaptureProps, {}, "active" | "value" | "disabled" | "status" | "element">;
 type HotkeyCapture = ReturnType<typeof HotkeyCapture>;
 export default HotkeyCapture;

package/_svseeds/_Modal.svelte

@@ -6,17 +6,16 @@
     closable?: boolean, // <true>
     trigger?: HTMLElement, // bindable
     status?: string, // bindable <STATE.DEFAULT>
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
     element?: HTMLDialogElement, // bindable
   };
   export type ModalReqdProps = "children";
   export type ModalBindProps = "open" | "status" | "element";
 
-  const svs = "svs-modal";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-modal";
 
   import { type Snippet, untrack } from "svelte";
-  import { type ClassRuleSet, STATE, AREA, fnClass } from "./core";
+  import { type SVSStyle, STATE, AREA, fnClass } from "./core";
 </script>
 
 <script lang="ts">
@@ -24,7 +23,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
 
   // *** Bind Handlers *** //
   $effect(() => {

package/_svseeds/_Modal.svelte.d.ts

@@ -5,13 +5,13 @@ export type ModalProps = {
     closable?: boolean;
     trigger?: HTMLElement;
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
     element?: HTMLDialogElement;
 };
 export type ModalReqdProps = "children";
 export type ModalBindProps = "open" | "status" | "element";
 import { type Snippet } from "svelte";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const Modal: import("svelte").Component<ModalProps, {}, "open" | "status" | "element" | "trigger">;
 type Modal = ReturnType<typeof Modal>;
 export default Modal;

package/_svseeds/_ProgressTracker.svelte

@@ -6,17 +6,16 @@
     extra?: Snippet<[string, number]>, // Snippet<[status,index]>
     status?: string, // bindable <STATE.DEFAULT>
     eachStatus?: SvelteMap<number, string> | Map<number, string>,
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
   };
   export type ProgressTrackerReqdProps = "current" | "labels";
   export type ProgressTrackerBindProps = "current" | "status";
 
-  const svs = "svs-progress-tracker";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-progress-tracker";
 
   import { type Snippet } from "svelte";
   import { type SvelteMap } from "svelte/reactivity";
-  import { type ClassRuleSet, STATE, AREA, fnClass } from "./core";
+  import { type SVSStyle, STATE, AREA, fnClass } from "./core";
 </script>
 
 <script lang="ts">
@@ -24,7 +23,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
 
   // *** Status *** //
   function getEachStatus(index: number): string {

package/_svseeds/_ProgressTracker.svelte.d.ts

@@ -5,13 +5,13 @@ export type ProgressTrackerProps = {
     extra?: Snippet<[string, number]>;
     status?: string;
     eachStatus?: SvelteMap<number, string> | Map<number, string>;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
 };
 export type ProgressTrackerReqdProps = "current" | "labels";
 export type ProgressTrackerBindProps = "current" | "status";
 import { type Snippet } from "svelte";
 import { type SvelteMap } from "svelte/reactivity";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const ProgressTracker: import("svelte").Component<ProgressTrackerProps, {}, "status" | "current">;
 type ProgressTracker = ReturnType<typeof ProgressTracker>;
 export default ProgressTracker;

package/_svseeds/_SelectField.svelte

@@ -11,7 +11,7 @@
     descFirst?: boolean, // <false>
     validations?: ((value: string, validity?: ValidityState) => string)[],
     status?: string, // bindable <STATE.DEFAULT>
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
     attributes?: HTMLSelectAttributes;
     action?: Action,
     element?: HTMLSelectElement, // bindable
@@ -20,14 +20,13 @@
   export type SelectFieldBindProps = "value" | "status" | "element";
 
   type SelectFieldTarget = { currentTarget: EventTarget & HTMLSelectElement };
-  const svs = "svs-select-field";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-select-field";
 
   import { type Snippet, untrack } from "svelte";
   import { type Action } from "svelte/action";
   import { type SvelteMap } from "svelte/reactivity";
   import { type HTMLSelectAttributes } from "svelte/elements";
-  import { type ClassRuleSet, STATE, AREA, elemId, fnClass, isNeutral, omit } from "./core";
+  import { type SVSStyle, STATE, AREA, elemId, fnClass, isNeutral, omit } from "./core";
 </script>
 
 <script lang="ts">
@@ -35,7 +34,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
   const id = attributes?.id ? attributes.id : elemId.get(label?.trim());
   const idLabel = elemId.get(label?.trim());
   const idDesc = elemId.get(bottom?.trim());
@@ -56,8 +55,8 @@
     message = msg ?? bottom;
     element?.setCustomValidity(msg ?? "");
   }
-  function validate() {
-    if (!value) return toNonInvalid(neutral);
+  function validate(oninvalid?: boolean) {
+    if (!value && !oninvalid) return toNonInvalid(neutral);
     for (const v of validations) {
       const msg = v(value, element?.validity);
       if (msg) return toInvalid(msg);
@@ -76,7 +75,7 @@
   function oninvalid(ev: Event & SelectFieldTarget) {
     attributes?.oninvalid?.(ev);
     ev.preventDefault();
-    validate();
+    validate(true);
     if (status !== STATE.INACTIVE) toInvalid(element?.validationMessage);
   }
 </script>

package/_svseeds/_SelectField.svelte.d.ts

@@ -10,7 +10,7 @@ export type SelectFieldProps = {
     descFirst?: boolean;
     validations?: ((value: string, validity?: ValidityState) => string)[];
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
     attributes?: HTMLSelectAttributes;
     action?: Action;
     element?: HTMLSelectElement;
@@ -21,7 +21,7 @@ import { type Snippet } from "svelte";
 import { type Action } from "svelte/action";
 import { type SvelteMap } from "svelte/reactivity";
 import { type HTMLSelectAttributes } from "svelte/elements";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const SelectField: import("svelte").Component<SelectFieldProps, {}, "value" | "status" | "element">;
 type SelectField = ReturnType<typeof SelectField>;
 export default SelectField;

package/_svseeds/_Slider.svelte

@@ -8,7 +8,7 @@
     options?: SvelteSet<number> | Set<number>,
     background?: Range, // <{ min: 5, max: 95 }>
     status?: string, // bindable <STATE.DEFAULT>
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
     attributes?: HTMLInputAttributes,
     action?: Action,
     element?: HTMLInputElement, // bindable
@@ -17,14 +17,13 @@
   export type SliderBindProps = "min" | "max" | "value" | "status" | "element";
   export type Range = { min: number, max: number };
 
-  const svs = "svs-slider";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-slider";
 
   import { type Snippet } from "svelte";
   import { type Action } from "svelte/action";
   import { type SvelteSet } from "svelte/reactivity";
   import { type HTMLInputAttributes } from "svelte/elements";
-  import { type ClassRuleSet, STATE, AREA, elemId, fnClass, omit } from "./core";
+  import { type SVSStyle, STATE, AREA, elemId, fnClass, omit } from "./core";
 </script>
 
 <script lang="ts">
@@ -32,7 +31,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
   const idList = elemId.get(options?.size);
   const attrs = omit(attributes, "class", "type", "value", "min", "max", "step", "list");
   if (range.min > range.max) range = { min: range.max, max: range.min };

package/_svseeds/_Slider.svelte.d.ts

@@ -7,7 +7,7 @@ export type SliderProps = {
     options?: SvelteSet<number> | Set<number>;
     background?: Range;
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
     attributes?: HTMLInputAttributes;
     action?: Action;
     element?: HTMLInputElement;
@@ -22,7 +22,7 @@ import { type Snippet } from "svelte";
 import { type Action } from "svelte/action";
 import { type SvelteSet } from "svelte/reactivity";
 import { type HTMLInputAttributes } from "svelte/elements";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const Slider: import("svelte").Component<SliderProps, {}, "value" | "status" | "range" | "element">;
 type Slider = ReturnType<typeof Slider>;
 export default Slider;

package/_svseeds/_Sortable.svelte

@@ -6,8 +6,7 @@
   const confirmTime = 500 // (ms) define how long to hover on item to confirm
   const triggerDrag: TriggerButton[] = ["main"]; // define draggable by which buttons
   const triggerSelect: TriggerButton[] = ["main"]; // define selectable by which buttons (for multi select)
-  const svs = "svs-sortable";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-sortable";
 
   /***************************************************************/
 
@@ -25,7 +24,7 @@
     appendable?: boolean, // enable append when enter group area <false>
     confirm?: boolean     // enable confirm interval time to move items <false>
     status?: string, // bindable <STATE.DEFAULT>
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
   };
   export type SortableReqdProps = "items" | "item";
   export type SortableBindProps = "status";
@@ -604,7 +603,7 @@
   import { on } from "svelte/events";
   import { type EasingFunction, crossfade } from "svelte/transition";
   import { flip } from "svelte/animate";
-  import { type ClassRuleSet, STATE, AREA, fnClass, throttle } from "./core";
+  import { type SVSStyle, STATE, AREA, fnClass, throttle } from "./core";
 </script>
 
 <script lang="ts">
@@ -612,7 +611,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
   const group: KeyValue = SortableItems._newItem(name);
   const elems: HTMLElement[] = [];
   const shadow = new Shadow(ghost);

package/_svseeds/_Sortable.svelte.d.ts

@@ -13,7 +13,7 @@ export type SortableProps = {
     appendable?: boolean;
     confirm?: boolean;
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
 };
 export type SortableReqdProps = "items" | "item";
 export type SortableBindProps = "status";
@@ -56,7 +56,7 @@ type KeyValue = {
 };
 type DragState = "ready" | "dragging" | "idle";
 import { type Snippet } from "svelte";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const Sortable: import("svelte").Component<SortableProps, {}, "status">;
 type Sortable = ReturnType<typeof Sortable>;
 export default Sortable;

package/_svseeds/_Tabs.svelte

@@ -4,15 +4,14 @@
     labels?: string[],
     current?: number, // bindable <0>
     status?: string, // bindable <STATE.DEFAULT>
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
     [key: string]: unknown | Snippet,
   };
   export type TabsReqdProps = never;
   export type TabsBindProps = "current" | "status";
 
   type NamedId = { id: string, name: string };
-  const svs = "svs-tabs";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-tabs";
   const roleLabel = "label";
   const rolePanel = "panel";
 
@@ -31,7 +30,7 @@
   }
 
   import { type Snippet } from "svelte";
-  import { type ClassRuleSet, STATE, AREA, elemId, fnClass } from "./core";
+  import { type SVSStyle, STATE, AREA, elemId, fnClass } from "./core";
 </script>
 
 <script lang="ts">
@@ -39,7 +38,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
   const isStrLabel = labels.length > 0;
   const tabs = toNamedId(isStrLabel ? labels : getSnippetNames(roleLabel, rest));
   const panels = toNamedId(getSnippetNames(rolePanel, rest));

package/_svseeds/_Tabs.svelte.d.ts

@@ -3,13 +3,13 @@ export type TabsProps = {
     labels?: string[];
     current?: number;
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
     [key: string]: unknown | Snippet;
 };
 export type TabsReqdProps = never;
 export type TabsBindProps = "current" | "status";
 import { type Snippet } from "svelte";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const Tabs: import("svelte").Component<TabsProps, {}, "status" | "current">;
 type Tabs = ReturnType<typeof Tabs>;
 export default Tabs;

package/_svseeds/_TextField.svelte

@@ -12,7 +12,7 @@
     descFirst?: boolean, // <false>
     validations?: ((value: string, validity?: ValidityState) => string)[],
     status?: string, // bindable <STATE.DEFAULT>
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
     attributes?: HTMLInputAttributes | HTMLTextareaAttributes,
     action?: Action,
     element?: HTMLInputElement | HTMLTextAreaElement, // bindable
@@ -20,14 +20,13 @@
   export type TextFieldReqdProps = never;
   export type TextFieldBindProps = "value" | "type" | "status" | "element";
 
-  const svs = "svs-text-field";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-text-field";
 
   import { type Snippet, untrack } from "svelte";
   import { type Action } from "svelte/action";
   import { type SvelteSet } from "svelte/reactivity";
   import { type HTMLInputAttributes, type HTMLTextareaAttributes } from "svelte/elements";
-  import { type ClassRuleSet, STATE, AREA, elemId, fnClass, isNeutral, omit } from "./core";
+  import { type SVSStyle, STATE, AREA, elemId, fnClass, isNeutral, omit } from "./core";
 </script>
 
 <script lang="ts">
@@ -35,7 +34,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
   const id = attributes?.id ? attributes.id : elemId.get(label?.trim());
   const idLabel = elemId.get(label?.trim());
   const idDesc = elemId.get(bottom?.trim());
@@ -57,8 +56,8 @@
     message = msg ?? bottom;
     element?.setCustomValidity(msg ?? "");
   }
-  function validate() {
-    if (!value) return toNonInvalid(neutral);
+  function validate(oninvalid?: boolean) {
+    if (!value && !oninvalid) return toNonInvalid(neutral);
     for (const v of validations) {
       const msg = v(value, element?.validity);
       if (msg) return toInvalid(msg);
@@ -84,7 +83,7 @@
   function oninvalid(ev: Event) {
     attributes?.oninvalid?.(ev as any);
     ev.preventDefault();
-    validate();
+    validate(true);
     if (status !== STATE.INACTIVE) toInvalid(element?.validationMessage);
   }
 </script>

package/_svseeds/_TextField.svelte.d.ts

@@ -11,7 +11,7 @@ export type TextFieldProps = {
     descFirst?: boolean;
     validations?: ((value: string, validity?: ValidityState) => string)[];
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
     attributes?: HTMLInputAttributes | HTMLTextareaAttributes;
     action?: Action;
     element?: HTMLInputElement | HTMLTextAreaElement;
@@ -22,7 +22,7 @@ import { type Snippet } from "svelte";
 import { type Action } from "svelte/action";
 import { type SvelteSet } from "svelte/reactivity";
 import { type HTMLInputAttributes, type HTMLTextareaAttributes } from "svelte/elements";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const TextField: import("svelte").Component<TextFieldProps, {}, "type" | "value" | "status" | "element">;
 type TextField = ReturnType<typeof TextField>;
 export default TextField;

package/_svseeds/_Toggle.svelte

@@ -7,7 +7,7 @@
     value?: boolean, // bindable <true>
     type?: "button" | "switch", // <"button">
     status?: string, // bindable <STATE.DEFAULT>
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
     attributes?: HTMLButtonAttributes;
     action?: Action,
     element?: HTMLButtonElement, // bindable
@@ -16,13 +16,12 @@
   export type ToggleBindProps = "value" | "status" | "element";
 
   type ToggleTarget = { currentTarget: EventTarget & HTMLButtonElement };
-  const svs = "svs-toggle";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-toggle";
 
   import { type Snippet, untrack } from "svelte";
   import { type Action } from "svelte/action";
   import { type HTMLButtonAttributes } from "svelte/elements";
-  import { type ClassRuleSet, STATE, AREA, fnClass, isNeutral, omit } from "./core";
+  import { type SVSStyle, STATE, AREA, fnClass, isNeutral, omit } from "./core";
 </script>
 
 <script lang="ts">
@@ -30,7 +29,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
   const attrs = omit(attributes, "class", "id", "type", "role", "aria-checked", "onclick");
   let neutral = isNeutral(status) ? status : STATE.DEFAULT;
 

package/_svseeds/_Toggle.svelte.d.ts

@@ -6,7 +6,7 @@ export type ToggleProps = {
     value?: boolean;
     type?: "button" | "switch";
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
     attributes?: HTMLButtonAttributes;
     action?: Action;
     element?: HTMLButtonElement;
@@ -16,7 +16,7 @@ export type ToggleBindProps = "value" | "status" | "element";
 import { type Snippet } from "svelte";
 import { type Action } from "svelte/action";
 import { type HTMLButtonAttributes } from "svelte/elements";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const Toggle: import("svelte").Component<ToggleProps, {}, "value" | "status" | "element">;
 type Toggle = ReturnType<typeof Toggle>;
 export default Toggle;

package/_svseeds/_TogglesField.svelte

@@ -10,7 +10,7 @@
     descFirst?: boolean, // <false>
     validations?: ((values: string[], validities?: ValidityState[]) => string)[],
     status?: string, // bindable <STATE.DEFAULT>
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
     attributes?: HTMLButtonAttributes;
     action?: Action,
     elements?: HTMLButtonElement[], // bindable
@@ -19,14 +19,13 @@
   export type TogglesFieldBindProps = "values" | "status" | "elements";
 
   type TogglesFieldTarget = { currentTarget: EventTarget & HTMLButtonElement };
-  const svs = "svs-toggles-field";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-toggles-field";
 
   import { type Snippet, untrack } from "svelte";
   import { type Action } from "svelte/action";
   import { type SvelteMap } from "svelte/reactivity";
   import { type HTMLButtonAttributes } from "svelte/elements";
-  import { type ClassRuleSet, STATE, AREA, elemId, fnClass, isNeutral, omit } from "./core";
+  import { type SVSStyle, STATE, AREA, elemId, fnClass, isNeutral, omit } from "./core";
 </script>
 
 <script lang="ts">
@@ -34,7 +33,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
   const role = multiple ? "checkbox" : "radio";
   const idLabel = elemId.get(label?.trim());
   const idDesc = elemId.get(bottom?.trim());
@@ -58,8 +57,8 @@
     message = stat === STATE.INACTIVE ? msg ?? bottom : bottom;
     elem?.setCustomValidity(msg ?? "");
   }
-  function validate() {
-    if (!values.length) return toNonInvalid();
+  function validate(oninvalid?: boolean) {
+    if (!values.length && !oninvalid) return toNonInvalid();
     const validities = elements.map((x) => x.validity);
     for (const v of validations) {
       const msg = v(values, validities);
@@ -88,6 +87,7 @@
     attributes?.oninvalid?.(ev as any);
     ev.preventDefault();
     phase.submit = true;
+    validate(true);
     if (status !== STATE.INACTIVE) toInvalid(elem?.validationMessage);
   }
 </script>

package/_svseeds/_TogglesField.svelte.d.ts

@@ -9,7 +9,7 @@ export type TogglesFieldProps = {
     descFirst?: boolean;
     validations?: ((values: string[], validities?: ValidityState[]) => string)[];
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
     attributes?: HTMLButtonAttributes;
     action?: Action;
     elements?: HTMLButtonElement[];
@@ -20,7 +20,7 @@ import { type Snippet } from "svelte";
 import { type Action } from "svelte/action";
 import { type SvelteMap } from "svelte/reactivity";
 import { type HTMLButtonAttributes } from "svelte/elements";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const TogglesField: import("svelte").Component<TogglesFieldProps, {}, "elements" | "status" | "values">;
 type TogglesField = ReturnType<typeof TogglesField>;
 export default TogglesField;

package/_svseeds/_Tooltip.svelte

@@ -6,7 +6,7 @@
     align?: Align, // "center"
     offset?: Vector, // <{ x: 0, y: 0 }>
     status?: string, // bindable <STATE.DEFAULT>
-    style?: ClassRuleSet | string,
+    style?: SVSStyle,
     element?: HTMLDivElement, // bindable
   };
   export type TooltipReqdProps = never;
@@ -23,8 +23,7 @@
 
   type valueof<T> = T[keyof T];
   type Unlisten = () => void;
-  const svs = "svs-tooltip";
-  const preset: ClassRuleSet = {};
+  const preset = "svs-tooltip";
   const INIT_VEC = { x: 0, y: 0 };
   const VISIBLE = {
     NONE: 0,
@@ -229,7 +228,7 @@
   import { type Snippet, untrack } from "svelte";
   import { on } from "svelte/events";
   import { type Action, type ActionReturn } from "svelte/action";
-  import { type ClassRuleSet, STATE, AREA, elemId, fnClass, throttle } from "./core";
+  import { type SVSStyle, STATE, AREA, elemId, fnClass, throttle } from "./core";
 </script>
 
 <script lang="ts">
@@ -237,7 +236,7 @@
 
   // *** Initialize *** //
   if (!status) status = STATE.DEFAULT;
-  const cls = fnClass(svs, preset, style);
+  const cls = fnClass(preset, style);
   const id = core.register(name);
   let point: Vector = $state.raw(INIT_VEC);
 

package/_svseeds/_Tooltip.svelte.d.ts

@@ -5,7 +5,7 @@ export type TooltipProps = {
     align?: Align;
     offset?: Vector;
     status?: string;
-    style?: ClassRuleSet | string;
+    style?: SVSStyle;
     element?: HTMLDivElement;
 };
 export type TooltipReqdProps = never;
@@ -25,7 +25,7 @@ export type Position = "top" | "left" | "bottom" | "right";
 export type Align = "start" | "center" | "end";
 import { type Snippet } from "svelte";
 import { type Action, type ActionReturn } from "svelte/action";
-import { type ClassRuleSet } from "./core";
+import { type SVSStyle } from "./core";
 declare const Tooltip: import("svelte").Component<TooltipProps, {}, "status" | "element">;
 type Tooltip = ReturnType<typeof Tooltip>;
 export default Tooltip;

package/_svseeds/core.d.ts

@@ -1,6 +1,7 @@
-export { type ClassRuleSet, CONST, STATE, AREA, elemId, fnClass, isNeutral, omit, debounce, throttle, UniqueId, };
-type ClassRule = Partial<Record<string, string>>;
+export { type SVSStyle, CONST, STATE, AREA, elemId, fnClass, isNeutral, omit, debounce, throttle, UniqueId, };
+type ClassRule = Record<string, string>;
 type ClassRuleSet = Partial<Record<string, ClassRule>>;
+type SVSStyle = ClassRuleSet | ClassRule | string;
 declare const CONST = "const";
 declare const STATE: Readonly<{
     DEFAULT: "default";
@@ -27,7 +28,7 @@ declare class UniqueId {
 }
 declare const elemId: UniqueId;
 type ClassFn = (area: string, status: string) => string | undefined;
-declare function fnClass(name: string, preset: ClassRuleSet, style?: ClassRuleSet | string): ClassFn;
+declare function fnClass(preset: SVSStyle, style?: SVSStyle): ClassFn;
 declare function isNeutral(status: string): boolean;
 declare function omit<T extends object, K extends keyof T>(obj?: T, ...keys: K[]): Omit<T, K> | Record<string, never>;
 declare function debounce<Args extends unknown[], R>(delay: number, fn: (...args: Args) => R): (...args: Args) => void;

package/_svseeds/core.js

@@ -1 +1 @@
-var t=this&&this.__assign||function(){return t=Object.assign||function(t){for(var r,e=1,n=arguments.length;e<n;e++)for(var i in r=arguments[e])Object.prototype.hasOwnProperty.call(r,i)&&(t[i]=r[i]);return t},t.apply(this,arguments)},r=this&&this.__classPrivateFieldSet||function(t,r,e,n,i){if("m"===n)throw new TypeError("Private method is not writable");if("a"===n&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof r?t!==r||!i:!r.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===n?i.call(t,e):i?i.value=e:r.set(t,e),e},e=this&&this.__classPrivateFieldGet||function(t,r,e,n){if("a"===e&&!n)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof r?t!==r||!n:!r.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===e?n:"a"===e?n.call(t):n?n.value:r.get(t)},n=this&&this.__spreadArray||function(t,r,e){if(e||2===arguments.length)for(var n,i=0,o=r.length;i<o;i++)!n&&i in r||(n||(n=Array.prototype.slice.call(r,0,i)),n[i]=r[i]);return t.concat(n||Array.prototype.slice.call(r))};export{i as CONST,o as STATE,a as AREA,u as elemId,l as fnClass,f as isNeutral,s as omit,h as debounce,v as throttle,c as UniqueId};var i="const",o=Object.freeze({DEFAULT:"default",ACTIVE:"active",INACTIVE:"inactive"}),a=Object.freeze({WHOLE:"whole",MIDDLE:"middle",MAIN:"main",TOP:"top",LEFT:"left",RIGHT:"right",BOTTOM:"bottom",LABEL:"label",AUX:"aux",EXTRA:"extra"}),c=function(){function t(t){void 0===t&&(t=4),i.add(this),c.set(this,new Set),u.set(this,4),t>2&&r(this,u,t,"f")}var i,o,a,c,u,l,f,s;return Object.defineProperty(t.prototype,"id",{get:function(){return this.get(!0)},enumerable:!1,configurable:!0}),t.prototype.get=function(t){if(t)return e(this,c,"f").size>1e4&&e(this,c,"f").clear(),e(this,i,"m",s).call(this)},o=t,c=new WeakMap,u=new WeakMap,i=new WeakSet,l=function(){return e(o,o,"f",a)[Math.trunc(Math.random()*e(o,o,"f",a).length)]},f=function(){var t=this;return String.fromCharCode.apply(String,Array(e(this,u,"f")).fill(null).map((function(){return e(t,i,"m",l).call(t)})))},s=function(){for(var t=e(this,i,"m",f).call(this);e(this,c,"f").has(t);)t=e(this,i,"m",f).call(this);return e(this,c,"f").add(t),t},a={value:n(n([],Array.from(Array(25).keys(),(function(t){return t+65})),!0),Array.from(Array(25).keys(),(function(t){return t+97})),!0)},t}(),u=new c;function l(r,e,a){var c=function(r,e,i){if("string"==typeof i)return i.trim()?i:r;var o=function(r,e){var i=Object.keys(r);if(i.length<=0)return e;var o=Object.keys(e);if(o.length<=0)return r;var a={};return new Set(n(n([],i,!0),o,!0)).forEach((function(n){var i,o;a[n]=t(t({},null!==(i=r[n])&&void 0!==i?i:{}),null!==(o=e[n])&&void 0!==o?o:{})})),a}(e,i);return Object.keys(o).length<=0?r:o}(r,e,null!=a?a:{});return"string"==typeof c?function(t,r){return function(t,r,e){return"".concat(t," ").concat(r).concat(e===o.DEFAULT?"":" ".concat(e))}(c,t,r)}:function(t,r){return function(t,r,e){var n,a,c,u,l,f,s=null!==(a=null===(n=t[r])||void 0===n?void 0:n[i])&&void 0!==a?a:"",h=null!==(f=null!==(u=null===(c=t[r])||void 0===c?void 0:c[e])&&void 0!==u?u:null===(l=t[r])||void 0===l?void 0:l[o.DEFAULT])&&void 0!==f?f:"";return""===s&&""===h?void 0:"".concat(s).concat(s&&h?" ":"").concat(h)}(c,t,r)}}function f(t){return t!==o.ACTIVE&&t!==o.INACTIVE}function s(r){for(var e=[],n=1;n<arguments.length;n++)e[n-1]=arguments[n];if(!r)return{};var i=t({},r);return e.forEach((function(t){return delete i[t]})),i}function h(t,r){var e;return function(){for(var i=[],o=0;o<arguments.length;o++)i[o]=arguments[o];e&&clearTimeout(e),e=setTimeout((function(){r.call.apply(r,n([null],i,!1))}),t)}}function v(t,r){var e,i=0,o=function(){return Date.now()-i},a=function(t){r.call.apply(r,n([null],t,!1)),i=Date.now()};return function(){for(var r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];if(!i)return a(r);clearTimeout(e),e=setTimeout((function(){o()>=t&&a(r)}),t-o())}}
+var t=this&&this.__assign||function(){return t=Object.assign||function(t){for(var r,e=1,n=arguments.length;e<n;e++)for(var i in r=arguments[e])Object.prototype.hasOwnProperty.call(r,i)&&(t[i]=r[i]);return t},t.apply(this,arguments)},r=this&&this.__classPrivateFieldSet||function(t,r,e,n,i){if("m"===n)throw new TypeError("Private method is not writable");if("a"===n&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof r?t!==r||!i:!r.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===n?i.call(t,e):i?i.value=e:r.set(t,e),e},e=this&&this.__classPrivateFieldGet||function(t,r,e,n){if("a"===e&&!n)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof r?t!==r||!n:!r.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===e?n:"a"===e?n.call(t):n?n.value:r.get(t)},n=this&&this.__spreadArray||function(t,r,e){if(e||2===arguments.length)for(var n,i=0,o=r.length;i<o;i++)!n&&i in r||(n||(n=Array.prototype.slice.call(r,0,i)),n[i]=r[i]);return t.concat(n||Array.prototype.slice.call(r))};export{i as CONST,o as STATE,a as AREA,u as elemId,l as fnClass,s as isNeutral,h as omit,v as debounce,d as throttle,c as UniqueId};var i="const",o=Object.freeze({DEFAULT:"default",ACTIVE:"active",INACTIVE:"inactive"}),a=Object.freeze({WHOLE:"whole",MIDDLE:"middle",MAIN:"main",TOP:"top",LEFT:"left",RIGHT:"right",BOTTOM:"bottom",LABEL:"label",AUX:"aux",EXTRA:"extra"}),c=function(){function t(t){void 0===t&&(t=4),i.add(this),c.set(this,new Set),u.set(this,4),t>2&&r(this,u,t,"f")}var i,o,a,c,u,l,f,s;return Object.defineProperty(t.prototype,"id",{get:function(){return this.get(!0)},enumerable:!1,configurable:!0}),t.prototype.get=function(t){if(t)return e(this,c,"f").size>1e4&&e(this,c,"f").clear(),e(this,i,"m",s).call(this)},o=t,c=new WeakMap,u=new WeakMap,i=new WeakSet,l=function(){return e(o,o,"f",a)[Math.trunc(Math.random()*e(o,o,"f",a).length)]},f=function(){var t=this;return String.fromCharCode.apply(String,Array(e(this,u,"f")).fill(null).map((function(){return e(t,i,"m",l).call(t)})))},s=function(){for(var t=e(this,i,"m",f).call(this);e(this,c,"f").has(t);)t=e(this,i,"m",f).call(this);return e(this,c,"f").add(t),t},a={value:n(n([],Array.from(Array(25).keys(),(function(t){return t+65})),!0),Array.from(Array(25).keys(),(function(t){return t+97})),!0)},t}(),u=new c;function l(t,r){var e,n=null!==(e=f(r))&&void 0!==e?e:f(t);return null==n?function(t,r){}:"string"==typeof n?function(t,r){return"".concat(n," ").concat(t," ").concat(r)}:function(t,r){return function(t,r,e){var n,a,c,u,l,f,s=null!==(a=null===(n=t[r])||void 0===n?void 0:n[i])&&void 0!==a?a:"",h=null!==(f=null!==(u=null===(c=t[r])||void 0===c?void 0:c[e])&&void 0!==u?u:null===(l=t[r])||void 0===l?void 0:l[o.DEFAULT])&&void 0!==f?f:"";if(!s&&!h)return;return"".concat(s).concat(s&&h?" ":"").concat(h)}(n,t,r)}}function f(t){if(null!=t){if("string"==typeof t)return t.trim()?t:void 0;var r=Object.values(t);if(r.length)return"string"!=typeof r[0]?t:Object.fromEntries(Object.entries(t).map((function(t){return[t[0],{const:t[1]}]})))}}function s(t){return t!==o.ACTIVE&&t!==o.INACTIVE}function h(r){for(var e=[],n=1;n<arguments.length;n++)e[n-1]=arguments[n];if(!r)return{};var i=t({},r);return e.forEach((function(t){return delete i[t]})),i}function v(t,r){var e;return function(){for(var i=[],o=0;o<arguments.length;o++)i[o]=arguments[o];e&&clearTimeout(e),e=setTimeout((function(){r.call.apply(r,n([null],i,!1))}),t)}}function d(t,r){var e,i=0,o=function(){return Date.now()-i},a=function(t){r.call.apply(r,n([null],t,!1)),i=Date.now()};return function(){for(var r=[],n=0;n<arguments.length;n++)r[n]=arguments[n];if(!i)return a(r);clearTimeout(e),e=setTimeout((function(){o()>=t&&a(r)}),t-o())}}