@wirekyt/svelte 0.0.4 → 0.0.6

package/dist/components/angle-slider/value-text.svelte

@@ -12,9 +12,15 @@
   import { Wire } from "../factory";
   import { useAngleSliderContext } from "./use-context";
 
-  let { ref = $bindable(null), ...props }: AngleSliderValueTextProps = $props();
+  let { ref = $bindable(null), children, ...props }: AngleSliderValueTextProps = $props();
   const angleSlider = useAngleSliderContext();
   const mergedProps = $derived(mergeProps(angleSlider().getValueTextProps(), props));
 </script>
 
-<Wire as="span" bind:ref {...mergedProps} />
+<Wire as="span" bind:ref {...mergedProps}>
+  {#if children}
+    {@render children()}
+  {:else}
+    {angleSlider().valueAsDegree}
+  {/if}
+</Wire>

package/dist/components/carousel/anatomy.d.ts

@@ -1 +1 @@
-export declare const carouselAnatomy: import("@wirekyt/dom/anatomy").AnatomyInstance<"root" | "item" | "control" | "indicator" | "nextTrigger" | "prevTrigger" | "itemGroup" | "indicatorGroup" | "autoplayTrigger" | "progressText" | "autoplayIndicator">;
+export declare const carouselAnatomy: import("@wirekyt/dom/anatomy").AnatomyInstance<"root" | "item" | "control" | "itemGroup" | "nextTrigger" | "prevTrigger" | "indicatorGroup" | "indicator" | "autoplayTrigger" | "progressText" | "autoplayIndicator">;

package/dist/components/combobox/anatomy.d.ts

@@ -1 +1 @@
-export declare const comboboxAnatomy: import("@wirekyt/dom/anatomy").AnatomyInstance<"label" | "input" | "root" | "content" | "trigger" | "list" | "item" | "control" | "itemGroup" | "positioner" | "clearTrigger" | "itemGroupLabel" | "itemText" | "itemIndicator" | "empty">;
+export declare const comboboxAnatomy: import("@wirekyt/dom/anatomy").AnatomyInstance<"label" | "input" | "root" | "content" | "trigger" | "list" | "item" | "control" | "itemGroup" | "positioner" | "clearTrigger" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;

package/dist/components/field/item.svelte

@@ -25,8 +25,8 @@
       throw new Error("Field.Item must be used within Field.Root");
     }
 
-    const controlId = `${parent.ids.root}::item::${value}`;
-    const labelId = `${controlId}::label`;
+    const controlId = `${parent.ids.root}:item:${value}`;
+    const labelId = `${controlId}:label`;
 
     const getControlProps = () =>
       ({

package/dist/components/field/use.svelte.js

@@ -24,11 +24,11 @@ export const useField = (inProps = {}) => {
     const setRootRef = (el) => {
         rootRef = el;
     };
-    const rootId = $derived(ids?.root ?? `field::${id}`);
-    const controlId = $derived(ids?.control ?? `field::${id}::control`);
-    const errorTextId = $derived(ids?.errorText ?? `field::${id}::error-text`);
-    const helperTextId = $derived(ids?.helperText ?? `field::${id}::helper-text`);
-    const labelId = $derived(ids?.label ?? `field::${id}::label`);
+    const rootId = $derived(ids?.root ?? `field:${id}`);
+    const controlId = $derived(ids?.control ?? `field:${id}:control`);
+    const errorTextId = $derived(ids?.errorText ?? `field:${id}:error-text`);
+    const helperTextId = $derived(ids?.helperText ?? `field:${id}:helper-text`);
+    const labelId = $derived(ids?.label ?? `field:${id}:label`);
     const checkTextElements = () => {
         if (!rootRef)
             return;
@@ -54,7 +54,7 @@ export const useField = (inProps = {}) => {
         "data-invalid": dataAttr(invalid),
         "data-readonly": dataAttr(readOnly),
     });
-    const targetControlId = $derived(props.target ? `field::${id}::item::${props.target}` : undefined);
+    const targetControlId = $derived(props.target ? `field:${id}:item:${props.target}` : undefined);
     const getLabelProps = () => ({
         ...parts.label.attrs,
         id: labelId,

package/dist/components/fieldset/use.svelte.js

@@ -20,9 +20,9 @@ export const useFieldset = (inProps = {}) => {
     const setRootRef = (el) => {
         rootRef = el;
     };
-    const legendId = $derived(`fieldset::${id}::legend`);
-    const errorTextId = $derived(`fieldset::${id}::error-text`);
-    const helperTextId = $derived(`fieldset::${id}::helper-text`);
+    const legendId = $derived(`fieldset:${id}:legend`);
+    const errorTextId = $derived(`fieldset:${id}:error-text`);
+    const helperTextId = $derived(`fieldset:${id}:helper-text`);
     const checkTextElements = () => {
         if (!rootRef)
             return;

package/dist/components/listbox/anatomy.d.ts

@@ -1 +1 @@
-export declare const listboxAnatomy: import("@wirekyt/dom/anatomy").AnatomyInstance<"label" | "input" | "root" | "content" | "item" | "valueText" | "itemGroup" | "itemGroupLabel" | "itemText" | "itemIndicator" | "empty">;
+export declare const listboxAnatomy: import("@wirekyt/dom/anatomy").AnatomyInstance<"label" | "input" | "root" | "content" | "item" | "valueText" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wirekyt/svelte",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "description": "Svelte adapter for Wirekyt",
   "files": [
     "dist"
@@ -327,7 +327,7 @@
   "dependencies": {
     "@internationalized/date": "^3.12.3",
     "@internationalized/number": "^3.6.7",
-    "@wirekyt/dom": "0.0.4"
+    "@wirekyt/dom": "0.0.6"
   },
   "peerDependencies": {
     "svelte": ">=5.0.0"