@breadstone/mosaik-elements-svelte 0.1.36 → 0.1.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/index.mjs +105 -4
  3. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,3 +1,13 @@
1
+ ## 0.1.38 (2026-06-29)
2
+
3
+ ### 🚀 Features
4
+
5
+ - **color-swatch:** enhance ColorSwatch component with new properties and events ([1ca631f146](https://github.com/RueDeRennes/mosaik/commit/1ca631f146))
6
+
7
+ ## 0.1.37 (2026-06-29)
8
+
9
+ This was a version bump only for mosaik-elements-svelte to align it with other projects, there were no code changes.
10
+
1
11
  ## 0.1.36 (2026-06-29)
2
12
 
3
13
  ### 🩹 Fixes
package/index.mjs CHANGED
@@ -95156,8 +95156,19 @@ function hV(e) {
95156
95156
  ${U(e.value, () => V`
95157
95157
  <div part="front"
95158
95158
  style="background-color: ${e.value?.toString()}"></div>
95159
- </div>
95160
95159
  `)}
95160
+ <span part="checkmark-container">
95161
+ <slot name="checkmark">
95162
+ <mosaik-checkmark part="checkmark"
95163
+ .lang="${e.lang}"
95164
+ .dir="${e.dir}"
95165
+ .variant="${e.variant}"
95166
+ .appearance="${q.Plain}"
95167
+ .type="${RR.Hook}"
95168
+ ?checked="${e.isChecked}"
95169
+ ?disabled="${e.disabled}"></mosaik-checkmark>
95170
+ </slot>
95171
+ </span>
95161
95172
  </div>
95162
95173
  `;
95163
95174
  }
@@ -95261,6 +95272,27 @@ function _V() {
95261
95272
  flex: 1;
95262
95273
  }
95263
95274
 
95275
+ :host [part="root"] [part="checkmark-container"] {
95276
+ z-index: 2;
95277
+ pointer-events: none;
95278
+ opacity: 0;
95279
+ transition-duration: var(--color-swatch-transition-duration);
95280
+ transition-timing-function: var(--color-swatch-transition-mode);
95281
+ place-items: center;
95282
+ transition-property: opacity;
95283
+ display: grid;
95284
+ position: absolute;
95285
+ inset: 0;
95286
+ }
95287
+
95288
+ :host [part="root"] [part="checkmark"] {
95289
+ pointer-events: none;
95290
+ }
95291
+
95292
+ :host([is-checked]) [part="root"] [part="checkmark-container"] {
95293
+ opacity: 1;
95294
+ }
95295
+
95264
95296
  :host([size="tiny"]) {
95265
95297
  --color-swatch-size: 8px;
95266
95298
  }
@@ -95380,6 +95412,27 @@ function vV() {
95380
95412
  flex: 1;
95381
95413
  }
95382
95414
 
95415
+ :host [part="root"] [part="checkmark-container"] {
95416
+ z-index: 2;
95417
+ pointer-events: none;
95418
+ opacity: 0;
95419
+ transition-duration: var(--color-swatch-transition-duration);
95420
+ transition-timing-function: var(--color-swatch-transition-mode);
95421
+ place-items: center;
95422
+ transition-property: opacity;
95423
+ display: grid;
95424
+ position: absolute;
95425
+ inset: 0;
95426
+ }
95427
+
95428
+ :host [part="root"] [part="checkmark"] {
95429
+ pointer-events: none;
95430
+ }
95431
+
95432
+ :host([is-checked]) [part="root"] [part="checkmark-container"] {
95433
+ opacity: 1;
95434
+ }
95435
+
95383
95436
  :host([size="tiny"]) {
95384
95437
  --color-swatch-size: 8px;
95385
95438
  }
@@ -95404,6 +95457,10 @@ function vV() {
95404
95457
  background-image: linear-gradient(45deg, var(--joy-scheme-highlight) 25%, var(--joy-scheme-transparent) 25%, var(--joy-scheme-transparent) 75%, var(--joy-scheme-highlight) 75%, var(--joy-scheme-highlight)), linear-gradient(45deg, var(--joy-scheme-highlight) 25%, var(--joy-scheme-transparent) 25%, var(--joy-scheme-transparent) 75%, var(--joy-scheme-highlight) 75%, var(--joy-scheme-highlight));
95405
95458
  }
95406
95459
 
95460
+ :host [part="root"] [part="checkmark"] {
95461
+ color: var(--joy-scheme-surface);
95462
+ }
95463
+
95407
95464
  `;
95408
95465
  }
95409
95466
  //#endregion
@@ -95503,6 +95560,27 @@ function yV() {
95503
95560
  flex: 1;
95504
95561
  }
95505
95562
 
95563
+ :host [part="root"] [part="checkmark-container"] {
95564
+ z-index: 2;
95565
+ pointer-events: none;
95566
+ opacity: 0;
95567
+ transition-duration: var(--color-swatch-transition-duration);
95568
+ transition-timing-function: var(--color-swatch-transition-mode);
95569
+ place-items: center;
95570
+ transition-property: opacity;
95571
+ display: grid;
95572
+ position: absolute;
95573
+ inset: 0;
95574
+ }
95575
+
95576
+ :host [part="root"] [part="checkmark"] {
95577
+ pointer-events: none;
95578
+ }
95579
+
95580
+ :host([is-checked]) [part="root"] [part="checkmark-container"] {
95581
+ opacity: 1;
95582
+ }
95583
+
95506
95584
  :host([size="tiny"]) {
95507
95585
  --color-swatch-size: 8px;
95508
95586
  }
@@ -95534,7 +95612,7 @@ var bV = function(e, t, n, r) {
95534
95612
  return i > 3 && a && Object.defineProperty(t, n, a), a;
95535
95613
  }, xV = function(e, t) {
95536
95614
  if (typeof Reflect == "object" && typeof Reflect.metadata == "function") return Reflect.metadata(e, t);
95537
- }, SV = class extends F(dS(Zx(j))) {
95615
+ }, SV = class extends F(jT(R(z(J(dS(Zx(j))))))) {
95538
95616
  _inheritance = wx(this, { context: gV });
95539
95617
  _name;
95540
95618
  _value;
@@ -95551,6 +95629,24 @@ var bV = function(e, t, n, r) {
95551
95629
  set size(e) {
95552
95630
  this._inheritance.markExplicit("size"), super.size = e;
95553
95631
  }
95632
+ get disabled() {
95633
+ return this._inheritance.get("disabled", super.disabled);
95634
+ }
95635
+ set disabled(e) {
95636
+ this._inheritance.markExplicit("disabled"), super.disabled = e;
95637
+ }
95638
+ get appearance() {
95639
+ return this._inheritance.get("appearance", super.appearance);
95640
+ }
95641
+ set appearance(e) {
95642
+ this._inheritance.markExplicit("appearance"), super.appearance = e;
95643
+ }
95644
+ get variant() {
95645
+ return this._inheritance.get("variant", super.variant);
95646
+ }
95647
+ set variant(e) {
95648
+ this._inheritance.markExplicit("variant"), super.variant = e;
95649
+ }
95554
95650
  get name() {
95555
95651
  return this._name;
95556
95652
  }
@@ -95593,7 +95689,7 @@ bV([
95593
95689
  memphis: yV,
95594
95690
  cosmopolitan: _V
95595
95691
  },
95596
- imports: []
95692
+ imports: [GR]
95597
95693
  }), xV("design:paramtypes", [])], SV);
95598
95694
  //#endregion
95599
95695
  //#region ../mosaik-elements-foundation/dist/Controls/Components/Media/ColorPicker/ColorPickerElementTemplate.js
@@ -163436,7 +163532,12 @@ var Dge = function(e, t, n, r) {
163436
163532
  constructor() {
163437
163533
  super(), FS(this, {
163438
163534
  context: gV,
163439
- values: () => ({ size: this.size })
163535
+ values: () => ({
163536
+ disabled: this.disabled,
163537
+ appearance: this.appearance,
163538
+ variant: this.variant,
163539
+ size: this.size
163540
+ })
163440
163541
  });
163441
163542
  }
163442
163543
  static get is() {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@breadstone/mosaik-elements-svelte",
3
- "version": "0.1.36",
3
+ "version": "0.1.38",
4
4
  "description": "Mosaik elements for Svelte.",
5
5
  "license": "MIT",
6
6
  "author": "andre.wehlert <awehlert@breadstone.de> (https://www.breadstone.de)",
@@ -11,8 +11,8 @@
11
11
  "url": "git+ssh://git@github.com/RueDeRennes/mosaik.git"
12
12
  },
13
13
  "dependencies": {
14
- "@breadstone/mosaik-elements": "0.1.36",
15
- "@breadstone/mosaik-elements-foundation": "0.1.36",
14
+ "@breadstone/mosaik-elements": "0.1.38",
15
+ "@breadstone/mosaik-elements-foundation": "0.1.38",
16
16
  "tslib": "2.8.1"
17
17
  },
18
18
  "peerDependencies": {