@iroco/ui 0.9.2 → 0.9.3

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.
package/lib/index.mjs CHANGED
@@ -169,6 +169,37 @@ function custom_event(type, detail) {
169
169
  e.initCustomEvent(type, false, false, detail);
170
170
  return e;
171
171
  }
172
+ class HtmlTag {
173
+ constructor(anchor = null) {
174
+ this.a = anchor;
175
+ this.e = this.n = null;
176
+ }
177
+ m(html, target, anchor = null) {
178
+ if (!this.e) {
179
+ this.e = element(target.nodeName);
180
+ this.t = target;
181
+ this.h(html);
182
+ }
183
+ this.i(anchor);
184
+ }
185
+ h(html) {
186
+ this.e.innerHTML = html;
187
+ this.n = Array.from(this.e.childNodes);
188
+ }
189
+ i(anchor) {
190
+ for (let i = 0; i < this.n.length; i += 1) {
191
+ insert(this.t, this.n[i], anchor);
192
+ }
193
+ }
194
+ p(html) {
195
+ this.d();
196
+ this.h(html);
197
+ this.i(this.a);
198
+ }
199
+ d() {
200
+ this.n.forEach(detach);
201
+ }
202
+ }
172
203
 
173
204
  let current_component;
174
205
  function set_current_component(component) {
@@ -472,19 +503,19 @@ function create_fragment$g(ctx) {
472
503
  let current;
473
504
  let mounted;
474
505
  let dispose;
475
- const default_slot_template = /*#slots*/ ctx[7].default;
476
- const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[6], null);
506
+ const default_slot_template = /*#slots*/ ctx[8].default;
507
+ const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[7], null);
477
508
 
478
509
  return {
479
510
  c() {
480
511
  button = element("button");
481
512
  if (default_slot) default_slot.c();
482
- attr(button, "id", /*id*/ ctx[5]);
483
- attr(button, "class", button_class_value = "" + (null_to_empty(`iroco-ui-button iroco-ui-button--${/*size*/ ctx[3]} iroco-ui-button--${/*kind*/ ctx[2]}`) + " svelte-hp8sdi"));
484
- attr(button, "type", /*type*/ ctx[0]);
485
- button.disabled = /*disabled*/ ctx[1];
486
- toggle_class(button, "disabled", /*disabled*/ ctx[1]);
487
- toggle_class(button, "rounded", /*rounded*/ ctx[4]);
513
+ attr(button, "id", /*id*/ ctx[6]);
514
+ attr(button, "class", button_class_value = "" + (null_to_empty(`iroco-ui-button iroco-ui-button--${/*size*/ ctx[4]} iroco-ui-button--${/*kind*/ ctx[3]}`) + " svelte-ahn9t2"));
515
+ attr(button, "type", /*type*/ ctx[1]);
516
+ button.disabled = /*disabled*/ ctx[2];
517
+ toggle_class(button, "disabled", /*disabled*/ ctx[2]);
518
+ toggle_class(button, "rounded", /*rounded*/ ctx[5]);
488
519
  },
489
520
  m(target, anchor) {
490
521
  insert(target, button, anchor);
@@ -493,42 +524,43 @@ function create_fragment$g(ctx) {
493
524
  default_slot.m(button, null);
494
525
  }
495
526
 
527
+ /*button_binding*/ ctx[10](button);
496
528
  current = true;
497
529
 
498
530
  if (!mounted) {
499
- dispose = listen(button, "click", /*click_handler*/ ctx[8]);
531
+ dispose = listen(button, "click", /*click_handler*/ ctx[9]);
500
532
  mounted = true;
501
533
  }
502
534
  },
503
535
  p(ctx, [dirty]) {
504
536
  if (default_slot) {
505
- if (default_slot.p && (!current || dirty & /*$$scope*/ 64)) {
506
- update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[6], dirty, null, null);
537
+ if (default_slot.p && (!current || dirty & /*$$scope*/ 128)) {
538
+ update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[7], dirty, null, null);
507
539
  }
508
540
  }
509
541
 
510
- if (!current || dirty & /*id*/ 32) {
511
- attr(button, "id", /*id*/ ctx[5]);
542
+ if (!current || dirty & /*id*/ 64) {
543
+ attr(button, "id", /*id*/ ctx[6]);
512
544
  }
513
545
 
514
- if (!current || dirty & /*size, kind*/ 12 && button_class_value !== (button_class_value = "" + (null_to_empty(`iroco-ui-button iroco-ui-button--${/*size*/ ctx[3]} iroco-ui-button--${/*kind*/ ctx[2]}`) + " svelte-hp8sdi"))) {
546
+ if (!current || dirty & /*size, kind*/ 24 && button_class_value !== (button_class_value = "" + (null_to_empty(`iroco-ui-button iroco-ui-button--${/*size*/ ctx[4]} iroco-ui-button--${/*kind*/ ctx[3]}`) + " svelte-ahn9t2"))) {
515
547
  attr(button, "class", button_class_value);
516
548
  }
517
549
 
518
- if (!current || dirty & /*type*/ 1) {
519
- attr(button, "type", /*type*/ ctx[0]);
550
+ if (!current || dirty & /*type*/ 2) {
551
+ attr(button, "type", /*type*/ ctx[1]);
520
552
  }
521
553
 
522
- if (!current || dirty & /*disabled*/ 2) {
523
- button.disabled = /*disabled*/ ctx[1];
554
+ if (!current || dirty & /*disabled*/ 4) {
555
+ button.disabled = /*disabled*/ ctx[2];
524
556
  }
525
557
 
526
- if (dirty & /*size, kind, disabled*/ 14) {
527
- toggle_class(button, "disabled", /*disabled*/ ctx[1]);
558
+ if (dirty & /*size, kind, disabled*/ 28) {
559
+ toggle_class(button, "disabled", /*disabled*/ ctx[2]);
528
560
  }
529
561
 
530
- if (dirty & /*size, kind, rounded*/ 28) {
531
- toggle_class(button, "rounded", /*rounded*/ ctx[4]);
562
+ if (dirty & /*size, kind, rounded*/ 56) {
563
+ toggle_class(button, "rounded", /*rounded*/ ctx[5]);
532
564
  }
533
565
  },
534
566
  i(local) {
@@ -543,6 +575,7 @@ function create_fragment$g(ctx) {
543
575
  d(detaching) {
544
576
  if (detaching) detach(button);
545
577
  if (default_slot) default_slot.d(detaching);
578
+ /*button_binding*/ ctx[10](null);
546
579
  mounted = false;
547
580
  dispose();
548
581
  }
@@ -557,22 +590,43 @@ function instance$f($$self, $$props, $$invalidate) {
557
590
  let { size = "regular" } = $$props;
558
591
  let { rounded = false } = $$props;
559
592
  let { id } = $$props;
593
+ let { node } = $$props;
560
594
 
561
595
  function click_handler(event) {
562
596
  bubble($$self, event);
563
597
  }
564
598
 
599
+ function button_binding($$value) {
600
+ binding_callbacks[$$value ? "unshift" : "push"](() => {
601
+ node = $$value;
602
+ $$invalidate(0, node);
603
+ });
604
+ }
605
+
565
606
  $$self.$$set = $$props => {
566
- if ("type" in $$props) $$invalidate(0, type = $$props.type);
567
- if ("disabled" in $$props) $$invalidate(1, disabled = $$props.disabled);
568
- if ("kind" in $$props) $$invalidate(2, kind = $$props.kind);
569
- if ("size" in $$props) $$invalidate(3, size = $$props.size);
570
- if ("rounded" in $$props) $$invalidate(4, rounded = $$props.rounded);
571
- if ("id" in $$props) $$invalidate(5, id = $$props.id);
572
- if ("$$scope" in $$props) $$invalidate(6, $$scope = $$props.$$scope);
607
+ if ("type" in $$props) $$invalidate(1, type = $$props.type);
608
+ if ("disabled" in $$props) $$invalidate(2, disabled = $$props.disabled);
609
+ if ("kind" in $$props) $$invalidate(3, kind = $$props.kind);
610
+ if ("size" in $$props) $$invalidate(4, size = $$props.size);
611
+ if ("rounded" in $$props) $$invalidate(5, rounded = $$props.rounded);
612
+ if ("id" in $$props) $$invalidate(6, id = $$props.id);
613
+ if ("node" in $$props) $$invalidate(0, node = $$props.node);
614
+ if ("$$scope" in $$props) $$invalidate(7, $$scope = $$props.$$scope);
573
615
  };
574
616
 
575
- return [type, disabled, kind, size, rounded, id, $$scope, slots, click_handler];
617
+ return [
618
+ node,
619
+ type,
620
+ disabled,
621
+ kind,
622
+ size,
623
+ rounded,
624
+ id,
625
+ $$scope,
626
+ slots,
627
+ click_handler,
628
+ button_binding
629
+ ];
576
630
  }
577
631
 
578
632
  class Button extends SvelteComponent {
@@ -580,19 +634,20 @@ class Button extends SvelteComponent {
580
634
  super();
581
635
 
582
636
  init(this, options, instance$f, create_fragment$g, safe_not_equal, {
583
- type: 0,
584
- disabled: 1,
585
- kind: 2,
586
- size: 3,
587
- rounded: 4,
588
- id: 5
637
+ type: 1,
638
+ disabled: 2,
639
+ kind: 3,
640
+ size: 4,
641
+ rounded: 5,
642
+ id: 6,
643
+ node: 0
589
644
  });
590
645
  }
591
646
  }
592
647
 
593
648
  /* src/TextInput.svelte generated by Svelte v3.38.2 */
594
649
 
595
- function create_if_block_1$1(ctx) {
650
+ function create_if_block_2(ctx) {
596
651
  let label_1;
597
652
  let t;
598
653
 
@@ -620,28 +675,91 @@ function create_if_block_1$1(ctx) {
620
675
  };
621
676
  }
622
677
 
623
- // (40:1) {#if error != null}
678
+ // (41:1) {#if error != null}
624
679
  function create_if_block$4(ctx) {
625
680
  let p;
626
- let t_value = (/*error*/ ctx[4] !== null ? /*error*/ ctx[4] : "") + "";
627
- let t;
681
+
682
+ function select_block_type(ctx, dirty) {
683
+ if (/*htmlError*/ ctx[5]) return create_if_block_1$1;
684
+ return create_else_block$1;
685
+ }
686
+
687
+ let current_block_type = select_block_type(ctx);
688
+ let if_block = current_block_type(ctx);
628
689
 
629
690
  return {
630
691
  c() {
631
692
  p = element("p");
632
- t = text(t_value);
693
+ if_block.c();
633
694
  attr(p, "data-testid", "error");
634
695
  attr(p, "class", "error svelte-11iawkb");
635
696
  },
636
697
  m(target, anchor) {
637
698
  insert(target, p, anchor);
638
- append(p, t);
699
+ if_block.m(p, null);
639
700
  },
640
701
  p(ctx, dirty) {
641
- if (dirty & /*error*/ 16 && t_value !== (t_value = (/*error*/ ctx[4] !== null ? /*error*/ ctx[4] : "") + "")) set_data(t, t_value);
702
+ if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block) {
703
+ if_block.p(ctx, dirty);
704
+ } else {
705
+ if_block.d(1);
706
+ if_block = current_block_type(ctx);
707
+
708
+ if (if_block) {
709
+ if_block.c();
710
+ if_block.m(p, null);
711
+ }
712
+ }
642
713
  },
643
714
  d(detaching) {
644
715
  if (detaching) detach(p);
716
+ if_block.d();
717
+ }
718
+ };
719
+ }
720
+
721
+ // (45:3) {:else}
722
+ function create_else_block$1(ctx) {
723
+ let t_value = (/*error*/ ctx[4] !== null ? /*error*/ ctx[4] : "") + "";
724
+ let t;
725
+
726
+ return {
727
+ c() {
728
+ t = text(t_value);
729
+ },
730
+ m(target, anchor) {
731
+ insert(target, t, anchor);
732
+ },
733
+ p(ctx, dirty) {
734
+ if (dirty & /*error*/ 16 && t_value !== (t_value = (/*error*/ ctx[4] !== null ? /*error*/ ctx[4] : "") + "")) set_data(t, t_value);
735
+ },
736
+ d(detaching) {
737
+ if (detaching) detach(t);
738
+ }
739
+ };
740
+ }
741
+
742
+ // (43:3) {#if htmlError}
743
+ function create_if_block_1$1(ctx) {
744
+ let html_tag;
745
+ let raw_value = (/*error*/ ctx[4] !== null ? /*error*/ ctx[4] : "") + "";
746
+ let html_anchor;
747
+
748
+ return {
749
+ c() {
750
+ html_anchor = empty();
751
+ html_tag = new HtmlTag(html_anchor);
752
+ },
753
+ m(target, anchor) {
754
+ html_tag.m(raw_value, target, anchor);
755
+ insert(target, html_anchor, anchor);
756
+ },
757
+ p(ctx, dirty) {
758
+ if (dirty & /*error*/ 16 && raw_value !== (raw_value = (/*error*/ ctx[4] !== null ? /*error*/ ctx[4] : "") + "")) html_tag.p(raw_value);
759
+ },
760
+ d(detaching) {
761
+ if (detaching) detach(html_anchor);
762
+ if (detaching) html_tag.d();
645
763
  }
646
764
  };
647
765
  }
@@ -653,7 +771,7 @@ function create_fragment$f(ctx) {
653
771
  let t1;
654
772
  let mounted;
655
773
  let dispose;
656
- let if_block0 = /*label*/ ctx[2] && create_if_block_1$1(ctx);
774
+ let if_block0 = /*label*/ ctx[2] && create_if_block_2(ctx);
657
775
  let if_block1 = /*error*/ ctx[4] != null && create_if_block$4(ctx);
658
776
 
659
777
  return {
@@ -667,11 +785,11 @@ function create_fragment$f(ctx) {
667
785
  attr(input, "id", /*id*/ ctx[1]);
668
786
  attr(input, "type", "text");
669
787
  attr(input, "placeholder", /*placeholder*/ ctx[3]);
670
- input.readOnly = /*readonly*/ ctx[7];
788
+ input.readOnly = /*readonly*/ ctx[8];
671
789
  attr(input, "class", "svelte-11iawkb");
672
- toggle_class(input, "border", /*border*/ ctx[8]);
790
+ toggle_class(input, "border", /*border*/ ctx[9]);
673
791
  toggle_class(input, "error", /*error*/ ctx[4] !== null);
674
- toggle_class(input, "readonlyInput", /*readonly*/ ctx[7] == true);
792
+ toggle_class(input, "readonlyInput", /*readonly*/ ctx[8] == true);
675
793
  attr(div, "class", "iroco-ui-input svelte-11iawkb");
676
794
  },
677
795
  m(target, anchor) {
@@ -685,15 +803,15 @@ function create_fragment$f(ctx) {
685
803
 
686
804
  if (!mounted) {
687
805
  dispose = [
688
- listen(input, "input", /*input_handler*/ ctx[12]),
689
- listen(input, "input", /*input_input_handler*/ ctx[13]),
806
+ listen(input, "input", /*input_handler*/ ctx[13]),
807
+ listen(input, "input", /*input_input_handler*/ ctx[14]),
690
808
  listen(input, "focus", function () {
691
- if (is_function(/*onFocus*/ ctx[5])) /*onFocus*/ ctx[5].apply(this, arguments);
809
+ if (is_function(/*onFocus*/ ctx[6])) /*onFocus*/ ctx[6].apply(this, arguments);
692
810
  }),
693
811
  listen(input, "blur", function () {
694
- if (is_function(/*onBlur*/ ctx[6])) /*onBlur*/ ctx[6].apply(this, arguments);
812
+ if (is_function(/*onBlur*/ ctx[7])) /*onBlur*/ ctx[7].apply(this, arguments);
695
813
  }),
696
- action_destroyer(/*typeAction*/ ctx[9].call(null, input))
814
+ action_destroyer(/*typeAction*/ ctx[10].call(null, input))
697
815
  ];
698
816
 
699
817
  mounted = true;
@@ -706,7 +824,7 @@ function create_fragment$f(ctx) {
706
824
  if (if_block0) {
707
825
  if_block0.p(ctx, dirty);
708
826
  } else {
709
- if_block0 = create_if_block_1$1(ctx);
827
+ if_block0 = create_if_block_2(ctx);
710
828
  if_block0.c();
711
829
  if_block0.m(div, t0);
712
830
  }
@@ -723,24 +841,24 @@ function create_fragment$f(ctx) {
723
841
  attr(input, "placeholder", /*placeholder*/ ctx[3]);
724
842
  }
725
843
 
726
- if (dirty & /*readonly*/ 128) {
727
- input.readOnly = /*readonly*/ ctx[7];
844
+ if (dirty & /*readonly*/ 256) {
845
+ input.readOnly = /*readonly*/ ctx[8];
728
846
  }
729
847
 
730
848
  if (dirty & /*value*/ 1 && input.value !== /*value*/ ctx[0]) {
731
849
  set_input_value(input, /*value*/ ctx[0]);
732
850
  }
733
851
 
734
- if (dirty & /*border*/ 256) {
735
- toggle_class(input, "border", /*border*/ ctx[8]);
852
+ if (dirty & /*border*/ 512) {
853
+ toggle_class(input, "border", /*border*/ ctx[9]);
736
854
  }
737
855
 
738
856
  if (dirty & /*error*/ 16) {
739
857
  toggle_class(input, "error", /*error*/ ctx[4] !== null);
740
858
  }
741
859
 
742
- if (dirty & /*readonly*/ 128) {
743
- toggle_class(input, "readonlyInput", /*readonly*/ ctx[7] == true);
860
+ if (dirty & /*readonly*/ 256) {
861
+ toggle_class(input, "readonlyInput", /*readonly*/ ctx[8] == true);
744
862
  }
745
863
 
746
864
  if (/*error*/ ctx[4] != null) {
@@ -782,6 +900,7 @@ function instance$e($$self, $$props, $$invalidate) {
782
900
  let { label = null } = $$props;
783
901
  let { placeholder } = $$props;
784
902
  let { error = null } = $$props;
903
+ let { htmlError = false } = $$props;
785
904
  let { value = null } = $$props;
786
905
  let { onFocus } = $$props;
787
906
  let { onBlur } = $$props;
@@ -802,17 +921,18 @@ function instance$e($$self, $$props, $$invalidate) {
802
921
  }
803
922
 
804
923
  $$self.$$set = $$props => {
805
- if ("TextType" in $$props) $$invalidate(10, TextType = $$props.TextType);
924
+ if ("TextType" in $$props) $$invalidate(11, TextType = $$props.TextType);
806
925
  if ("id" in $$props) $$invalidate(1, id = $$props.id);
807
- if ("type" in $$props) $$invalidate(11, type = $$props.type);
926
+ if ("type" in $$props) $$invalidate(12, type = $$props.type);
808
927
  if ("label" in $$props) $$invalidate(2, label = $$props.label);
809
928
  if ("placeholder" in $$props) $$invalidate(3, placeholder = $$props.placeholder);
810
929
  if ("error" in $$props) $$invalidate(4, error = $$props.error);
930
+ if ("htmlError" in $$props) $$invalidate(5, htmlError = $$props.htmlError);
811
931
  if ("value" in $$props) $$invalidate(0, value = $$props.value);
812
- if ("onFocus" in $$props) $$invalidate(5, onFocus = $$props.onFocus);
813
- if ("onBlur" in $$props) $$invalidate(6, onBlur = $$props.onBlur);
814
- if ("readonly" in $$props) $$invalidate(7, readonly = $$props.readonly);
815
- if ("border" in $$props) $$invalidate(8, border = $$props.border);
932
+ if ("onFocus" in $$props) $$invalidate(6, onFocus = $$props.onFocus);
933
+ if ("onBlur" in $$props) $$invalidate(7, onBlur = $$props.onBlur);
934
+ if ("readonly" in $$props) $$invalidate(8, readonly = $$props.readonly);
935
+ if ("border" in $$props) $$invalidate(9, border = $$props.border);
816
936
  };
817
937
 
818
938
  return [
@@ -821,6 +941,7 @@ function instance$e($$self, $$props, $$invalidate) {
821
941
  label,
822
942
  placeholder,
823
943
  error,
944
+ htmlError,
824
945
  onFocus,
825
946
  onBlur,
826
947
  readonly,
@@ -838,17 +959,18 @@ class TextInput extends SvelteComponent {
838
959
  super();
839
960
 
840
961
  init(this, options, instance$e, create_fragment$f, safe_not_equal, {
841
- TextType: 10,
962
+ TextType: 11,
842
963
  id: 1,
843
- type: 11,
964
+ type: 12,
844
965
  label: 2,
845
966
  placeholder: 3,
846
967
  error: 4,
968
+ htmlError: 5,
847
969
  value: 0,
848
- onFocus: 5,
849
- onBlur: 6,
850
- readonly: 7,
851
- border: 8
970
+ onFocus: 6,
971
+ onBlur: 7,
972
+ readonly: 8,
973
+ border: 9
852
974
  });
853
975
  }
854
976
  }
@@ -3996,16 +4118,15 @@ class IconClose extends SvelteComponent {
3996
4118
 
3997
4119
  function get_each_context$1(ctx, list, i) {
3998
4120
  const child_ctx = ctx.slice();
3999
- child_ctx[6] = list[i].destination;
4000
- child_ctx[7] = list[i].name;
4121
+ child_ctx[6] = list[i];
4001
4122
  return child_ctx;
4002
4123
  }
4003
4124
 
4004
- // (19:2) {#each navigationItems as { destination, name }}
4125
+ // (23:2) {#each navigationItems as item}
4005
4126
  function create_each_block$1(ctx) {
4006
4127
  let li;
4007
4128
  let a;
4008
- let t0_value = /*name*/ ctx[7] + "";
4129
+ let t0_value = /*item*/ ctx[6].name + "";
4009
4130
  let t0;
4010
4131
  let a_href_value;
4011
4132
  let t1;
@@ -4013,7 +4134,7 @@ function create_each_block$1(ctx) {
4013
4134
  let dispose;
4014
4135
 
4015
4136
  function click_handler_1() {
4016
- return /*click_handler_1*/ ctx[4](/*destination*/ ctx[6]);
4137
+ return /*click_handler_1*/ ctx[4](/*item*/ ctx[6]);
4017
4138
  }
4018
4139
 
4019
4140
  return {
@@ -4022,10 +4143,14 @@ function create_each_block$1(ctx) {
4022
4143
  a = element("a");
4023
4144
  t0 = text(t0_value);
4024
4145
  t1 = space();
4025
- attr(a, "href", a_href_value = /*destination*/ ctx[6]);
4026
- attr(a, "class", "svelte-1rx212l");
4027
- attr(li, "class", "account__sidebar__item svelte-1rx212l");
4028
- toggle_class(li, "active", /*active*/ ctx[1] === /*destination*/ ctx[6]);
4146
+
4147
+ attr(a, "href", a_href_value = typeof /*item*/ ctx[6].hrefOrCallback === "string"
4148
+ ? /*item*/ ctx[6].hrefOrCallback
4149
+ : "#");
4150
+
4151
+ attr(a, "class", "svelte-jkys2k");
4152
+ attr(li, "class", "account__sidebar__item svelte-jkys2k");
4153
+ toggle_class(li, "active", /*active*/ ctx[1] === /*item*/ ctx[6].name);
4029
4154
  },
4030
4155
  m(target, anchor) {
4031
4156
  insert(target, li, anchor);
@@ -4040,14 +4165,16 @@ function create_each_block$1(ctx) {
4040
4165
  },
4041
4166
  p(new_ctx, dirty) {
4042
4167
  ctx = new_ctx;
4043
- if (dirty & /*navigationItems*/ 1 && t0_value !== (t0_value = /*name*/ ctx[7] + "")) set_data(t0, t0_value);
4168
+ if (dirty & /*navigationItems*/ 1 && t0_value !== (t0_value = /*item*/ ctx[6].name + "")) set_data(t0, t0_value);
4044
4169
 
4045
- if (dirty & /*navigationItems*/ 1 && a_href_value !== (a_href_value = /*destination*/ ctx[6])) {
4170
+ if (dirty & /*navigationItems*/ 1 && a_href_value !== (a_href_value = typeof /*item*/ ctx[6].hrefOrCallback === "string"
4171
+ ? /*item*/ ctx[6].hrefOrCallback
4172
+ : "#")) {
4046
4173
  attr(a, "href", a_href_value);
4047
4174
  }
4048
4175
 
4049
4176
  if (dirty & /*active, navigationItems*/ 3) {
4050
- toggle_class(li, "active", /*active*/ ctx[1] === /*destination*/ ctx[6]);
4177
+ toggle_class(li, "active", /*active*/ ctx[1] === /*item*/ ctx[6].name);
4051
4178
  }
4052
4179
  },
4053
4180
  d(detaching) {
@@ -4087,10 +4214,10 @@ function create_fragment$7(ctx) {
4087
4214
  each_blocks[i].c();
4088
4215
  }
4089
4216
 
4090
- attr(button, "class", "account__sidebar__close svelte-1rx212l");
4091
- attr(ul, "class", "account__sidebar__item_container svelte-1rx212l");
4217
+ attr(button, "class", "account__sidebar__close svelte-jkys2k");
4218
+ attr(ul, "class", "account__sidebar__item_container svelte-jkys2k");
4092
4219
  attr(nav, "data-testid", "sidebar");
4093
- attr(nav, "class", "account__sidebar svelte-1rx212l");
4220
+ attr(nav, "class", "account__sidebar svelte-jkys2k");
4094
4221
  },
4095
4222
  m(target, anchor) {
4096
4223
  insert(target, nav, anchor);
@@ -4159,8 +4286,14 @@ function instance$7($$self, $$props, $$invalidate) {
4159
4286
  let active;
4160
4287
  const dispatch = createEventDispatcher();
4161
4288
 
4162
- const handleClickLink = destination => {
4163
- $$invalidate(1, active = destination);
4289
+ const handleClickLink = menuItem => {
4290
+ $$invalidate(1, active = menuItem.name);
4291
+
4292
+ if (typeof menuItem.hrefOrCallback === "function") {
4293
+ menuItem.hrefOrCallback();
4294
+ return false; // to avoid calling href
4295
+ }
4296
+
4164
4297
  dispatch("click_link");
4165
4298
  };
4166
4299
 
@@ -4168,7 +4301,7 @@ function instance$7($$self, $$props, $$invalidate) {
4168
4301
  bubble($$self, event);
4169
4302
  }
4170
4303
 
4171
- const click_handler_1 = destination => handleClickLink(destination);
4304
+ const click_handler_1 = item => handleClickLink(item);
4172
4305
 
4173
4306
  $$self.$$set = $$props => {
4174
4307
  if ("navigationItems" in $$props) $$invalidate(0, navigationItems = $$props.navigationItems);
@@ -4344,13 +4477,13 @@ function create_fragment$5(ctx) {
4344
4477
  t6 = text(/*title*/ ctx[1]);
4345
4478
  t7 = space();
4346
4479
  create_component(sidebar.$$.fragment);
4347
- attr(h10, "class", "svelte-1jgfrsf");
4348
- attr(div0, "class", "account__navigation--mobile__title-container svelte-1jgfrsf");
4349
- attr(button, "class", "account__navigation--mobile__button svelte-1jgfrsf");
4350
- attr(div1, "class", "account__navigation--mobile svelte-1jgfrsf");
4351
- attr(h11, "class", "svelte-1jgfrsf");
4352
- attr(div2, "class", "account__navigation__title-container svelte-1jgfrsf");
4353
- attr(div3, "class", "account__navigation svelte-1jgfrsf");
4480
+ attr(h10, "class", "svelte-1uu9ytm");
4481
+ attr(div0, "class", "account__navigation--mobile__title-container svelte-1uu9ytm");
4482
+ attr(button, "class", "account__navigation--mobile__button svelte-1uu9ytm");
4483
+ attr(div1, "class", "account__navigation--mobile svelte-1uu9ytm");
4484
+ attr(h11, "class", "svelte-1uu9ytm");
4485
+ attr(div2, "class", "account__navigation__title-container svelte-1uu9ytm");
4486
+ attr(div3, "class", "account__navigation svelte-1uu9ytm");
4354
4487
  },
4355
4488
  m(target, anchor) {
4356
4489
  insert(target, div1, anchor);