@breadstone/mosaik-elements-svelte 0.0.118 → 0.0.120

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## 0.0.120 (2025-08-18)
+
+### 🚀 Features
+
+- Add ToggleButtonElementValueAccessor and integrate with ToggleButtonComponent ([5e831d7fbd](https://github.com/RueDeRennes/mosaik/commit/5e831d7fbd))
+
+## 0.0.119 (2025-08-18)
+
+### 🚀 Features
+
+- **wizard:** add isFirstStep and isLastStep properties to Wizard component ([b398a839e2](https://github.com/RueDeRennes/mosaik/commit/b398a839e2))
+
+### 🩹 Fixes
+
+- **release:** update version to 0.0.118 in release script ([4ac4717314](https://github.com/RueDeRennes/mosaik/commit/4ac4717314))
+
 ## 0.0.118 (2025-08-18)
 
 ### 🩹 Fixes

package/index.mjs

@@ -29440,6 +29440,16 @@ let w1 = class extends P(Ji(Zt(Ki(qo(bn(Ew(Lt(Zi(Fr))))))))) {
   static get is() {
     return "mosaik-toggle-button";
   }
+  // #endregion
+  // #region Methods
+  /**
+   * Resets the element to its initial state.
+   *
+   * @public
+   */
+  reset() {
+    this.isChecked = !1;
+  }
 };
 w1 = bU([
   O({
@@ -142231,11 +142241,6 @@ Vi = vl([
 function krt(o) {
   return w`
         <div part="root">
-            <output part="value"
-                    for="input">
-                <mosaik-text part="text"
-                             .text="${o.tooltipAccessor(o.value)}"></mosaik-text>
-            </output>
             <div part="surface"
                  role="slider"
                  aria-valuemin=${o.min}
@@ -142254,6 +142259,10 @@ function krt(o) {
                    .max=${o.max.toString()}
                    .step=${o.step.toString()}
                    .value=${String(o.value)} />
+            <div part="hint">
+                <slot name="hint"
+                      @slotchange="${(t) => t.target.assignedElements().map((e, r) => F.current.setStyle(e, "order", r))}"></slot>
+            </div>
         </div>
     `;
 }
@@ -142347,10 +142356,10 @@ function _rt() {
   --center-width: 3px;
   --tick-gap: 12px;
   --tick-width: 2px;
-  --tick-color: #b9bcc2;
+  --tick-color: var(--joy-scheme-highlight);
   --tick-color-strong: #8b8f96;
-  --track-bg: #fff;
-  --center-color: #e53935;
+  --track-bg: var(--joy-scheme-background);
+  --center-color: var(--joy-color-danger-500);
   --value-font: 700 48px / 1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
   font-family: var(--scrub-slider-font-family);
   font-size: var(--scrub-slider-font-size);
@@ -142417,8 +142426,8 @@ function _rt() {
   pointer-events: none;
   border-radius: 1px;
   position: absolute;
-  top: 8px;
-  bottom: 8px;
+  top: 0;
+  bottom: 0;
   left: 50%;
   transform: translateX(-50%);
 }
@@ -142432,6 +142441,12 @@ function _rt() {
   display: grid;
 }
 
+:host [part="hint"] {
+  flex-direction: row;
+  justify-content: space-between;
+  display: flex;
+}
+
 :host .visually-hidden {
   clip: rect(0 0 0 0);
   white-space: nowrap;
@@ -142573,10 +142588,10 @@ function jrt() {
   --center-width: 3px;
   --tick-gap: 12px;
   --tick-width: 2px;
-  --tick-color: #b9bcc2;
+  --tick-color: var(--joy-scheme-highlight);
   --tick-color-strong: #8b8f96;
-  --track-bg: #fff;
-  --center-color: #e53935;
+  --track-bg: var(--joy-scheme-background);
+  --center-color: var(--joy-color-danger-500);
   --value-font: 700 48px / 1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
   font-family: var(--scrub-slider-font-family);
   font-size: var(--scrub-slider-font-size);
@@ -142643,8 +142658,8 @@ function jrt() {
   pointer-events: none;
   border-radius: 1px;
   position: absolute;
-  top: 8px;
-  bottom: 8px;
+  top: 0;
+  bottom: 0;
   left: 50%;
   transform: translateX(-50%);
 }
@@ -142658,6 +142673,12 @@ function jrt() {
   display: grid;
 }
 
+:host [part="hint"] {
+  flex-direction: row;
+  justify-content: space-between;
+  display: flex;
+}
+
 :host .visually-hidden {
   clip: rect(0 0 0 0);
   white-space: nowrap;
@@ -142799,10 +142820,10 @@ function zrt() {
   --center-width: 3px;
   --tick-gap: 12px;
   --tick-width: 2px;
-  --tick-color: #b9bcc2;
+  --tick-color: var(--joy-scheme-highlight);
   --tick-color-strong: #8b8f96;
-  --track-bg: #fff;
-  --center-color: #e53935;
+  --track-bg: var(--joy-scheme-background);
+  --center-color: var(--joy-color-danger-500);
   --value-font: 700 48px / 1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
   font-family: var(--scrub-slider-font-family);
   font-size: var(--scrub-slider-font-size);
@@ -142869,8 +142890,8 @@ function zrt() {
   pointer-events: none;
   border-radius: 1px;
   position: absolute;
-  top: 8px;
-  bottom: 8px;
+  top: 0;
+  bottom: 0;
   left: 50%;
   transform: translateX(-50%);
 }
@@ -142884,6 +142905,12 @@ function zrt() {
   display: grid;
 }
 
+:host [part="hint"] {
+  flex-direction: row;
+  justify-content: space-between;
+  display: flex;
+}
+
 :host .visually-hidden {
   clip: rect(0 0 0 0);
   white-space: nowrap;
@@ -143020,6 +143047,12 @@ let xa = class extends P(Zt(W(tt(gt(nr(Ze(rl))))))) {
   set pxPerStep(t) {
     this._pxPerStep !== t && t > 0 && (this._pxPerStep = t, this.requestUpdate("pxPerStep"));
   }
+  /**
+   * Accelerate the slider when dragging.
+   *
+   * @public
+   * @default true
+   */
   get accelerate() {
     return this._accelerate;
   }
@@ -156417,6 +156450,24 @@ let cp = class extends P(At(qo(W(ja)))) {
   get activeIndex() {
     return this.items.findIndex((t) => t.isActive);
   }
+  /**
+   * Gets the first step of the wizard.
+   *
+   * @public
+   * @readonly
+   */
+  get isFirstStep() {
+    return this.activeIndex === 0;
+  }
+  /**
+   * Gets the last step of the wizard.
+   *
+   * @public
+   * @readonly
+   */
+  get isLastStep() {
+    return this.activeIndex === this.items.length - 1;
+  }
   /**
    * Called when the active step has changed.
    * Provides reference to `{@link IEventDetail}` as event detail.

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@breadstone/mosaik-elements-svelte",
-    "version": "0.0.118",
+    "version": "0.0.120",
     "description": "Mosaik elements for Svelte.",
     "license": "MIT",
     "author": "andre.wehlert <awehlert@breadstone.de> (https://www.breadstone.de)",
@@ -15,8 +15,8 @@
         "vite": "*"
     },
     "dependencies": {
-        "@breadstone/mosaik-elements": "^0.0.118",
-        "@breadstone/mosaik-elements-foundation": "^0.0.118",
+        "@breadstone/mosaik-elements": "^0.0.120",
+        "@breadstone/mosaik-elements-foundation": "^0.0.120",
         "tslib": "^2.8.1"
     },
     "exports": {