@bitrise/bitkit-v2 0.3.481-beta.3063 → 0.3.481-beta.3067

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.
Files changed (143) hide show
  1. package/dist/components/BitkitCalendar/BitkitCalendar.d.ts +12 -0
  2. package/dist/components/BitkitCalendar/BitkitCalendar.js +7 -1
  3. package/dist/components/BitkitCalendar/BitkitCalendar.js.map +1 -1
  4. package/dist/components/BitkitCalendar/components/CalendarContent.d.ts +5 -1
  5. package/dist/components/BitkitCalendar/components/CalendarContent.js +60 -43
  6. package/dist/components/BitkitCalendar/components/CalendarContent.js.map +1 -1
  7. package/dist/components/BitkitCalendar/components/CalendarMonth.d.ts +4 -2
  8. package/dist/components/BitkitCalendar/components/CalendarMonth.js +15 -5
  9. package/dist/components/BitkitCalendar/components/CalendarMonth.js.map +1 -1
  10. package/dist/components/BitkitCalendar/components/CalendarMonthSelect.d.ts +2 -1
  11. package/dist/components/BitkitCalendar/components/CalendarMonthSelect.js +3 -2
  12. package/dist/components/BitkitCalendar/components/CalendarMonthSelect.js.map +1 -1
  13. package/dist/components/BitkitCalendar/components/CalendarNextTrigger.d.ts +3 -1
  14. package/dist/components/BitkitCalendar/components/CalendarNextTrigger.js +3 -3
  15. package/dist/components/BitkitCalendar/components/CalendarNextTrigger.js.map +1 -1
  16. package/dist/components/BitkitCalendar/components/CalendarPrevTrigger.d.ts +3 -1
  17. package/dist/components/BitkitCalendar/components/CalendarPrevTrigger.js +3 -3
  18. package/dist/components/BitkitCalendar/components/CalendarPrevTrigger.js.map +1 -1
  19. package/dist/components/BitkitCalendar/components/CalendarSelect.d.ts +1 -0
  20. package/dist/components/BitkitCalendar/components/CalendarSelect.js +5 -3
  21. package/dist/components/BitkitCalendar/components/CalendarSelect.js.map +1 -1
  22. package/dist/components/BitkitCalendar/components/CalendarTrigger.js +1 -0
  23. package/dist/components/BitkitCalendar/components/CalendarTrigger.js.map +1 -1
  24. package/dist/components/BitkitCalendar/components/CalendarYearSelect.d.ts +2 -1
  25. package/dist/components/BitkitCalendar/components/CalendarYearSelect.js +3 -2
  26. package/dist/components/BitkitCalendar/components/CalendarYearSelect.js.map +1 -1
  27. package/dist/components/BitkitDatePicker/BitkitDatePicker.d.ts +2 -0
  28. package/dist/components/BitkitDatePicker/BitkitDatePicker.js +2 -1
  29. package/dist/components/BitkitDatePicker/BitkitDatePicker.js.map +1 -1
  30. package/dist/components/BitkitFilter/BitkitFilter.context.d.ts +65 -0
  31. package/dist/components/BitkitFilter/BitkitFilter.context.js +82 -0
  32. package/dist/components/BitkitFilter/BitkitFilter.context.js.map +1 -0
  33. package/dist/components/BitkitFilter/BitkitFilter.d.ts +55 -0
  34. package/dist/components/BitkitFilter/BitkitFilter.js +247 -0
  35. package/dist/components/BitkitFilter/BitkitFilter.js.map +1 -0
  36. package/dist/components/BitkitFilter/BitkitFilter.utils.d.ts +18 -0
  37. package/dist/components/BitkitFilter/BitkitFilter.utils.js +42 -0
  38. package/dist/components/BitkitFilter/BitkitFilter.utils.js.map +1 -0
  39. package/dist/components/BitkitFilter/BitkitFilterAdd.d.ts +18 -0
  40. package/dist/components/BitkitFilter/BitkitFilterAdd.js +200 -0
  41. package/dist/components/BitkitFilter/BitkitFilterAdd.js.map +1 -0
  42. package/dist/components/BitkitFilter/BitkitFilterDateRange.d.ts +26 -0
  43. package/dist/components/BitkitFilter/BitkitFilterDateRange.js +118 -0
  44. package/dist/components/BitkitFilter/BitkitFilterDateRange.js.map +1 -0
  45. package/dist/components/BitkitFilter/BitkitFilterSearch.d.ts +23 -0
  46. package/dist/components/BitkitFilter/BitkitFilterSearch.js +72 -0
  47. package/dist/components/BitkitFilter/BitkitFilterSearch.js.map +1 -0
  48. package/dist/components/BitkitFilter/BitkitFilterSelect.d.ts +61 -0
  49. package/dist/components/BitkitFilter/BitkitFilterSelect.js +149 -0
  50. package/dist/components/BitkitFilter/BitkitFilterSelect.js.map +1 -0
  51. package/dist/components/BitkitFilter/BitkitFilterSwitch.d.ts +28 -0
  52. package/dist/components/BitkitFilter/BitkitFilterSwitch.js +87 -0
  53. package/dist/components/BitkitFilter/BitkitFilterSwitch.js.map +1 -0
  54. package/dist/components/BitkitFilter/components/FilterChip.d.ts +23 -0
  55. package/dist/components/BitkitFilter/components/FilterChip.js +66 -0
  56. package/dist/components/BitkitFilter/components/FilterChip.js.map +1 -0
  57. package/dist/components/BitkitFilter/components/FilterField.d.ts +15 -0
  58. package/dist/components/BitkitFilter/components/FilterField.js +60 -0
  59. package/dist/components/BitkitFilter/components/FilterField.js.map +1 -0
  60. package/dist/components/BitkitFilter/components/FilterPanel.d.ts +42 -0
  61. package/dist/components/BitkitFilter/components/FilterPanel.js +126 -0
  62. package/dist/components/BitkitFilter/components/FilterPanel.js.map +1 -0
  63. package/dist/components/BitkitFilter/components/FilterSearchInput.d.ts +15 -0
  64. package/dist/components/BitkitFilter/components/FilterSearchInput.js +42 -0
  65. package/dist/components/BitkitFilter/components/FilterSearchInput.js.map +1 -0
  66. package/dist/components/BitkitFilter/components/FilterSelectForm.d.ts +45 -0
  67. package/dist/components/BitkitFilter/components/FilterSelectForm.js +341 -0
  68. package/dist/components/BitkitFilter/components/FilterSelectForm.js.map +1 -0
  69. package/dist/components/BitkitLabelTooltip/BitkitLabelTooltip.d.ts +4 -3
  70. package/dist/components/BitkitLabelTooltip/BitkitLabelTooltip.js +3 -2
  71. package/dist/components/BitkitLabelTooltip/BitkitLabelTooltip.js.map +1 -1
  72. package/dist/components/BitkitMarkdown/BitkitMarkdown.js +1 -1
  73. package/dist/components/BitkitNoteCard/BitkitNoteCard.js +1 -1
  74. package/dist/components/BitkitPageSidebar/BitkitPageSidebar.js +1 -1
  75. package/dist/components/index.d.ts +6 -1
  76. package/dist/main.js +8 -9
  77. package/dist/theme/recipes/index.d.ts +525 -0
  78. package/dist/theme/recipes/index.js +1 -3
  79. package/dist/theme/recipes/index.js.map +1 -1
  80. package/dist/theme/semantic-tokens/index.d.ts +0 -5
  81. package/dist/theme/semantic-tokens/semanticColors.d.ts +0 -5
  82. package/dist/theme/semantic-tokens/semanticColors.js +0 -1
  83. package/dist/theme/semantic-tokens/semanticColors.js.map +1 -1
  84. package/dist/theme/slot-recipes/DatePicker.recipe.d.ts +15 -0
  85. package/dist/theme/slot-recipes/DatePicker.recipe.js +72 -22
  86. package/dist/theme/slot-recipes/DatePicker.recipe.js.map +1 -1
  87. package/dist/theme/slot-recipes/DatePickerSelect.recipe.d.ts +85 -0
  88. package/dist/theme/slot-recipes/DatePickerSelect.recipe.js +35 -10
  89. package/dist/theme/slot-recipes/DatePickerSelect.recipe.js.map +1 -1
  90. package/dist/theme/slot-recipes/Filter.recipe.d.ts +37 -0
  91. package/dist/theme/slot-recipes/Filter.recipe.js +655 -0
  92. package/dist/theme/slot-recipes/Filter.recipe.js.map +1 -0
  93. package/dist/theme/slot-recipes/Listbox.recipe.d.ts +22 -0
  94. package/dist/theme/slot-recipes/Listbox.recipe.js +96 -0
  95. package/dist/theme/slot-recipes/Listbox.recipe.js.map +1 -0
  96. package/dist/theme/slot-recipes/Menu.recipe.js +6 -1
  97. package/dist/theme/slot-recipes/Menu.recipe.js.map +1 -1
  98. package/dist/theme/slot-recipes/Tag.recipe.d.ts +1 -1
  99. package/dist/theme/slot-recipes/UISideNav.recipe.d.ts +2 -1
  100. package/dist/theme/slot-recipes/UISideNav.recipe.js +3 -2
  101. package/dist/theme/slot-recipes/UISideNav.recipe.js.map +1 -1
  102. package/dist/theme/slot-recipes/index.d.ts +160 -3
  103. package/dist/theme/slot-recipes/index.js +4 -2
  104. package/dist/theme/slot-recipes/index.js.map +1 -1
  105. package/dist/theme/themeUtils.d.ts +0 -6
  106. package/dist/theme/themeUtils.js +1 -7
  107. package/dist/theme/themeUtils.js.map +1 -1
  108. package/dist/utilities/BitkitPortalContext.js +3 -2
  109. package/dist/utilities/BitkitPortalContext.js.map +1 -1
  110. package/docs/v1-to-v2-migration-guide.md +48 -1
  111. package/package.json +1 -1
  112. package/dist/components/BitkitUIHeader/BitkitUIHeader.d.ts +0 -37
  113. package/dist/components/BitkitUIHeader/BitkitUIHeader.js +0 -112
  114. package/dist/components/BitkitUIHeader/BitkitUIHeader.js.map +0 -1
  115. package/dist/components/BitkitUIHeader/BitriseLogo.d.ts +0 -10
  116. package/dist/components/BitkitUIHeader/BitriseLogo.js +0 -86
  117. package/dist/components/BitkitUIHeader/BitriseLogo.js.map +0 -1
  118. package/dist/components/BitkitUIHeader/UIHeaderAccount.d.ts +0 -23
  119. package/dist/components/BitkitUIHeader/UIHeaderAccount.js +0 -40
  120. package/dist/components/BitkitUIHeader/UIHeaderAccount.js.map +0 -1
  121. package/dist/components/BitkitUIHeader/UIHeaderButton.d.ts +0 -32
  122. package/dist/components/BitkitUIHeader/UIHeaderButton.js +0 -41
  123. package/dist/components/BitkitUIHeader/UIHeaderButton.js.map +0 -1
  124. package/dist/components/BitkitUIHeader/UIHeaderContext.d.ts +0 -13
  125. package/dist/components/BitkitUIHeader/UIHeaderContext.js +0 -11
  126. package/dist/components/BitkitUIHeader/UIHeaderContext.js.map +0 -1
  127. package/dist/components/BitkitUIHeader/UIHeaderControl.d.ts +0 -65
  128. package/dist/components/BitkitUIHeader/UIHeaderControl.js +0 -71
  129. package/dist/components/BitkitUIHeader/UIHeaderControl.js.map +0 -1
  130. package/dist/components/BitkitUIHeader/UIHeaderNavButton.d.ts +0 -20
  131. package/dist/components/BitkitUIHeader/UIHeaderNavButton.js +0 -46
  132. package/dist/components/BitkitUIHeader/UIHeaderNavButton.js.map +0 -1
  133. package/dist/components/BitkitUIHeader/UIHeaderSearch.d.ts +0 -32
  134. package/dist/components/BitkitUIHeader/UIHeaderSearch.js +0 -116
  135. package/dist/components/BitkitUIHeader/UIHeaderSearch.js.map +0 -1
  136. package/dist/components/BitkitUIHeader/uiHeaderPart.d.ts +0 -9
  137. package/dist/components/BitkitUIHeader/uiHeaderPart.js +0 -13
  138. package/dist/components/BitkitUIHeader/uiHeaderPart.js.map +0 -1
  139. package/dist/theme/recipes/UIHeaderButton.recipe.js +0 -103
  140. package/dist/theme/recipes/UIHeaderButton.recipe.js.map +0 -1
  141. package/dist/theme/slot-recipes/UIHeader.recipe.d.ts +0 -4
  142. package/dist/theme/slot-recipes/UIHeader.recipe.js +0 -241
  143. package/dist/theme/slot-recipes/UIHeader.recipe.js.map +0 -1
@@ -1,6 +1,5 @@
1
1
  import avatarSlotRecipe from "./Avatar.recipe.js";
2
2
  import numberInputSlotRecipe from "./NumberInput.recipe.js";
3
- import uiHeaderSlotRecipe from "./UIHeader.recipe.js";
4
3
  import uiSideNavSlotRecipe from "./UISideNav.recipe.js";
5
4
  import accordionSlotRecipe from "./Accordion.recipe.js";
6
5
  import actionBarSlotRecipe from "./ActionBar.recipe.js";
@@ -23,11 +22,13 @@ import expandableCardSlotRecipe from "./ExpandableCard.recipe.js";
23
22
  import fieldSlotRecipe from "./Field.recipe.js";
24
23
  import fieldsetSlotRecipe from "./Fieldset.recipe.js";
25
24
  import fileUploadSlotRecipe from "./FileUpload.recipe.js";
25
+ import filterSlotRecipe from "./Filter.recipe.js";
26
26
  import groupHeadingRecipe from "./GroupHeading.recipe.js";
27
27
  import imageCropperSlotRecipe from "./ImageCropper.recipe.js";
28
28
  import inlineLoadingRecipe from "./InlineLoading.recipe.js";
29
29
  import labeledDataSlotRecipe from "./LabeledData.recipe.js";
30
30
  import listSlotRecipe from "./List.recipe.js";
31
+ import listboxSlotRecipe from "./Listbox.recipe.js";
31
32
  import markdownSlotRecipe from "./Markdown.recipe.js";
32
33
  import markdownCardSlotRecipe from "./MarkdownCard.recipe.js";
33
34
  import menuSlotRecipe from "./Menu.recipe.js";
@@ -88,9 +89,11 @@ var slotRecipes = {
88
89
  groupHeading: groupHeadingRecipe,
89
90
  fieldset: fieldsetSlotRecipe,
90
91
  fileUpload: fileUploadSlotRecipe,
92
+ filter: filterSlotRecipe,
91
93
  imageCropper: imageCropperSlotRecipe,
92
94
  inlineLoading: inlineLoadingRecipe,
93
95
  list: listSlotRecipe,
96
+ listbox: listboxSlotRecipe,
94
97
  markdown: markdownSlotRecipe,
95
98
  markdownCard: markdownCardSlotRecipe,
96
99
  menu: menuSlotRecipe,
@@ -130,7 +133,6 @@ var slotRecipes = {
130
133
  tooltip: tooltipSlotRecipe,
131
134
  tour: tourSlotRecipe,
132
135
  treeView: treeViewSlotRecipe,
133
- uiHeader: uiHeaderSlotRecipe,
134
136
  uiSideNav: uiSideNavSlotRecipe
135
137
  };
136
138
  //#endregion
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["groupHeadingSlotRecipe","inlineLoadingSlotRecipe","paginationLoadMoreSlotRecipe","sectionHeadingSlotRecipe"],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport dataWidgetSlotRecipe from './DataWidget.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport draggableCardSlotRecipe from './DraggableCard.recipe.ts';\nimport drawerSlotRecipe from './Drawer.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport labeledDataSlotRecipe from './LabeledData.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport multiselectSlotRecipe from './Multiselect.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport overflowContentSlotRecipe from './OverflowContent.recipe.ts';\nimport pageFooterSlotRecipe from './PageFooter.recipe.ts';\nimport pageHeaderSlotRecipe from './PageHeader.recipe.ts';\nimport pageSidebarSlotRecipe from './PageSidebar.recipe.ts';\nimport paginationSlotRecipe from './Pagination.recipe.ts';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport popoverSlotRecipe from './Popover.recipe.ts';\nimport progressSlotRecipe from './Progress.recipe.ts';\nimport qrCodeSlotRecipe from './QrCode.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport settingsCardSlotRecipe from './SettingsCard.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.recipe.ts';\nimport stepCardSlotRecipe from './StepCard.recipe.ts';\nimport stepsSlotRecipe from './Steps.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tableCardSlotRecipe from './TableCard.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport textInputSlotRecipe from './TextInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport toggletipSlotRecipe from './Toggletip.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\nimport tourSlotRecipe from './Tour.recipe.ts';\nimport treeViewSlotRecipe from './TreeView.recipe.ts';\nimport uiHeaderSlotRecipe from './UIHeader.recipe';\nimport uiSideNavSlotRecipe from './UISideNav.recipe.ts';\n\nconst slotRecipes = {\n accordion: accordionSlotRecipe,\n actionBar: actionBarSlotRecipe,\n alert: alertSlotRecipe,\n avatar: avatarSlotRecipe,\n breadcrumb: breadcrumbSlotRecipe,\n card: cardSlotRecipe,\n checkbox: checkboxSlotRecipe,\n codeSnippet: codeSnippetSlotRecipe,\n collapsible: collapsibleSlotRecipe,\n combobox: comboboxSlotRecipe,\n dataWidget: dataWidgetSlotRecipe,\n datePicker: datePickerSlotRecipe,\n datePickerSelect: datePickerSelectSlotRecipe,\n dialog: dialogSlotRecipe,\n draggableCard: draggableCardSlotRecipe,\n drawer: drawerSlotRecipe,\n emptyState: emptyStateSlotRecipe,\n expandableCard: expandableCardSlotRecipe,\n field: fieldSlotRecipe,\n groupHeading: groupHeadingSlotRecipe,\n fieldset: fieldsetSlotRecipe,\n fileUpload: fileUploadSlotRecipe,\n imageCropper: imageCropperSlotRecipe,\n inlineLoading: inlineLoadingSlotRecipe,\n list: listSlotRecipe,\n markdown: markdownSlotRecipe,\n markdownCard: markdownCardSlotRecipe,\n menu: menuSlotRecipe,\n multiselect: multiselectSlotRecipe,\n noteCard: noteCardSlotRecipe,\n nativeSelect: nativeSelectSlotRecipe,\n numberInput: numberInputSlotRecipe,\n overflowContent: overflowContentSlotRecipe,\n pageFooter: pageFooterSlotRecipe,\n pageHeader: pageHeaderSlotRecipe,\n pageSidebar: pageSidebarSlotRecipe,\n pagination: paginationSlotRecipe,\n paginationLoadMore: paginationLoadMoreSlotRecipe,\n popover: popoverSlotRecipe,\n progress: progressSlotRecipe,\n qrCode: qrCodeSlotRecipe,\n radioGroup: radioGroupSlotRecipe,\n ribbon: ribbonSlotRecipe,\n sectionHeading: sectionHeadingSlotRecipe,\n labeledData: labeledDataSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n select: selectSlotRecipe,\n settingsCard: settingsCardSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n stat: statSlotRecipe,\n stepsCard: stepCardSlotRecipe,\n steps: stepsSlotRecipe,\n switch: switchSlotRecipe,\n table: tableSlotRecipe,\n tableCard: tableCardSlotRecipe,\n tabs: tabsSlotRecipe,\n tag: tagSlotRecipe,\n tagsInput: tagsInputSlotRecipe,\n textInput: textInputSlotRecipe,\n toast: toastSlotRecipe,\n toggletip: toggletipSlotRecipe,\n tooltip: tooltipSlotRecipe,\n tour: tourSlotRecipe,\n treeView: treeViewSlotRecipe,\n uiHeader: uiHeaderSlotRecipe,\n uiSideNav: uiSideNavSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmEA,IAAM,cAAc;CAClB,WAAW;CACX,WAAW;CACX,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,aAAa;CACb,aAAa;CACb,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,kBAAkB;CAClB,QAAQ;CACR,eAAe;CACf,QAAQ;CACR,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAcA;CACd,UAAU;CACV,YAAY;CACZ,cAAc;CACd,eAAeC;CACf,MAAM;CACN,UAAU;CACV,cAAc;CACd,MAAM;CACN,aAAa;CACb,UAAU;CACV,cAAc;CACd,aAAa;CACb,iBAAiB;CACjB,YAAY;CACZ,YAAY;CACZ,aAAa;CACb,YAAY;CACZ,oBAAoBC;CACpB,SAAS;CACT,UAAU;CACV,QAAQ;CACR,YAAY;CACZ,QAAQ;CACR,gBAAgBC;CAChB,aAAa;CACb,cAAc;CACd,QAAQ;CACR,cAAc;CACd,aAAa;CACb,MAAM;CACN,WAAW;CACX,OAAO;CACP,QAAQ;CACR,OAAO;CACP,WAAW;CACX,MAAM;CACN,KAAK;CACL,WAAW;CACX,WAAW;CACX,OAAO;CACP,WAAW;CACX,SAAS;CACT,MAAM;CACN,UAAU;CACV,UAAU;CACV,WAAW;AACb"}
1
+ {"version":3,"file":"index.js","names":["groupHeadingSlotRecipe","inlineLoadingSlotRecipe","paginationLoadMoreSlotRecipe","sectionHeadingSlotRecipe"],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport dataWidgetSlotRecipe from './DataWidget.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport draggableCardSlotRecipe from './DraggableCard.recipe.ts';\nimport drawerSlotRecipe from './Drawer.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport filterSlotRecipe from './Filter.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport labeledDataSlotRecipe from './LabeledData.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport listboxSlotRecipe from './Listbox.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport multiselectSlotRecipe from './Multiselect.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport overflowContentSlotRecipe from './OverflowContent.recipe.ts';\nimport pageFooterSlotRecipe from './PageFooter.recipe.ts';\nimport pageHeaderSlotRecipe from './PageHeader.recipe.ts';\nimport pageSidebarSlotRecipe from './PageSidebar.recipe.ts';\nimport paginationSlotRecipe from './Pagination.recipe.ts';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport popoverSlotRecipe from './Popover.recipe.ts';\nimport progressSlotRecipe from './Progress.recipe.ts';\nimport qrCodeSlotRecipe from './QrCode.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport settingsCardSlotRecipe from './SettingsCard.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.recipe.ts';\nimport stepCardSlotRecipe from './StepCard.recipe.ts';\nimport stepsSlotRecipe from './Steps.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tableCardSlotRecipe from './TableCard.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport textInputSlotRecipe from './TextInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport toggletipSlotRecipe from './Toggletip.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\nimport tourSlotRecipe from './Tour.recipe.ts';\nimport treeViewSlotRecipe from './TreeView.recipe.ts';\nimport uiSideNavSlotRecipe from './UISideNav.recipe.ts';\n\nconst slotRecipes = {\n accordion: accordionSlotRecipe,\n actionBar: actionBarSlotRecipe,\n alert: alertSlotRecipe,\n avatar: avatarSlotRecipe,\n breadcrumb: breadcrumbSlotRecipe,\n card: cardSlotRecipe,\n checkbox: checkboxSlotRecipe,\n codeSnippet: codeSnippetSlotRecipe,\n collapsible: collapsibleSlotRecipe,\n combobox: comboboxSlotRecipe,\n dataWidget: dataWidgetSlotRecipe,\n datePicker: datePickerSlotRecipe,\n datePickerSelect: datePickerSelectSlotRecipe,\n dialog: dialogSlotRecipe,\n draggableCard: draggableCardSlotRecipe,\n drawer: drawerSlotRecipe,\n emptyState: emptyStateSlotRecipe,\n expandableCard: expandableCardSlotRecipe,\n field: fieldSlotRecipe,\n groupHeading: groupHeadingSlotRecipe,\n fieldset: fieldsetSlotRecipe,\n fileUpload: fileUploadSlotRecipe,\n filter: filterSlotRecipe,\n imageCropper: imageCropperSlotRecipe,\n inlineLoading: inlineLoadingSlotRecipe,\n list: listSlotRecipe,\n listbox: listboxSlotRecipe,\n markdown: markdownSlotRecipe,\n markdownCard: markdownCardSlotRecipe,\n menu: menuSlotRecipe,\n multiselect: multiselectSlotRecipe,\n noteCard: noteCardSlotRecipe,\n nativeSelect: nativeSelectSlotRecipe,\n numberInput: numberInputSlotRecipe,\n overflowContent: overflowContentSlotRecipe,\n pageFooter: pageFooterSlotRecipe,\n pageHeader: pageHeaderSlotRecipe,\n pageSidebar: pageSidebarSlotRecipe,\n pagination: paginationSlotRecipe,\n paginationLoadMore: paginationLoadMoreSlotRecipe,\n popover: popoverSlotRecipe,\n progress: progressSlotRecipe,\n qrCode: qrCodeSlotRecipe,\n radioGroup: radioGroupSlotRecipe,\n ribbon: ribbonSlotRecipe,\n sectionHeading: sectionHeadingSlotRecipe,\n labeledData: labeledDataSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n select: selectSlotRecipe,\n settingsCard: settingsCardSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n stat: statSlotRecipe,\n stepsCard: stepCardSlotRecipe,\n steps: stepsSlotRecipe,\n switch: switchSlotRecipe,\n table: tableSlotRecipe,\n tableCard: tableCardSlotRecipe,\n tabs: tabsSlotRecipe,\n tag: tagSlotRecipe,\n tagsInput: tagsInputSlotRecipe,\n textInput: textInputSlotRecipe,\n toast: toastSlotRecipe,\n toggletip: toggletipSlotRecipe,\n tooltip: tooltipSlotRecipe,\n tour: tourSlotRecipe,\n treeView: treeViewSlotRecipe,\n uiSideNav: uiSideNavSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoEA,IAAM,cAAc;CAClB,WAAW;CACX,WAAW;CACX,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,aAAa;CACb,aAAa;CACb,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,kBAAkB;CAClB,QAAQ;CACR,eAAe;CACf,QAAQ;CACR,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAcA;CACd,UAAU;CACV,YAAY;CACZ,QAAQ;CACR,cAAc;CACd,eAAeC;CACf,MAAM;CACN,SAAS;CACT,UAAU;CACV,cAAc;CACd,MAAM;CACN,aAAa;CACb,UAAU;CACV,cAAc;CACd,aAAa;CACb,iBAAiB;CACjB,YAAY;CACZ,YAAY;CACZ,aAAa;CACb,YAAY;CACZ,oBAAoBC;CACpB,SAAS;CACT,UAAU;CACV,QAAQ;CACR,YAAY;CACZ,QAAQ;CACR,gBAAgBC;CAChB,aAAa;CACb,cAAc;CACd,QAAQ;CACR,cAAc;CACd,aAAa;CACb,MAAM;CACN,WAAW;CACX,OAAO;CACP,QAAQ;CACR,OAAO;CACP,WAAW;CACX,MAAM;CACN,KAAK;CACL,WAAW;CACX,WAAW;CACX,OAAO;CACP,WAAW;CACX,SAAS;CACT,MAAM;CACN,UAAU;CACV,WAAW;AACb"}
@@ -8,12 +8,6 @@ export declare function withSlashes(object: Record<string, any>): Record<string,
8
8
  * @returns Value in rems, typed precisely enough to satisfy props that take a `${number}rem`
9
9
  */
10
10
  export declare const rem: (input: number) => `${number}rem`;
11
- /**
12
- * A colour token as the raw CSS variable Chakra compiles it to, for the places a `{colors.…}`
13
- * reference cannot go: inside a compound value like a gradient, Chakra reads the token's first `/`
14
- * as its colour-mix opacity modifier, so the slashes have to be escaped by hand instead.
15
- */
16
- export declare const colorVar: (token: string) => string;
17
11
  /**
18
12
  * The colour tokens under the given prefixes, for props that must take a semantic token.
19
13
  *
@@ -29,13 +29,7 @@ function withSlashes(object) {
29
29
  var rem = (input) => {
30
30
  return `${input / 16}rem`;
31
31
  };
32
- /**
33
- * A colour token as the raw CSS variable Chakra compiles it to, for the places a `{colors.…}`
34
- * reference cannot go: inside a compound value like a gradient, Chakra reads the token's first `/`
35
- * as its colour-mix opacity modifier, so the slashes have to be escaped by hand instead.
36
- */
37
- var colorVar = (token) => `var(--colors-${token.replace(/\//g, "\\/")})`;
38
32
  //#endregion
39
- export { colorVar, flattenTokens, rem, withSlashes };
33
+ export { flattenTokens, rem, withSlashes };
40
34
 
41
35
  //# sourceMappingURL=themeUtils.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"themeUtils.js","names":[],"sources":["../../lib/theme/themeUtils.ts"],"sourcesContent":["import { type Tokens } from '@chakra-ui/react/styled-system';\nimport { type TextProps } from '@chakra-ui/react/text';\nimport { isPlainObject } from 'es-toolkit';\n\n// Based on https://github.com/toss/es-toolkit/blob/main/src/object/flattenObject.ts\nexport const flattenTokens = (object: object, prefix: string = ''): Record<string, any> => {\n const result: Record<string, any> = {};\n const keys = Object.keys(object);\n\n for (let i = 0; i < keys.length; i++) {\n const key = keys[i];\n const value = (object as any)[key];\n\n const prefixedKey = prefix ? `${prefix}/${key}` : key;\n\n if (isPlainObject(value) && Object.keys(value).length > 0 && Object.keys(value)[0] !== 'value') {\n Object.assign(result, flattenTokens(value, prefixedKey));\n continue;\n }\n\n result[prefixedKey] = value;\n }\n\n return result;\n};\n\nexport function withSlashes(object: Record<string, any>): Record<string, any> {\n return {\n ...object,\n ...flattenTokens(object),\n };\n}\n\n/**\n *\n * @param input Value in pixels\n * @returns Value in rems, typed precisely enough to satisfy props that take a `${number}rem`\n */\nexport const rem = (input: number): `${number}rem` => {\n return `${input / 16}rem`;\n};\n\n/**\n * A colour token as the raw CSS variable Chakra compiles it to, for the places a `{colors.…}`\n * reference cannot go: inside a compound value like a gradient, Chakra reads the token's first `/`\n * as its colour-mix opacity modifier, so the slashes have to be escaped by hand instead.\n */\nexport const colorVar = (token: string): string => `var(--colors-${token.replace(/\\//g, '\\\\/')})`;\n\n/**\n * The colour tokens under the given prefixes, for props that must take a semantic token.\n *\n * `Tokens` is generated in the consumer's own project by `chakra typegen`, which\n * `scripts/postinstall.cjs` runs and which exits 0 with a warning when it cannot. Where it did not\n * run, `Tokens['colors']` is Chakra's stock union, the `Extract` has nothing to match and collapses\n * to `never` -- which would make every prop using it a type error pointing at the wrong thing. So it\n * falls back to `string`: the narrowing is a guard where the types are real, not a tripwire where\n * they are not.\n */\nexport type BitkitColorToken<Prefix extends string> = [Extract<Tokens['colors'], `${Prefix}/${string}`>] extends [never]\n ? string\n : Extract<Tokens['colors'], `${Prefix}/${string}`>;\n\nexport const getTextStyle = (as: TextProps['as']) => {\n if (['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].includes(as as string)) {\n return `heading/${as}`;\n }\n return undefined;\n};\n"],"mappings":";;AAKA,IAAa,iBAAiB,QAAgB,SAAiB,OAA4B;CACzF,MAAM,SAA8B,CAAC;CACrC,MAAM,OAAO,OAAO,KAAK,MAAM;CAE/B,KAAK,IAAI,IAAI,GAAG,IAAI,KAAK,QAAQ,KAAK;EACpC,MAAM,MAAM,KAAK;EACjB,MAAM,QAAS,OAAe;EAE9B,MAAM,cAAc,SAAS,GAAG,OAAO,GAAG,QAAQ;EAElD,IAAI,cAAc,KAAK,KAAK,OAAO,KAAK,KAAK,CAAC,CAAC,SAAS,KAAK,OAAO,KAAK,KAAK,CAAC,CAAC,OAAO,SAAS;GAC9F,OAAO,OAAO,QAAQ,cAAc,OAAO,WAAW,CAAC;GACvD;EACF;EAEA,OAAO,eAAe;CACxB;CAEA,OAAO;AACT;AAEA,SAAgB,YAAY,QAAkD;CAC5E,OAAO;EACL,GAAG;EACH,GAAG,cAAc,MAAM;CACzB;AACF;;;;;;AAOA,IAAa,OAAO,UAAkC;CACpD,OAAO,GAAG,QAAQ,GAAG;AACvB;;;;;;AAOA,IAAa,YAAY,UAA0B,gBAAgB,MAAM,QAAQ,OAAO,KAAK,EAAE"}
1
+ {"version":3,"file":"themeUtils.js","names":[],"sources":["../../lib/theme/themeUtils.ts"],"sourcesContent":["import { type Tokens } from '@chakra-ui/react/styled-system';\nimport { type TextProps } from '@chakra-ui/react/text';\nimport { isPlainObject } from 'es-toolkit';\n\n// Based on https://github.com/toss/es-toolkit/blob/main/src/object/flattenObject.ts\nexport const flattenTokens = (object: object, prefix: string = ''): Record<string, any> => {\n const result: Record<string, any> = {};\n const keys = Object.keys(object);\n\n for (let i = 0; i < keys.length; i++) {\n const key = keys[i];\n const value = (object as any)[key];\n\n const prefixedKey = prefix ? `${prefix}/${key}` : key;\n\n if (isPlainObject(value) && Object.keys(value).length > 0 && Object.keys(value)[0] !== 'value') {\n Object.assign(result, flattenTokens(value, prefixedKey));\n continue;\n }\n\n result[prefixedKey] = value;\n }\n\n return result;\n};\n\nexport function withSlashes(object: Record<string, any>): Record<string, any> {\n return {\n ...object,\n ...flattenTokens(object),\n };\n}\n\n/**\n *\n * @param input Value in pixels\n * @returns Value in rems, typed precisely enough to satisfy props that take a `${number}rem`\n */\nexport const rem = (input: number): `${number}rem` => {\n return `${input / 16}rem`;\n};\n\n/**\n * The colour tokens under the given prefixes, for props that must take a semantic token.\n *\n * `Tokens` is generated in the consumer's own project by `chakra typegen`, which\n * `scripts/postinstall.cjs` runs and which exits 0 with a warning when it cannot. Where it did not\n * run, `Tokens['colors']` is Chakra's stock union, the `Extract` has nothing to match and collapses\n * to `never` -- which would make every prop using it a type error pointing at the wrong thing. So it\n * falls back to `string`: the narrowing is a guard where the types are real, not a tripwire where\n * they are not.\n */\nexport type BitkitColorToken<Prefix extends string> = [Extract<Tokens['colors'], `${Prefix}/${string}`>] extends [never]\n ? string\n : Extract<Tokens['colors'], `${Prefix}/${string}`>;\n\nexport const getTextStyle = (as: TextProps['as']) => {\n if (['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].includes(as as string)) {\n return `heading/${as}`;\n }\n return undefined;\n};\n"],"mappings":";;AAKA,IAAa,iBAAiB,QAAgB,SAAiB,OAA4B;CACzF,MAAM,SAA8B,CAAC;CACrC,MAAM,OAAO,OAAO,KAAK,MAAM;CAE/B,KAAK,IAAI,IAAI,GAAG,IAAI,KAAK,QAAQ,KAAK;EACpC,MAAM,MAAM,KAAK;EACjB,MAAM,QAAS,OAAe;EAE9B,MAAM,cAAc,SAAS,GAAG,OAAO,GAAG,QAAQ;EAElD,IAAI,cAAc,KAAK,KAAK,OAAO,KAAK,KAAK,CAAC,CAAC,SAAS,KAAK,OAAO,KAAK,KAAK,CAAC,CAAC,OAAO,SAAS;GAC9F,OAAO,OAAO,QAAQ,cAAc,OAAO,WAAW,CAAC;GACvD;EACF;EAEA,OAAO,eAAe;CACxB;CAEA,OAAO;AACT;AAEA,SAAgB,YAAY,QAAkD;CAC5E,OAAO;EACL,GAAG;EACH,GAAG,cAAc,MAAM;CACzB;AACF;;;;;;AAOA,IAAa,OAAO,UAAkC;CACpD,OAAO,GAAG,QAAQ,GAAG;AACvB"}
@@ -1,7 +1,8 @@
1
- import { createContext } from "react";
1
+ import { createContext, useContext } from "react";
2
2
  //#region lib/utilities/BitkitPortalContext.ts
3
3
  var BitkitPortalContext = createContext({ disablePortal: false });
4
+ var usePortalContext = () => useContext(BitkitPortalContext);
4
5
  //#endregion
5
- export { BitkitPortalContext as default };
6
+ export { BitkitPortalContext as default, usePortalContext };
6
7
 
7
8
  //# sourceMappingURL=BitkitPortalContext.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitPortalContext.js","names":[],"sources":["../../lib/utilities/BitkitPortalContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nconst BitkitPortalContext = createContext({ disablePortal: false });\n\nexport const usePortalContext = () => useContext(BitkitPortalContext);\n\nexport default BitkitPortalContext;\n"],"mappings":";;AAEA,IAAM,sBAAsB,cAAc,EAAE,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"BitkitPortalContext.js","names":[],"sources":["../../lib/utilities/BitkitPortalContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nconst BitkitPortalContext = createContext({ disablePortal: false });\n\nexport const usePortalContext = () => useContext(BitkitPortalContext);\n\nexport default BitkitPortalContext;\n"],"mappings":";;AAEA,IAAM,sBAAsB,cAAc,EAAE,eAAe,MAAM,CAAC;AAElE,IAAa,yBAAyB,WAAW,mBAAmB"}
@@ -35,7 +35,7 @@ Migrate in this order to minimize blockers:
35
35
  2. **Atomic components**: `Button`, `Badge`, `Tag`, `Spinner`, `Toast`
36
36
  3. **Form components**: `Input`, `Textarea`, `Select`, `Checkbox`, `Switch`
37
37
  4. **Layout & navigation**: `Sidebar`, `Breadcrumb`
38
- 5. **Composite components**: `Dialog`, `Tabs`, `Table`, `Card`, `Alert`
38
+ 5. **Composite components**: `Dialog`, `Tabs`, `Table`, `Card`, `Alert`, `Filter`
39
39
  6. **Icons** (if migrating from `lucide-react` or similar)
40
40
  7. **Dependency cleanup**: remove v1 and all now-unused peer deps
41
41
 
@@ -270,6 +270,53 @@ import { Table } from '@chakra-ui/react/table'
270
270
 
271
271
  For password fields with an eye-toggle: use `BitkitField` + Chakra v3 `InputGroup` with `endElement`.
272
272
 
273
+ ### Filter
274
+
275
+ v1's single `data` object becomes children: each filter is a controlled sub-component with its own `value` and `onValueChange`.
276
+
277
+ ```tsx
278
+ // v1
279
+ <Filter data={{ project: {...}, date_range: { type: 'dateRange' }, branch: { type: 'tag', isPatternEnabled: true } }} state={state} onChange={setState} showAdd showSearch />
280
+
281
+ // v2
282
+ <BitkitFilter>
283
+ <BitkitFilter.Select label="Project" pluralLabel="Projects" items={projects} value={project} onValueChange={setProject} />
284
+ <BitkitFilter.DateRange value={dates} onValueChange={setDates} />
285
+ <BitkitFilter.Add>
286
+ <BitkitFilter.Select label="Branch" pluralLabel="Branches" items={branches} multiple pattern value={branch} onValueChange={setBranch} />
287
+ </BitkitFilter.Add>
288
+ <BitkitFilter.Search value={search} onValueChange={setSearch} />
289
+ </BitkitFilter>
290
+ ```
291
+
292
+ | v1 | v2 |
293
+ |----|----|
294
+ | `state` / `onChange` | per-filter `value` / `onValueChange` |
295
+ | `defaultState` | per-filter `resetValue`; root `onClear` to reset everything in one write |
296
+ | `type: 'select'`, `isMultiple` | `BitkitFilter.Select`, `multiple` |
297
+ | `type: 'switch'`, `allOptionLabel` | `BitkitFilter.Switch`, `allLabel` |
298
+ | `type: 'dateRange'`, `selectable`, `dayTooltip` | `BitkitFilter.DateRange`, `min` / `max`, `dayTooltip` (now `(date: Date) => string \| undefined`; v1 passed `{ date, selectable }` with a luxon `DateTime`) |
299
+ | `type: 'tag'`, `showAdd` | `BitkitFilter.Select` inside `BitkitFilter.Add` |
300
+ | `showSearch`, `searchTooltip`, `state.search = [text]` | `BitkitFilter.Search`, `tooltip`, `value: string` |
301
+ | `options`, `optionsMap`, `iconsMap`, `iconColorsMap` | `items: { value, label, icon?, iconColor? }[]` |
302
+ | `categoryName`, `categoryNamePlural`, `unfilteredLabel` | `label`, `pluralLabel` (required), `emptyLabel` |
303
+ | `onAsyncSearch` | `onSearchChange` + `items` + `loading` |
304
+ | `isInitialLoading`, `loadingText` | `loading`, `loadingLabel` |
305
+ | `isPatternEnabled` | `pattern` |
306
+ | `hasNotFilteredOption: false` | `required`, with the default as `resetValue` |
307
+ | `preserveOptionOrder` | `preserveOrder` |
308
+ | `dependsOn`, `filtersDependOn` | `disabledReason`; clear the dependent filter in the parent's `onValueChange` |
309
+ | `isLoading` | `state="loading"` |
310
+ | `isMobile` | `device` |
311
+ | `showFilterIcon`, `showClearFilters` | `showIcon`, `showClear` |
312
+
313
+ Things that behave differently:
314
+ - **Mobile is automatic** below the tablet breakpoint. v1 was opt-in; pass `device="desktop"` where a page relied on that.
315
+ - **`onSearchChange` returns nothing.** Fetch yourself and pass the results as `items`, with `loading` meanwhile. It is debounced (300ms), but dropping out-of-order responses is up to you.
316
+ - **Values are typed per filter**: `string | null` for a switch (`null` = "All"), `[start, end] | null` of `Date`s for a date range, `string[]` for a select, a plain `string` for the search.
317
+ - **`iconColor` takes an `icon/*` token**, e.g. `icon/positive` instead of `status/success/icon`.
318
+ - **"Clear filters" only resets the filters that changed**, each through its own `onValueChange`. A URL-backed page should pass `onClear`, or it gets one history entry per filter.
319
+
273
320
  ### Cards
274
321
 
275
322
  | v1 | v2 |
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bitrise/bitkit-v2",
3
3
  "private": false,
4
- "version": "0.3.481-beta.3063",
4
+ "version": "0.3.481-beta.3067",
5
5
  "description": "Bitrise Design System Components built with Chakra UI V3",
6
6
  "keywords": [
7
7
  "react",
@@ -1,37 +0,0 @@
1
- import { BoxProps } from '@chakra-ui/react/box';
2
- import { ReactNode } from 'react';
3
- export interface BitkitUIHeaderProps extends Omit<BoxProps, 'children'> {
4
- /**
5
- * Content below the bar, inside the header itself — account-wide notices and the like. It is
6
- * part of the header rather than the page, so a pinned header keeps it pinned too, and a page
7
- * reserving room for the header has one element to measure.
8
- */
9
- banner?: ReactNode;
10
- /** The trailing controls, in the order they should appear. */
11
- children?: ReactNode;
12
- /**
13
- * The slot before the logo, shown only below the `tablet` breakpoint. It takes a
14
- * `BitkitUIHeader.NavButton`, which opens the navigation drawer, or a `BitkitUIHeader.Control`
15
- * for an account with no workspace to navigate yet.
16
- *
17
- * It is a slot rather than a child because the design fixes where it goes: children all land in
18
- * the trailing cluster, on the far side of the logo.
19
- */
20
- leading?: ReactNode;
21
- /** Where the logo links to. */
22
- logoHref?: string;
23
- }
24
- export { uiHeaderHeight, uiHeaderHeightPx } from '../../theme/slot-recipes/UIHeader.recipe';
25
- export { type BitkitUIHeaderAccountProps } from './UIHeaderAccount';
26
- export { type BitkitUIHeaderButtonProps } from './UIHeaderButton';
27
- export { type BitkitUIHeaderControlAsAnchorProps, type BitkitUIHeaderControlAsButtonProps, type BitkitUIHeaderControlProps, } from './UIHeaderControl';
28
- export { type BitkitUIHeaderNavButtonProps } from './UIHeaderNavButton';
29
- export { type BitkitUIHeaderSearchProps } from './UIHeaderSearch';
30
- declare const _default: import('react').ForwardRefExoticComponent<BitkitUIHeaderProps & import('react').RefAttributes<HTMLElement>> & {
31
- Account: import('react').ForwardRefExoticComponent<import('./UIHeaderAccount').BitkitUIHeaderAccountProps & import('react').RefAttributes<HTMLButtonElement>>;
32
- Button: import('react').ForwardRefExoticComponent<import('./UIHeaderButton').BitkitUIHeaderButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
33
- Control: import('react').ForwardRefExoticComponent<import('./UIHeaderControl').BitkitUIHeaderControlProps & import('react').RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
34
- NavButton: import('react').ForwardRefExoticComponent<import('./UIHeaderNavButton').BitkitUIHeaderNavButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
35
- Search: import('react').ForwardRefExoticComponent<import('./UIHeaderSearch').BitkitUIHeaderSearchProps & import('react').RefAttributes<HTMLDivElement>>;
36
- };
37
- export default _default;
@@ -1,112 +0,0 @@
1
- import { withSubComponents } from "../../utilities/withSubComponents.js";
2
- import BitriseLogo from "./BitriseLogo.js";
3
- import { UIHeaderContextProvider } from "./UIHeaderContext.js";
4
- import uiHeaderPart from "./uiHeaderPart.js";
5
- import UIHeaderControl from "./UIHeaderControl.js";
6
- import UIHeaderAccount from "./UIHeaderAccount.js";
7
- import UIHeaderButton from "./UIHeaderButton.js";
8
- import UIHeaderNavButton from "./UIHeaderNavButton.js";
9
- import UIHeaderSearch from "./UIHeaderSearch.js";
10
- import { uiHeaderHeight } from "../../theme/slot-recipes/UIHeader.recipe.js";
11
- import { Box } from "@chakra-ui/react/box";
12
- import { useSlotRecipe } from "@chakra-ui/react/styled-system";
13
- import { forwardRef, useMemo, useRef } from "react";
14
- import { jsx, jsxs } from "react/jsx-runtime";
15
- //#region lib/components/BitkitUIHeader/BitkitUIHeader.tsx
16
- /**
17
- * The platform's top bar: the Bitrise logo, and the controls for everything that is not navigation
18
- * — search, changelog, help, notifications, the account.
19
- *
20
- * ```tsx
21
- * <BitkitUIHeader leading={<BitkitUIHeader.NavButton name={workspace} onClick={openNav} />}>
22
- * <BitkitUIHeader.Button icon={IconSparkle} onClick={askAI} variant="secondary">Ask AI</BitkitUIHeader.Button>
23
- * <BitkitUIHeader.Search onOpenChange={setSearchOpen} onValueChange={setQuery} open={searchOpen} value={query} />
24
- * <BitkitUIHeader.Control icon={IconBell} label="Notifications" onClick={toggleNotifications} selected={isOpen} />
25
- * <BitkitUIHeader.Account name={user.name} onClick={toggleAccount} src={user.avatar} />
26
- * </BitkitUIHeader>
27
- * ```
28
- *
29
- * It does not position itself. The consumer decides whether it scrolls with the page or is pinned
30
- * to the top of it, which is what lets a page put its own chrome above the header. Pin it with the
31
- * style props the root forwards, and reserve `uiHeaderHeight` for it in the page below.
32
- *
33
- * The panels the controls open are the consumer's: a control takes a `selected` flag and paints
34
- * itself as the open one, and nothing more. That keeps a drawer's content, placement and state
35
- * where the product can see them.
36
- *
37
- * It carries its own responsive behaviour and needs no breakpoint hook. Below `tablet` the
38
- * `leading` slot appears, the logo centres, the account button becomes an icon, and search stops
39
- * opening a field in the bar.
40
- */
41
- var BitkitUIHeader = forwardRef((props, ref) => {
42
- const { banner, children, css, leading, logoHref = "/", ...rest } = props;
43
- const styles = useSlotRecipe({ key: "uiHeader" })();
44
- const barRef = useRef(null);
45
- const context = useMemo(() => ({
46
- barRef,
47
- styles
48
- }), [styles]);
49
- return /* @__PURE__ */ jsx(UIHeaderContextProvider, {
50
- value: context,
51
- children: /* @__PURE__ */ jsx(Box, {
52
- ref,
53
- asChild: true,
54
- ...rest,
55
- css: [styles.root, css],
56
- children: /* @__PURE__ */ jsxs("header", {
57
- ...uiHeaderPart("root"),
58
- children: [/* @__PURE__ */ jsxs(Box, {
59
- ref: barRef,
60
- css: styles.bar,
61
- ...uiHeaderPart("bar"),
62
- children: [
63
- /* @__PURE__ */ jsx(Box, {
64
- css: styles.leading,
65
- ...uiHeaderPart("leading"),
66
- children: leading
67
- }),
68
- /* @__PURE__ */ jsx(Box, {
69
- css: styles.spacer,
70
- ...uiHeaderPart("spacer")
71
- }),
72
- /* @__PURE__ */ jsx(Box, {
73
- css: styles.logoBlock,
74
- ...uiHeaderPart("logo-block"),
75
- children: /* @__PURE__ */ jsx(Box, {
76
- asChild: true,
77
- css: styles.logoLink,
78
- children: /* @__PURE__ */ jsx("a", {
79
- "aria-label": "Bitrise",
80
- href: logoHref,
81
- ...uiHeaderPart("logo-link"),
82
- children: /* @__PURE__ */ jsx(BitriseLogo, {})
83
- })
84
- })
85
- }),
86
- /* @__PURE__ */ jsx(Box, {
87
- css: styles.actions,
88
- ...uiHeaderPart("actions"),
89
- children
90
- })
91
- ]
92
- }), !!banner && /* @__PURE__ */ jsx(Box, {
93
- css: styles.banner,
94
- ...uiHeaderPart("banner"),
95
- children: banner
96
- })]
97
- })
98
- })
99
- });
100
- });
101
- BitkitUIHeader.displayName = "BitkitUIHeader";
102
- var BitkitUIHeader_default = withSubComponents(BitkitUIHeader, {
103
- Account: UIHeaderAccount,
104
- Button: UIHeaderButton,
105
- Control: UIHeaderControl,
106
- NavButton: UIHeaderNavButton,
107
- Search: UIHeaderSearch
108
- });
109
- //#endregion
110
- export { BitkitUIHeader_default as default, uiHeaderHeight };
111
-
112
- //# sourceMappingURL=BitkitUIHeader.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BitkitUIHeader.js","names":[],"sources":["../../../lib/components/BitkitUIHeader/BitkitUIHeader.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode, useMemo, useRef } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitriseLogo from './BitriseLogo';\nimport UIHeaderAccount from './UIHeaderAccount';\nimport UIHeaderButton from './UIHeaderButton';\nimport { UIHeaderContextProvider } from './UIHeaderContext';\nimport UIHeaderControl from './UIHeaderControl';\nimport UIHeaderNavButton from './UIHeaderNavButton';\nimport uiHeaderPart from './uiHeaderPart';\nimport UIHeaderSearch from './UIHeaderSearch';\n\nexport interface BitkitUIHeaderProps extends Omit<BoxProps, 'children'> {\n /**\n * Content below the bar, inside the header itself — account-wide notices and the like. It is\n * part of the header rather than the page, so a pinned header keeps it pinned too, and a page\n * reserving room for the header has one element to measure.\n */\n banner?: ReactNode;\n /** The trailing controls, in the order they should appear. */\n children?: ReactNode;\n /**\n * The slot before the logo, shown only below the `tablet` breakpoint. It takes a\n * `BitkitUIHeader.NavButton`, which opens the navigation drawer, or a `BitkitUIHeader.Control`\n * for an account with no workspace to navigate yet.\n *\n * It is a slot rather than a child because the design fixes where it goes: children all land in\n * the trailing cluster, on the far side of the logo.\n */\n leading?: ReactNode;\n /** Where the logo links to. */\n logoHref?: string;\n}\n\n/**\n * The platform's top bar: the Bitrise logo, and the controls for everything that is not navigation\n * — search, changelog, help, notifications, the account.\n *\n * ```tsx\n * <BitkitUIHeader leading={<BitkitUIHeader.NavButton name={workspace} onClick={openNav} />}>\n * <BitkitUIHeader.Button icon={IconSparkle} onClick={askAI} variant=\"secondary\">Ask AI</BitkitUIHeader.Button>\n * <BitkitUIHeader.Search onOpenChange={setSearchOpen} onValueChange={setQuery} open={searchOpen} value={query} />\n * <BitkitUIHeader.Control icon={IconBell} label=\"Notifications\" onClick={toggleNotifications} selected={isOpen} />\n * <BitkitUIHeader.Account name={user.name} onClick={toggleAccount} src={user.avatar} />\n * </BitkitUIHeader>\n * ```\n *\n * It does not position itself. The consumer decides whether it scrolls with the page or is pinned\n * to the top of it, which is what lets a page put its own chrome above the header. Pin it with the\n * style props the root forwards, and reserve `uiHeaderHeight` for it in the page below.\n *\n * The panels the controls open are the consumer's: a control takes a `selected` flag and paints\n * itself as the open one, and nothing more. That keeps a drawer's content, placement and state\n * where the product can see them.\n *\n * It carries its own responsive behaviour and needs no breakpoint hook. Below `tablet` the\n * `leading` slot appears, the logo centres, the account button becomes an icon, and search stops\n * opening a field in the bar.\n */\nconst BitkitUIHeader = forwardRef<HTMLElement, BitkitUIHeaderProps>((props, ref) => {\n const { banner, children, css, leading, logoHref = '/', ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'uiHeader' });\n const styles = recipe();\n\n const barRef = useRef<HTMLDivElement>(null);\n\n const context = useMemo(() => ({ barRef, styles }), [styles]);\n\n return (\n <UIHeaderContextProvider value={context}>\n <Box ref={ref} asChild {...rest} css={[styles.root, css]}>\n <header {...uiHeaderPart('root')}>\n <Box ref={barRef} css={styles.bar} {...uiHeaderPart('bar')}>\n <Box css={styles.leading} {...uiHeaderPart('leading')}>\n {leading}\n </Box>\n <Box css={styles.spacer} {...uiHeaderPart('spacer')} />\n <Box css={styles.logoBlock} {...uiHeaderPart('logo-block')}>\n <Box asChild css={styles.logoLink}>\n <a aria-label=\"Bitrise\" href={logoHref} {...uiHeaderPart('logo-link')}>\n <BitriseLogo />\n </a>\n </Box>\n </Box>\n <Box css={styles.actions} {...uiHeaderPart('actions')}>\n {children}\n </Box>\n </Box>\n {!!banner && (\n <Box css={styles.banner} {...uiHeaderPart('banner')}>\n {banner}\n </Box>\n )}\n </header>\n </Box>\n </UIHeaderContextProvider>\n );\n});\n\nexport { uiHeaderHeight, uiHeaderHeightPx } from '../../theme/slot-recipes/UIHeader.recipe';\nexport { type BitkitUIHeaderAccountProps } from './UIHeaderAccount';\nexport { type BitkitUIHeaderButtonProps } from './UIHeaderButton';\nexport {\n type BitkitUIHeaderControlAsAnchorProps,\n type BitkitUIHeaderControlAsButtonProps,\n type BitkitUIHeaderControlProps,\n} from './UIHeaderControl';\nexport { type BitkitUIHeaderNavButtonProps } from './UIHeaderNavButton';\nexport { type BitkitUIHeaderSearchProps } from './UIHeaderSearch';\n\nBitkitUIHeader.displayName = 'BitkitUIHeader';\n\nexport default withSubComponents(BitkitUIHeader, {\n Account: UIHeaderAccount,\n Button: UIHeaderButton,\n Control: UIHeaderControl,\n NavButton: UIHeaderNavButton,\n Search: UIHeaderSearch,\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6DA,IAAM,iBAAiB,YAA8C,OAAO,QAAQ;CAClF,MAAM,EAAE,QAAQ,UAAU,KAAK,SAAS,WAAW,KAAK,GAAG,SAAS;CAGpE,MAAM,SADS,cAAc,EAAE,KAAK,WAAW,CAChC,CAAA,CAAO;CAEtB,MAAM,SAAS,OAAuB,IAAI;CAE1C,MAAM,UAAU,eAAe;EAAE;EAAQ;CAAO,IAAI,CAAC,MAAM,CAAC;CAE5D,OACE,oBAAC,yBAAD;EAAyB,OAAO;EAC9B,UAAA,oBAAC,KAAD;GAAU;GAAK,SAAA;GAAQ,GAAI;GAAM,KAAK,CAAC,OAAO,MAAM,GAAG;GACrD,UAAA,qBAAC,UAAD;IAAQ,GAAI,aAAa,MAAM;IAA/B,UAAA,CACE,qBAAC,KAAD;KAAK,KAAK;KAAQ,KAAK,OAAO;KAAK,GAAI,aAAa,KAAK;KAAzD,UAAA;MACE,oBAAC,KAAD;OAAK,KAAK,OAAO;OAAS,GAAI,aAAa,SAAS;OACjD,UAAA;MACE,CAAA;MACL,oBAAC,KAAD;OAAK,KAAK,OAAO;OAAQ,GAAI,aAAa,QAAQ;MAAI,CAAA;MACtD,oBAAC,KAAD;OAAK,KAAK,OAAO;OAAW,GAAI,aAAa,YAAY;OACvD,UAAA,oBAAC,KAAD;QAAK,SAAA;QAAQ,KAAK,OAAO;QACvB,UAAA,oBAAC,KAAD;SAAG,cAAW;SAAU,MAAM;SAAU,GAAI,aAAa,WAAW;SAClE,UAAA,oBAAC,aAAD,CAAc,CAAA;QACb,CAAA;OACA,CAAA;MACF,CAAA;MACL,oBAAC,KAAD;OAAK,KAAK,OAAO;OAAS,GAAI,aAAa,SAAS;OACjD;MACE,CAAA;KACF;IACJ,CAAA,GAAA,CAAC,CAAC,UACD,oBAAC,KAAD;KAAK,KAAK,OAAO;KAAQ,GAAI,aAAa,QAAQ;KAC/C,UAAA;IACE,CAAA,CAED;;EACL,CAAA;CACkB,CAAA;AAE7B,CAAC;AAaD,eAAe,cAAc;AAE7B,IAAA,yBAAe,kBAAkB,gBAAgB;CAC/C,SAAS;CACT,QAAQ;CACR,SAAS;CACT,WAAW;CACX,QAAQ;AACV,CAAC"}
@@ -1,10 +0,0 @@
1
- import { SVGProps } from 'react';
2
- /**
3
- * The Bitrise wordmark, at the one size the header draws it. It is monochrome and follows the
4
- * surrounding `color`.
5
- *
6
- * It is hand-maintained rather than generated: the icon pipeline only emits 16 and 24 square
7
- * icons, and this is neither.
8
- */
9
- declare const BitriseLogo: (props: SVGProps<SVGSVGElement>) => import('react').JSX.Element;
10
- export default BitriseLogo;
@@ -1,86 +0,0 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- //#region lib/components/BitkitUIHeader/BitriseLogo.tsx
3
- /**
4
- * The Bitrise wordmark, at the one size the header draws it. It is monochrome and follows the
5
- * surrounding `color`.
6
- *
7
- * It is hand-maintained rather than generated: the icon pipeline only emits 16 and 24 square
8
- * icons, and this is neither.
9
- */
10
- var BitriseLogo = (props) => /* @__PURE__ */ jsxs("svg", {
11
- "aria-hidden": "true",
12
- fill: "none",
13
- height: "24",
14
- viewBox: "0 0 84.2553 24",
15
- width: "84.2553",
16
- xmlns: "http://www.w3.org/2000/svg",
17
- ...props,
18
- children: [
19
- /* @__PURE__ */ jsx("path", {
20
- d: "M16.055 1.24337C16.055 1.92998 15.4915 2.4866 14.7962 2.4866C14.101 2.4866 13.5374 1.92998 13.5374 1.24337C13.5374 0.556762 14.101 0 14.7962 0C15.4915 0 16.055 0.556762 16.055 1.24337Z",
21
- fill: "currentColor"
22
- }),
23
- /* @__PURE__ */ jsx("path", {
24
- d: "M5.40952 14.0537C5.40952 12.9456 6.31909 12.0471 7.44126 12.0471C8.56343 12.0471 9.47301 12.9456 9.47301 14.0537H5.40952Z",
25
- fill: "currentColor"
26
- }),
27
- /* @__PURE__ */ jsx("path", {
28
- d: "M11.5057 16.0605C11.5057 17.8552 12.9789 19.3103 14.7963 19.3103C16.6135 19.3103 18.0868 17.8552 18.0868 16.0605H11.5057Z",
29
- fill: "currentColor"
30
- }),
31
- /* @__PURE__ */ jsx("path", {
32
- d: "M22.1651 12.0475C21.0429 12.0475 20.1333 12.946 20.1333 14.0541H24.1968C24.1968 12.946 23.2873 12.0475 22.1651 12.0475Z",
33
- fill: "currentColor"
34
- }),
35
- /* @__PURE__ */ jsx("path", {
36
- clipRule: "evenodd",
37
- d: "M29.0271 13.7727C28.6855 11.4818 28.1742 9.16488 27.8054 7.62488C27.3658 5.7897 25.7901 4.47799 23.8847 4.36079C22.014 4.24563 18.9187 4.10822 14.7962 4.10822C10.6735 4.10822 7.57817 4.24563 5.70779 4.36079C3.80207 4.47799 2.22644 5.7897 1.78696 7.62488C1.41816 9.16415 0.906981 11.4802 0.565118 13.7727C0.33397 15.3226 0.147138 17.1531 0.00962665 19.2132C-0.0672263 20.3612 0.318069 21.4661 1.09411 22.3243C1.87132 23.1837 2.94138 23.6865 4.10742 23.7404C6.66875 23.8588 10.6022 24 14.7962 24C18.9898 24 22.9234 23.8588 25.4849 23.7404C26.651 23.6865 27.721 23.1837 28.4981 22.3243C29.2741 21.4663 29.6594 20.3613 29.5826 19.2132C29.4452 17.1531 29.2582 15.3226 29.0271 13.7727ZM26.9827 20.9878C26.572 21.4417 26.0064 21.7074 25.3899 21.736C22.85 21.8534 18.9503 21.9932 14.796 21.9932C10.6415 21.9932 6.7419 21.8534 4.20222 21.736C3.58563 21.7074 3.01998 21.4417 2.60921 20.9876C2.19962 20.5347 1.9963 19.9513 2.03679 19.3452C2.17077 17.3385 2.35186 15.5621 2.57505 14.0649C2.90632 11.8433 3.40454 9.58787 3.76407 8.08669C3.99595 7.11785 4.82794 6.42542 5.83395 6.36362C7.67562 6.25021 10.7256 6.11498 14.796 6.11498C18.8661 6.11498 21.9162 6.25021 23.7582 6.36362C24.7642 6.42542 25.5959 7.11785 25.8279 8.08669C26.1878 9.58845 26.6858 11.8447 27.0168 14.0649C27.24 15.5621 27.4212 17.3385 27.5552 19.3452C27.5956 19.9514 27.3922 20.5348 26.9827 20.9878Z",
38
- fill: "currentColor",
39
- fillRule: "evenodd"
40
- }),
41
- /* @__PURE__ */ jsx("path", {
42
- clipRule: "evenodd",
43
- d: "M40.174 19.5834C42.3057 19.5834 44.1815 17.7307 44.1815 15.2885C44.1815 12.8464 42.3057 10.9939 40.174 10.9939C38.554 10.9939 37.7013 12.1727 37.7013 12.1727V7.62542H35.3991V19.415H37.7013V18.4044C37.7013 18.4044 38.554 19.5834 40.174 19.5834ZM39.7479 13.0148C40.8562 13.0148 41.7942 13.9412 41.7942 15.2885C41.7942 16.636 40.8562 17.5624 39.7479 17.5624C38.6394 17.5624 37.7014 16.636 37.7014 15.2885C37.7014 13.9412 38.6394 13.0148 39.7479 13.0148Z",
44
- fill: "currentColor",
45
- fillRule: "evenodd"
46
- }),
47
- /* @__PURE__ */ jsx("path", {
48
- d: "M45.9719 19.415H48.2741V11.1623H45.9719V19.415Z",
49
- fill: "currentColor"
50
- }),
51
- /* @__PURE__ */ jsx("path", {
52
- d: "M47.0803 10.0675C46.313 10.0675 45.8014 9.56222 45.8014 8.80421C45.8014 8.04621 46.313 7.54107 47.0803 7.54107C47.9329 7.54107 48.4447 8.04621 48.4447 8.80421C48.4447 9.56222 47.9329 10.0675 47.0803 10.0675Z",
53
- fill: "currentColor"
54
- }),
55
- /* @__PURE__ */ jsx("path", {
56
- d: "M53.646 8.72005H51.5995V10.2359C51.5995 10.9096 51.1731 11.3307 50.6615 11.3307H49.8942V13.3517H51.3438V16.7202C51.3438 18.6571 52.2816 19.5834 53.987 19.5834C54.8397 19.5834 55.5218 19.3308 55.5218 19.3308V17.3939C55.5218 17.3939 55.1807 17.5624 54.6692 17.5624C54.0722 17.5624 53.646 17.1413 53.646 16.6358V13.3517H55.3512V11.3307H53.646V8.72005Z",
57
- fill: "currentColor"
58
- }),
59
- /* @__PURE__ */ jsx("path", {
60
- d: "M62.513 13.3516C62.513 13.3516 62.2571 13.2676 61.7457 13.2676C60.5518 13.2676 59.7844 14.0255 59.7844 15.457V19.4149H57.4822V11.1622H59.7844V12.1728C59.7844 12.1728 60.6372 11.0779 62.1719 11.0779H62.513V13.3516Z",
61
- fill: "currentColor"
62
- }),
63
- /* @__PURE__ */ jsx("path", {
64
- d: "M66.1792 19.415H63.877V11.1623H66.1792V19.415Z",
65
- fill: "currentColor"
66
- }),
67
- /* @__PURE__ */ jsx("path", {
68
- d: "M63.7067 8.80421C63.7067 9.56222 64.2183 10.0675 64.9857 10.0675C65.8384 10.0675 66.35 9.56222 66.35 8.80421C66.35 8.04621 65.8384 7.54107 64.9857 7.54107C64.2183 7.54107 63.7067 8.04621 63.7067 8.80421Z",
69
- fill: "currentColor"
70
- }),
71
- /* @__PURE__ */ jsx("path", {
72
- d: "M73.086 13.6044C73.086 13.6044 72.5744 12.9307 71.7218 12.9307C71.0397 12.9307 70.6986 13.2676 70.6986 13.6044C70.6986 14.0693 71.2955 14.2592 72.0184 14.4892C73.1285 14.8423 74.5356 15.29 74.5356 16.9729C74.5356 18.4044 73.3418 19.5834 71.2102 19.5834C68.8226 19.5834 67.7995 18.0675 67.7995 18.0675L69.0785 16.8045C69.0785 16.8045 69.7607 17.7307 70.8691 17.7307C71.6366 17.7307 71.9776 17.394 71.9776 16.9729C71.9776 16.4614 71.3485 16.2592 70.5998 16.0185C69.4994 15.6648 68.1407 15.2281 68.1407 13.6044C68.1407 12.3411 69.5049 10.9939 71.3807 10.9939C73.3418 10.9939 74.2798 12.2569 74.2798 12.2569L73.086 13.6044Z",
73
- fill: "currentColor"
74
- }),
75
- /* @__PURE__ */ jsx("path", {
76
- clipRule: "evenodd",
77
- d: "M80.333 17.6466C79.054 17.6466 78.2865 16.8887 78.1161 16.0465H84.1701C84.1701 16.0465 84.2553 15.7097 84.2553 15.1201C84.2553 12.7623 82.4647 10.9939 80.0771 10.9939C77.6897 10.9939 75.7286 12.9307 75.7286 15.2885C75.7286 17.6466 77.6897 19.5834 80.1624 19.5834C82.4647 19.5834 83.7437 18.1517 83.7437 18.1517L82.55 16.636C82.55 16.636 81.7825 17.6466 80.333 17.6466ZM81.9533 14.4464H78.1162C78.3719 13.6044 79.0542 12.9307 80.0773 12.9307C81.1005 12.9307 81.7826 13.6044 81.9533 14.4464Z",
78
- fill: "currentColor",
79
- fillRule: "evenodd"
80
- })
81
- ]
82
- });
83
- //#endregion
84
- export { BitriseLogo as default };
85
-
86
- //# sourceMappingURL=BitriseLogo.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"BitriseLogo.js","names":[],"sources":["../../../lib/components/BitkitUIHeader/BitriseLogo.tsx"],"sourcesContent":["import { type SVGProps } from 'react';\n\n/**\n * The Bitrise wordmark, at the one size the header draws it. It is monochrome and follows the\n * surrounding `color`.\n *\n * It is hand-maintained rather than generated: the icon pipeline only emits 16 and 24 square\n * icons, and this is neither.\n */\nconst BitriseLogo = (props: SVGProps<SVGSVGElement>) => (\n <svg\n aria-hidden=\"true\"\n fill=\"none\"\n height=\"24\"\n viewBox=\"0 0 84.2553 24\"\n width=\"84.2553\"\n xmlns=\"http://www.w3.org/2000/svg\"\n {...props}\n >\n <path\n d=\"M16.055 1.24337C16.055 1.92998 15.4915 2.4866 14.7962 2.4866C14.101 2.4866 13.5374 1.92998 13.5374 1.24337C13.5374 0.556762 14.101 0 14.7962 0C15.4915 0 16.055 0.556762 16.055 1.24337Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M5.40952 14.0537C5.40952 12.9456 6.31909 12.0471 7.44126 12.0471C8.56343 12.0471 9.47301 12.9456 9.47301 14.0537H5.40952Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M11.5057 16.0605C11.5057 17.8552 12.9789 19.3103 14.7963 19.3103C16.6135 19.3103 18.0868 17.8552 18.0868 16.0605H11.5057Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M22.1651 12.0475C21.0429 12.0475 20.1333 12.946 20.1333 14.0541H24.1968C24.1968 12.946 23.2873 12.0475 22.1651 12.0475Z\"\n fill=\"currentColor\"\n />\n <path\n clipRule=\"evenodd\"\n d=\"M29.0271 13.7727C28.6855 11.4818 28.1742 9.16488 27.8054 7.62488C27.3658 5.7897 25.7901 4.47799 23.8847 4.36079C22.014 4.24563 18.9187 4.10822 14.7962 4.10822C10.6735 4.10822 7.57817 4.24563 5.70779 4.36079C3.80207 4.47799 2.22644 5.7897 1.78696 7.62488C1.41816 9.16415 0.906981 11.4802 0.565118 13.7727C0.33397 15.3226 0.147138 17.1531 0.00962665 19.2132C-0.0672263 20.3612 0.318069 21.4661 1.09411 22.3243C1.87132 23.1837 2.94138 23.6865 4.10742 23.7404C6.66875 23.8588 10.6022 24 14.7962 24C18.9898 24 22.9234 23.8588 25.4849 23.7404C26.651 23.6865 27.721 23.1837 28.4981 22.3243C29.2741 21.4663 29.6594 20.3613 29.5826 19.2132C29.4452 17.1531 29.2582 15.3226 29.0271 13.7727ZM26.9827 20.9878C26.572 21.4417 26.0064 21.7074 25.3899 21.736C22.85 21.8534 18.9503 21.9932 14.796 21.9932C10.6415 21.9932 6.7419 21.8534 4.20222 21.736C3.58563 21.7074 3.01998 21.4417 2.60921 20.9876C2.19962 20.5347 1.9963 19.9513 2.03679 19.3452C2.17077 17.3385 2.35186 15.5621 2.57505 14.0649C2.90632 11.8433 3.40454 9.58787 3.76407 8.08669C3.99595 7.11785 4.82794 6.42542 5.83395 6.36362C7.67562 6.25021 10.7256 6.11498 14.796 6.11498C18.8661 6.11498 21.9162 6.25021 23.7582 6.36362C24.7642 6.42542 25.5959 7.11785 25.8279 8.08669C26.1878 9.58845 26.6858 11.8447 27.0168 14.0649C27.24 15.5621 27.4212 17.3385 27.5552 19.3452C27.5956 19.9514 27.3922 20.5348 26.9827 20.9878Z\"\n fill=\"currentColor\"\n fillRule=\"evenodd\"\n />\n <path\n clipRule=\"evenodd\"\n d=\"M40.174 19.5834C42.3057 19.5834 44.1815 17.7307 44.1815 15.2885C44.1815 12.8464 42.3057 10.9939 40.174 10.9939C38.554 10.9939 37.7013 12.1727 37.7013 12.1727V7.62542H35.3991V19.415H37.7013V18.4044C37.7013 18.4044 38.554 19.5834 40.174 19.5834ZM39.7479 13.0148C40.8562 13.0148 41.7942 13.9412 41.7942 15.2885C41.7942 16.636 40.8562 17.5624 39.7479 17.5624C38.6394 17.5624 37.7014 16.636 37.7014 15.2885C37.7014 13.9412 38.6394 13.0148 39.7479 13.0148Z\"\n fill=\"currentColor\"\n fillRule=\"evenodd\"\n />\n <path d=\"M45.9719 19.415H48.2741V11.1623H45.9719V19.415Z\" fill=\"currentColor\" />\n <path\n d=\"M47.0803 10.0675C46.313 10.0675 45.8014 9.56222 45.8014 8.80421C45.8014 8.04621 46.313 7.54107 47.0803 7.54107C47.9329 7.54107 48.4447 8.04621 48.4447 8.80421C48.4447 9.56222 47.9329 10.0675 47.0803 10.0675Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M53.646 8.72005H51.5995V10.2359C51.5995 10.9096 51.1731 11.3307 50.6615 11.3307H49.8942V13.3517H51.3438V16.7202C51.3438 18.6571 52.2816 19.5834 53.987 19.5834C54.8397 19.5834 55.5218 19.3308 55.5218 19.3308V17.3939C55.5218 17.3939 55.1807 17.5624 54.6692 17.5624C54.0722 17.5624 53.646 17.1413 53.646 16.6358V13.3517H55.3512V11.3307H53.646V8.72005Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M62.513 13.3516C62.513 13.3516 62.2571 13.2676 61.7457 13.2676C60.5518 13.2676 59.7844 14.0255 59.7844 15.457V19.4149H57.4822V11.1622H59.7844V12.1728C59.7844 12.1728 60.6372 11.0779 62.1719 11.0779H62.513V13.3516Z\"\n fill=\"currentColor\"\n />\n <path d=\"M66.1792 19.415H63.877V11.1623H66.1792V19.415Z\" fill=\"currentColor\" />\n <path\n d=\"M63.7067 8.80421C63.7067 9.56222 64.2183 10.0675 64.9857 10.0675C65.8384 10.0675 66.35 9.56222 66.35 8.80421C66.35 8.04621 65.8384 7.54107 64.9857 7.54107C64.2183 7.54107 63.7067 8.04621 63.7067 8.80421Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M73.086 13.6044C73.086 13.6044 72.5744 12.9307 71.7218 12.9307C71.0397 12.9307 70.6986 13.2676 70.6986 13.6044C70.6986 14.0693 71.2955 14.2592 72.0184 14.4892C73.1285 14.8423 74.5356 15.29 74.5356 16.9729C74.5356 18.4044 73.3418 19.5834 71.2102 19.5834C68.8226 19.5834 67.7995 18.0675 67.7995 18.0675L69.0785 16.8045C69.0785 16.8045 69.7607 17.7307 70.8691 17.7307C71.6366 17.7307 71.9776 17.394 71.9776 16.9729C71.9776 16.4614 71.3485 16.2592 70.5998 16.0185C69.4994 15.6648 68.1407 15.2281 68.1407 13.6044C68.1407 12.3411 69.5049 10.9939 71.3807 10.9939C73.3418 10.9939 74.2798 12.2569 74.2798 12.2569L73.086 13.6044Z\"\n fill=\"currentColor\"\n />\n <path\n clipRule=\"evenodd\"\n d=\"M80.333 17.6466C79.054 17.6466 78.2865 16.8887 78.1161 16.0465H84.1701C84.1701 16.0465 84.2553 15.7097 84.2553 15.1201C84.2553 12.7623 82.4647 10.9939 80.0771 10.9939C77.6897 10.9939 75.7286 12.9307 75.7286 15.2885C75.7286 17.6466 77.6897 19.5834 80.1624 19.5834C82.4647 19.5834 83.7437 18.1517 83.7437 18.1517L82.55 16.636C82.55 16.636 81.7825 17.6466 80.333 17.6466ZM81.9533 14.4464H78.1162C78.3719 13.6044 79.0542 12.9307 80.0773 12.9307C81.1005 12.9307 81.7826 13.6044 81.9533 14.4464Z\"\n fill=\"currentColor\"\n fillRule=\"evenodd\"\n />\n </svg>\n);\n\nexport default BitriseLogo;\n"],"mappings":";;;;;;;;;AASA,IAAM,eAAe,UACnB,qBAAC,OAAD;CACE,eAAY;CACZ,MAAK;CACL,QAAO;CACP,SAAQ;CACR,OAAM;CACN,OAAM;CACN,GAAI;CAPN,UAAA;EASE,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;EACN,CAAA;EACD,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;EACN,CAAA;EACD,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;EACN,CAAA;EACD,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;EACN,CAAA;EACD,oBAAC,QAAD;GACE,UAAS;GACT,GAAE;GACF,MAAK;GACL,UAAS;EACV,CAAA;EACD,oBAAC,QAAD;GACE,UAAS;GACT,GAAE;GACF,MAAK;GACL,UAAS;EACV,CAAA;EACD,oBAAC,QAAD;GAAM,GAAE;GAAkD,MAAK;EAAgB,CAAA;EAC/E,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;EACN,CAAA;EACD,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;EACN,CAAA;EACD,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;EACN,CAAA;EACD,oBAAC,QAAD;GAAM,GAAE;GAAiD,MAAK;EAAgB,CAAA;EAC9E,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;EACN,CAAA;EACD,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;EACN,CAAA;EACD,oBAAC,QAAD;GACE,UAAS;GACT,GAAE;GACF,MAAK;GACL,UAAS;EACV,CAAA;CACE"}
@@ -1,23 +0,0 @@
1
- import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
2
- import { BitkitUIHeaderBadge } from './UIHeaderControl';
3
- export interface BitkitUIHeaderAccountProps extends Omit<HTMLChakraProps<'button'>, 'children' | 'disabled'> {
4
- /** Marks the account as carrying something unread, like the other controls. */
5
- badge?: BitkitUIHeaderBadge;
6
- /**
7
- * The accessible name. Defaults to `Account: ` and the signed-in person's name — the name alone
8
- * would announce as a person rather than as what the button opens.
9
- */
10
- label?: string;
11
- /** Who is signed in. Shown as the avatar's initials when there is no picture. */
12
- name: string;
13
- /** Marks the account panel as open. */
14
- selected?: boolean;
15
- /** The signed-in person's picture. Without one the avatar falls back to their initials. */
16
- src?: string;
17
- }
18
- /**
19
- * The account button at the trailing end of the bar. It shows the signed-in person's avatar on
20
- * desktop and a plain icon on mobile, where the bar has no room for a picture.
21
- */
22
- declare const UIHeaderAccount: import('react').ForwardRefExoticComponent<BitkitUIHeaderAccountProps & import('react').RefAttributes<HTMLButtonElement>>;
23
- export default UIHeaderAccount;
@@ -1,40 +0,0 @@
1
- import IconPerson from "../../icons/IconPerson.js";
2
- import BitkitAvatar from "../BitkitAvatar/BitkitAvatar.js";
3
- import { useUIHeaderContext } from "./UIHeaderContext.js";
4
- import uiHeaderPart from "./uiHeaderPart.js";
5
- import { UIHeaderControlBase } from "./UIHeaderControl.js";
6
- import { forwardRef } from "react";
7
- import { jsx, jsxs } from "react/jsx-runtime";
8
- //#region lib/components/BitkitUIHeader/UIHeaderAccount.tsx
9
- /**
10
- * The account button at the trailing end of the bar. It shows the signed-in person's avatar on
11
- * desktop and a plain icon on mobile, where the bar has no room for a picture.
12
- */
13
- var UIHeaderAccount = forwardRef((props, ref) => {
14
- const { badge, label, name, selected, src, ...rest } = props;
15
- const { styles } = useUIHeaderContext();
16
- const avatarProps = src ? {
17
- src,
18
- variant: "user"
19
- } : { variant: "letters" };
20
- return /* @__PURE__ */ jsxs(UIHeaderControlBase, {
21
- ref,
22
- badge,
23
- footprint: "control",
24
- label: label ?? `Account: ${name}`,
25
- selected,
26
- ...uiHeaderPart("account"),
27
- ...rest,
28
- children: [/* @__PURE__ */ jsx(BitkitAvatar, {
29
- css: styles.accountAvatar,
30
- name,
31
- size: "32",
32
- ...avatarProps
33
- }), /* @__PURE__ */ jsx(IconPerson, { css: styles.accountIcon })]
34
- });
35
- });
36
- UIHeaderAccount.displayName = "BitkitUIHeader.Account";
37
- //#endregion
38
- export { UIHeaderAccount as default };
39
-
40
- //# sourceMappingURL=UIHeaderAccount.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"UIHeaderAccount.js","names":[],"sources":["../../../lib/components/BitkitUIHeader/UIHeaderAccount.tsx"],"sourcesContent":["import { type HTMLChakraProps } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { IconPerson } from '../../icons';\nimport BitkitAvatar from '../BitkitAvatar/BitkitAvatar';\nimport { useUIHeaderContext } from './UIHeaderContext';\nimport { type BitkitUIHeaderBadge, UIHeaderControlBase } from './UIHeaderControl';\nimport uiHeaderPart from './uiHeaderPart';\n\nexport interface BitkitUIHeaderAccountProps extends Omit<HTMLChakraProps<'button'>, 'children' | 'disabled'> {\n /** Marks the account as carrying something unread, like the other controls. */\n badge?: BitkitUIHeaderBadge;\n /**\n * The accessible name. Defaults to `Account: ` and the signed-in person's name — the name alone\n * would announce as a person rather than as what the button opens.\n */\n label?: string;\n /** Who is signed in. Shown as the avatar's initials when there is no picture. */\n name: string;\n /** Marks the account panel as open. */\n selected?: boolean;\n /** The signed-in person's picture. Without one the avatar falls back to their initials. */\n src?: string;\n}\n\n/**\n * The account button at the trailing end of the bar. It shows the signed-in person's avatar on\n * desktop and a plain icon on mobile, where the bar has no room for a picture.\n */\nconst UIHeaderAccount = forwardRef<HTMLButtonElement, BitkitUIHeaderAccountProps>((props, ref) => {\n const { badge, label, name, selected, src, ...rest } = props;\n\n const { styles } = useUIHeaderContext();\n\n const avatarProps = src ? ({ src, variant: 'user' } as const) : ({ variant: 'letters' } as const);\n\n return (\n <UIHeaderControlBase\n ref={ref}\n badge={badge}\n footprint=\"control\"\n label={label ?? `Account: ${name}`}\n selected={selected}\n {...uiHeaderPart('account')}\n {...rest}\n >\n <BitkitAvatar css={styles.accountAvatar} name={name} size=\"32\" {...avatarProps} />\n <IconPerson css={styles.accountIcon} />\n </UIHeaderControlBase>\n );\n});\n\nUIHeaderAccount.displayName = 'BitkitUIHeader.Account';\n\nexport default UIHeaderAccount;\n"],"mappings":";;;;;;;;;;;;AA6BA,IAAM,kBAAkB,YAA2D,OAAO,QAAQ;CAChG,MAAM,EAAE,OAAO,OAAO,MAAM,UAAU,KAAK,GAAG,SAAS;CAEvD,MAAM,EAAE,WAAW,mBAAmB;CAEtC,MAAM,cAAc,MAAO;EAAE;EAAK,SAAS;CAAO,IAAe,EAAE,SAAS,UAAU;CAEtF,OACE,qBAAC,qBAAD;EACO;EACE;EACP,WAAU;EACV,OAAO,SAAS,YAAY;EAClB;EACV,GAAI,aAAa,SAAS;EAC1B,GAAI;EAPN,UAAA,CASE,oBAAC,cAAD;GAAc,KAAK,OAAO;GAAqB;GAAM,MAAK;GAAK,GAAI;EAAc,CAAA,GACjF,oBAAC,YAAD,EAAY,KAAK,OAAO,YAAc,CAAA,CACnB;;AAEzB,CAAC;AAED,gBAAgB,cAAc"}
@@ -1,32 +0,0 @@
1
- import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
2
- import { ReactNode } from 'react';
3
- import { BitkitIconComponent } from '../../icons';
4
- import { BitkitUIHeaderBadge } from './UIHeaderControl';
5
- export interface BitkitUIHeaderButtonProps extends Omit<HTMLChakraProps<'button'>, 'children' | 'disabled'> {
6
- /**
7
- * An unread marker on the button's trailing top corner. `pulse` animates it, for something that
8
- * has just arrived and is worth looking at now; `idle` and `true` are the same marker at rest.
9
- */
10
- badge?: BitkitUIHeaderBadge;
11
- /** The button's label. */
12
- children: ReactNode;
13
- /** Leading icon. */
14
- icon?: BitkitIconComponent;
15
- /**
16
- * Marks the button as the one whose panel is open, which keeps it pressed. The consumer owns the
17
- * panel, so it owns this too.
18
- */
19
- selected?: boolean;
20
- state?: 'disabled';
21
- /** Trailing icon, for a button that opens a menu. */
22
- suffixIcon?: BitkitIconComponent;
23
- variant?: 'primary' | 'secondary' | 'tertiary';
24
- }
25
- /**
26
- * A labelled button in the header bar, for an action that needs more than an icon — the Ask AI
27
- * entry point is the one in the design.
28
- *
29
- * It comes in one size: the bar is 48px tall and leaves room for nothing else.
30
- */
31
- declare const UIHeaderButton: import('react').ForwardRefExoticComponent<BitkitUIHeaderButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
32
- export default UIHeaderButton;