1import { 2 Polymorphic, 3 __export, 4 access, 5 combineStyle, 6 composeEventHandlers, 7 createControllableSignal, 8 createDomCollection, 9 createDomCollectionItem, 10 createListState, 11 createSelectableCollection, 12 createSelectableItem, 13 focusWithoutScrolling, 14 getFocusableTreeWalker, 15 index_default2 as index_default, 16 isWebKit, 17 mergeDefaultProps, 18 mergeRefs, 19 useLocale 20} from "./chunk-PBSMYCQH.js"; 21import { 22 For, 23 Show, 24 createComponent, 25 createContext, 26 createEffect, 27 createMemo, 28 createSignal, 29 createUniqueId, 30 insert, 31 isServer, 32 memo, 33 mergeProps, 34 on, 35 onCleanup, 36 splitProps, 37 template, 38 useContext 39} from "./chunk-47C2ISC4.js"; 40
vendor: 2,367 bytes, lines 41-137
41// node_modules/@kobalte/core/dist/chunk/43XIKO67.js 42var TabsKeyboardDelegate = class { 43 collection; 44 direction; 45 orientation; 46 constructor(collection, direction, orientation) { 47 this.collection = collection; 48 this.direction = direction; 49 this.orientation = orientation; 50 } 51 flipDirection() { 52 return this.direction() === "rtl" && this.orientation() === "horizontal"; 53 } 54 getKeyLeftOf(key) { 55 if (this.flipDirection()) { 56 return this.getNextKey(key); 57 } 58 if (this.orientation() === "horizontal") { 59 return this.getPreviousKey(key); 60 } 61 return void 0; 62 } 63 getKeyRightOf(key) { 64 if (this.flipDirection()) { 65 return this.getPreviousKey(key); 66 } 67 if (this.orientation() === "horizontal") { 68 return this.getNextKey(key); 69 } 70 return void 0; 71 } 72 getKeyAbove(key) { 73 if (this.orientation() === "vertical") { 74 return this.getPreviousKey(key); 75 } 76 return void 0; 77 } 78 getKeyBelow(key) { 79 if (this.orientation() === "vertical") { 80 return this.getNextKey(key); 81 } 82 return void 0; 83 } 84 getFirstKey() { 85 let key = this.collection().getFirstKey(); 86 if (key == null) { 87 return; 88 } 89 const item = this.collection().getItem(key); 90 if (item?.disabled) { 91 key = this.getNextKey(key); 92 } 93 return key; 94 } 95 getLastKey() { 96 let key = this.collection().getLastKey(); 97 if (key == null) { 98 return; 99 } 100 const item = this.collection().getItem(key); 101 if (item?.disabled) { 102 key = this.getPreviousKey(key); 103 } 104 return key; 105 } 106 getNextKey(key) { 107 let nextKey = key; 108 let nextItem; 109 do { 110 nextKey = this.collection().getKeyAfter(nextKey) ?? this.collection().getFirstKey(); 111 if (nextKey == null) { 112 return; 113 } 114 nextItem = this.collection().getItem(nextKey); 115 if (nextItem == null) { 116 return; 117 } 118 } while (nextItem.disabled); 119 return nextKey; 120 } 121 getPreviousKey(key) { 122 let previousKey = key; 123 let previousItem; 124 do { 125 previousKey = this.collection().getKeyBefore(previousKey) ?? this.collection().getLastKey(); 126 if (previousKey == null) { 127 return; 128 } 129 previousItem = this.collection().getItem(previousKey); 130 if (previousItem == null) { 131 return; 132 } 133 } while (previousItem.disabled); 134 return previousKey; 135 } 136}; 137
vendor: 1,056 bytes, lines 138-175
138// node_modules/@kobalte/core/node_modules/@solid-primitives/utils/dist/index.js 139var noop = (() => void 0); 140var isNonNullable = (i) => i != null; 141var filterNonNullable = (arr) => arr.filter(isNonNullable); 142var access2 = (v) => typeof v === "function" && !v.length ? v() : v; 143var asArray = (value) => Array.isArray(value) ? value : value ? [value] : []; 144function handleDiffArray(current, prev, handleAdded, handleRemoved) { 145 const currLength = current.length; 146 const prevLength = prev.length; 147 let i = 0; 148 if (!prevLength) { 149 for (; i < currLength; i++) 150 handleAdded(current[i]); 151 return; 152 } 153 if (!currLength) { 154 for (; i < prevLength; i++) 155 handleRemoved(prev[i]); 156 return; 157 } 158 for (; i < prevLength; i++) { 159 if (prev[i] !== current[i]) 160 break; 161 } 162 let prevEl; 163 let currEl; 164 prev = prev.slice(i); 165 current = current.slice(i); 166 for (prevEl of prev) { 167 if (!current.includes(prevEl)) 168 handleRemoved(prevEl); 169 } 170 for (currEl of current) { 171 if (!prev.includes(currEl)) 172 handleAdded(currEl); 173 } 174} 175
vendor: 1,205 bytes, lines 176-206
176// node_modules/@kobalte/core/node_modules/@solid-primitives/resize-observer/dist/index.js 177function makeResizeObserver(callback, options) { 178 if (isServer) { 179 return { observe: noop, unobserve: noop }; 180 } 181 const observer = new ResizeObserver(callback); 182 onCleanup(observer.disconnect.bind(observer)); 183 return { 184 observe: (ref) => observer.observe(ref, options), 185 unobserve: observer.unobserve.bind(observer) 186 }; 187} 188function createResizeObserver(targets, onResize, options) { 189 if (isServer) 190 return; 191 const previousMap = /* @__PURE__ */ new WeakMap(), { observe, unobserve } = makeResizeObserver((entries) => { 192 for (const entry of entries) { 193 const { contentRect, target } = entry, width = Math.round(contentRect.width), height = Math.round(contentRect.height), previous = previousMap.get(target); 194 if (!previous || previous.width !== width || previous.height !== height) { 195 onResize(contentRect, target, entry); 196 previousMap.set(target, { width, height }); 197 } 198 } 199 }, options); 200 createEffect((prev) => { 201 const refs = filterNonNullable(asArray(access2(targets))); 202 handleDiffArray(refs, prev, observe, unobserve); 203 return refs; 204 }, []); 205} 206
vendor: 13,783 bytes, lines 207-631
207// node_modules/@kobalte/core/dist/chunk/7DPKSDZL.js 208var tabs_exports = {}; 209__export(tabs_exports, { 210 Content: () => TabsContent, 211 Indicator: () => TabsIndicator, 212 List: () => TabsList, 213 Root: () => TabsRoot, 214 Tabs: () => Tabs, 215 Trigger: () => TabsTrigger, 216 useTabsContext: () => useTabsContext 217}); 218var TabsContext = createContext(); 219function useTabsContext() { 220 const context = useContext(TabsContext); 221 if (context === void 0) { 222 throw new Error("[kobalte]: `useTabsContext` must be used within a `Tabs` component"); 223 } 224 return context; 225} 226function TabsContent(props) { 227 const [ref, setRef] = createSignal(); 228 const context = useTabsContext(); 229 const [local, others] = splitProps(props, ["ref", "id", "value", "forceMount"]); 230 const [tabIndex, setTabIndex] = createSignal(0); 231 const id = () => local.id ?? context.generateContentId(local.value); 232 const isSelected = () => context.listState().selectedKey() === local.value; 233 const { 234 present 235 } = index_default({ 236 show: () => local.forceMount || isSelected(), 237 element: () => ref() ?? null 238 }); 239 createEffect(on([() => ref(), () => present()], ([ref2, isPresent]) => { 240 if (ref2 == null || !isPresent) { 241 return; 242 } 243 const updateTabIndex = () => { 244 const walker = getFocusableTreeWalker(ref2, { 245 tabbable: true 246 }); 247 setTabIndex(walker.nextNode() ? void 0 : 0); 248 }; 249 updateTabIndex(); 250 const observer = new MutationObserver(updateTabIndex); 251 observer.observe(ref2, { 252 subtree: true, 253 childList: true, 254 attributes: true, 255 attributeFilter: ["tabindex", "disabled"] 256 }); 257 onCleanup(() => { 258 observer.disconnect(); 259 }); 260 })); 261 createEffect(on([() => local.value, id], ([value, id2]) => { 262 context.contentIdsMap().set(value, id2); 263 })); 264 return createComponent(Show, { 265 get when() { 266 return present(); 267 }, 268 get children() { 269 return createComponent(Polymorphic, mergeProps({ 270 as: "div", 271 ref(r$) { 272 const _ref$ = mergeRefs(setRef, local.ref); 273 typeof _ref$ === "function" && _ref$(r$); 274 }, 275 get id() { 276 return id(); 277 }, 278 role: "tabpanel", 279 get tabIndex() { 280 return tabIndex(); 281 }, 282 get ["aria-labelledby"]() { 283 return context.triggerIdsMap().get(local.value); 284 }, 285 get ["data-orientation"]() { 286 return context.orientation(); 287 }, 288 get ["data-selected"]() { 289 return isSelected() ? "" : void 0; 290 } 291 }, others)); 292 } 293 }); 294} 295function TabsIndicator(props) { 296 const context = useTabsContext(); 297 const [local, others] = splitProps(props, ["style"]); 298 const [style, setStyle] = createSignal(); 299 const { 300 direction 301 } = useLocale(); 302 const computeStyle = () => { 303 const selectedTab = context.selectedTab(); 304 if (selectedTab == null || selectedTab.getClientRects().length === 0) { 305 return; 306 } 307 const styleObj = { 308 transform: void 0, 309 width: void 0, 310 height: void 0, 311 transition: style() == null ? "none" : void 0 312 }; 313 const offset = direction() === "rtl" ? -1 * (selectedTab.offsetParent?.offsetWidth - selectedTab.offsetWidth - selectedTab.offsetLeft) : selectedTab.offsetLeft; 314 styleObj.transform = context.orientation() === "vertical" ? `translateY(${selectedTab.offsetTop}px)` : `translateX(${offset}px)`; 315 if (context.orientation() === "horizontal") { 316 styleObj.width = `${selectedTab.offsetWidth}px`; 317 } else { 318 styleObj.height = `${selectedTab.offsetHeight}px`; 319 } 320 setStyle(styleObj); 321 }; 322 createEffect(on([context.selectedTab, context.orientation, direction], () => { 323 if (style() != null) { 324 computeStyle(); 325 } 326 }, { 327 defer: true 328 })); 329 const [resizing, setResizing] = createSignal(false); 330 let timeout = null; 331 let prevTarget = null; 332 createResizeObserver(context.selectedTab, (_, t) => { 333 if (prevTarget !== t) { 334 prevTarget = t; 335 computeStyle(); 336 return; 337 } 338 setResizing(true); 339 if (timeout) 340 clearTimeout(timeout); 341 timeout = setTimeout(() => { 342 timeout = null; 343 setResizing(false); 344 }, 1); 345 computeStyle(); 346 }); 347 return createComponent(Polymorphic, mergeProps({ 348 as: "div", 349 role: "presentation", 350 get style() { 351 return combineStyle(style() ?? { 352 visibility: "hidden" 353 }, local.style); 354 }, 355 get ["data-orientation"]() { 356 return context.orientation(); 357 }, 358 get ["data-resizing"]() { 359 return resizing(); 360 } 361 }, others)); 362} 363function TabsList(props) { 364 let ref; 365 const context = useTabsContext(); 366 const [local, others] = splitProps(props, ["ref", "onKeyDown", "onMouseDown", "onFocusIn", "onFocusOut"]); 367 const { 368 direction 369 } = useLocale(); 370 const delegate = new TabsKeyboardDelegate(() => context.listState().collection(), direction, context.orientation); 371 const selectableCollection = createSelectableCollection({ 372 selectionManager: () => context.listState().selectionManager(), 373 keyboardDelegate: () => delegate, 374 selectOnFocus: () => context.activationMode() === "automatic", 375 shouldFocusWrap: false, 376 // handled by the keyboard delegate 377 disallowEmptySelection: true 378 }, () => ref); 379 createEffect(() => { 380 if (ref == null) { 381 return; 382 } 383 const selectedTab = ref.querySelector(`[data-key="${context.listState().selectedKey()}"]`); 384 if (selectedTab != null) { 385 context.setSelectedTab(selectedTab); 386 } 387 }); 388 return createComponent(Polymorphic, mergeProps({ 389 as: "div", 390 ref(r$) { 391 const _ref$ = mergeRefs((el) => ref = el, local.ref); 392 typeof _ref$ === "function" && _ref$(r$); 393 }, 394 role: "tablist", 395 get ["aria-orientation"]() { 396 return context.orientation(); 397 }, 398 get ["data-orientation"]() { 399 return context.orientation(); 400 }, 401 get onKeyDown() { 402 return composeEventHandlers([local.onKeyDown, selectableCollection.onKeyDown]); 403 }, 404 get onMouseDown() { 405 return composeEventHandlers([local.onMouseDown, selectableCollection.onMouseDown]); 406 }, 407 get onFocusIn() { 408 return composeEventHandlers([local.onFocusIn, selectableCollection.onFocusIn]); 409 }, 410 get onFocusOut() { 411 return composeEventHandlers([local.onFocusOut, selectableCollection.onFocusOut]); 412 } 413 }, others)); 414} 415function createSingleSelectListState(props) { 416 const [selectedKey, setSelectedKey] = createControllableSignal({ 417 value: () => access(props.selectedKey), 418 defaultValue: () => access(props.defaultSelectedKey), 419 onChange: (value) => props.onSelectionChange?.(value) 420 }); 421 const selectedKeys = createMemo(() => { 422 const selection = selectedKey(); 423 return selection != null ? [selection] : []; 424 }); 425 const [, defaultCreateListStateProps] = splitProps(props, [ 426 "onSelectionChange" 427 ]); 428 const createListStateProps = mergeProps(defaultCreateListStateProps, { 429 selectionMode: "single", 430 disallowEmptySelection: true, 431 allowDuplicateSelectionEvents: true, 432 selectedKeys, 433 onSelectionChange: (keys) => { 434 const key = keys.values().next().value; 435 if (key === void 0) { 436 return; 437 } 438 if (key === selectedKey()) { 439 props.onSelectionChange?.(key); 440 } 441 setSelectedKey(key); 442 } 443 }); 444 const { collection, selectionManager } = createListState(createListStateProps); 445 const selectedItem = createMemo(() => { 446 const selection = selectedKey(); 447 return selection != null ? collection().getItem(selection) : void 0; 448 }); 449 return { 450 collection, 451 selectionManager, 452 selectedKey, 453 setSelectedKey, 454 selectedItem 455 }; 456} 457function TabsRoot(props) { 458 const defaultId = `tabs-${createUniqueId()}`; 459 const mergedProps = mergeDefaultProps({ 460 id: defaultId, 461 orientation: "horizontal", 462 activationMode: "automatic" 463 }, props); 464 const [local, others] = splitProps(mergedProps, ["value", "defaultValue", "onChange", "orientation", "activationMode", "disabled"]); 465 const [items, setItems] = createSignal([]); 466 const [selectedTab, setSelectedTab] = createSignal(); 467 const { 468 DomCollectionProvider 469 } = createDomCollection({ 470 items, 471 onItemsChange: setItems 472 }); 473 const listState = createSingleSelectListState({ 474 selectedKey: () => local.value, 475 defaultSelectedKey: () => local.defaultValue, 476 onSelectionChange: (key) => local.onChange?.(String(key)), 477 dataSource: items 478 }); 479 let lastSelectedKey = listState.selectedKey(); 480 createEffect(on([() => listState.selectionManager(), () => listState.collection(), () => listState.selectedKey()], ([selectionManager, collection, currentSelectedKey]) => { 481 let selectedKey = currentSelectedKey; 482 if (selectionManager.isEmpty() || selectedKey == null || !collection.getItem(selectedKey)) { 483 selectedKey = collection.getFirstKey(); 484 let selectedItem = selectedKey != null ? collection.getItem(selectedKey) : void 0; 485 while (selectedItem?.disabled && selectedItem.key !== collection.getLastKey()) { 486 selectedKey = collection.getKeyAfter(selectedItem.key); 487 selectedItem = selectedKey != null ? collection.getItem(selectedKey) : void 0; 488 } 489 if (selectedItem?.disabled && selectedKey === collection.getLastKey()) { 490 selectedKey = collection.getFirstKey(); 491 } 492 if (selectedKey != null) { 493 selectionManager.setSelectedKeys([selectedKey]); 494 } 495 } 496 if (selectionManager.focusedKey() == null || !selectionManager.isFocused() && selectedKey !== lastSelectedKey) { 497 selectionManager.setFocusedKey(selectedKey); 498 } 499 lastSelectedKey = selectedKey; 500 })); 501 const triggerIdsMap = /* @__PURE__ */ new Map(); 502 const contentIdsMap = /* @__PURE__ */ new Map(); 503 const context = { 504 isDisabled: () => local.disabled ?? false, 505 orientation: () => local.orientation, 506 activationMode: () => local.activationMode, 507 triggerIdsMap: () => triggerIdsMap, 508 contentIdsMap: () => contentIdsMap, 509 listState: () => listState, 510 selectedTab, 511 setSelectedTab, 512 generateTriggerId: (value) => `${others.id}-trigger-${value}`, 513 generateContentId: (value) => `${others.id}-content-${value}` 514 }; 515 return createComponent(DomCollectionProvider, { 516 get children() { 517 return createComponent(TabsContext.Provider, { 518 value: context, 519 get children() { 520 return createComponent(Polymorphic, mergeProps({ 521 as: "div", 522 get ["data-orientation"]() { 523 return context.orientation(); 524 } 525 }, others)); 526 } 527 }); 528 } 529 }); 530} 531function TabsTrigger(props) { 532 let ref; 533 const context = useTabsContext(); 534 const mergedProps = mergeDefaultProps({ 535 type: "button" 536 }, props); 537 const [local, others] = splitProps(mergedProps, ["ref", "id", "value", "disabled", "onPointerDown", "onPointerUp", "onClick", "onKeyDown", "onMouseDown", "onFocus"]); 538 const id = () => local.id ?? context.generateTriggerId(local.value); 539 const isHighlighted = () => context.listState().selectionManager().focusedKey() === local.value; 540 const isDisabled = () => local.disabled || context.isDisabled(); 541 const contentId = () => context.contentIdsMap().get(local.value); 542 createDomCollectionItem({ 543 getItem: () => ({ 544 ref: () => ref, 545 type: "item", 546 key: local.value, 547 textValue: "", 548 // not applicable here 549 disabled: isDisabled() 550 }) 551 }); 552 const selectableItem = createSelectableItem({ 553 key: () => local.value, 554 selectionManager: () => context.listState().selectionManager(), 555 disabled: isDisabled 556 }, () => ref); 557 const onClick = (e) => { 558 if (isWebKit()) { 559 focusWithoutScrolling(e.currentTarget); 560 } 561 }; 562 createEffect(on([() => local.value, id], ([value, id2]) => { 563 context.triggerIdsMap().set(value, id2); 564 })); 565 return createComponent(Polymorphic, mergeProps({ 566 as: "button", 567 ref(r$) { 568 const _ref$ = mergeRefs((el) => ref = el, local.ref); 569 typeof _ref$ === "function" && _ref$(r$); 570 }, 571 get id() { 572 return id(); 573 }, 574 role: "tab", 575 get tabIndex() { 576 return memo(() => !!!isDisabled())() ? selectableItem.tabIndex() : void 0; 577 }, 578 get disabled() { 579 return isDisabled(); 580 }, 581 get ["aria-selected"]() { 582 return selectableItem.isSelected(); 583 }, 584 get ["aria-disabled"]() { 585 return isDisabled() || void 0; 586 }, 587 get ["aria-controls"]() { 588 return memo(() => !!selectableItem.isSelected())() ? contentId() : void 0; 589 }, 590 get ["data-key"]() { 591 return selectableItem.dataKey(); 592 }, 593 get ["data-orientation"]() { 594 return context.orientation(); 595 }, 596 get ["data-selected"]() { 597 return selectableItem.isSelected() ? "" : void 0; 598 }, 599 get ["data-highlighted"]() { 600 return isHighlighted() ? "" : void 0; 601 }, 602 get ["data-disabled"]() { 603 return isDisabled() ? "" : void 0; 604 }, 605 get onPointerDown() { 606 return composeEventHandlers([local.onPointerDown, selectableItem.onPointerDown]); 607 }, 608 get onPointerUp() { 609 return composeEventHandlers([local.onPointerUp, selectableItem.onPointerUp]); 610 }, 611 get onClick() { 612 return composeEventHandlers([local.onClick, selectableItem.onClick, onClick]); 613 }, 614 get onKeyDown() { 615 return composeEventHandlers([local.onKeyDown, selectableItem.onKeyDown]); 616 }, 617 get onMouseDown() { 618 return composeEventHandlers([local.onMouseDown, selectableItem.onMouseDown]); 619 }, 620 get onFocus() { 621 return composeEventHandlers([local.onFocus, selectableItem.onFocus]); 622 } 623 }, others)); 624} 625var Tabs = Object.assign(TabsRoot, { 626 Content: TabsContent, 627 Indicator: TabsIndicator, 628 List: TabsList, 629 Trigger: TabsTrigger 630}); 631
632// src/app/framework/tabs.jsx 633var _tmpl$ = /* @__PURE__ */ template(`<div class="absolute-0"><div class="centered-scroller">`); 634var Tab = (props) => { 635 return createComponent(Tabs.Content, { 636 "class": "tabs__content", 637 get value() { 638 return props.value; 639 }, 640 get children() { 641 const _el$ = _tmpl$(), _el$2 = _el$.firstChild; 642 insert(_el$2, () => props.children); 643 return _el$; 644 } 645 }); 646}; 647var Tabs2 = (props) => { 648 return createComponent(Tabs, { 649 get ["aria-label"]() { 650 return props.label; 651 }, 652 "class": "tabs relative-h100 grid-rows-min-1", 653 get value() { 654 return props.value; 655 }, 656 get onChange() { 657 return props.onChange; 658 }, 659 get children() { 660 return [createComponent(Tabs.List, { 661 "class": "tabs__list", 662 get children() { 663 return [createComponent(For, { 664 get each() { 665 return props.values; 666 }, 667 children: (name) => createComponent(Tabs.Trigger, { 668 "class": "tabs__trigger", 669 value: name, 670 children: name 671 }) 672 }), createComponent(Tabs.Indicator, { 673 "class": "tabs__indicator" 674 })]; 675 } 676 }), memo(() => props.children)]; 677 } 678 }); 679}; 680 681export { 682 Tabs, 683 Tab, 684 Tabs2 685};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.