@samline/drawer 2.0.7 → 2.0.8

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.
@@ -2613,7 +2613,7 @@ function openAncestorChain(parentId) {
2613
2613
  openAncestorChain(nextParentId);
2614
2614
  }
2615
2615
  if (!parentRuntime.controller.getSnapshot().state.isOpen) {
2616
- releaseHiddenFocusBeforeOpen(parentRuntime.options);
2616
+ releaseHiddenFocusBeforeOpen(parentRuntime.options, getRuntimeDrawerElement(parentRuntime));
2617
2617
  parentRuntime.controller.setOpen(true);
2618
2618
  notifyOpenStateChange(parentRuntime, true);
2619
2619
  renderVanillaDrawer(parentRuntime.id);
@@ -2628,18 +2628,36 @@ function cleanupRuntimeTrigger(runtime) {
2628
2628
  }
2629
2629
  function bindTriggerElement(runtime) {
2630
2630
  cleanupRuntimeTrigger(runtime);
2631
+ const drawerElement = getRuntimeDrawerElement(runtime);
2632
+ const builtInTriggerElement = getRuntimeTriggerElement(runtime);
2633
+ const cleanups = [];
2634
+ if (builtInTriggerElement) {
2635
+ const handleBuiltInTriggerClick = ()=>{
2636
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
2637
+ };
2638
+ builtInTriggerElement.addEventListener('click', handleBuiltInTriggerClick);
2639
+ cleanups.push(()=>{
2640
+ builtInTriggerElement.removeEventListener('click', handleBuiltInTriggerClick);
2641
+ });
2642
+ }
2631
2643
  if (!runtime.options.triggerElement) {
2644
+ runtime.cleanupTriggerElement = cleanups.length ? ()=>{
2645
+ cleanups.forEach((cleanup)=>cleanup());
2646
+ } : null;
2632
2647
  return;
2633
2648
  }
2634
2649
  const triggerElement = runtime.options.triggerElement;
2635
2650
  const handleClick = ()=>{
2636
- releaseHiddenFocusBeforeOpen(runtime.options);
2651
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
2637
2652
  runtime.controller.setOpen(true);
2638
2653
  renderVanillaDrawer(runtime.id);
2639
2654
  };
2640
2655
  triggerElement.addEventListener('click', handleClick);
2641
- runtime.cleanupTriggerElement = ()=>{
2656
+ cleanups.push(()=>{
2642
2657
  triggerElement.removeEventListener('click', handleClick);
2658
+ });
2659
+ runtime.cleanupTriggerElement = ()=>{
2660
+ cleanups.forEach((cleanup)=>cleanup());
2643
2661
  };
2644
2662
  }
2645
2663
  function notifyOpenStateChange(runtime, open) {
@@ -2669,15 +2687,32 @@ function notifyOpenStateChange(runtime, open) {
2669
2687
  function canUseDOM() {
2670
2688
  return typeof window !== 'undefined' && typeof document !== 'undefined';
2671
2689
  }
2672
- function releaseHiddenFocusBeforeOpen(options) {
2690
+ function isElementInsideDrawer(element) {
2691
+ let currentElement = element;
2692
+ while(currentElement){
2693
+ if (currentElement instanceof HTMLElement && currentElement.hasAttribute('data-drawer')) {
2694
+ return true;
2695
+ }
2696
+ currentElement = currentElement.parentElement;
2697
+ }
2698
+ return false;
2699
+ }
2700
+ function releaseHiddenFocusBeforeOpen(options, drawerElement) {
2673
2701
  if (!canUseDOM() || options.modal === false || options.autoFocus) {
2674
2702
  return;
2675
2703
  }
2676
2704
  const activeElement = document.activeElement;
2677
- if (!activeElement || activeElement === document.body || typeof activeElement.blur !== 'function') {
2705
+ if (!activeElement || activeElement === document.body) {
2706
+ return;
2707
+ }
2708
+ const activeElementNode = activeElement;
2709
+ if ((drawerElement == null ? void 0 : drawerElement.contains(activeElementNode)) || isElementInsideDrawer(activeElementNode)) {
2710
+ return;
2711
+ }
2712
+ if (typeof activeElementNode.blur !== 'function') {
2678
2713
  return;
2679
2714
  }
2680
- activeElement.blur();
2715
+ activeElementNode.blur();
2681
2716
  }
2682
2717
  function getRuntimeDrawerElement(runtime) {
2683
2718
  if (!runtime.element) {
@@ -2685,6 +2720,12 @@ function getRuntimeDrawerElement(runtime) {
2685
2720
  }
2686
2721
  return runtime.element.querySelector('[data-drawer]');
2687
2722
  }
2723
+ function getRuntimeTriggerElement(runtime) {
2724
+ if (!runtime.element) {
2725
+ return null;
2726
+ }
2727
+ return runtime.element.querySelector('[data-drawer-vanilla-trigger]');
2728
+ }
2688
2729
  function getViewportSizeForDirection(direction) {
2689
2730
  if (!canUseDOM()) {
2690
2731
  return 0;
@@ -2730,7 +2771,7 @@ function renderVanillaDrawer(id) {
2730
2771
  onOpenChange: (open)=>{
2731
2772
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
2732
2773
  if (open) {
2733
- releaseHiddenFocusBeforeOpen(runtime.options);
2774
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
2734
2775
  }
2735
2776
  runtime.controller.setOpen(open);
2736
2777
  if (previousOpen !== open) {
@@ -2785,7 +2826,7 @@ function buildVanillaController(id) {
2785
2826
  }).getSnapshot();
2786
2827
  }
2787
2828
  if (open) {
2788
- releaseHiddenFocusBeforeOpen(runtime.options);
2829
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
2789
2830
  }
2790
2831
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
2791
2832
  const snapshot = runtime.controller.setOpen(open);
@@ -2881,7 +2922,7 @@ function createDrawer(options = {}) {
2881
2922
  }
2882
2923
  }
2883
2924
  if (nextOptions.open && !previousOpen) {
2884
- releaseHiddenFocusBeforeOpen(nextOptions);
2925
+ releaseHiddenFocusBeforeOpen(nextOptions, existing ? getRuntimeDrawerElement(existing) : null);
2885
2926
  }
2886
2927
  renderVanillaDrawer(id);
2887
2928
  if (nextOptions.parentId && nextOptions.open) {
@@ -2591,7 +2591,7 @@ function openAncestorChain(parentId) {
2591
2591
  openAncestorChain(nextParentId);
2592
2592
  }
2593
2593
  if (!parentRuntime.controller.getSnapshot().state.isOpen) {
2594
- releaseHiddenFocusBeforeOpen(parentRuntime.options);
2594
+ releaseHiddenFocusBeforeOpen(parentRuntime.options, getRuntimeDrawerElement(parentRuntime));
2595
2595
  parentRuntime.controller.setOpen(true);
2596
2596
  notifyOpenStateChange(parentRuntime, true);
2597
2597
  renderVanillaDrawer(parentRuntime.id);
@@ -2606,18 +2606,36 @@ function cleanupRuntimeTrigger(runtime) {
2606
2606
  }
2607
2607
  function bindTriggerElement(runtime) {
2608
2608
  cleanupRuntimeTrigger(runtime);
2609
+ const drawerElement = getRuntimeDrawerElement(runtime);
2610
+ const builtInTriggerElement = getRuntimeTriggerElement(runtime);
2611
+ const cleanups = [];
2612
+ if (builtInTriggerElement) {
2613
+ const handleBuiltInTriggerClick = ()=>{
2614
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
2615
+ };
2616
+ builtInTriggerElement.addEventListener('click', handleBuiltInTriggerClick);
2617
+ cleanups.push(()=>{
2618
+ builtInTriggerElement.removeEventListener('click', handleBuiltInTriggerClick);
2619
+ });
2620
+ }
2609
2621
  if (!runtime.options.triggerElement) {
2622
+ runtime.cleanupTriggerElement = cleanups.length ? ()=>{
2623
+ cleanups.forEach((cleanup)=>cleanup());
2624
+ } : null;
2610
2625
  return;
2611
2626
  }
2612
2627
  const triggerElement = runtime.options.triggerElement;
2613
2628
  const handleClick = ()=>{
2614
- releaseHiddenFocusBeforeOpen(runtime.options);
2629
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
2615
2630
  runtime.controller.setOpen(true);
2616
2631
  renderVanillaDrawer(runtime.id);
2617
2632
  };
2618
2633
  triggerElement.addEventListener('click', handleClick);
2619
- runtime.cleanupTriggerElement = ()=>{
2634
+ cleanups.push(()=>{
2620
2635
  triggerElement.removeEventListener('click', handleClick);
2636
+ });
2637
+ runtime.cleanupTriggerElement = ()=>{
2638
+ cleanups.forEach((cleanup)=>cleanup());
2621
2639
  };
2622
2640
  }
2623
2641
  function notifyOpenStateChange(runtime, open) {
@@ -2647,15 +2665,32 @@ function notifyOpenStateChange(runtime, open) {
2647
2665
  function canUseDOM() {
2648
2666
  return typeof window !== 'undefined' && typeof document !== 'undefined';
2649
2667
  }
2650
- function releaseHiddenFocusBeforeOpen(options) {
2668
+ function isElementInsideDrawer(element) {
2669
+ let currentElement = element;
2670
+ while(currentElement){
2671
+ if (currentElement instanceof HTMLElement && currentElement.hasAttribute('data-drawer')) {
2672
+ return true;
2673
+ }
2674
+ currentElement = currentElement.parentElement;
2675
+ }
2676
+ return false;
2677
+ }
2678
+ function releaseHiddenFocusBeforeOpen(options, drawerElement) {
2651
2679
  if (!canUseDOM() || options.modal === false || options.autoFocus) {
2652
2680
  return;
2653
2681
  }
2654
2682
  const activeElement = document.activeElement;
2655
- if (!activeElement || activeElement === document.body || typeof activeElement.blur !== 'function') {
2683
+ if (!activeElement || activeElement === document.body) {
2684
+ return;
2685
+ }
2686
+ const activeElementNode = activeElement;
2687
+ if ((drawerElement == null ? void 0 : drawerElement.contains(activeElementNode)) || isElementInsideDrawer(activeElementNode)) {
2688
+ return;
2689
+ }
2690
+ if (typeof activeElementNode.blur !== 'function') {
2656
2691
  return;
2657
2692
  }
2658
- activeElement.blur();
2693
+ activeElementNode.blur();
2659
2694
  }
2660
2695
  function getRuntimeDrawerElement(runtime) {
2661
2696
  if (!runtime.element) {
@@ -2663,6 +2698,12 @@ function getRuntimeDrawerElement(runtime) {
2663
2698
  }
2664
2699
  return runtime.element.querySelector('[data-drawer]');
2665
2700
  }
2701
+ function getRuntimeTriggerElement(runtime) {
2702
+ if (!runtime.element) {
2703
+ return null;
2704
+ }
2705
+ return runtime.element.querySelector('[data-drawer-vanilla-trigger]');
2706
+ }
2666
2707
  function getViewportSizeForDirection(direction) {
2667
2708
  if (!canUseDOM()) {
2668
2709
  return 0;
@@ -2708,7 +2749,7 @@ function renderVanillaDrawer(id) {
2708
2749
  onOpenChange: (open)=>{
2709
2750
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
2710
2751
  if (open) {
2711
- releaseHiddenFocusBeforeOpen(runtime.options);
2752
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
2712
2753
  }
2713
2754
  runtime.controller.setOpen(open);
2714
2755
  if (previousOpen !== open) {
@@ -2763,7 +2804,7 @@ function buildVanillaController(id) {
2763
2804
  }).getSnapshot();
2764
2805
  }
2765
2806
  if (open) {
2766
- releaseHiddenFocusBeforeOpen(runtime.options);
2807
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
2767
2808
  }
2768
2809
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
2769
2810
  const snapshot = runtime.controller.setOpen(open);
@@ -2859,7 +2900,7 @@ function createDrawer(options = {}) {
2859
2900
  }
2860
2901
  }
2861
2902
  if (nextOptions.open && !previousOpen) {
2862
- releaseHiddenFocusBeforeOpen(nextOptions);
2903
+ releaseHiddenFocusBeforeOpen(nextOptions, existing ? getRuntimeDrawerElement(existing) : null);
2863
2904
  }
2864
2905
  renderVanillaDrawer(id);
2865
2906
  if (nextOptions.parentId && nextOptions.open) {
@@ -29135,7 +29135,7 @@ function openAncestorChain(parentId) {
29135
29135
  openAncestorChain(nextParentId);
29136
29136
  }
29137
29137
  if (!parentRuntime.controller.getSnapshot().state.isOpen) {
29138
- releaseHiddenFocusBeforeOpen(parentRuntime.options);
29138
+ releaseHiddenFocusBeforeOpen(parentRuntime.options, getRuntimeDrawerElement(parentRuntime));
29139
29139
  parentRuntime.controller.setOpen(true);
29140
29140
  notifyOpenStateChange(parentRuntime, true);
29141
29141
  renderVanillaDrawer(parentRuntime.id);
@@ -29150,18 +29150,36 @@ function cleanupRuntimeTrigger(runtime) {
29150
29150
  }
29151
29151
  function bindTriggerElement(runtime) {
29152
29152
  cleanupRuntimeTrigger(runtime);
29153
+ const drawerElement = getRuntimeDrawerElement(runtime);
29154
+ const builtInTriggerElement = getRuntimeTriggerElement(runtime);
29155
+ const cleanups = [];
29156
+ if (builtInTriggerElement) {
29157
+ const handleBuiltInTriggerClick = () => {
29158
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
29159
+ };
29160
+ builtInTriggerElement.addEventListener("click", handleBuiltInTriggerClick);
29161
+ cleanups.push(() => {
29162
+ builtInTriggerElement.removeEventListener("click", handleBuiltInTriggerClick);
29163
+ });
29164
+ }
29153
29165
  if (!runtime.options.triggerElement) {
29166
+ runtime.cleanupTriggerElement = cleanups.length ? () => {
29167
+ cleanups.forEach((cleanup) => cleanup());
29168
+ } : null;
29154
29169
  return;
29155
29170
  }
29156
29171
  const triggerElement = runtime.options.triggerElement;
29157
29172
  const handleClick = () => {
29158
- releaseHiddenFocusBeforeOpen(runtime.options);
29173
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
29159
29174
  runtime.controller.setOpen(true);
29160
29175
  renderVanillaDrawer(runtime.id);
29161
29176
  };
29162
29177
  triggerElement.addEventListener("click", handleClick);
29163
- runtime.cleanupTriggerElement = () => {
29178
+ cleanups.push(() => {
29164
29179
  triggerElement.removeEventListener("click", handleClick);
29180
+ });
29181
+ runtime.cleanupTriggerElement = () => {
29182
+ cleanups.forEach((cleanup) => cleanup());
29165
29183
  };
29166
29184
  }
29167
29185
  function notifyOpenStateChange(runtime, open) {
@@ -29191,15 +29209,32 @@ function notifyOpenStateChange(runtime, open) {
29191
29209
  function canUseDOM3() {
29192
29210
  return typeof window !== "undefined" && typeof document !== "undefined";
29193
29211
  }
29194
- function releaseHiddenFocusBeforeOpen(options) {
29212
+ function isElementInsideDrawer(element) {
29213
+ let currentElement = element;
29214
+ while (currentElement) {
29215
+ if (currentElement instanceof HTMLElement && currentElement.hasAttribute("data-drawer")) {
29216
+ return true;
29217
+ }
29218
+ currentElement = currentElement.parentElement;
29219
+ }
29220
+ return false;
29221
+ }
29222
+ function releaseHiddenFocusBeforeOpen(options, drawerElement) {
29195
29223
  if (!canUseDOM3() || options.modal === false || options.autoFocus) {
29196
29224
  return;
29197
29225
  }
29198
29226
  const activeElement = document.activeElement;
29199
- if (!activeElement || activeElement === document.body || typeof activeElement.blur !== "function") {
29227
+ if (!activeElement || activeElement === document.body) {
29228
+ return;
29229
+ }
29230
+ const activeElementNode = activeElement;
29231
+ if (drawerElement?.contains(activeElementNode) || isElementInsideDrawer(activeElementNode)) {
29232
+ return;
29233
+ }
29234
+ if (typeof activeElementNode.blur !== "function") {
29200
29235
  return;
29201
29236
  }
29202
- activeElement.blur();
29237
+ activeElementNode.blur();
29203
29238
  }
29204
29239
  function getRuntimeDrawerElement(runtime) {
29205
29240
  if (!runtime.element) {
@@ -29207,6 +29242,12 @@ function getRuntimeDrawerElement(runtime) {
29207
29242
  }
29208
29243
  return runtime.element.querySelector("[data-drawer]");
29209
29244
  }
29245
+ function getRuntimeTriggerElement(runtime) {
29246
+ if (!runtime.element) {
29247
+ return null;
29248
+ }
29249
+ return runtime.element.querySelector("[data-drawer-vanilla-trigger]");
29250
+ }
29210
29251
  function getViewportSizeForDirection(direction) {
29211
29252
  if (!canUseDOM3()) {
29212
29253
  return 0;
@@ -29255,7 +29296,7 @@ function renderVanillaDrawer(id) {
29255
29296
  onOpenChange: (open) => {
29256
29297
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
29257
29298
  if (open) {
29258
- releaseHiddenFocusBeforeOpen(runtime.options);
29299
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
29259
29300
  }
29260
29301
  runtime.controller.setOpen(open);
29261
29302
  if (previousOpen !== open) {
@@ -29304,7 +29345,7 @@ function buildVanillaController(id) {
29304
29345
  return createDrawer({ id, open }).getSnapshot();
29305
29346
  }
29306
29347
  if (open) {
29307
- releaseHiddenFocusBeforeOpen(runtime.options);
29348
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
29308
29349
  }
29309
29350
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
29310
29351
  const snapshot = runtime.controller.setOpen(open);
@@ -29377,7 +29418,7 @@ function createDrawer(options = {}) {
29377
29418
  }
29378
29419
  }
29379
29420
  if (nextOptions.open && !previousOpen) {
29380
- releaseHiddenFocusBeforeOpen(nextOptions);
29421
+ releaseHiddenFocusBeforeOpen(nextOptions, existing ? getRuntimeDrawerElement(existing) : null);
29381
29422
  }
29382
29423
  renderVanillaDrawer(id);
29383
29424
  if (nextOptions.parentId && nextOptions.open) {
@@ -29107,7 +29107,7 @@ function openAncestorChain(parentId) {
29107
29107
  openAncestorChain(nextParentId);
29108
29108
  }
29109
29109
  if (!parentRuntime.controller.getSnapshot().state.isOpen) {
29110
- releaseHiddenFocusBeforeOpen(parentRuntime.options);
29110
+ releaseHiddenFocusBeforeOpen(parentRuntime.options, getRuntimeDrawerElement(parentRuntime));
29111
29111
  parentRuntime.controller.setOpen(true);
29112
29112
  notifyOpenStateChange(parentRuntime, true);
29113
29113
  renderVanillaDrawer(parentRuntime.id);
@@ -29122,18 +29122,36 @@ function cleanupRuntimeTrigger(runtime) {
29122
29122
  }
29123
29123
  function bindTriggerElement(runtime) {
29124
29124
  cleanupRuntimeTrigger(runtime);
29125
+ const drawerElement = getRuntimeDrawerElement(runtime);
29126
+ const builtInTriggerElement = getRuntimeTriggerElement(runtime);
29127
+ const cleanups = [];
29128
+ if (builtInTriggerElement) {
29129
+ const handleBuiltInTriggerClick = () => {
29130
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
29131
+ };
29132
+ builtInTriggerElement.addEventListener("click", handleBuiltInTriggerClick);
29133
+ cleanups.push(() => {
29134
+ builtInTriggerElement.removeEventListener("click", handleBuiltInTriggerClick);
29135
+ });
29136
+ }
29125
29137
  if (!runtime.options.triggerElement) {
29138
+ runtime.cleanupTriggerElement = cleanups.length ? () => {
29139
+ cleanups.forEach((cleanup) => cleanup());
29140
+ } : null;
29126
29141
  return;
29127
29142
  }
29128
29143
  const triggerElement = runtime.options.triggerElement;
29129
29144
  const handleClick = () => {
29130
- releaseHiddenFocusBeforeOpen(runtime.options);
29145
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
29131
29146
  runtime.controller.setOpen(true);
29132
29147
  renderVanillaDrawer(runtime.id);
29133
29148
  };
29134
29149
  triggerElement.addEventListener("click", handleClick);
29135
- runtime.cleanupTriggerElement = () => {
29150
+ cleanups.push(() => {
29136
29151
  triggerElement.removeEventListener("click", handleClick);
29152
+ });
29153
+ runtime.cleanupTriggerElement = () => {
29154
+ cleanups.forEach((cleanup) => cleanup());
29137
29155
  };
29138
29156
  }
29139
29157
  function notifyOpenStateChange(runtime, open) {
@@ -29163,15 +29181,32 @@ function notifyOpenStateChange(runtime, open) {
29163
29181
  function canUseDOM3() {
29164
29182
  return typeof window !== "undefined" && typeof document !== "undefined";
29165
29183
  }
29166
- function releaseHiddenFocusBeforeOpen(options) {
29184
+ function isElementInsideDrawer(element) {
29185
+ let currentElement = element;
29186
+ while (currentElement) {
29187
+ if (currentElement instanceof HTMLElement && currentElement.hasAttribute("data-drawer")) {
29188
+ return true;
29189
+ }
29190
+ currentElement = currentElement.parentElement;
29191
+ }
29192
+ return false;
29193
+ }
29194
+ function releaseHiddenFocusBeforeOpen(options, drawerElement) {
29167
29195
  if (!canUseDOM3() || options.modal === false || options.autoFocus) {
29168
29196
  return;
29169
29197
  }
29170
29198
  const activeElement = document.activeElement;
29171
- if (!activeElement || activeElement === document.body || typeof activeElement.blur !== "function") {
29199
+ if (!activeElement || activeElement === document.body) {
29200
+ return;
29201
+ }
29202
+ const activeElementNode = activeElement;
29203
+ if (drawerElement?.contains(activeElementNode) || isElementInsideDrawer(activeElementNode)) {
29204
+ return;
29205
+ }
29206
+ if (typeof activeElementNode.blur !== "function") {
29172
29207
  return;
29173
29208
  }
29174
- activeElement.blur();
29209
+ activeElementNode.blur();
29175
29210
  }
29176
29211
  function getRuntimeDrawerElement(runtime) {
29177
29212
  if (!runtime.element) {
@@ -29179,6 +29214,12 @@ function getRuntimeDrawerElement(runtime) {
29179
29214
  }
29180
29215
  return runtime.element.querySelector("[data-drawer]");
29181
29216
  }
29217
+ function getRuntimeTriggerElement(runtime) {
29218
+ if (!runtime.element) {
29219
+ return null;
29220
+ }
29221
+ return runtime.element.querySelector("[data-drawer-vanilla-trigger]");
29222
+ }
29182
29223
  function getViewportSizeForDirection(direction) {
29183
29224
  if (!canUseDOM3()) {
29184
29225
  return 0;
@@ -29227,7 +29268,7 @@ function renderVanillaDrawer(id) {
29227
29268
  onOpenChange: (open) => {
29228
29269
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
29229
29270
  if (open) {
29230
- releaseHiddenFocusBeforeOpen(runtime.options);
29271
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
29231
29272
  }
29232
29273
  runtime.controller.setOpen(open);
29233
29274
  if (previousOpen !== open) {
@@ -29276,7 +29317,7 @@ function buildVanillaController(id) {
29276
29317
  return createDrawer({ id, open }).getSnapshot();
29277
29318
  }
29278
29319
  if (open) {
29279
- releaseHiddenFocusBeforeOpen(runtime.options);
29320
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
29280
29321
  }
29281
29322
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
29282
29323
  const snapshot = runtime.controller.setOpen(open);
@@ -29349,7 +29390,7 @@ function createDrawer(options = {}) {
29349
29390
  }
29350
29391
  }
29351
29392
  if (nextOptions.open && !previousOpen) {
29352
- releaseHiddenFocusBeforeOpen(nextOptions);
29393
+ releaseHiddenFocusBeforeOpen(nextOptions, existing ? getRuntimeDrawerElement(existing) : null);
29353
29394
  }
29354
29395
  renderVanillaDrawer(id);
29355
29396
  if (nextOptions.parentId && nextOptions.open) {
package/dist/vue/index.js CHANGED
@@ -29135,7 +29135,7 @@ function openAncestorChain(parentId) {
29135
29135
  openAncestorChain(nextParentId);
29136
29136
  }
29137
29137
  if (!parentRuntime.controller.getSnapshot().state.isOpen) {
29138
- releaseHiddenFocusBeforeOpen(parentRuntime.options);
29138
+ releaseHiddenFocusBeforeOpen(parentRuntime.options, getRuntimeDrawerElement(parentRuntime));
29139
29139
  parentRuntime.controller.setOpen(true);
29140
29140
  notifyOpenStateChange(parentRuntime, true);
29141
29141
  renderVanillaDrawer(parentRuntime.id);
@@ -29150,18 +29150,36 @@ function cleanupRuntimeTrigger(runtime) {
29150
29150
  }
29151
29151
  function bindTriggerElement(runtime) {
29152
29152
  cleanupRuntimeTrigger(runtime);
29153
+ const drawerElement = getRuntimeDrawerElement(runtime);
29154
+ const builtInTriggerElement = getRuntimeTriggerElement(runtime);
29155
+ const cleanups = [];
29156
+ if (builtInTriggerElement) {
29157
+ const handleBuiltInTriggerClick = () => {
29158
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
29159
+ };
29160
+ builtInTriggerElement.addEventListener("click", handleBuiltInTriggerClick);
29161
+ cleanups.push(() => {
29162
+ builtInTriggerElement.removeEventListener("click", handleBuiltInTriggerClick);
29163
+ });
29164
+ }
29153
29165
  if (!runtime.options.triggerElement) {
29166
+ runtime.cleanupTriggerElement = cleanups.length ? () => {
29167
+ cleanups.forEach((cleanup) => cleanup());
29168
+ } : null;
29154
29169
  return;
29155
29170
  }
29156
29171
  const triggerElement = runtime.options.triggerElement;
29157
29172
  const handleClick = () => {
29158
- releaseHiddenFocusBeforeOpen(runtime.options);
29173
+ releaseHiddenFocusBeforeOpen(runtime.options, drawerElement);
29159
29174
  runtime.controller.setOpen(true);
29160
29175
  renderVanillaDrawer(runtime.id);
29161
29176
  };
29162
29177
  triggerElement.addEventListener("click", handleClick);
29163
- runtime.cleanupTriggerElement = () => {
29178
+ cleanups.push(() => {
29164
29179
  triggerElement.removeEventListener("click", handleClick);
29180
+ });
29181
+ runtime.cleanupTriggerElement = () => {
29182
+ cleanups.forEach((cleanup) => cleanup());
29165
29183
  };
29166
29184
  }
29167
29185
  function notifyOpenStateChange(runtime, open) {
@@ -29191,15 +29209,32 @@ function notifyOpenStateChange(runtime, open) {
29191
29209
  function canUseDOM3() {
29192
29210
  return typeof window !== "undefined" && typeof document !== "undefined";
29193
29211
  }
29194
- function releaseHiddenFocusBeforeOpen(options) {
29212
+ function isElementInsideDrawer(element) {
29213
+ let currentElement = element;
29214
+ while (currentElement) {
29215
+ if (currentElement instanceof HTMLElement && currentElement.hasAttribute("data-drawer")) {
29216
+ return true;
29217
+ }
29218
+ currentElement = currentElement.parentElement;
29219
+ }
29220
+ return false;
29221
+ }
29222
+ function releaseHiddenFocusBeforeOpen(options, drawerElement) {
29195
29223
  if (!canUseDOM3() || options.modal === false || options.autoFocus) {
29196
29224
  return;
29197
29225
  }
29198
29226
  const activeElement = document.activeElement;
29199
- if (!activeElement || activeElement === document.body || typeof activeElement.blur !== "function") {
29227
+ if (!activeElement || activeElement === document.body) {
29228
+ return;
29229
+ }
29230
+ const activeElementNode = activeElement;
29231
+ if (drawerElement?.contains(activeElementNode) || isElementInsideDrawer(activeElementNode)) {
29232
+ return;
29233
+ }
29234
+ if (typeof activeElementNode.blur !== "function") {
29200
29235
  return;
29201
29236
  }
29202
- activeElement.blur();
29237
+ activeElementNode.blur();
29203
29238
  }
29204
29239
  function getRuntimeDrawerElement(runtime) {
29205
29240
  if (!runtime.element) {
@@ -29207,6 +29242,12 @@ function getRuntimeDrawerElement(runtime) {
29207
29242
  }
29208
29243
  return runtime.element.querySelector("[data-drawer]");
29209
29244
  }
29245
+ function getRuntimeTriggerElement(runtime) {
29246
+ if (!runtime.element) {
29247
+ return null;
29248
+ }
29249
+ return runtime.element.querySelector("[data-drawer-vanilla-trigger]");
29250
+ }
29210
29251
  function getViewportSizeForDirection(direction) {
29211
29252
  if (!canUseDOM3()) {
29212
29253
  return 0;
@@ -29255,7 +29296,7 @@ function renderVanillaDrawer(id) {
29255
29296
  onOpenChange: (open) => {
29256
29297
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
29257
29298
  if (open) {
29258
- releaseHiddenFocusBeforeOpen(runtime.options);
29299
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
29259
29300
  }
29260
29301
  runtime.controller.setOpen(open);
29261
29302
  if (previousOpen !== open) {
@@ -29304,7 +29345,7 @@ function buildVanillaController(id) {
29304
29345
  return createDrawer({ id, open }).getSnapshot();
29305
29346
  }
29306
29347
  if (open) {
29307
- releaseHiddenFocusBeforeOpen(runtime.options);
29348
+ releaseHiddenFocusBeforeOpen(runtime.options, getRuntimeDrawerElement(runtime));
29308
29349
  }
29309
29350
  const previousOpen = runtime.controller.getSnapshot().state.isOpen;
29310
29351
  const snapshot = runtime.controller.setOpen(open);
@@ -29377,7 +29418,7 @@ function createDrawer(options = {}) {
29377
29418
  }
29378
29419
  }
29379
29420
  if (nextOptions.open && !previousOpen) {
29380
- releaseHiddenFocusBeforeOpen(nextOptions);
29421
+ releaseHiddenFocusBeforeOpen(nextOptions, existing ? getRuntimeDrawerElement(existing) : null);
29381
29422
  }
29382
29423
  renderVanillaDrawer(id);
29383
29424
  if (nextOptions.parentId && nextOptions.open) {