basecoat-cli 0.2.2 → 0.2.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.
@@ -19,19 +19,19 @@
19
19
  if (activePanel) activePanel.hidden = false;
20
20
  };
21
21
 
22
- tablist.addEventListener('click', (e) => {
23
- const clickedTab = e.target.closest('[role="tab"]');
22
+ tablist.addEventListener('click', (event) => {
23
+ const clickedTab = event.target.closest('[role="tab"]');
24
24
  if (clickedTab) selectTab(clickedTab);
25
25
  });
26
26
 
27
- tablist.addEventListener('keydown', (e) => {
28
- const currentTab = e.target;
27
+ tablist.addEventListener('keydown', (event) => {
28
+ const currentTab = event.target;
29
29
  if (!tabs.includes(currentTab)) return;
30
30
 
31
31
  let nextTab;
32
32
  const currentIndex = tabs.indexOf(currentTab);
33
33
 
34
- switch (e.key) {
34
+ switch (event.key) {
35
35
  case 'ArrowRight':
36
36
  nextTab = tabs[(currentIndex + 1) % tabs.length];
37
37
  break;
@@ -48,7 +48,7 @@
48
48
  return;
49
49
  }
50
50
 
51
- e.preventDefault();
51
+ event.preventDefault();
52
52
  selectTab(nextTab);
53
53
  nextTab.focus();
54
54
  });
@@ -15,11 +15,11 @@
15
15
 
16
16
  toaster.addEventListener('mouseenter', pauseAllTimeouts);
17
17
  toaster.addEventListener('mouseleave', resumeAllTimeouts);
18
- toaster.addEventListener('click', (e) => {
19
- const actionLink = e.target.closest('.toast footer a');
20
- const actionButton = e.target.closest('.toast footer button');
18
+ toaster.addEventListener('click', (event) => {
19
+ const actionLink = event.target.closest('.toast footer a');
20
+ const actionButton = event.target.closest('.toast footer button');
21
21
  if (actionLink || actionButton) {
22
- closeToast(e.target.closest('.toast'));
22
+ closeToast(event.target.closest('.toast'));
23
23
  }
24
24
  });
25
25
 
@@ -109,8 +109,8 @@
109
109
  try {
110
110
  const func = new Function('close', actionString);
111
111
  func(() => closeToast(toast));
112
- } catch (e) {
113
- console.error('Error executing toast action:', e);
112
+ } catch (event) {
113
+ console.error('Error executing toast action:', event);
114
114
  }
115
115
  }
116
116
 
@@ -166,12 +166,12 @@
166
166
  const initialToaster = document.getElementById('toaster');
167
167
  if (initialToaster) initToaster(initialToaster);
168
168
 
169
- window.addEventListener('basecoat:toast', (e) => {
169
+ document.addEventListener('basecoat:toast', (event) => {
170
170
  if (!toaster) {
171
171
  console.error('Cannot create toast: toaster container not found on page.');
172
172
  return;
173
173
  }
174
- const config = e.detail?.config || {};
174
+ const config = event.detail?.config || {};
175
175
  const toastElement = createToast(config);
176
176
  toaster.appendChild(toastElement);
177
177
  });
@@ -1 +1 @@
1
- (()=>{let t;const e=new WeakMap;let n=!1;const o={success:'<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="m9 12 2 2 4-4"/></svg>',error:'<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="m15 9-6 6"/><path d="m9 9 6 6"/></svg>',info:'<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/></svg>',warning:'<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>'};function i(e){e.dataset.toasterInitialized||(t=e,t.addEventListener("mouseenter",r),t.addEventListener("mouseleave",s),t.addEventListener("click",(t=>{const e=t.target.closest(".toast footer a"),n=t.target.closest(".toast footer button");(e||n)&&d(t.target.closest(".toast"))})),t.querySelectorAll(".toast:not([data-toast-initialized])").forEach(a),t.dataset.toasterInitialized="true")}function a(t){if(t.dataset.toastInitialized)return;const o=parseInt(t.dataset.duration),i=-1!==o?o||("error"===t.dataset.category?5e3:3e3):-1,a={remainingTime:i,timeoutId:null,startTime:null};-1!==i&&(n?a.timeoutId=null:(a.startTime=Date.now(),a.timeoutId=setTimeout((()=>d(t)),i))),e.set(t,a),t.dataset.toastInitialized="true"}function r(){n||(n=!0,t.querySelectorAll('.toast:not([aria-hidden="true"])').forEach((t=>{if(!e.has(t))return;const n=e.get(t);n.timeoutId&&(clearTimeout(n.timeoutId),n.timeoutId=null,n.remainingTime-=Date.now()-n.startTime)})))}function s(){n&&(n=!1,t.querySelectorAll('.toast:not([aria-hidden="true"])').forEach((t=>{if(!e.has(t))return;const n=e.get(t);-1===n.remainingTime||n.timeoutId||(n.remainingTime>0?(n.startTime=Date.now(),n.timeoutId=setTimeout((()=>d(t)),n.remainingTime)):d(t))})))}function d(t){if(!e.has(t))return;const n=e.get(t);clearTimeout(n.timeoutId),e.delete(t),document.activeElement&&document.activeElement.blur(),t.setAttribute("aria-hidden","true"),t.addEventListener("transitionend",(()=>t.remove()),{once:!0})}const c=document.getElementById("toaster");c&&i(c),window.addEventListener("basecoat:toast",(e=>{if(!t)return void console.error("Cannot create toast: toaster container not found on page.");const n=function(t){const{category:e="info",title:n,description:i,action:a,cancel:r,duration:s,icon:d}=t,c=d||e&&o[e]||"",l=n?`<h2>${n}</h2>`:"",u=i?`<p>${i}</p>`:"",h=a?.href?`<a href="${a.href}" class="btn" data-toast-action>${a.label}</a>`:a?.onclick?`<button type="button" class="btn" data-toast-action onclick="${a.onclick}">${a.label}</button>`:"",m=r?`<button type="button" class="btn-outline h-6 text-xs px-2.5 rounded-sm" data-toast-cancel onclick="${r?.onclick}">${r.label}</button>`:"",g=`\n <div\n class="toast"\n role="${"error"===e?"alert":"status"}"\n aria-atomic="true"\n ${e?`data-category="${e}"`:""}\n ${void 0!==s?`data-duration="${s}"`:""}\n >\n <div class="toast-content">\n ${c}\n <section>\n ${l}\n ${u}\n </section>\n ${h||m?`<footer>${h}${m}</footer>`:""}\n </div>\n </div>\n </div>\n `,v=document.createElement("template");return v.innerHTML=g.trim(),v.content.firstChild}(e.detail?.config||{});t.appendChild(n)}));new MutationObserver((e=>{e.forEach((e=>{e.addedNodes.forEach((e=>{e.nodeType===Node.ELEMENT_NODE&&(e.matches("#toaster")&&i(e),t&&e.matches(".toast:not([data-toast-initialized])")&&a(e))}))}))})).observe(document.body,{childList:!0,subtree:!0})})();
1
+ (()=>{let t;const e=new WeakMap;let n=!1;const o={success:'<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="m9 12 2 2 4-4"/></svg>',error:'<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="m15 9-6 6"/><path d="m9 9 6 6"/></svg>',info:'<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/></svg>',warning:'<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>'};function i(e){e.dataset.toasterInitialized||(t=e,t.addEventListener("mouseenter",r),t.addEventListener("mouseleave",s),t.addEventListener("click",(t=>{const e=t.target.closest(".toast footer a"),n=t.target.closest(".toast footer button");(e||n)&&d(t.target.closest(".toast"))})),t.querySelectorAll(".toast:not([data-toast-initialized])").forEach(a),t.dataset.toasterInitialized="true")}function a(t){if(t.dataset.toastInitialized)return;const o=parseInt(t.dataset.duration),i=-1!==o?o||("error"===t.dataset.category?5e3:3e3):-1,a={remainingTime:i,timeoutId:null,startTime:null};-1!==i&&(n?a.timeoutId=null:(a.startTime=Date.now(),a.timeoutId=setTimeout((()=>d(t)),i))),e.set(t,a),t.dataset.toastInitialized="true"}function r(){n||(n=!0,t.querySelectorAll('.toast:not([aria-hidden="true"])').forEach((t=>{if(!e.has(t))return;const n=e.get(t);n.timeoutId&&(clearTimeout(n.timeoutId),n.timeoutId=null,n.remainingTime-=Date.now()-n.startTime)})))}function s(){n&&(n=!1,t.querySelectorAll('.toast:not([aria-hidden="true"])').forEach((t=>{if(!e.has(t))return;const n=e.get(t);-1===n.remainingTime||n.timeoutId||(n.remainingTime>0?(n.startTime=Date.now(),n.timeoutId=setTimeout((()=>d(t)),n.remainingTime)):d(t))})))}function d(t){if(!e.has(t))return;const n=e.get(t);clearTimeout(n.timeoutId),e.delete(t),document.activeElement&&document.activeElement.blur(),t.setAttribute("aria-hidden","true"),t.addEventListener("transitionend",(()=>t.remove()),{once:!0})}const c=document.getElementById("toaster");c&&i(c),document.addEventListener("basecoat:toast",(e=>{if(!t)return void console.error("Cannot create toast: toaster container not found on page.");const n=function(t){const{category:e="info",title:n,description:i,action:a,cancel:r,duration:s,icon:d}=t,c=d||e&&o[e]||"",l=n?`<h2>${n}</h2>`:"",u=i?`<p>${i}</p>`:"",h=a?.href?`<a href="${a.href}" class="btn" data-toast-action>${a.label}</a>`:a?.onclick?`<button type="button" class="btn" data-toast-action onclick="${a.onclick}">${a.label}</button>`:"",m=r?`<button type="button" class="btn-outline h-6 text-xs px-2.5 rounded-sm" data-toast-cancel onclick="${r?.onclick}">${r.label}</button>`:"",g=`\n <div\n class="toast"\n role="${"error"===e?"alert":"status"}"\n aria-atomic="true"\n ${e?`data-category="${e}"`:""}\n ${void 0!==s?`data-duration="${s}"`:""}\n >\n <div class="toast-content">\n ${c}\n <section>\n ${l}\n ${u}\n </section>\n ${h||m?`<footer>${h}${m}</footer>`:""}\n </div>\n </div>\n </div>\n `,v=document.createElement("template");return v.innerHTML=g.trim(),v.content.firstChild}(e.detail?.config||{});t.appendChild(n)}));new MutationObserver((e=>{e.forEach((e=>{e.addedNodes.forEach((e=>{e.nodeType===Node.ELEMENT_NODE&&(e.matches("#toaster")&&i(e),t&&e.matches(".toast:not([data-toast-initialized])")&&a(e))}))}))})).observe(document.body,{childList:!0,subtree:!0})})();
@@ -84,7 +84,7 @@
84
84
  {% endfor %}
85
85
  {% endif %}
86
86
  >
87
- <div role="presentation" id="{{ group_label_id }}">{{ item.label }}</div>
87
+ <div role="heading" id="{{ group_label_id }}">{{ item.label }}</div>
88
88
  {{ render_dropdown_items(item.items, item_id) if item.items }}
89
89
  </div>
90
90
  {% elif item.type == "separator" %}
@@ -151,7 +151,7 @@
151
151
  {% endfor %}
152
152
  {% endif %}
153
153
  >
154
- <div role="presentation" id="{{ group_label_id }}">{{ item.label }}</div>
154
+ <div role="heading" id="{{ group_label_id }}">{{ item.label }}</div>
155
155
  {{ render_select_items(item.items, selected, item_id) if item.items }}
156
156
  </div>
157
157
  {% elif item.type == "separator" %}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "basecoat-cli",
3
- "version": "0.2.2",
3
+ "version": "0.2.3",
4
4
  "description": "Add Basecoat components to your project",
5
5
  "author": "hunvreus",
6
6
  "license": "MIT",
@@ -1,10 +0,0 @@
1
- (() => {
2
- document.body.addEventListener('click', (event) => {
3
- const toggleButton = event.target.closest('[data-action="toggle-dark-mode"]');
4
-
5
- if (!toggleButton) return;
6
-
7
- const isDark = document.documentElement.classList.toggle('dark');
8
- localStorage.setItem('darkMode', isDark ? 'dark' : 'light');
9
- });
10
- })();
@@ -1 +0,0 @@
1
- document.body.addEventListener("click",(t=>{if(!t.target.closest('[data-action="toggle-dark-mode"]'))return;const e=document.documentElement.classList.toggle("dark");localStorage.setItem("darkMode",e?"dark":"light")}));