{"version":3,"file":"base.umd.cjs","names":["utils"],"sources":["../src/components/tabs.js","../src/utils/match-container.js","../src/components/enclosure.js","../src/utils.js","../src/index.js"],"sourcesContent":["export function init_tabs(component) {\r\n\r\n  const tab_list = Array.from(component.querySelectorAll('[role=\"tab\"]'));\r\n\r\n  tab_list.forEach(tab => {\r\n    tab.addEventListener(\"click\", e => show_panel_of(tab_list, tab));\r\n    tab.addEventListener(\"keydown\", e => {\r\n      const tab_nav_keys = [\"ArrowRight\", \"ArrowLeft\", \"Home\", \"End\"];\r\n      const panel_show_keys = [\" \", \"Enter\"]; \r\n\r\n      if (panel_show_keys.includes(e.key)) {\r\n        e.preventDefault();\r\n        e.stopPropagation();\r\n\r\n        show_panel_of(tab_list, tab);\r\n      } else if (tab_nav_keys.includes(e.key)) {\r\n        navigate_tabs(e, tab_list, tab);\r\n      }\r\n    });\r\n  });\r\n}\r\n\r\nfunction navigate_tabs(e, tab_list, tab) {\r\n  const current_tab_index = tab_list.indexOf(tab);\r\n  \r\n  if (current_tab_index === -1) return;\r\n  \r\n  let new_tab_index = 0;\r\n\r\n  switch (e.key) {\r\n    case \"ArrowRight\":\r\n      new_tab_index = (current_tab_index + 1) % tab_list.length;\r\n      break;\r\n    case \"ArrowLeft\":\r\n      new_tab_index = (current_tab_index - 1 + tab_list.length) % tab_list.length;\r\n      break;\r\n    case \"Home\":\r\n      new_tab_index = 0;\r\n      break;\r\n    case \"End\":\r\n      new_tab_index = tab_list.length - 1;\r\n      break;\r\n    default:\r\n      return;\r\n  }\r\n\r\n  tab_list[new_tab_index].focus();\r\n\r\n  e.preventDefault();\r\n  e.stopPropagation();\r\n}\r\n\r\nfunction show_panel_of(tab_list, tab) {\r\n\r\n  for (const item of tab_list) {\r\n    if (item === tab) {\r\n      item.setAttribute(\"aria-selected\", true);\r\n      item.tabIndex = 0;\r\n    } else {\r\n      item.setAttribute(\"aria-selected\", false);\r\n      item.tabIndex = -1;\r\n    }\r\n  }\r\n\r\n  const panel = document.getElementById(tab.getAttribute(\"aria-controls\"));\r\n  const panel_list = panel.parentNode.children;\r\n\r\n  for (const item of panel_list) {\r\n    if (item === panel) {\r\n      item.hidden = false;\r\n    } else {\r\n      item.hidden = true;\r\n    }\r\n  }\r\n\r\n} ","\r\n// export function matchContainer(component, query, callback) {\r\n//   // query in rem for relativeness, but calculation in pixels for fine grain checks\r\n\r\n//   let matching = null;\r\n//   let matches = false;\r\n//   const range_query = query.replace(/\\s+/g, '').match(/^([\\d.]+)rem<=(width)<=([\\d.]+)rem$/);\r\n//   const single_query = query.replace(/\\s+/g, '').match(/^width(>=|<=)([\\d.]+)rem$/);\r\n//   const root_font_size = parseFloat(window.getComputedStyle(document.documentElement).fontSize) || 16;\r\n\r\n//   const observer = new ResizeObserver((entries) => {\r\n\r\n//     for (let entry of entries) {\r\n//       const current_width = entry.contentBoxSize[0]\r\n//         ? entry.contentBoxSize[0].inlineSize\r\n//         : entry.contentRect.width;\r\n\r\n//       if (range_query) {\r\n//         const min_width = parseFloat(range_query[1]) * root_font_size;\r\n//         const max_width = parseFloat(range_query[3]) * root_font_size;\r\n\r\n//         matches = current_width >= min_width && current_width <= max_width;\r\n\r\n//       } else if (single_query) {\r\n//         const operator = single_query[1];\r\n//         const bound = parseFloat(single_query[2]) * root_font_size;\r\n\r\n//         matches = operator === '>=' ? current_width >= bound : current_width <= bound;\r\n\r\n//       } else {\r\n//         console.warn(`invalid query syntaxL \"${query}\"`);\r\n//         return;\r\n//       }\r\n\r\n//       if (matches !== matching) {\r\n//         matching = matches;\r\n//         callback({matches, current_width});\r\n//       }\r\n//     }\r\n//   });\r\n\r\n//   observer.observe(component);\r\n//   return () => observer.unobserve(element);\r\n// }\r\n\r\nexport function matchContainer(element, remValue, callback) {\r\n        let wasMatching = null;\r\n\r\n      const observer = new ResizeObserver((entries) => {\r\n        // 1. Query the live computed pixel size of 1rem from the html root element\r\n        const rootFontSize = parseFloat(window.getComputedStyle(document.documentElement).fontSize);\r\n\r\n        // 2. Convert your target rem value into a relative pixel threshold\r\n        const pixelThreshold = remValue * rootFontSize;\r\n\r\n        for (let entry of entries) {\r\n          // 3. Read the current internal layout width of the container\r\n          const currentWidth = entry.contentBoxSize[0] \r\n            ? entry.contentBoxSize[0].inlineSize \r\n            : entry.contentRect.width;\r\n\r\n          // 4. Evaluate the match condition against the dynamic pixel line\r\n          const matches = currentWidth <= pixelThreshold;\r\n\r\n          // 5. Fire the callback only when the boolean state flips\r\n          if (matches !== wasMatching) {\r\n            wasMatching = matches;\r\n            callback({ matches, currentPixelThreshold: pixelThreshold });\r\n          }\r\n        }\r\n      });\r\n\r\n      observer.observe(element);\r\n      return () => observer.unobserve(element);\r\n\r\n}\r\n","import { matchContainer } from \"../utils/match-container.js\";\r\n\r\nexport function init_enclosure(component) {\r\n  const container = document.body;\r\n  \r\n  matchContainer(container, component.dataset.media, e => {\r\n    const alt_btn_list = component.querySelectorAll('[data-is=\"base-enclosure-button\"]');\r\n\r\n    alt_btn_list.forEach(alt_btn => {\r\n      const target_id = alt_btn.dataset.for;\r\n      const target = document.getElementById(target_id);\r\n\r\n      if (!target) return;\r\n      \r\n      const target_attrs = {\r\n        \"role\": \"button\",\r\n        \"tabindex\": 0,\r\n        \"aria-controls\": target_id,\r\n        \"aria-expanded\": alt_btn.dataset.expanded.trim().toLowerCase() === \"true\",\r\n      }\r\n\r\n      if (e.matches) {\r\n\r\n        // set default state\r\n        target.hidden = !target_attrs['aria-expanded'];\r\n\r\n        // Add properties\r\n        Object.keys(target_attrs).forEach(attr => {\r\n          alt_btn.setAttribute(attr, target_attrs[attr]);\r\n        });\r\n\r\n        // Add listeners\r\n        alt_btn.addEventListener(\"click\", toggle_enclosure);\r\n        alt_btn.addEventListener(\"keydown\", toggle_enclosure);\r\n      } else {\r\n\r\n        // Remove button properties\r\n        Object.keys(target_attrs).forEach(attr => {\r\n          alt_btn.removeAttribute(attr);\r\n        });\r\n\r\n        // Remove listeners\r\n        alt_btn.removeEventListener(\"click\", toggle_enclosure);\r\n        alt_btn.removeEventListener(\"keyboard\", toggle_enclosure);\r\n\r\n        // Expand target permanently\r\n        target.hidden = false;\r\n      }\r\n    });\r\n  })\r\n}\r\n\r\nfunction toggle_enclosure(e) {\r\n\r\n  // if keydown event, allow only spacebar and enter key\r\n  if (e.type === 'keydown' && ![' ', 'Enter'].includes(e.key)) return;\r\n\r\n  // Stop spacebar scrolling\r\n  if (e.key === ' ') e.preventDefault();\r\n\r\n  const alt_btn = e.currentTarget;\r\n  const target_id = alt_btn.dataset.for;\r\n  const target = document.querySelector(`#${target_id}:not([hidden] *)`);\r\n\r\n  if (!target) return;\r\n\r\n  const is_expanded = alt_btn.getAttribute('aria-expanded') === 'false';\r\n\r\n  if (is_expanded) {\r\n    target.hidden = false;\r\n    alt_btn.setAttribute(\"aria-expanded\", true);\r\n  } else {\r\n    target.hidden = true;\r\n    alt_btn.setAttribute(\"aria-expanded\", false);\r\n  }\r\n}","export { matchContainer } from './utils/match-container.js';\r\n\r\n","import './index.css';\r\nimport { init_tabs } from \"./components/tabs.js\";\r\nimport { init_enclosure } from \"./components/enclosure.js\";\r\nimport * as utils from './utils.js';\r\n\r\nconst COMPONENT_REGISTRY = {\r\n  \"data-base-tabs\": init_tabs,\r\n  'data-base-enclosure': init_enclosure,\r\n}\r\n\r\nexport const base = {\r\n\r\n  utils: utils,\r\n  init_all(root = document) {\r\n    Object.entries(COMPONENT_REGISTRY).forEach(([selector, init_function]) => {\r\n      root.querySelectorAll(`[${selector}]`).forEach(el => {\r\n        if (el.dataset.baseEnhanced === 'true') return;\r\n\r\n        try {\r\n          init_function(el);\r\n          el.dataset.baseEnhanced = 'true';\r\n        } catch (e) {\r\n          console.error(e);\r\n        }\r\n      })\r\n    })\r\n  }\r\n};\r\n\r\nif (typeof window !== 'undefined') {\r\n  window.base = base;\r\n}"],"mappings":"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"}