@televet/kibble-ui 5.0.28-rb.0 → 5.0.28
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.
- package/dist/chunks/{alert.component-nhRTQ5KK.js → alert.component-B0gDwaKQ.js} +2 -2
- package/dist/chunks/{alert.component-nhRTQ5KK.js.map → alert.component-B0gDwaKQ.js.map} +1 -1
- package/dist/chunks/{alert.component-OcRbeRJa.js → alert.component-B2kzYzhv.js} +3 -3
- package/dist/chunks/{alert.component-OcRbeRJa.js.map → alert.component-B2kzYzhv.js.map} +1 -1
- package/dist/chunks/{avatarGroup.component-CJCQSIyr.js → avatarGroup.component-CUOKTQHZ.js} +2 -2
- package/dist/chunks/{avatarGroup.component-CJCQSIyr.js.map → avatarGroup.component-CUOKTQHZ.js.map} +1 -1
- package/dist/chunks/{avatarGroup.component-BPhQpVYM.js → avatarGroup.component-z6SzTzKR.js} +3 -3
- package/dist/chunks/{avatarGroup.component-BPhQpVYM.js.map → avatarGroup.component-z6SzTzKR.js.map} +1 -1
- package/dist/chunks/{buttonGroup.component-pR0mvmm7.js → buttonGroup.component-CHbRCpMI.js} +2 -2
- package/dist/chunks/{buttonGroup.component-pR0mvmm7.js.map → buttonGroup.component-CHbRCpMI.js.map} +1 -1
- package/dist/chunks/{buttonGroup.component-CO5lC36l.js → buttonGroup.component-CYJxaqK1.js} +2 -2
- package/dist/chunks/{buttonGroup.component-CO5lC36l.js.map → buttonGroup.component-CYJxaqK1.js.map} +1 -1
- package/dist/chunks/calendar.component-BpDNoBAZ.js +62 -0
- package/dist/chunks/calendar.component-BpDNoBAZ.js.map +1 -0
- package/dist/chunks/calendar.component-C2bzItDq.js +2 -0
- package/dist/chunks/calendar.component-C2bzItDq.js.map +1 -0
- package/dist/chunks/{characterCounter.component-BRHLt929.js → characterCounter.component-CczgC612.js} +2 -2
- package/dist/chunks/{characterCounter.component-BRHLt929.js.map → characterCounter.component-CczgC612.js.map} +1 -1
- package/dist/chunks/{characterCounter.component-DI_FQNUR.js → characterCounter.component-Cm9yEHjz.js} +2 -2
- package/dist/chunks/{characterCounter.component-DI_FQNUR.js.map → characterCounter.component-Cm9yEHjz.js.map} +1 -1
- package/dist/chunks/{checkbox.component-DUJCiZr2.js → checkbox.component-Bytw6Mk1.js} +3 -3
- package/dist/chunks/{checkbox.component-DUJCiZr2.js.map → checkbox.component-Bytw6Mk1.js.map} +1 -1
- package/dist/chunks/{checkbox.component-C132vkan.js → checkbox.component-CrTnnQ30.js} +2 -2
- package/dist/chunks/{checkbox.component-C132vkan.js.map → checkbox.component-CrTnnQ30.js.map} +1 -1
- package/dist/chunks/{checkboxGroup.component-DW9qUlSm.js → checkboxGroup.component-Bf_yc-Fl.js} +3 -3
- package/dist/chunks/{checkboxGroup.component-DW9qUlSm.js.map → checkboxGroup.component-Bf_yc-Fl.js.map} +1 -1
- package/dist/chunks/{checkboxGroup.component-2U0ZW1TD.js → checkboxGroup.component-CndHvReL.js} +2 -2
- package/dist/chunks/{checkboxGroup.component-2U0ZW1TD.js.map → checkboxGroup.component-CndHvReL.js.map} +1 -1
- package/dist/chunks/{conversationCard.component-CscMIq51.js → conversationCard.component-BKXSq7NS.js} +2 -2
- package/dist/chunks/{conversationCard.component-CscMIq51.js.map → conversationCard.component-BKXSq7NS.js.map} +1 -1
- package/dist/chunks/{conversationCard.component-DByFo4jj.js → conversationCard.component-Mn3eYMW_.js} +6 -6
- package/dist/chunks/{conversationCard.component-DByFo4jj.js.map → conversationCard.component-Mn3eYMW_.js.map} +1 -1
- package/dist/chunks/{datePicker.component-CLTjEX7i.js → datePicker.component-CHBO_Jrk.js} +5 -5
- package/dist/chunks/{datePicker.component-CLTjEX7i.js.map → datePicker.component-CHBO_Jrk.js.map} +1 -1
- package/dist/chunks/{datePicker.component-BuGpHTzS.js → datePicker.component-DQ0a5vhA.js} +2 -2
- package/dist/chunks/{datePicker.component-BuGpHTzS.js.map → datePicker.component-DQ0a5vhA.js.map} +1 -1
- package/dist/chunks/{datePicker.provider-i35-VNAb.js → datePicker.provider-CDhsnFSD.js} +2 -2
- package/dist/chunks/{datePicker.provider-i35-VNAb.js.map → datePicker.provider-CDhsnFSD.js.map} +1 -1
- package/dist/chunks/{datePicker.provider-CttuPiiS.js → datePicker.provider-o-sEPUJe.js} +7 -7
- package/dist/chunks/{datePicker.provider-CttuPiiS.js.map → datePicker.provider-o-sEPUJe.js.map} +1 -1
- package/dist/chunks/dateTimePicker.component-B1tTKUZU.js +306 -0
- package/dist/chunks/dateTimePicker.component-B1tTKUZU.js.map +1 -0
- package/dist/chunks/dateTimePicker.component-oLZ5KXWa.js +2 -0
- package/dist/chunks/dateTimePicker.component-oLZ5KXWa.js.map +1 -0
- package/dist/chunks/endOfMonth-ClO3w4vF.js +2 -0
- package/dist/chunks/endOfMonth-ClO3w4vF.js.map +1 -0
- package/dist/chunks/endOfMonth-D0kCU08_.js +19 -0
- package/dist/chunks/endOfMonth-D0kCU08_.js.map +1 -0
- package/dist/chunks/{format-CqTHHSak.js → format-dJJ72A--.js} +3 -3
- package/dist/chunks/{format-CqTHHSak.js.map → format-dJJ72A--.js.map} +1 -1
- package/dist/chunks/{heading.component-CpSAN3cv.js → heading.component-BBTU00_w.js} +2 -2
- package/dist/chunks/{heading.component-CpSAN3cv.js.map → heading.component-BBTU00_w.js.map} +1 -1
- package/dist/chunks/{heading.component-DnoZOXdz.js → heading.component-DeM4h5rY.js} +2 -2
- package/dist/chunks/{heading.component-DnoZOXdz.js.map → heading.component-DeM4h5rY.js.map} +1 -1
- package/dist/chunks/isToday-Q8lj3mkM.js +23 -0
- package/dist/chunks/{isToday-iCYsPDMT.js.map → isToday-Q8lj3mkM.js.map} +1 -1
- package/dist/chunks/{maintenanceBanner.types-DerZF_8G.js → maintenanceBanner.types-BiSgtHkP.js} +2 -2
- package/dist/chunks/{maintenanceBanner.types-DerZF_8G.js.map → maintenanceBanner.types-BiSgtHkP.js.map} +1 -1
- package/dist/chunks/{maintenanceBanner.types-BsNjAlXa.js → maintenanceBanner.types-CfHYj6Nu.js} +2 -2
- package/dist/chunks/{maintenanceBanner.types-BsNjAlXa.js.map → maintenanceBanner.types-CfHYj6Nu.js.map} +1 -1
- package/dist/chunks/{menu.component-D2V9Q1Y5.js → menu.component-CNbEm3SL.js} +2 -2
- package/dist/chunks/{menu.component-D2V9Q1Y5.js.map → menu.component-CNbEm3SL.js.map} +1 -1
- package/dist/chunks/{menu.component-WHzMw5ZI.js → menu.component-DwnU1N2a.js} +5 -5
- package/dist/chunks/{menu.component-WHzMw5ZI.js.map → menu.component-DwnU1N2a.js.map} +1 -1
- package/dist/chunks/{modal.types-Bj6PrItn.js → modal.types-CfN8ElV6.js} +2 -2
- package/dist/chunks/{modal.types-Bj6PrItn.js.map → modal.types-CfN8ElV6.js.map} +1 -1
- package/dist/chunks/{modal.types-rx31rD9D.js → modal.types-DlvB1lQC.js} +2 -2
- package/dist/chunks/{modal.types-rx31rD9D.js.map → modal.types-DlvB1lQC.js.map} +1 -1
- package/dist/chunks/{notificationCounter.component-CBwi5vXa.js → notificationCounter.component-BUxWlpKh.js} +2 -2
- package/dist/chunks/{notificationCounter.component-CBwi5vXa.js.map → notificationCounter.component-BUxWlpKh.js.map} +1 -1
- package/dist/chunks/{notificationCounter.component-6Q3q8jWj.js → notificationCounter.component-DhfVkkOQ.js} +2 -2
- package/dist/chunks/{notificationCounter.component-6Q3q8jWj.js.map → notificationCounter.component-DhfVkkOQ.js.map} +1 -1
- package/dist/chunks/{numberInput.component-DGPEz0Fv.js → numberInput.component-B0P7w6Av.js} +2 -2
- package/dist/chunks/{numberInput.component-DGPEz0Fv.js.map → numberInput.component-B0P7w6Av.js.map} +1 -1
- package/dist/chunks/{numberInput.component-CRDRjrTH.js → numberInput.component-Bpl3NGJU.js} +2 -2
- package/dist/chunks/{numberInput.component-CRDRjrTH.js.map → numberInput.component-Bpl3NGJU.js.map} +1 -1
- package/dist/chunks/{pinInput.types-bIGh7aUS.js → pinInput.types-B0WLZ-4e.js} +2 -2
- package/dist/chunks/{pinInput.types-bIGh7aUS.js.map → pinInput.types-B0WLZ-4e.js.map} +1 -1
- package/dist/chunks/{pinInput.types-Can9f1Eu.js → pinInput.types-xxX7jDUo.js} +2 -2
- package/dist/chunks/{pinInput.types-Can9f1Eu.js.map → pinInput.types-xxX7jDUo.js.map} +1 -1
- package/dist/chunks/{popover.component-DIYT1Lc0.js → popover.component-65oNmbmB.js} +3 -3
- package/dist/chunks/{popover.component-DIYT1Lc0.js.map → popover.component-65oNmbmB.js.map} +1 -1
- package/dist/chunks/{popover.component-DTjA1GSd.js → popover.component-Cw6-018C.js} +2 -2
- package/dist/chunks/{popover.component-DTjA1GSd.js.map → popover.component-Cw6-018C.js.map} +1 -1
- package/dist/chunks/{radioGroup.types-U1ep9nrN.js → radioGroup.types-4D0zmi0v.js} +2 -2
- package/dist/chunks/{radioGroup.types-U1ep9nrN.js.map → radioGroup.types-4D0zmi0v.js.map} +1 -1
- package/dist/chunks/{radioGroup.types-DzSpA07h.js → radioGroup.types-Dbfon_Lr.js} +4 -4
- package/dist/chunks/{radioGroup.types-DzSpA07h.js.map → radioGroup.types-Dbfon_Lr.js.map} +1 -1
- package/dist/chunks/{rating.component-DsHkKmA7.js → rating.component-DOUCmD0Y.js} +2 -2
- package/dist/chunks/{rating.component-DsHkKmA7.js.map → rating.component-DOUCmD0Y.js.map} +1 -1
- package/dist/chunks/{rating.component-BWBPSEEk.js → rating.component-DlCpQ5GH.js} +2 -2
- package/dist/chunks/{rating.component-BWBPSEEk.js.map → rating.component-DlCpQ5GH.js.map} +1 -1
- package/dist/chunks/{ratingDots.component-BhWM7kTg.js → ratingDots.component-Qk8qlPmN.js} +3 -3
- package/dist/chunks/{ratingDots.component-BhWM7kTg.js.map → ratingDots.component-Qk8qlPmN.js.map} +1 -1
- package/dist/chunks/{ratingDots.component-CZ370iI3.js → ratingDots.component-pc5p1mua.js} +2 -2
- package/dist/chunks/{ratingDots.component-CZ370iI3.js.map → ratingDots.component-pc5p1mua.js.map} +1 -1
- package/dist/chunks/{select.component-OrsHXCMz.js → select.component-CzyXxbhS.js} +2 -2
- package/dist/chunks/{select.component-OrsHXCMz.js.map → select.component-CzyXxbhS.js.map} +1 -1
- package/dist/chunks/{select.component-DckP-f8y.js → select.component-DIrbeCPd.js} +5 -5
- package/dist/chunks/{select.component-DckP-f8y.js.map → select.component-DIrbeCPd.js.map} +1 -1
- package/dist/chunks/{semanticTokens.records-YFGbKTL1.js → semanticTokens.records-CmeaObFQ.js} +2 -2
- package/dist/chunks/{semanticTokens.records-YFGbKTL1.js.map → semanticTokens.records-CmeaObFQ.js.map} +1 -1
- package/dist/chunks/{semanticTokens.records-C_ewkfqj.js → semanticTokens.records-Di2_gv9n.js} +9 -9
- package/dist/chunks/{semanticTokens.records-C_ewkfqj.js.map → semanticTokens.records-Di2_gv9n.js.map} +1 -1
- package/dist/chunks/{sortableList.component-CbxbBLVQ.js → sortableList.component-05kG3QEM.js} +2 -2
- package/dist/chunks/{sortableList.component-CbxbBLVQ.js.map → sortableList.component-05kG3QEM.js.map} +1 -1
- package/dist/chunks/{sortableList.component-2yX2pXs7.js → sortableList.component-DX9EP39N.js} +2 -2
- package/dist/chunks/{sortableList.component-2yX2pXs7.js.map → sortableList.component-DX9EP39N.js.map} +1 -1
- package/dist/chunks/{spinner.component-Dq6u4vVL.js → spinner.component-0tE7mnxi.js} +2 -2
- package/dist/chunks/{spinner.component-Dq6u4vVL.js.map → spinner.component-0tE7mnxi.js.map} +1 -1
- package/dist/chunks/{spinner.component-CNHQ8UDz.js → spinner.component-CQ-JWUon.js} +2 -2
- package/dist/chunks/{spinner.component-CNHQ8UDz.js.map → spinner.component-CQ-JWUon.js.map} +1 -1
- package/dist/chunks/{switch.component-BYEMhBCA.js → switch.component-BKahX4Bw.js} +2 -2
- package/dist/chunks/{switch.component-BYEMhBCA.js.map → switch.component-BKahX4Bw.js.map} +1 -1
- package/dist/chunks/{switch.component-DjN67nap.js → switch.component-WMd5cinZ.js} +2 -2
- package/dist/chunks/{switch.component-DjN67nap.js.map → switch.component-WMd5cinZ.js.map} +1 -1
- package/dist/chunks/{tab.types-JAJ5Xxff.js → tab.types-CTlxVEvQ.js} +3 -3
- package/dist/chunks/{tab.types-JAJ5Xxff.js.map → tab.types-CTlxVEvQ.js.map} +1 -1
- package/dist/chunks/{tab.types-DSPWRVCF.js → tab.types-xN2lQJLC.js} +2 -2
- package/dist/chunks/{tab.types-DSPWRVCF.js.map → tab.types-xN2lQJLC.js.map} +1 -1
- package/dist/chunks/{tagBlock.component-CT7_RyJ-.js → tagBlock.component-CNwLyYYb.js} +5 -5
- package/dist/chunks/{tagBlock.component-CT7_RyJ-.js.map → tagBlock.component-CNwLyYYb.js.map} +1 -1
- package/dist/chunks/{tagBlock.component-B899iqQP.js → tagBlock.component-fnt27QP6.js} +2 -2
- package/dist/chunks/{tagBlock.component-B899iqQP.js.map → tagBlock.component-fnt27QP6.js.map} +1 -1
- package/dist/chunks/{text.component-DhuUgP3j.js → text.component-C9jh_JMO.js} +2 -2
- package/dist/chunks/{text.component-DhuUgP3j.js.map → text.component-C9jh_JMO.js.map} +1 -1
- package/dist/chunks/{text.component-BDDz5KQP.js → text.component-D5GpbfNx.js} +2 -2
- package/dist/chunks/{text.component-BDDz5KQP.js.map → text.component-D5GpbfNx.js.map} +1 -1
- package/dist/chunks/{textInput.component-CwTc0h_F.js → textInput.component-BDJuvT1c.js} +2 -2
- package/dist/chunks/{textInput.component-CwTc0h_F.js.map → textInput.component-BDJuvT1c.js.map} +1 -1
- package/dist/chunks/{textInput.component-BeiTxTkS.js → textInput.component-DAan7BwF.js} +3 -3
- package/dist/chunks/{textInput.component-BeiTxTkS.js.map → textInput.component-DAan7BwF.js.map} +1 -1
- package/dist/chunks/{textarea.component-BIg_XX_R.js → textarea.component-1Gvjelye.js} +2 -2
- package/dist/chunks/{textarea.component-BIg_XX_R.js.map → textarea.component-1Gvjelye.js.map} +1 -1
- package/dist/chunks/{textarea.component-C6Wt1Pk8.js → textarea.component-B-tQg_4m.js} +3 -3
- package/dist/chunks/{textarea.component-C6Wt1Pk8.js.map → textarea.component-B-tQg_4m.js.map} +1 -1
- package/dist/chunks/theme-BFbOz0Jj.js.map +1 -1
- package/dist/chunks/theme-BOK659O0.js.map +1 -1
- package/dist/chunks/{theme.provider-BeSlhtUQ.js → theme.provider-CD72J0A7.js} +17 -6
- package/dist/chunks/{theme.provider-BeSlhtUQ.js.map → theme.provider-CD72J0A7.js.map} +1 -1
- package/dist/chunks/{theme.provider-DYehMUhm.js → theme.provider-DpFjsbLx.js} +2 -2
- package/dist/chunks/{theme.provider-DYehMUhm.js.map → theme.provider-DpFjsbLx.js.map} +1 -1
- package/dist/chunks/{timePicker.component-BCMX6aqb.js → timePicker.component-CvQ9kF_7.js} +4 -4
- package/dist/chunks/{timePicker.component-BCMX6aqb.js.map → timePicker.component-CvQ9kF_7.js.map} +1 -1
- package/dist/chunks/{timePicker.component-D5hw80VV.js → timePicker.component-D2gDf5fp.js} +2 -2
- package/dist/chunks/{timePicker.component-D5hw80VV.js.map → timePicker.component-D2gDf5fp.js.map} +1 -1
- package/dist/chunks/{timeRange.component-D3Db8lvh.js → timeRange.component-DL2vskjy.js} +2 -2
- package/dist/chunks/{timeRange.component-D3Db8lvh.js.map → timeRange.component-DL2vskjy.js.map} +1 -1
- package/dist/chunks/{timeRange.component-BZHpZeAX.js → timeRange.component-DfOq2mGR.js} +2 -2
- package/dist/chunks/{timeRange.component-BZHpZeAX.js.map → timeRange.component-DfOq2mGR.js.map} +1 -1
- package/dist/chunks/{timestamp.component-BfmZPfy5.js → timestamp.component-CRTYMLmn.js} +2 -2
- package/dist/chunks/{timestamp.component-BfmZPfy5.js.map → timestamp.component-CRTYMLmn.js.map} +1 -1
- package/dist/chunks/{timestamp.component-DkLjxUsy.js → timestamp.component-CRz-1i68.js} +4 -4
- package/dist/chunks/{timestamp.component-DkLjxUsy.js.map → timestamp.component-CRz-1i68.js.map} +1 -1
- package/dist/chunks/{withFormControl-DW9A6BSL.js → withFormControl-DVeqCX53.js} +2 -2
- package/dist/chunks/{withFormControl-DW9A6BSL.js.map → withFormControl-DVeqCX53.js.map} +1 -1
- package/dist/chunks/{withFormControl-QV_Jridv.js → withFormControl-d2CEvsH2.js} +2 -2
- package/dist/chunks/{withFormControl-QV_Jridv.js.map → withFormControl-d2CEvsH2.js.map} +1 -1
- package/dist/chunks/withTruncation-D0mlwwep.js +2 -0
- package/dist/chunks/{withTruncation-B2GhwmHG.js.map → withTruncation-D0mlwwep.js.map} +1 -1
- package/dist/chunks/withTruncation-DW62mTHW.js +103 -0
- package/dist/chunks/withTruncation-DW62mTHW.js.map +1 -0
- package/dist/cjs/components/Alert/index.cjs +1 -1
- package/dist/cjs/components/AvatarGroup/index.cjs +1 -1
- package/dist/cjs/components/ButtonGroup/index.cjs +1 -1
- package/dist/cjs/components/Calendar/index.cjs +1 -1
- package/dist/cjs/components/CharacterCounter/index.cjs +1 -1
- package/dist/cjs/components/Checkbox/index.cjs +1 -1
- package/dist/cjs/components/CheckboxGroup/index.cjs +1 -1
- package/dist/cjs/components/ConversationCard/index.cjs +1 -1
- package/dist/cjs/components/DatePicker/index.cjs +1 -1
- package/dist/cjs/components/DateTimePicker/index.cjs +1 -1
- package/dist/cjs/components/Heading/index.cjs +1 -1
- package/dist/cjs/components/MaintenanceBanner/index.cjs +1 -1
- package/dist/cjs/components/Menu/index.cjs +1 -1
- package/dist/cjs/components/Modal/index.cjs +1 -1
- package/dist/cjs/components/NotificationCounter/index.cjs +1 -1
- package/dist/cjs/components/NumberInput/index.cjs +1 -1
- package/dist/cjs/components/PinInput/index.cjs +1 -1
- package/dist/cjs/components/Popover/index.cjs +1 -1
- package/dist/cjs/components/RadioGroup/index.cjs +1 -1
- package/dist/cjs/components/Rating/index.cjs +1 -1
- package/dist/cjs/components/RatingDots/index.cjs +1 -1
- package/dist/cjs/components/Select/index.cjs +1 -1
- package/dist/cjs/components/SortableList/index.cjs +1 -1
- package/dist/cjs/components/Spinner/index.cjs +1 -1
- package/dist/cjs/components/Switch/index.cjs +1 -1
- package/dist/cjs/components/Tabs/index.cjs +1 -1
- package/dist/cjs/components/TagBlock/index.cjs +1 -1
- package/dist/cjs/components/Text/index.cjs +1 -1
- package/dist/cjs/components/TextInput/index.cjs +1 -1
- package/dist/cjs/components/Textarea/index.cjs +1 -1
- package/dist/cjs/components/TimePicker/index.cjs +1 -1
- package/dist/cjs/components/TimeRange/index.cjs +1 -1
- package/dist/cjs/components/Timestamp/index.cjs +1 -1
- package/dist/cjs/components/index.cjs +1 -1
- package/dist/cjs/index.cjs +1 -1
- package/dist/cjs/theme/index.cjs +1 -1
- package/dist/cjs/theme/semanticTokens/index.cjs +1 -1
- package/dist/cjs/theme/semanticTokens/index.cjs.map +1 -1
- package/dist/esm/components/Alert/index.js +1 -1
- package/dist/esm/components/AvatarGroup/index.js +1 -1
- package/dist/esm/components/ButtonGroup/index.js +1 -1
- package/dist/esm/components/Calendar/index.js +4 -2
- package/dist/esm/components/CharacterCounter/index.js +1 -1
- package/dist/esm/components/Checkbox/index.js +1 -1
- package/dist/esm/components/CheckboxGroup/index.js +1 -1
- package/dist/esm/components/ConversationCard/index.js +1 -1
- package/dist/esm/components/DatePicker/index.js +2 -2
- package/dist/esm/components/DateTimePicker/index.js +1 -1
- package/dist/esm/components/Heading/index.js +1 -1
- package/dist/esm/components/MaintenanceBanner/index.js +1 -1
- package/dist/esm/components/Menu/index.js +1 -1
- package/dist/esm/components/Modal/index.js +1 -1
- package/dist/esm/components/NotificationCounter/index.js +1 -1
- package/dist/esm/components/NumberInput/index.js +1 -1
- package/dist/esm/components/PinInput/index.js +1 -1
- package/dist/esm/components/Popover/index.js +1 -1
- package/dist/esm/components/RadioGroup/index.js +1 -1
- package/dist/esm/components/Rating/index.js +1 -1
- package/dist/esm/components/RatingDots/index.js +1 -1
- package/dist/esm/components/Select/index.js +1 -1
- package/dist/esm/components/SortableList/index.js +1 -1
- package/dist/esm/components/Spinner/index.js +1 -1
- package/dist/esm/components/Switch/index.js +1 -1
- package/dist/esm/components/Tabs/index.js +1 -1
- package/dist/esm/components/TagBlock/index.js +1 -1
- package/dist/esm/components/Text/index.js +1 -1
- package/dist/esm/components/TextInput/index.js +1 -1
- package/dist/esm/components/Textarea/index.js +1 -1
- package/dist/esm/components/TimePicker/index.js +1 -1
- package/dist/esm/components/TimeRange/index.js +1 -1
- package/dist/esm/components/Timestamp/index.js +1 -1
- package/dist/esm/components/index.js +127 -125
- package/dist/esm/index.js +155 -153
- package/dist/esm/theme/index.js +1 -1
- package/dist/esm/theme/semanticTokens/index.js +39 -15
- package/dist/esm/theme/semanticTokens/index.js.map +1 -1
- package/dist/types/components/Calendar/calendar.component.d.ts +19 -1
- package/dist/types/components/Calendar/calendar.utils.d.ts +3 -0
- package/dist/types/components/Calendar/calendarFooterButton.component.d.ts +41 -0
- package/dist/types/components/Calendar/index.d.ts +2 -0
- package/dist/types/components/Heading/heading.recipe.d.ts +1 -1
- package/dist/types/components/Link/link.recipe.d.ts +1 -1
- package/dist/types/components/Modal/modal.recipe.d.ts +1 -1
- package/dist/types/components/Text/text.recipe.d.ts +1 -1
- package/dist/types/shared/types/theme.d.ts +1 -1
- package/dist/types/theme/semanticTokens/semanticTokens.config.d.ts +37 -37
- package/dist/types/theme/tokens/colors/colors.config.d.ts +1 -1
- package/package.json +1 -1
- package/dist/chunks/calendar.component-BFSyxaB6.js +0 -2
- package/dist/chunks/calendar.component-BFSyxaB6.js.map +0 -1
- package/dist/chunks/calendar.component-CegJR9ey.js +0 -18
- package/dist/chunks/calendar.component-CegJR9ey.js.map +0 -1
- package/dist/chunks/dateTimePicker.component-BlWhC5aT.js +0 -2
- package/dist/chunks/dateTimePicker.component-BlWhC5aT.js.map +0 -1
- package/dist/chunks/dateTimePicker.component-CLAI_Q6e.js +0 -317
- package/dist/chunks/dateTimePicker.component-CLAI_Q6e.js.map +0 -1
- package/dist/chunks/isToday-iCYsPDMT.js +0 -23
- package/dist/chunks/withTruncation-B2GhwmHG.js +0 -92
- package/dist/chunks/withTruncation-pzYbtqYw.js +0 -2
- package/dist/chunks/withTruncation-pzYbtqYw.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pinInput.types-bIGh7aUS.js","sources":["../../node_modules/@ark-ui/react/dist/components/pin-input/use-pin-input-context.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-control.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-hidden-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-label.js","../../node_modules/@ark-ui/react/dist/components/pin-input/use-pin-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-root.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-root-provider.js","../../node_modules/@chakra-ui/react/dist/esm/components/pin-input/pin-input.js","../../src/components/PinInput/pinInput.component.tsx","../../src/components/PinInput/pinInput.types.ts"],"sourcesContent":["'use client';\nimport { createContext } from '../../utils/create-context.js';\n\nconst [PinInputProvider, usePinInputContext] = createContext({\n name: \"PinInputContext\",\n hookName: \"usePinInputContext\",\n providerName: \"<PinInputProvider />\"\n});\n\nexport { PinInputProvider, usePinInputContext };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputControl = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getControlProps(), props);\n return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });\n});\nPinInputControl.displayName = \"PinInputControl\";\n\nexport { PinInputControl };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { useFieldContext } from '../field/use-field-context.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputHiddenInput = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getHiddenInputProps(), props);\n const field = useFieldContext();\n return /* @__PURE__ */ jsx(ark.input, { \"aria-describedby\": field?.ariaDescribedby, ...mergedProps, ref });\n});\nPinInputHiddenInput.displayName = \"PinInputHiddenInput\";\n\nexport { PinInputHiddenInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputInput = forwardRef((props, ref) => {\n const [inputProps, localProps] = createSplitProps()(props, [\"index\"]);\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getInputProps(inputProps), localProps);\n return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });\n});\nPinInputInput.displayName = \"PinInputInput\";\n\nexport { PinInputInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputLabel = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getLabelProps(), props);\n return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });\n});\nPinInputLabel.displayName = \"PinInputLabel\";\n\nexport { PinInputLabel };\n","'use client';\nimport * as pinInput from '@zag-js/pin-input';\nimport { useMachine, normalizeProps } from '@zag-js/react';\nimport { useId } from 'react';\nimport { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';\nimport { useLocaleContext } from '../../providers/locale/use-locale-context.js';\nimport { useFieldContext } from '../field/use-field-context.js';\n\nconst usePinInput = (props) => {\n const id = useId();\n const { getRootNode } = useEnvironmentContext();\n const { dir } = useLocaleContext();\n const field = useFieldContext();\n const machineProps = {\n id,\n ids: {\n label: field?.ids.label,\n hiddenInput: field?.ids.control\n },\n disabled: field?.disabled,\n readOnly: field?.readOnly,\n required: field?.required,\n invalid: field?.invalid,\n dir,\n getRootNode,\n ...props\n };\n const service = useMachine(pinInput.machine, machineProps);\n return pinInput.connect(service, normalizeProps);\n};\n\nexport { usePinInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { usePinInput } from './use-pin-input.js';\nimport { PinInputProvider } from './use-pin-input-context.js';\n\nconst PinInputRoot = forwardRef((props, ref) => {\n const [usePinInputProps, localProps] = createSplitProps()(props, [\n \"autoFocus\",\n \"blurOnComplete\",\n \"count\",\n \"defaultValue\",\n \"disabled\",\n \"form\",\n \"id\",\n \"ids\",\n \"invalid\",\n \"mask\",\n \"name\",\n \"onValueChange\",\n \"onValueComplete\",\n \"onValueInvalid\",\n \"otp\",\n \"pattern\",\n \"placeholder\",\n \"readOnly\",\n \"required\",\n \"selectOnFocus\",\n \"translations\",\n \"type\",\n \"value\"\n ]);\n const pinInput = usePinInput(usePinInputProps);\n const mergedProps = mergeProps(pinInput.getRootProps(), localProps);\n return /* @__PURE__ */ jsx(PinInputProvider, { value: pinInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });\n});\nPinInputRoot.displayName = \"PinInputRoot\";\n\nexport { PinInputRoot };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { PinInputProvider } from './use-pin-input-context.js';\n\nconst PinInputRootProvider = forwardRef((props, ref) => {\n const [{ value: pinInput }, localProps] = createSplitProps()(props, [\"value\"]);\n const mergedProps = mergeProps(pinInput.getRootProps(), localProps);\n return /* @__PURE__ */ jsx(PinInputProvider, { value: pinInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });\n});\nPinInputRootProvider.displayName = \"PinInputRootProvider\";\n\nexport { PinInputRootProvider };\n","\"use strict\";\n\"use client\";\nimport { PinInput } from '@ark-ui/react/pin-input';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\n\nconst {\n withProvider,\n withContext,\n useStyles: usePinInputStyles,\n PropsProvider\n} = createSlotRecipeContext({ key: \"pinInput\" });\nconst PinInputRootProvider = withProvider(PinInput.RootProvider, \"root\", { forwardAsChild: true });\nconst PinInputRoot = withProvider(\n PinInput.Root,\n \"root\",\n { forwardProps: [\"mask\"], forwardAsChild: true }\n);\nconst PinInputPropsProvider = PropsProvider;\nconst PinInputControl = withContext(PinInput.Control, \"control\", { forwardAsChild: true });\nconst PinInputInput = withContext(\n PinInput.Input,\n \"input\",\n { forwardAsChild: true }\n);\nconst PinInputLabel = withContext(\n PinInput.Label,\n \"label\",\n { forwardAsChild: true }\n);\nconst PinInputContext = PinInput.Context;\nconst PinInputHiddenInput = PinInput.HiddenInput;\n\nexport { PinInputContext, PinInputControl, PinInputHiddenInput, PinInputInput, PinInputLabel, PinInputPropsProvider, PinInputRoot, PinInputRootProvider, usePinInputStyles };\n","import React from 'react';\nimport { PinInput as CPinInput } from '@chakra-ui/react/pin-input';\nimport { withFormControl, WithFormControlProps } from 'hocs/withFormControl/withFormControl';\nimport { FormControlSize } from 'shared/types';\n\nexport interface PinInputProps extends WithFormControlProps, Omit<CPinInput.RootProps, 'size'> {\n /**\n * Number of inputs in the pin input.\n * @default 6\n */\n count?: number;\n /** Ref to the hidden input element. */\n inputRef?: React.Ref<HTMLInputElement | null>;\n /**\n * If true, the pin input will render a contrasting variant.\n * @default false\n */\n onContrast?: boolean;\n /** Ref to the pin input component. */\n rootRef?: React.Ref<HTMLDivElement | null>;\n /** Size of the pin input.\n * @default md\n */\n size?: FormControlSize;\n /** Data test id for the pin input.\n * @default kibble-pin-input\n */\n 'data-testid'?: string;\n}\n\nconst PinInput = React.forwardRef<HTMLInputElement, PinInputProps>(\n (\n {\n count = 6,\n inputRef,\n onContrast = false,\n otp = true,\n rootRef,\n size = 'md',\n type = 'numeric',\n ['data-testid']: dataTestId = 'kibble-pin-input',\n ...rest\n },\n ref,\n ): React.JSX.Element => {\n const _computedVariant = onContrast ? 'onContrast' : 'default';\n\n return (\n <CPinInput.Root\n className=\"PinInput\"\n data-testid={dataTestId}\n ref={rootRef}\n variant={_computedVariant}\n size={size}\n type={type}\n otp={otp}\n {...rest}\n >\n <CPinInput.HiddenInput\n className=\"PinInput__HiddenInput\"\n data-testid={`${dataTestId}-hidden-input`}\n ref={inputRef || ref}\n />\n <CPinInput.Control className=\"PinInput__Control\" data-testid={`${dataTestId}-control`}>\n {Array.from({ length: count }).map((_, index) => (\n <CPinInput.Input\n key={index}\n index={index}\n className=\"PinInput__Input\"\n data-testid={`${dataTestId}-input-${index}`}\n />\n ))}\n </CPinInput.Control>\n </CPinInput.Root>\n );\n },\n);\n\nPinInput.displayName = 'PinInput';\nconst WrappedPinInput = withFormControl<PinInputProps>(PinInput);\n\nexport { WrappedPinInput as PinInput };\n","export const pinInputTypes = ['numeric', 'alphabetic', 'alphanumeric'] as const;\nexport type PinInputType = (typeof pinInputTypes)[number];\n"],"names":["PinInputProvider","usePinInputContext","createContext","PinInputControl","forwardRef","props","ref","pinInput","mergedProps","mergeProps","jsx","ark","PinInputHiddenInput","field","useFieldContext","PinInputInput","inputProps","localProps","createSplitProps","PinInputLabel","usePinInput","id","useId","getRootNode","useEnvironmentContext","dir","useLocaleContext","machineProps","service","useMachine","pinInput.machine","pinInput.connect","normalizeProps","PinInputRoot","usePinInputProps","PinInputRootProvider","withProvider","withContext","createSlotRecipeContext","PinInput.RootProvider","PinInput.Root","PinInput.Control","PinInput.Input","PinInput.Label","PinInput.HiddenInput","PinInput","React","count","inputRef","onContrast","otp","rootRef","size","type","dataTestId","rest","_computedVariant","jsxs","CPinInput.Root","CPinInput.HiddenInput","CPinInput.Control","_","index","CPinInput.Input","WrappedPinInput","withFormControl","pinInputTypes"],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5,6,7,8]}
|
|
1
|
+
{"version":3,"file":"pinInput.types-B0WLZ-4e.js","sources":["../../node_modules/@ark-ui/react/dist/components/pin-input/use-pin-input-context.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-control.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-hidden-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-label.js","../../node_modules/@ark-ui/react/dist/components/pin-input/use-pin-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-root.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-root-provider.js","../../node_modules/@chakra-ui/react/dist/esm/components/pin-input/pin-input.js","../../src/components/PinInput/pinInput.component.tsx","../../src/components/PinInput/pinInput.types.ts"],"sourcesContent":["'use client';\nimport { createContext } from '../../utils/create-context.js';\n\nconst [PinInputProvider, usePinInputContext] = createContext({\n name: \"PinInputContext\",\n hookName: \"usePinInputContext\",\n providerName: \"<PinInputProvider />\"\n});\n\nexport { PinInputProvider, usePinInputContext };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputControl = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getControlProps(), props);\n return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });\n});\nPinInputControl.displayName = \"PinInputControl\";\n\nexport { PinInputControl };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { useFieldContext } from '../field/use-field-context.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputHiddenInput = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getHiddenInputProps(), props);\n const field = useFieldContext();\n return /* @__PURE__ */ jsx(ark.input, { \"aria-describedby\": field?.ariaDescribedby, ...mergedProps, ref });\n});\nPinInputHiddenInput.displayName = \"PinInputHiddenInput\";\n\nexport { PinInputHiddenInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputInput = forwardRef((props, ref) => {\n const [inputProps, localProps] = createSplitProps()(props, [\"index\"]);\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getInputProps(inputProps), localProps);\n return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });\n});\nPinInputInput.displayName = \"PinInputInput\";\n\nexport { PinInputInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputLabel = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getLabelProps(), props);\n return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });\n});\nPinInputLabel.displayName = \"PinInputLabel\";\n\nexport { PinInputLabel };\n","'use client';\nimport * as pinInput from '@zag-js/pin-input';\nimport { useMachine, normalizeProps } from '@zag-js/react';\nimport { useId } from 'react';\nimport { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';\nimport { useLocaleContext } from '../../providers/locale/use-locale-context.js';\nimport { useFieldContext } from '../field/use-field-context.js';\n\nconst usePinInput = (props) => {\n const id = useId();\n const { getRootNode } = useEnvironmentContext();\n const { dir } = useLocaleContext();\n const field = useFieldContext();\n const machineProps = {\n id,\n ids: {\n label: field?.ids.label,\n hiddenInput: field?.ids.control\n },\n disabled: field?.disabled,\n readOnly: field?.readOnly,\n required: field?.required,\n invalid: field?.invalid,\n dir,\n getRootNode,\n ...props\n };\n const service = useMachine(pinInput.machine, machineProps);\n return pinInput.connect(service, normalizeProps);\n};\n\nexport { usePinInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { usePinInput } from './use-pin-input.js';\nimport { PinInputProvider } from './use-pin-input-context.js';\n\nconst PinInputRoot = forwardRef((props, ref) => {\n const [usePinInputProps, localProps] = createSplitProps()(props, [\n \"autoFocus\",\n \"blurOnComplete\",\n \"count\",\n \"defaultValue\",\n \"disabled\",\n \"form\",\n \"id\",\n \"ids\",\n \"invalid\",\n \"mask\",\n \"name\",\n \"onValueChange\",\n \"onValueComplete\",\n \"onValueInvalid\",\n \"otp\",\n \"pattern\",\n \"placeholder\",\n \"readOnly\",\n \"required\",\n \"selectOnFocus\",\n \"translations\",\n \"type\",\n \"value\"\n ]);\n const pinInput = usePinInput(usePinInputProps);\n const mergedProps = mergeProps(pinInput.getRootProps(), localProps);\n return /* @__PURE__ */ jsx(PinInputProvider, { value: pinInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });\n});\nPinInputRoot.displayName = \"PinInputRoot\";\n\nexport { PinInputRoot };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { PinInputProvider } from './use-pin-input-context.js';\n\nconst PinInputRootProvider = forwardRef((props, ref) => {\n const [{ value: pinInput }, localProps] = createSplitProps()(props, [\"value\"]);\n const mergedProps = mergeProps(pinInput.getRootProps(), localProps);\n return /* @__PURE__ */ jsx(PinInputProvider, { value: pinInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });\n});\nPinInputRootProvider.displayName = \"PinInputRootProvider\";\n\nexport { PinInputRootProvider };\n","\"use strict\";\n\"use client\";\nimport { PinInput } from '@ark-ui/react/pin-input';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\n\nconst {\n withProvider,\n withContext,\n useStyles: usePinInputStyles,\n PropsProvider\n} = createSlotRecipeContext({ key: \"pinInput\" });\nconst PinInputRootProvider = withProvider(PinInput.RootProvider, \"root\", { forwardAsChild: true });\nconst PinInputRoot = withProvider(\n PinInput.Root,\n \"root\",\n { forwardProps: [\"mask\"], forwardAsChild: true }\n);\nconst PinInputPropsProvider = PropsProvider;\nconst PinInputControl = withContext(PinInput.Control, \"control\", { forwardAsChild: true });\nconst PinInputInput = withContext(\n PinInput.Input,\n \"input\",\n { forwardAsChild: true }\n);\nconst PinInputLabel = withContext(\n PinInput.Label,\n \"label\",\n { forwardAsChild: true }\n);\nconst PinInputContext = PinInput.Context;\nconst PinInputHiddenInput = PinInput.HiddenInput;\n\nexport { PinInputContext, PinInputControl, PinInputHiddenInput, PinInputInput, PinInputLabel, PinInputPropsProvider, PinInputRoot, PinInputRootProvider, usePinInputStyles };\n","import React from 'react';\nimport { PinInput as CPinInput } from '@chakra-ui/react/pin-input';\nimport { withFormControl, WithFormControlProps } from 'hocs/withFormControl/withFormControl';\nimport { FormControlSize } from 'shared/types';\n\nexport interface PinInputProps extends WithFormControlProps, Omit<CPinInput.RootProps, 'size'> {\n /**\n * Number of inputs in the pin input.\n * @default 6\n */\n count?: number;\n /** Ref to the hidden input element. */\n inputRef?: React.Ref<HTMLInputElement | null>;\n /**\n * If true, the pin input will render a contrasting variant.\n * @default false\n */\n onContrast?: boolean;\n /** Ref to the pin input component. */\n rootRef?: React.Ref<HTMLDivElement | null>;\n /** Size of the pin input.\n * @default md\n */\n size?: FormControlSize;\n /** Data test id for the pin input.\n * @default kibble-pin-input\n */\n 'data-testid'?: string;\n}\n\nconst PinInput = React.forwardRef<HTMLInputElement, PinInputProps>(\n (\n {\n count = 6,\n inputRef,\n onContrast = false,\n otp = true,\n rootRef,\n size = 'md',\n type = 'numeric',\n ['data-testid']: dataTestId = 'kibble-pin-input',\n ...rest\n },\n ref,\n ): React.JSX.Element => {\n const _computedVariant = onContrast ? 'onContrast' : 'default';\n\n return (\n <CPinInput.Root\n className=\"PinInput\"\n data-testid={dataTestId}\n ref={rootRef}\n variant={_computedVariant}\n size={size}\n type={type}\n otp={otp}\n {...rest}\n >\n <CPinInput.HiddenInput\n className=\"PinInput__HiddenInput\"\n data-testid={`${dataTestId}-hidden-input`}\n ref={inputRef || ref}\n />\n <CPinInput.Control className=\"PinInput__Control\" data-testid={`${dataTestId}-control`}>\n {Array.from({ length: count }).map((_, index) => (\n <CPinInput.Input\n key={index}\n index={index}\n className=\"PinInput__Input\"\n data-testid={`${dataTestId}-input-${index}`}\n />\n ))}\n </CPinInput.Control>\n </CPinInput.Root>\n );\n },\n);\n\nPinInput.displayName = 'PinInput';\nconst WrappedPinInput = withFormControl<PinInputProps>(PinInput);\n\nexport { WrappedPinInput as PinInput };\n","export const pinInputTypes = ['numeric', 'alphabetic', 'alphanumeric'] as const;\nexport type PinInputType = (typeof pinInputTypes)[number];\n"],"names":["PinInputProvider","usePinInputContext","createContext","PinInputControl","forwardRef","props","ref","pinInput","mergedProps","mergeProps","jsx","ark","PinInputHiddenInput","field","useFieldContext","PinInputInput","inputProps","localProps","createSplitProps","PinInputLabel","usePinInput","id","useId","getRootNode","useEnvironmentContext","dir","useLocaleContext","machineProps","service","useMachine","pinInput.machine","pinInput.connect","normalizeProps","PinInputRoot","usePinInputProps","PinInputRootProvider","withProvider","withContext","createSlotRecipeContext","PinInput.RootProvider","PinInput.Root","PinInput.Control","PinInput.Input","PinInput.Label","PinInput.HiddenInput","PinInput","React","count","inputRef","onContrast","otp","rootRef","size","type","dataTestId","rest","_computedVariant","jsxs","CPinInput.Root","CPinInput.HiddenInput","CPinInput.Control","_","index","CPinInput.Input","WrappedPinInput","withFormControl","pinInputTypes"],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5,6,7,8]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const i=require("./jsx-runtime-BjDatQAs.js"),p=require("react"),_=require("./withFormControl-
|
|
2
|
-
//# sourceMappingURL=pinInput.types-
|
|
1
|
+
"use strict";const i=require("./jsx-runtime-BjDatQAs.js"),p=require("react"),_=require("./withFormControl-d2CEvsH2.js"),k=require("./create-slot-recipe-context-HXE1VazG.js"),s=require("./use-locale-context-ym21RUxU.js"),I=require("./use-field-context-Cm29IQ7H.js"),a=require("./index-CQURjLlA.js"),x=require("./index-kpOEHtZZ.js"),q=t=>t&&t.__esModule?t:{default:t},$=q(p),[f,l]=s.createContext({name:"PinInputContext",hookName:"usePinInputContext",providerName:"<PinInputProvider />"}),R=p.forwardRef((t,r)=>{const n=l(),o=a.mergeProps(n.getControlProps(),t);return i.jsxRuntimeExports.jsx(s.ark.div,{...o,ref:r})});R.displayName="PinInputControl";const C=p.forwardRef((t,r)=>{const n=l(),o=a.mergeProps(n.getHiddenInputProps(),t),e=I.useFieldContext();return i.jsxRuntimeExports.jsx(s.ark.input,{"aria-describedby":e?.ariaDescribedby,...o,ref:r})});C.displayName="PinInputHiddenInput";const j=p.forwardRef((t,r)=>{const[n,o]=s.createSplitProps()(t,["index"]),e=l(),u=a.mergeProps(e.getInputProps(n),o);return i.jsxRuntimeExports.jsx(s.ark.input,{...u,ref:r})});j.displayName="PinInputInput";const h=p.forwardRef((t,r)=>{const n=l(),o=a.mergeProps(n.getLabelProps(),t);return i.jsxRuntimeExports.jsx(s.ark.label,{...o,ref:r})});h.displayName="PinInputLabel";const F=t=>{const r=p.useId(),{getRootNode:n}=s.useEnvironmentContext(),{dir:o}=s.useLocaleContext(),e=I.useFieldContext(),u={id:r,ids:{label:e?.ids.label,hiddenInput:e?.ids.control},disabled:e?.disabled,readOnly:e?.readOnly,required:e?.required,invalid:e?.invalid,dir:o,getRootNode:n,...t},c=s.useMachine(x.machine,u);return x.connect(c,s.normalizeProps)},g=p.forwardRef((t,r)=>{const[n,o]=s.createSplitProps()(t,["autoFocus","blurOnComplete","count","defaultValue","disabled","form","id","ids","invalid","mask","name","onValueChange","onValueComplete","onValueInvalid","otp","pattern","placeholder","readOnly","required","selectOnFocus","translations","type","value"]),e=F(n),u=a.mergeProps(e.getRootProps(),o);return i.jsxRuntimeExports.jsx(f,{value:e,children:i.jsxRuntimeExports.jsx(s.ark.div,{...u,ref:r})})});g.displayName="PinInputRoot";const v=p.forwardRef((t,r)=>{const[{value:n},o]=s.createSplitProps()(t,["value"]),e=a.mergeProps(n.getRootProps(),o);return i.jsxRuntimeExports.jsx(f,{value:n,children:i.jsxRuntimeExports.jsx(s.ark.div,{...e,ref:r})})});v.displayName="PinInputRootProvider";const{withProvider:b,withContext:m}=k.createSlotRecipeContext({key:"pinInput"});b(v,"root",{forwardAsChild:!0});const A=b(g,"root",{forwardProps:["mask"],forwardAsChild:!0}),H=m(R,"control",{forwardAsChild:!0}),L=m(j,"input",{forwardAsChild:!0});m(h,"label",{forwardAsChild:!0});const O=C,w=$.default.forwardRef(({count:t=6,inputRef:r,onContrast:n=!1,otp:o=!0,rootRef:e,size:u="md",type:c="numeric",["data-testid"]:d="kibble-pin-input",...y},N)=>{const E=n?"onContrast":"default";return i.jsxRuntimeExports.jsxs(A,{className:"PinInput","data-testid":d,ref:e,variant:E,size:u,type:c,otp:o,...y,children:[i.jsxRuntimeExports.jsx(O,{className:"PinInput__HiddenInput","data-testid":`${d}-hidden-input`,ref:r||N}),i.jsxRuntimeExports.jsx(H,{className:"PinInput__Control","data-testid":`${d}-control`,children:Array.from({length:t}).map((D,P)=>i.jsxRuntimeExports.jsx(L,{index:P,className:"PinInput__Input","data-testid":`${d}-input-${P}`},P))})]})});w.displayName="PinInput";const S=_.withFormControl(w),V=["numeric","alphabetic","alphanumeric"];exports.WrappedPinInput=S;exports.pinInputTypes=V;
|
|
2
|
+
//# sourceMappingURL=pinInput.types-xxX7jDUo.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pinInput.types-Can9f1Eu.js","sources":["../../node_modules/@ark-ui/react/dist/components/pin-input/use-pin-input-context.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-control.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-hidden-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-label.js","../../node_modules/@ark-ui/react/dist/components/pin-input/use-pin-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-root.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-root-provider.js","../../node_modules/@chakra-ui/react/dist/esm/components/pin-input/pin-input.js","../../src/components/PinInput/pinInput.component.tsx","../../src/components/PinInput/pinInput.types.ts"],"sourcesContent":["'use client';\nimport { createContext } from '../../utils/create-context.js';\n\nconst [PinInputProvider, usePinInputContext] = createContext({\n name: \"PinInputContext\",\n hookName: \"usePinInputContext\",\n providerName: \"<PinInputProvider />\"\n});\n\nexport { PinInputProvider, usePinInputContext };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputControl = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getControlProps(), props);\n return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });\n});\nPinInputControl.displayName = \"PinInputControl\";\n\nexport { PinInputControl };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { useFieldContext } from '../field/use-field-context.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputHiddenInput = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getHiddenInputProps(), props);\n const field = useFieldContext();\n return /* @__PURE__ */ jsx(ark.input, { \"aria-describedby\": field?.ariaDescribedby, ...mergedProps, ref });\n});\nPinInputHiddenInput.displayName = \"PinInputHiddenInput\";\n\nexport { PinInputHiddenInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputInput = forwardRef((props, ref) => {\n const [inputProps, localProps] = createSplitProps()(props, [\"index\"]);\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getInputProps(inputProps), localProps);\n return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });\n});\nPinInputInput.displayName = \"PinInputInput\";\n\nexport { PinInputInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputLabel = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getLabelProps(), props);\n return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });\n});\nPinInputLabel.displayName = \"PinInputLabel\";\n\nexport { PinInputLabel };\n","'use client';\nimport * as pinInput from '@zag-js/pin-input';\nimport { useMachine, normalizeProps } from '@zag-js/react';\nimport { useId } from 'react';\nimport { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';\nimport { useLocaleContext } from '../../providers/locale/use-locale-context.js';\nimport { useFieldContext } from '../field/use-field-context.js';\n\nconst usePinInput = (props) => {\n const id = useId();\n const { getRootNode } = useEnvironmentContext();\n const { dir } = useLocaleContext();\n const field = useFieldContext();\n const machineProps = {\n id,\n ids: {\n label: field?.ids.label,\n hiddenInput: field?.ids.control\n },\n disabled: field?.disabled,\n readOnly: field?.readOnly,\n required: field?.required,\n invalid: field?.invalid,\n dir,\n getRootNode,\n ...props\n };\n const service = useMachine(pinInput.machine, machineProps);\n return pinInput.connect(service, normalizeProps);\n};\n\nexport { usePinInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { usePinInput } from './use-pin-input.js';\nimport { PinInputProvider } from './use-pin-input-context.js';\n\nconst PinInputRoot = forwardRef((props, ref) => {\n const [usePinInputProps, localProps] = createSplitProps()(props, [\n \"autoFocus\",\n \"blurOnComplete\",\n \"count\",\n \"defaultValue\",\n \"disabled\",\n \"form\",\n \"id\",\n \"ids\",\n \"invalid\",\n \"mask\",\n \"name\",\n \"onValueChange\",\n \"onValueComplete\",\n \"onValueInvalid\",\n \"otp\",\n \"pattern\",\n \"placeholder\",\n \"readOnly\",\n \"required\",\n \"selectOnFocus\",\n \"translations\",\n \"type\",\n \"value\"\n ]);\n const pinInput = usePinInput(usePinInputProps);\n const mergedProps = mergeProps(pinInput.getRootProps(), localProps);\n return /* @__PURE__ */ jsx(PinInputProvider, { value: pinInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });\n});\nPinInputRoot.displayName = \"PinInputRoot\";\n\nexport { PinInputRoot };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { PinInputProvider } from './use-pin-input-context.js';\n\nconst PinInputRootProvider = forwardRef((props, ref) => {\n const [{ value: pinInput }, localProps] = createSplitProps()(props, [\"value\"]);\n const mergedProps = mergeProps(pinInput.getRootProps(), localProps);\n return /* @__PURE__ */ jsx(PinInputProvider, { value: pinInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });\n});\nPinInputRootProvider.displayName = \"PinInputRootProvider\";\n\nexport { PinInputRootProvider };\n","\"use strict\";\n\"use client\";\nimport { PinInput } from '@ark-ui/react/pin-input';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\n\nconst {\n withProvider,\n withContext,\n useStyles: usePinInputStyles,\n PropsProvider\n} = createSlotRecipeContext({ key: \"pinInput\" });\nconst PinInputRootProvider = withProvider(PinInput.RootProvider, \"root\", { forwardAsChild: true });\nconst PinInputRoot = withProvider(\n PinInput.Root,\n \"root\",\n { forwardProps: [\"mask\"], forwardAsChild: true }\n);\nconst PinInputPropsProvider = PropsProvider;\nconst PinInputControl = withContext(PinInput.Control, \"control\", { forwardAsChild: true });\nconst PinInputInput = withContext(\n PinInput.Input,\n \"input\",\n { forwardAsChild: true }\n);\nconst PinInputLabel = withContext(\n PinInput.Label,\n \"label\",\n { forwardAsChild: true }\n);\nconst PinInputContext = PinInput.Context;\nconst PinInputHiddenInput = PinInput.HiddenInput;\n\nexport { PinInputContext, PinInputControl, PinInputHiddenInput, PinInputInput, PinInputLabel, PinInputPropsProvider, PinInputRoot, PinInputRootProvider, usePinInputStyles };\n","import React from 'react';\nimport { PinInput as CPinInput } from '@chakra-ui/react/pin-input';\nimport { withFormControl, WithFormControlProps } from 'hocs/withFormControl/withFormControl';\nimport { FormControlSize } from 'shared/types';\n\nexport interface PinInputProps extends WithFormControlProps, Omit<CPinInput.RootProps, 'size'> {\n /**\n * Number of inputs in the pin input.\n * @default 6\n */\n count?: number;\n /** Ref to the hidden input element. */\n inputRef?: React.Ref<HTMLInputElement | null>;\n /**\n * If true, the pin input will render a contrasting variant.\n * @default false\n */\n onContrast?: boolean;\n /** Ref to the pin input component. */\n rootRef?: React.Ref<HTMLDivElement | null>;\n /** Size of the pin input.\n * @default md\n */\n size?: FormControlSize;\n /** Data test id for the pin input.\n * @default kibble-pin-input\n */\n 'data-testid'?: string;\n}\n\nconst PinInput = React.forwardRef<HTMLInputElement, PinInputProps>(\n (\n {\n count = 6,\n inputRef,\n onContrast = false,\n otp = true,\n rootRef,\n size = 'md',\n type = 'numeric',\n ['data-testid']: dataTestId = 'kibble-pin-input',\n ...rest\n },\n ref,\n ): React.JSX.Element => {\n const _computedVariant = onContrast ? 'onContrast' : 'default';\n\n return (\n <CPinInput.Root\n className=\"PinInput\"\n data-testid={dataTestId}\n ref={rootRef}\n variant={_computedVariant}\n size={size}\n type={type}\n otp={otp}\n {...rest}\n >\n <CPinInput.HiddenInput\n className=\"PinInput__HiddenInput\"\n data-testid={`${dataTestId}-hidden-input`}\n ref={inputRef || ref}\n />\n <CPinInput.Control className=\"PinInput__Control\" data-testid={`${dataTestId}-control`}>\n {Array.from({ length: count }).map((_, index) => (\n <CPinInput.Input\n key={index}\n index={index}\n className=\"PinInput__Input\"\n data-testid={`${dataTestId}-input-${index}`}\n />\n ))}\n </CPinInput.Control>\n </CPinInput.Root>\n );\n },\n);\n\nPinInput.displayName = 'PinInput';\nconst WrappedPinInput = withFormControl<PinInputProps>(PinInput);\n\nexport { WrappedPinInput as PinInput };\n","export const pinInputTypes = ['numeric', 'alphabetic', 'alphanumeric'] as const;\nexport type PinInputType = (typeof pinInputTypes)[number];\n"],"names":["PinInputProvider","usePinInputContext","createContext","PinInputControl","forwardRef","props","ref","pinInput","mergedProps","mergeProps","jsx","ark","PinInputHiddenInput","field","useFieldContext","PinInputInput","inputProps","localProps","createSplitProps","PinInputLabel","usePinInput","id","useId","getRootNode","useEnvironmentContext","dir","useLocaleContext","machineProps","service","useMachine","pinInput.machine","pinInput.connect","normalizeProps","PinInputRoot","usePinInputProps","PinInputRootProvider","withProvider","withContext","createSlotRecipeContext","PinInput.RootProvider","PinInput.Root","PinInput.Control","PinInput.Input","PinInput.Label","PinInput.HiddenInput","PinInput","React","count","inputRef","onContrast","otp","rootRef","size","type","dataTestId","rest","_computedVariant","jsxs","CPinInput.Root","CPinInput.HiddenInput","CPinInput.Control","_","index","CPinInput.Input","WrappedPinInput","withFormControl","pinInputTypes"],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5,6,7,8]}
|
|
1
|
+
{"version":3,"file":"pinInput.types-xxX7jDUo.js","sources":["../../node_modules/@ark-ui/react/dist/components/pin-input/use-pin-input-context.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-control.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-hidden-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-label.js","../../node_modules/@ark-ui/react/dist/components/pin-input/use-pin-input.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-root.js","../../node_modules/@ark-ui/react/dist/components/pin-input/pin-input-root-provider.js","../../node_modules/@chakra-ui/react/dist/esm/components/pin-input/pin-input.js","../../src/components/PinInput/pinInput.component.tsx","../../src/components/PinInput/pinInput.types.ts"],"sourcesContent":["'use client';\nimport { createContext } from '../../utils/create-context.js';\n\nconst [PinInputProvider, usePinInputContext] = createContext({\n name: \"PinInputContext\",\n hookName: \"usePinInputContext\",\n providerName: \"<PinInputProvider />\"\n});\n\nexport { PinInputProvider, usePinInputContext };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputControl = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getControlProps(), props);\n return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });\n});\nPinInputControl.displayName = \"PinInputControl\";\n\nexport { PinInputControl };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { useFieldContext } from '../field/use-field-context.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputHiddenInput = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getHiddenInputProps(), props);\n const field = useFieldContext();\n return /* @__PURE__ */ jsx(ark.input, { \"aria-describedby\": field?.ariaDescribedby, ...mergedProps, ref });\n});\nPinInputHiddenInput.displayName = \"PinInputHiddenInput\";\n\nexport { PinInputHiddenInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputInput = forwardRef((props, ref) => {\n const [inputProps, localProps] = createSplitProps()(props, [\"index\"]);\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getInputProps(inputProps), localProps);\n return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });\n});\nPinInputInput.displayName = \"PinInputInput\";\n\nexport { PinInputInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { ark } from '../factory.js';\nimport { usePinInputContext } from './use-pin-input-context.js';\n\nconst PinInputLabel = forwardRef((props, ref) => {\n const pinInput = usePinInputContext();\n const mergedProps = mergeProps(pinInput.getLabelProps(), props);\n return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });\n});\nPinInputLabel.displayName = \"PinInputLabel\";\n\nexport { PinInputLabel };\n","'use client';\nimport * as pinInput from '@zag-js/pin-input';\nimport { useMachine, normalizeProps } from '@zag-js/react';\nimport { useId } from 'react';\nimport { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';\nimport { useLocaleContext } from '../../providers/locale/use-locale-context.js';\nimport { useFieldContext } from '../field/use-field-context.js';\n\nconst usePinInput = (props) => {\n const id = useId();\n const { getRootNode } = useEnvironmentContext();\n const { dir } = useLocaleContext();\n const field = useFieldContext();\n const machineProps = {\n id,\n ids: {\n label: field?.ids.label,\n hiddenInput: field?.ids.control\n },\n disabled: field?.disabled,\n readOnly: field?.readOnly,\n required: field?.required,\n invalid: field?.invalid,\n dir,\n getRootNode,\n ...props\n };\n const service = useMachine(pinInput.machine, machineProps);\n return pinInput.connect(service, normalizeProps);\n};\n\nexport { usePinInput };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { usePinInput } from './use-pin-input.js';\nimport { PinInputProvider } from './use-pin-input-context.js';\n\nconst PinInputRoot = forwardRef((props, ref) => {\n const [usePinInputProps, localProps] = createSplitProps()(props, [\n \"autoFocus\",\n \"blurOnComplete\",\n \"count\",\n \"defaultValue\",\n \"disabled\",\n \"form\",\n \"id\",\n \"ids\",\n \"invalid\",\n \"mask\",\n \"name\",\n \"onValueChange\",\n \"onValueComplete\",\n \"onValueInvalid\",\n \"otp\",\n \"pattern\",\n \"placeholder\",\n \"readOnly\",\n \"required\",\n \"selectOnFocus\",\n \"translations\",\n \"type\",\n \"value\"\n ]);\n const pinInput = usePinInput(usePinInputProps);\n const mergedProps = mergeProps(pinInput.getRootProps(), localProps);\n return /* @__PURE__ */ jsx(PinInputProvider, { value: pinInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });\n});\nPinInputRoot.displayName = \"PinInputRoot\";\n\nexport { PinInputRoot };\n","'use client';\nimport { jsx } from 'react/jsx-runtime';\nimport { mergeProps } from '@zag-js/react';\nimport { forwardRef } from 'react';\nimport { createSplitProps } from '../../utils/create-split-props.js';\nimport { ark } from '../factory.js';\nimport { PinInputProvider } from './use-pin-input-context.js';\n\nconst PinInputRootProvider = forwardRef((props, ref) => {\n const [{ value: pinInput }, localProps] = createSplitProps()(props, [\"value\"]);\n const mergedProps = mergeProps(pinInput.getRootProps(), localProps);\n return /* @__PURE__ */ jsx(PinInputProvider, { value: pinInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });\n});\nPinInputRootProvider.displayName = \"PinInputRootProvider\";\n\nexport { PinInputRootProvider };\n","\"use strict\";\n\"use client\";\nimport { PinInput } from '@ark-ui/react/pin-input';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\n\nconst {\n withProvider,\n withContext,\n useStyles: usePinInputStyles,\n PropsProvider\n} = createSlotRecipeContext({ key: \"pinInput\" });\nconst PinInputRootProvider = withProvider(PinInput.RootProvider, \"root\", { forwardAsChild: true });\nconst PinInputRoot = withProvider(\n PinInput.Root,\n \"root\",\n { forwardProps: [\"mask\"], forwardAsChild: true }\n);\nconst PinInputPropsProvider = PropsProvider;\nconst PinInputControl = withContext(PinInput.Control, \"control\", { forwardAsChild: true });\nconst PinInputInput = withContext(\n PinInput.Input,\n \"input\",\n { forwardAsChild: true }\n);\nconst PinInputLabel = withContext(\n PinInput.Label,\n \"label\",\n { forwardAsChild: true }\n);\nconst PinInputContext = PinInput.Context;\nconst PinInputHiddenInput = PinInput.HiddenInput;\n\nexport { PinInputContext, PinInputControl, PinInputHiddenInput, PinInputInput, PinInputLabel, PinInputPropsProvider, PinInputRoot, PinInputRootProvider, usePinInputStyles };\n","import React from 'react';\nimport { PinInput as CPinInput } from '@chakra-ui/react/pin-input';\nimport { withFormControl, WithFormControlProps } from 'hocs/withFormControl/withFormControl';\nimport { FormControlSize } from 'shared/types';\n\nexport interface PinInputProps extends WithFormControlProps, Omit<CPinInput.RootProps, 'size'> {\n /**\n * Number of inputs in the pin input.\n * @default 6\n */\n count?: number;\n /** Ref to the hidden input element. */\n inputRef?: React.Ref<HTMLInputElement | null>;\n /**\n * If true, the pin input will render a contrasting variant.\n * @default false\n */\n onContrast?: boolean;\n /** Ref to the pin input component. */\n rootRef?: React.Ref<HTMLDivElement | null>;\n /** Size of the pin input.\n * @default md\n */\n size?: FormControlSize;\n /** Data test id for the pin input.\n * @default kibble-pin-input\n */\n 'data-testid'?: string;\n}\n\nconst PinInput = React.forwardRef<HTMLInputElement, PinInputProps>(\n (\n {\n count = 6,\n inputRef,\n onContrast = false,\n otp = true,\n rootRef,\n size = 'md',\n type = 'numeric',\n ['data-testid']: dataTestId = 'kibble-pin-input',\n ...rest\n },\n ref,\n ): React.JSX.Element => {\n const _computedVariant = onContrast ? 'onContrast' : 'default';\n\n return (\n <CPinInput.Root\n className=\"PinInput\"\n data-testid={dataTestId}\n ref={rootRef}\n variant={_computedVariant}\n size={size}\n type={type}\n otp={otp}\n {...rest}\n >\n <CPinInput.HiddenInput\n className=\"PinInput__HiddenInput\"\n data-testid={`${dataTestId}-hidden-input`}\n ref={inputRef || ref}\n />\n <CPinInput.Control className=\"PinInput__Control\" data-testid={`${dataTestId}-control`}>\n {Array.from({ length: count }).map((_, index) => (\n <CPinInput.Input\n key={index}\n index={index}\n className=\"PinInput__Input\"\n data-testid={`${dataTestId}-input-${index}`}\n />\n ))}\n </CPinInput.Control>\n </CPinInput.Root>\n );\n },\n);\n\nPinInput.displayName = 'PinInput';\nconst WrappedPinInput = withFormControl<PinInputProps>(PinInput);\n\nexport { WrappedPinInput as PinInput };\n","export const pinInputTypes = ['numeric', 'alphabetic', 'alphanumeric'] as const;\nexport type PinInputType = (typeof pinInputTypes)[number];\n"],"names":["PinInputProvider","usePinInputContext","createContext","PinInputControl","forwardRef","props","ref","pinInput","mergedProps","mergeProps","jsx","ark","PinInputHiddenInput","field","useFieldContext","PinInputInput","inputProps","localProps","createSplitProps","PinInputLabel","usePinInput","id","useId","getRootNode","useEnvironmentContext","dir","useLocaleContext","machineProps","service","useMachine","pinInput.machine","pinInput.connect","normalizeProps","PinInputRoot","usePinInputProps","PinInputRootProvider","withProvider","withContext","createSlotRecipeContext","PinInput.RootProvider","PinInput.Root","PinInput.Control","PinInput.Input","PinInput.Label","PinInput.HiddenInput","PinInput","React","count","inputRef","onContrast","otp","rootRef","size","type","dataTestId","rest","_computedVariant","jsxs","CPinInput.Root","CPinInput.HiddenInput","CPinInput.Control","_","index","CPinInput.Input","WrappedPinInput","withFormControl","pinInputTypes"],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5,6,7,8]}
|
|
@@ -2,8 +2,8 @@ import { j as e } from "./jsx-runtime-C5mzlN2N.js";
|
|
|
2
2
|
import { useRef as k } from "react";
|
|
3
3
|
import { d as N, e as S, f as O, c as $, g as B, b as D, h as z, i as F, j as W, k as E, a as M, l as V, m as q, n as G, o as J, P as K, u as L } from "./popover-Gb1fXSR7.js";
|
|
4
4
|
import { H as Q, a as U, b as X, c as Y, d as Z, e as I, f as ee, g as oe, h as re, u as w } from "./tooltip.component-CHohp2qn.js";
|
|
5
|
-
import { W as te } from "./text.component-
|
|
6
|
-
import { W as se } from "./heading.component-
|
|
5
|
+
import { W as te } from "./text.component-C9jh_JMO.js";
|
|
6
|
+
import { W as se } from "./heading.component-BBTU00_w.js";
|
|
7
7
|
import { B as h } from "./button.component-BO6oee_V.js";
|
|
8
8
|
import { p as b } from "./popover.recipe-DPwwsWLb.js";
|
|
9
9
|
import { u as y } from "./create-slot-recipe-context-D_FXDJGp.js";
|
|
@@ -217,4 +217,4 @@ const ve = ({
|
|
|
217
217
|
export {
|
|
218
218
|
Se as P
|
|
219
219
|
};
|
|
220
|
-
//# sourceMappingURL=popover.component-
|
|
220
|
+
//# sourceMappingURL=popover.component-65oNmbmB.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover.component-DIYT1Lc0.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/spacer/spacer.js","../../src/components/Popover/components/PopoverHeader/popoverHeader.component.tsx","../../src/components/Popover/components/PopoverFooter/popoverFooter.component.tsx","../../src/components/Popover/popover.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { chakra } from '../../styled-system/factory.js';\n\nconst Spacer = chakra(\"div\", {\n base: {\n flex: 1,\n justifySelf: \"stretch\",\n alignSelf: \"stretch\"\n }\n});\nSpacer.displayName = \"Spacer\";\n\nexport { Spacer };\n","import React, { ReactNode } from 'react';\nimport { usePopoverContext } from '@chakra-ui/react/popover';\nimport { useHoverCardContext } from '@chakra-ui/react/hover-card';\nimport { Heading, HeadingSize } from 'components/Heading';\nimport { Button } from 'components/Button/button.component';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { popoverRecipe } from '../../popover.recipe';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { PopoverTriggerType } from '../../popover.types';\n\nexport interface PopoverHeaderProps extends FlexProps {\n /** Content to be rendered in the header. */\n children?: ReactNode;\n /** If true, the close button will not be displayed.\n * @default false\n */\n hideCloseButton?: boolean;\n /** Callback function to be called when the close button is clicked. */\n onClose?: () => void;\n /** If true, the header will render in a contrasting color.\n * @default true\n */\n onContrast?: boolean;\n /** Size of the header.\n * @default sm\n */\n size?: HeadingSize;\n /** Data test id for the header.\n * @default kibble-popover-header\n */\n 'data-testid'?: string;\n}\n\ninterface InternalPopoverHeaderProps extends PopoverHeaderProps {\n /** Trigger type of the popover.\n * @internal\n */\n trigger: PopoverTriggerType;\n}\n\nexport const PopoverHeader = ({\n children,\n color,\n hideCloseButton = false,\n onContrast = true,\n onClose,\n size = 'sm',\n trigger,\n ['data-testid']: dataTestId = 'kibble-popover-header',\n ...rest\n}: InternalPopoverHeaderProps): React.JSX.Element => {\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe();\n const { setOpen } =\n // eslint-disable-next-line react-hooks/rules-of-hooks\n trigger === 'hover' ? useHoverCardContext() : usePopoverContext();\n\n return (\n <Flex className=\"Popover__HeaderWrapper\" data-testid={`${dataTestId}-wrapper`} css={styles.header} {...rest}>\n {typeof children === 'string' ? (\n <Heading\n className=\"Popover__Header\"\n data-testid={`${dataTestId}-header`}\n size={size}\n color={color || 'inherit'}\n w=\"100%\"\n >\n {children}\n </Heading>\n ) : (\n children\n )}\n {!hideCloseButton && trigger === 'click' && (\n <Button\n className=\"Popover__CloseButton\"\n data-testid={`${dataTestId}-close-button`}\n variant=\"ghostNeutral\"\n onContrast={onContrast}\n onClick={onClose ? onClose : (): void => setOpen(false)}\n iconName=\"close\"\n position=\"absolute\"\n right={1}\n top={1}\n size=\"xs\"\n />\n )}\n </Flex>\n );\n};\n","import React, { ReactNode } from 'react';\nimport { usePopoverContext } from '@chakra-ui/react/popover';\nimport { useHoverCardContext } from '@chakra-ui/react/hover-card';\nimport { Spacer } from '@chakra-ui/react/spacer';\nimport { Button } from 'components/Button/button.component';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { popoverRecipe } from '../../popover.recipe';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { PopoverTriggerType } from '../../popover.types';\n\nexport interface PopoverFooterProps extends FlexProps {\n /** Content to be rendered in the footer. */\n children?: ReactNode;\n /** If true, the footer will be disabled. */\n disabled?: boolean;\n /** If true, the buttons will not be displayed.\n * @default false\n */\n hideButtons?: boolean;\n /** If true, the cancel button will not be displayed.\n * @default false\n */\n hideCancelButton?: boolean;\n /** If true, the submit button will be displayed as a destructive button.\n * @default false\n */\n destructive?: boolean;\n /** If true, the submit button will be displayed with a loading state. */\n loading?: boolean;\n /** Callback function to be called when the cancel button is clicked. */\n onCancel?: () => void;\n /** If true, the buttons will render with a contrasting variant.\n * @default true\n */\n onContrast?: boolean;\n /** Callback function to be called when the submit button is clicked. */\n onSubmit?: () => void;\n /** Text to display in the submit button. */\n submitText?: string;\n /** Data test id for the footer.\n * @default kibble-popover-footer\n */\n 'data-testid'?: string;\n}\n\ninterface InternalPopoverFooterProps extends PopoverFooterProps {\n /** Trigger type of the popover.\n * @internal\n */\n trigger: PopoverTriggerType;\n}\n\nexport const PopoverFooter = ({\n children,\n disabled,\n hideButtons = false,\n hideCancelButton = false,\n destructive,\n loading,\n onCancel,\n onContrast = true,\n onSubmit,\n submitText = 'Submit',\n trigger,\n ['data-testid']: dataTestId = 'kibble-popover-footer',\n ...rest\n}: InternalPopoverFooterProps): React.JSX.Element => {\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe();\n const { setOpen } =\n // eslint-disable-next-line react-hooks/rules-of-hooks\n trigger === 'hover' ? useHoverCardContext() : usePopoverContext();\n\n const handleCancel = (): void => {\n if (onCancel) {\n onCancel();\n }\n setOpen(false);\n };\n\n return (\n <Flex className=\"Popover__Footer\" data-testid={dataTestId} css={styles.footer} {...rest}>\n {children}\n {!hideButtons && (\n <Flex w=\"100%\">\n {!hideCancelButton && (\n <Button variant=\"tertiary\" onContrast={onContrast} size=\"sm\" onClick={handleCancel}>\n Cancel\n </Button>\n )}\n <Spacer />\n <Button\n onClick={onSubmit}\n loading={loading}\n disabled={disabled}\n size=\"sm\"\n onContrast={onContrast}\n variant={destructive ? 'primaryDestructive' : 'primary'}\n >\n {submitText}\n </Button>\n </Flex>\n )}\n </Flex>\n );\n};\n","import React, { useRef } from 'react';\nimport { Popover as CPopover } from '@chakra-ui/react/popover';\nimport { HoverCard } from '@chakra-ui/react/hover-card';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Placement } from 'shared/types/placement';\nimport { Text } from 'components/Text/text.component';\nimport { PopoverSize, PopoverTriggerType, PopoverVariant } from './popover.types';\nimport { PopoverHeader, PopoverHeaderProps } from './components/PopoverHeader/popoverHeader.component';\nimport { PopoverFooter, PopoverFooterProps } from './components/PopoverFooter/popoverFooter.component';\nimport { Box } from '@chakra-ui/react/box';\nimport { ConditionalValue, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { popoverRecipe } from './popover.recipe';\nimport { PortalContext } from 'hooks/usePortalContentRef';\nimport { useDeviceType } from 'hooks/useDeviceType';\n\nexport interface KPopoverProps {\n /** The element that triggers the popover. */\n anchor: React.ReactNode;\n /** Props to customize the content of the popover. */\n contentProps?: CPopover.ContentProps;\n /**\n * If true, the popover will be disabled.\n * @default false\n */\n disabled?: boolean;\n /** Props to configure the footer of the popover. */\n footerProps?: PopoverFooterProps;\n /** Props to configure the header of the popover. */\n headerProps?: PopoverHeaderProps;\n /** Configuration for the positioner of the popover. */\n positionerProps?: CPopover.PositionerProps;\n /**\n * If true, the popover will be rendered in a portal.\n * @default true\n */\n portalled?: boolean;\n /**\n * Sets the placement of the popover in relation to the designated element. If the chosen placement puts the tooltip out-of-bounds of the viewport, the placement will automatically adjust. You should, however, choose a placement that works best with orientation of the element.\n * @default bottom\n */\n placement?: Placement;\n /** Whether to show the arrow of the popover. */\n showArrow?: boolean;\n /**\n * The size of the popover.\n * @default md\n */\n size?: ConditionalValue<PopoverSize>;\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: PopoverTriggerType;\n /**\n * The color variant of the popover.\n * @default contrast\n */\n variant?: PopoverVariant;\n /** Data test id for the popover.\n * @default kibble-popover\n */\n 'data-testid'?: string;\n}\n\ninterface ClickPopoverProps extends CPopover.RootProps {\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: 'click';\n}\n\ninterface HoverPopoverProps extends HoverCard.RootProps {\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: 'hover';\n}\n\nexport type PopoverProps = KPopoverProps & (Omit<ClickPopoverProps, 'size'> | Omit<HoverPopoverProps, 'size'>);\n\nexport const Popover = ({\n anchor,\n children,\n contentProps,\n footerProps,\n headerProps,\n disabled = false,\n portalled = true,\n placement = 'bottom',\n positioning,\n showArrow = true,\n size = 'sm',\n trigger = 'click',\n variant = 'contrast',\n positionerProps,\n ['data-testid']: dataTestId = 'kibble-popover',\n ...rest\n}: PopoverProps): React.ReactNode => {\n const contentRef = useRef<HTMLDivElement>(null!);\n const contextValue = { contentRef };\n const deviceType = useDeviceType();\n // Forces click trigger on mobile devices for better UX\n const effectiveTrigger = deviceType === 'mobile' ? 'click' : trigger;\n const Element = effectiveTrigger === 'hover' ? HoverCard : CPopover;\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe({ variant, size });\n\n if (disabled) return anchor;\n\n const onContrast = variant === 'contrast' || variant === 'contrastDestructive';\n\n return (\n <Element.Root\n closeOnEscape={true}\n closeOnInteractOutside={true}\n positioning={{\n ...positioning,\n placement: positioning?.placement || placement,\n }}\n {...rest}\n >\n <Element.Trigger\n asChild\n className=\"Popover__Trigger\"\n data-testid={`${dataTestId}-trigger`}\n cursor={effectiveTrigger === 'click' ? 'pointer' : 'default'}\n >\n {anchor}\n </Element.Trigger>\n <Portal disabled={!portalled}>\n <Element.Positioner className=\"Popover\" data-testid={dataTestId} {...positionerProps}>\n <PortalContext.Provider value={contextValue}>\n <Element.Content\n className=\"Popover__Content\"\n data-testid={`${dataTestId}-content`}\n ref={contentRef}\n {...contentProps}\n css={styles.content}\n >\n {showArrow && (\n <Element.Arrow className=\"Popover__Arrow\" data-testid={`${dataTestId}-arrow`} css={styles.arrow}>\n <Element.ArrowTip css={styles.arrowTip} />\n </Element.Arrow>\n )}\n {headerProps && <PopoverHeader trigger={effectiveTrigger} onContrast={onContrast} {...headerProps} />}\n <Box\n className=\"Popover__Body\"\n data-testid={`${dataTestId}-body`}\n css={styles.body}\n {...(!!headerProps && { pt: 0 })}\n >\n {typeof children === 'string' ? (\n <Text variant={onContrast ? 'onContrast' : 'default'} size=\"sm\">\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n {footerProps && (\n <PopoverFooter\n trigger={effectiveTrigger}\n destructive={variant === 'contrastDestructive' || variant === 'defaultDestructive'}\n onContrast={onContrast}\n {...footerProps}\n />\n )}\n </Element.Content>\n </PortalContext.Provider>\n </Element.Positioner>\n </Portal>\n </Element.Root>\n );\n};\n"],"names":["Spacer","chakra","PopoverHeader","children","color","hideCloseButton","onContrast","onClose","size","trigger","dataTestId","rest","styles","useSlotRecipe","popoverRecipe","setOpen","useHoverCardContext","usePopoverContext","jsxs","Flex","jsx","Heading","Button","PopoverFooter","disabled","hideButtons","hideCancelButton","destructive","loading","onCancel","onSubmit","submitText","handleCancel","Popover","anchor","contentProps","footerProps","headerProps","portalled","placement","positioning","showArrow","variant","positionerProps","contentRef","useRef","contextValue","effectiveTrigger","useDeviceType","Element","HoverCard","CPopover","Portal","PortalContext","Box","Text"],"mappings":"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","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"popover.component-65oNmbmB.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/spacer/spacer.js","../../src/components/Popover/components/PopoverHeader/popoverHeader.component.tsx","../../src/components/Popover/components/PopoverFooter/popoverFooter.component.tsx","../../src/components/Popover/popover.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { chakra } from '../../styled-system/factory.js';\n\nconst Spacer = chakra(\"div\", {\n base: {\n flex: 1,\n justifySelf: \"stretch\",\n alignSelf: \"stretch\"\n }\n});\nSpacer.displayName = \"Spacer\";\n\nexport { Spacer };\n","import React, { ReactNode } from 'react';\nimport { usePopoverContext } from '@chakra-ui/react/popover';\nimport { useHoverCardContext } from '@chakra-ui/react/hover-card';\nimport { Heading, HeadingSize } from 'components/Heading';\nimport { Button } from 'components/Button/button.component';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { popoverRecipe } from '../../popover.recipe';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { PopoverTriggerType } from '../../popover.types';\n\nexport interface PopoverHeaderProps extends FlexProps {\n /** Content to be rendered in the header. */\n children?: ReactNode;\n /** If true, the close button will not be displayed.\n * @default false\n */\n hideCloseButton?: boolean;\n /** Callback function to be called when the close button is clicked. */\n onClose?: () => void;\n /** If true, the header will render in a contrasting color.\n * @default true\n */\n onContrast?: boolean;\n /** Size of the header.\n * @default sm\n */\n size?: HeadingSize;\n /** Data test id for the header.\n * @default kibble-popover-header\n */\n 'data-testid'?: string;\n}\n\ninterface InternalPopoverHeaderProps extends PopoverHeaderProps {\n /** Trigger type of the popover.\n * @internal\n */\n trigger: PopoverTriggerType;\n}\n\nexport const PopoverHeader = ({\n children,\n color,\n hideCloseButton = false,\n onContrast = true,\n onClose,\n size = 'sm',\n trigger,\n ['data-testid']: dataTestId = 'kibble-popover-header',\n ...rest\n}: InternalPopoverHeaderProps): React.JSX.Element => {\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe();\n const { setOpen } =\n // eslint-disable-next-line react-hooks/rules-of-hooks\n trigger === 'hover' ? useHoverCardContext() : usePopoverContext();\n\n return (\n <Flex className=\"Popover__HeaderWrapper\" data-testid={`${dataTestId}-wrapper`} css={styles.header} {...rest}>\n {typeof children === 'string' ? (\n <Heading\n className=\"Popover__Header\"\n data-testid={`${dataTestId}-header`}\n size={size}\n color={color || 'inherit'}\n w=\"100%\"\n >\n {children}\n </Heading>\n ) : (\n children\n )}\n {!hideCloseButton && trigger === 'click' && (\n <Button\n className=\"Popover__CloseButton\"\n data-testid={`${dataTestId}-close-button`}\n variant=\"ghostNeutral\"\n onContrast={onContrast}\n onClick={onClose ? onClose : (): void => setOpen(false)}\n iconName=\"close\"\n position=\"absolute\"\n right={1}\n top={1}\n size=\"xs\"\n />\n )}\n </Flex>\n );\n};\n","import React, { ReactNode } from 'react';\nimport { usePopoverContext } from '@chakra-ui/react/popover';\nimport { useHoverCardContext } from '@chakra-ui/react/hover-card';\nimport { Spacer } from '@chakra-ui/react/spacer';\nimport { Button } from 'components/Button/button.component';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { popoverRecipe } from '../../popover.recipe';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { PopoverTriggerType } from '../../popover.types';\n\nexport interface PopoverFooterProps extends FlexProps {\n /** Content to be rendered in the footer. */\n children?: ReactNode;\n /** If true, the footer will be disabled. */\n disabled?: boolean;\n /** If true, the buttons will not be displayed.\n * @default false\n */\n hideButtons?: boolean;\n /** If true, the cancel button will not be displayed.\n * @default false\n */\n hideCancelButton?: boolean;\n /** If true, the submit button will be displayed as a destructive button.\n * @default false\n */\n destructive?: boolean;\n /** If true, the submit button will be displayed with a loading state. */\n loading?: boolean;\n /** Callback function to be called when the cancel button is clicked. */\n onCancel?: () => void;\n /** If true, the buttons will render with a contrasting variant.\n * @default true\n */\n onContrast?: boolean;\n /** Callback function to be called when the submit button is clicked. */\n onSubmit?: () => void;\n /** Text to display in the submit button. */\n submitText?: string;\n /** Data test id for the footer.\n * @default kibble-popover-footer\n */\n 'data-testid'?: string;\n}\n\ninterface InternalPopoverFooterProps extends PopoverFooterProps {\n /** Trigger type of the popover.\n * @internal\n */\n trigger: PopoverTriggerType;\n}\n\nexport const PopoverFooter = ({\n children,\n disabled,\n hideButtons = false,\n hideCancelButton = false,\n destructive,\n loading,\n onCancel,\n onContrast = true,\n onSubmit,\n submitText = 'Submit',\n trigger,\n ['data-testid']: dataTestId = 'kibble-popover-footer',\n ...rest\n}: InternalPopoverFooterProps): React.JSX.Element => {\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe();\n const { setOpen } =\n // eslint-disable-next-line react-hooks/rules-of-hooks\n trigger === 'hover' ? useHoverCardContext() : usePopoverContext();\n\n const handleCancel = (): void => {\n if (onCancel) {\n onCancel();\n }\n setOpen(false);\n };\n\n return (\n <Flex className=\"Popover__Footer\" data-testid={dataTestId} css={styles.footer} {...rest}>\n {children}\n {!hideButtons && (\n <Flex w=\"100%\">\n {!hideCancelButton && (\n <Button variant=\"tertiary\" onContrast={onContrast} size=\"sm\" onClick={handleCancel}>\n Cancel\n </Button>\n )}\n <Spacer />\n <Button\n onClick={onSubmit}\n loading={loading}\n disabled={disabled}\n size=\"sm\"\n onContrast={onContrast}\n variant={destructive ? 'primaryDestructive' : 'primary'}\n >\n {submitText}\n </Button>\n </Flex>\n )}\n </Flex>\n );\n};\n","import React, { useRef } from 'react';\nimport { Popover as CPopover } from '@chakra-ui/react/popover';\nimport { HoverCard } from '@chakra-ui/react/hover-card';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Placement } from 'shared/types/placement';\nimport { Text } from 'components/Text/text.component';\nimport { PopoverSize, PopoverTriggerType, PopoverVariant } from './popover.types';\nimport { PopoverHeader, PopoverHeaderProps } from './components/PopoverHeader/popoverHeader.component';\nimport { PopoverFooter, PopoverFooterProps } from './components/PopoverFooter/popoverFooter.component';\nimport { Box } from '@chakra-ui/react/box';\nimport { ConditionalValue, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { popoverRecipe } from './popover.recipe';\nimport { PortalContext } from 'hooks/usePortalContentRef';\nimport { useDeviceType } from 'hooks/useDeviceType';\n\nexport interface KPopoverProps {\n /** The element that triggers the popover. */\n anchor: React.ReactNode;\n /** Props to customize the content of the popover. */\n contentProps?: CPopover.ContentProps;\n /**\n * If true, the popover will be disabled.\n * @default false\n */\n disabled?: boolean;\n /** Props to configure the footer of the popover. */\n footerProps?: PopoverFooterProps;\n /** Props to configure the header of the popover. */\n headerProps?: PopoverHeaderProps;\n /** Configuration for the positioner of the popover. */\n positionerProps?: CPopover.PositionerProps;\n /**\n * If true, the popover will be rendered in a portal.\n * @default true\n */\n portalled?: boolean;\n /**\n * Sets the placement of the popover in relation to the designated element. If the chosen placement puts the tooltip out-of-bounds of the viewport, the placement will automatically adjust. You should, however, choose a placement that works best with orientation of the element.\n * @default bottom\n */\n placement?: Placement;\n /** Whether to show the arrow of the popover. */\n showArrow?: boolean;\n /**\n * The size of the popover.\n * @default md\n */\n size?: ConditionalValue<PopoverSize>;\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: PopoverTriggerType;\n /**\n * The color variant of the popover.\n * @default contrast\n */\n variant?: PopoverVariant;\n /** Data test id for the popover.\n * @default kibble-popover\n */\n 'data-testid'?: string;\n}\n\ninterface ClickPopoverProps extends CPopover.RootProps {\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: 'click';\n}\n\ninterface HoverPopoverProps extends HoverCard.RootProps {\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: 'hover';\n}\n\nexport type PopoverProps = KPopoverProps & (Omit<ClickPopoverProps, 'size'> | Omit<HoverPopoverProps, 'size'>);\n\nexport const Popover = ({\n anchor,\n children,\n contentProps,\n footerProps,\n headerProps,\n disabled = false,\n portalled = true,\n placement = 'bottom',\n positioning,\n showArrow = true,\n size = 'sm',\n trigger = 'click',\n variant = 'contrast',\n positionerProps,\n ['data-testid']: dataTestId = 'kibble-popover',\n ...rest\n}: PopoverProps): React.ReactNode => {\n const contentRef = useRef<HTMLDivElement>(null!);\n const contextValue = { contentRef };\n const deviceType = useDeviceType();\n // Forces click trigger on mobile devices for better UX\n const effectiveTrigger = deviceType === 'mobile' ? 'click' : trigger;\n const Element = effectiveTrigger === 'hover' ? HoverCard : CPopover;\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe({ variant, size });\n\n if (disabled) return anchor;\n\n const onContrast = variant === 'contrast' || variant === 'contrastDestructive';\n\n return (\n <Element.Root\n closeOnEscape={true}\n closeOnInteractOutside={true}\n positioning={{\n ...positioning,\n placement: positioning?.placement || placement,\n }}\n {...rest}\n >\n <Element.Trigger\n asChild\n className=\"Popover__Trigger\"\n data-testid={`${dataTestId}-trigger`}\n cursor={effectiveTrigger === 'click' ? 'pointer' : 'default'}\n >\n {anchor}\n </Element.Trigger>\n <Portal disabled={!portalled}>\n <Element.Positioner className=\"Popover\" data-testid={dataTestId} {...positionerProps}>\n <PortalContext.Provider value={contextValue}>\n <Element.Content\n className=\"Popover__Content\"\n data-testid={`${dataTestId}-content`}\n ref={contentRef}\n {...contentProps}\n css={styles.content}\n >\n {showArrow && (\n <Element.Arrow className=\"Popover__Arrow\" data-testid={`${dataTestId}-arrow`} css={styles.arrow}>\n <Element.ArrowTip css={styles.arrowTip} />\n </Element.Arrow>\n )}\n {headerProps && <PopoverHeader trigger={effectiveTrigger} onContrast={onContrast} {...headerProps} />}\n <Box\n className=\"Popover__Body\"\n data-testid={`${dataTestId}-body`}\n css={styles.body}\n {...(!!headerProps && { pt: 0 })}\n >\n {typeof children === 'string' ? (\n <Text variant={onContrast ? 'onContrast' : 'default'} size=\"sm\">\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n {footerProps && (\n <PopoverFooter\n trigger={effectiveTrigger}\n destructive={variant === 'contrastDestructive' || variant === 'defaultDestructive'}\n onContrast={onContrast}\n {...footerProps}\n />\n )}\n </Element.Content>\n </PortalContext.Provider>\n </Element.Positioner>\n </Portal>\n </Element.Root>\n );\n};\n"],"names":["Spacer","chakra","PopoverHeader","children","color","hideCloseButton","onContrast","onClose","size","trigger","dataTestId","rest","styles","useSlotRecipe","popoverRecipe","setOpen","useHoverCardContext","usePopoverContext","jsxs","Flex","jsx","Heading","Button","PopoverFooter","disabled","hideButtons","hideCancelButton","destructive","loading","onCancel","onSubmit","submitText","handleCancel","Popover","anchor","contentProps","footerProps","headerProps","portalled","placement","positioning","showArrow","variant","positionerProps","contentRef","useRef","contextValue","effectiveTrigger","useDeviceType","Element","HoverCard","CPopover","Portal","PortalContext","Box","Text"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const e=require("./jsx-runtime-BjDatQAs.js"),S=require("react"),o=require("./popover-C7aj8Iwj.js"),r=require("./tooltip.component-DBw-hAPU.js"),A=require("./text.component-
|
|
2
|
-
//# sourceMappingURL=popover.component-
|
|
1
|
+
"use strict";const e=require("./jsx-runtime-BjDatQAs.js"),S=require("react"),o=require("./popover-C7aj8Iwj.js"),r=require("./tooltip.component-DBw-hAPU.js"),A=require("./text.component-D5GpbfNx.js"),k=require("./heading.component-DeM4h5rY.js"),y=require("./button.component-DjdgBXDC.js"),b=require("./popover.recipe-CtptsJg6.js"),E=require("./create-slot-recipe-context-HXE1VazG.js"),T=require("./popover-root-provider-CZDbUJ2K.js"),h=require("./flex-BOU6tYUd.js"),N=require("./factory-a2SJjEvR.js"),O=require("./index-BQRnVsAg.js"),B=require("./usePortalContentRef-CTrvBQ7I.js"),D=require("../cjs/hooks/useDeviceType/index.cjs"),$=require("./index-Ts8g8jZd.js"),F=Object.freeze(Object.defineProperty({__proto__:null,Arrow:r.HoverCardArrow,ArrowTip:r.HoverCardArrowTip,Content:r.HoverCardContent,Context:r.HoverCardContext,Positioner:r.HoverCardPositioner,PropsProvider:r.HoverCardPropsProvider,Root:r.HoverCardRoot,RootProvider:r.HoverCardRootProvider,Trigger:r.HoverCardTrigger},Symbol.toStringTag,{value:"Module"})),z=Object.freeze(Object.defineProperty({__proto__:null,Anchor:o.PopoverAnchor,Arrow:o.PopoverArrow,ArrowTip:o.PopoverArrowTip,Body:o.PopoverBody,CloseTrigger:o.PopoverCloseTrigger,Content:o.PopoverContent,Context:o.PopoverContext,Description:o.PopoverDescription,Footer:o.PopoverFooter,Header:o.PopoverHeader,Positioner:o.PopoverPositioner,PropsProvider:o.PopoverPropsProvider,Root:o.PopoverRoot,RootProvider:o.PopoverRootProvider,Title:o.PopoverTitle,Trigger:o.PopoverTrigger,usePopoverStyles:o.usePopoverStyles},Symbol.toStringTag,{value:"Module"})),w=N.chakra("div",{base:{flex:1,justifySelf:"stretch",alignSelf:"stretch"}});w.displayName="Spacer";const W=({children:t,color:n,hideCloseButton:v=!1,onContrast:l=!0,onClose:s,size:d="sm",trigger:c,["data-testid"]:i="kibble-popover-header",...u})=>{const P=E.useSlotRecipe({recipe:b.popoverRecipe})(),{setOpen:m}=c==="hover"?r.useHoverCardContext():T.usePopoverContext();return e.jsxRuntimeExports.jsxs(h.Flex,{className:"Popover__HeaderWrapper","data-testid":`${i}-wrapper`,css:P.header,...u,children:[typeof t=="string"?e.jsxRuntimeExports.jsx(k.WrappedHeading,{className:"Popover__Header","data-testid":`${i}-header`,size:d,color:n||"inherit",w:"100%",children:t}):t,!v&&c==="click"&&e.jsxRuntimeExports.jsx(y.Button,{className:"Popover__CloseButton","data-testid":`${i}-close-button`,variant:"ghostNeutral",onContrast:l,onClick:s||(()=>m(!1)),iconName:"close",position:"absolute",right:1,top:1,size:"xs"})]})},M=({children:t,disabled:n,hideButtons:v=!1,hideCancelButton:l=!1,destructive:s,loading:d,onCancel:c,onContrast:i=!0,onSubmit:u,submitText:j="Submit",trigger:P,["data-testid"]:m="kibble-popover-footer",...p})=>{const a=E.useSlotRecipe({recipe:b.popoverRecipe})(),{setOpen:_}=P==="hover"?r.useHoverCardContext():T.usePopoverContext(),R=()=>{c&&c(),_(!1)};return e.jsxRuntimeExports.jsxs(h.Flex,{className:"Popover__Footer","data-testid":m,css:a.footer,...p,children:[t,!v&&e.jsxRuntimeExports.jsxs(h.Flex,{w:"100%",children:[!l&&e.jsxRuntimeExports.jsx(y.Button,{variant:"tertiary",onContrast:i,size:"sm",onClick:R,children:"Cancel"}),e.jsxRuntimeExports.jsx(w,{}),e.jsxRuntimeExports.jsx(y.Button,{onClick:u,loading:d,disabled:n,size:"sm",onContrast:i,variant:s?"primaryDestructive":"primary",children:j})]})]})},V=({anchor:t,children:n,contentProps:v,footerProps:l,headerProps:s,disabled:d=!1,portalled:c=!0,placement:i="bottom",positioning:u,showArrow:j=!0,size:P="sm",trigger:m="click",variant:p="contrast",positionerProps:H,["data-testid"]:a="kibble-popover",..._})=>{const R=S.useRef(null),q={contentRef:R},C=D.useDeviceType()==="mobile"?"click":m,x=C==="hover"?F:z,g=E.useSlotRecipe({recipe:b.popoverRecipe})({variant:p,size:P});if(d)return t;const f=p==="contrast"||p==="contrastDestructive";return e.jsxRuntimeExports.jsxs(x.Root,{closeOnEscape:!0,closeOnInteractOutside:!0,positioning:{...u,placement:u?.placement||i},..._,children:[e.jsxRuntimeExports.jsx(x.Trigger,{asChild:!0,className:"Popover__Trigger","data-testid":`${a}-trigger`,cursor:C==="click"?"pointer":"default",children:t}),e.jsxRuntimeExports.jsx($.Portal,{disabled:!c,children:e.jsxRuntimeExports.jsx(x.Positioner,{className:"Popover","data-testid":a,...H,children:e.jsxRuntimeExports.jsx(B.PortalContext.Provider,{value:q,children:e.jsxRuntimeExports.jsxs(x.Content,{className:"Popover__Content","data-testid":`${a}-content`,ref:R,...v,css:g.content,children:[j&&e.jsxRuntimeExports.jsx(x.Arrow,{className:"Popover__Arrow","data-testid":`${a}-arrow`,css:g.arrow,children:e.jsxRuntimeExports.jsx(x.ArrowTip,{css:g.arrowTip})}),s&&e.jsxRuntimeExports.jsx(W,{trigger:C,onContrast:f,...s}),e.jsxRuntimeExports.jsx(O.Box,{className:"Popover__Body","data-testid":`${a}-body`,css:g.body,...!!s&&{pt:0},children:typeof n=="string"?e.jsxRuntimeExports.jsx(A.WrappedText,{variant:f?"onContrast":"default",size:"sm",children:n}):n}),l&&e.jsxRuntimeExports.jsx(M,{trigger:C,destructive:p==="contrastDestructive"||p==="defaultDestructive",onContrast:f,...l})]})})})})]})};exports.Popover=V;
|
|
2
|
+
//# sourceMappingURL=popover.component-Cw6-018C.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover.component-DTjA1GSd.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/spacer/spacer.js","../../src/components/Popover/components/PopoverHeader/popoverHeader.component.tsx","../../src/components/Popover/components/PopoverFooter/popoverFooter.component.tsx","../../src/components/Popover/popover.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { chakra } from '../../styled-system/factory.js';\n\nconst Spacer = chakra(\"div\", {\n base: {\n flex: 1,\n justifySelf: \"stretch\",\n alignSelf: \"stretch\"\n }\n});\nSpacer.displayName = \"Spacer\";\n\nexport { Spacer };\n","import React, { ReactNode } from 'react';\nimport { usePopoverContext } from '@chakra-ui/react/popover';\nimport { useHoverCardContext } from '@chakra-ui/react/hover-card';\nimport { Heading, HeadingSize } from 'components/Heading';\nimport { Button } from 'components/Button/button.component';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { popoverRecipe } from '../../popover.recipe';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { PopoverTriggerType } from '../../popover.types';\n\nexport interface PopoverHeaderProps extends FlexProps {\n /** Content to be rendered in the header. */\n children?: ReactNode;\n /** If true, the close button will not be displayed.\n * @default false\n */\n hideCloseButton?: boolean;\n /** Callback function to be called when the close button is clicked. */\n onClose?: () => void;\n /** If true, the header will render in a contrasting color.\n * @default true\n */\n onContrast?: boolean;\n /** Size of the header.\n * @default sm\n */\n size?: HeadingSize;\n /** Data test id for the header.\n * @default kibble-popover-header\n */\n 'data-testid'?: string;\n}\n\ninterface InternalPopoverHeaderProps extends PopoverHeaderProps {\n /** Trigger type of the popover.\n * @internal\n */\n trigger: PopoverTriggerType;\n}\n\nexport const PopoverHeader = ({\n children,\n color,\n hideCloseButton = false,\n onContrast = true,\n onClose,\n size = 'sm',\n trigger,\n ['data-testid']: dataTestId = 'kibble-popover-header',\n ...rest\n}: InternalPopoverHeaderProps): React.JSX.Element => {\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe();\n const { setOpen } =\n // eslint-disable-next-line react-hooks/rules-of-hooks\n trigger === 'hover' ? useHoverCardContext() : usePopoverContext();\n\n return (\n <Flex className=\"Popover__HeaderWrapper\" data-testid={`${dataTestId}-wrapper`} css={styles.header} {...rest}>\n {typeof children === 'string' ? (\n <Heading\n className=\"Popover__Header\"\n data-testid={`${dataTestId}-header`}\n size={size}\n color={color || 'inherit'}\n w=\"100%\"\n >\n {children}\n </Heading>\n ) : (\n children\n )}\n {!hideCloseButton && trigger === 'click' && (\n <Button\n className=\"Popover__CloseButton\"\n data-testid={`${dataTestId}-close-button`}\n variant=\"ghostNeutral\"\n onContrast={onContrast}\n onClick={onClose ? onClose : (): void => setOpen(false)}\n iconName=\"close\"\n position=\"absolute\"\n right={1}\n top={1}\n size=\"xs\"\n />\n )}\n </Flex>\n );\n};\n","import React, { ReactNode } from 'react';\nimport { usePopoverContext } from '@chakra-ui/react/popover';\nimport { useHoverCardContext } from '@chakra-ui/react/hover-card';\nimport { Spacer } from '@chakra-ui/react/spacer';\nimport { Button } from 'components/Button/button.component';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { popoverRecipe } from '../../popover.recipe';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { PopoverTriggerType } from '../../popover.types';\n\nexport interface PopoverFooterProps extends FlexProps {\n /** Content to be rendered in the footer. */\n children?: ReactNode;\n /** If true, the footer will be disabled. */\n disabled?: boolean;\n /** If true, the buttons will not be displayed.\n * @default false\n */\n hideButtons?: boolean;\n /** If true, the cancel button will not be displayed.\n * @default false\n */\n hideCancelButton?: boolean;\n /** If true, the submit button will be displayed as a destructive button.\n * @default false\n */\n destructive?: boolean;\n /** If true, the submit button will be displayed with a loading state. */\n loading?: boolean;\n /** Callback function to be called when the cancel button is clicked. */\n onCancel?: () => void;\n /** If true, the buttons will render with a contrasting variant.\n * @default true\n */\n onContrast?: boolean;\n /** Callback function to be called when the submit button is clicked. */\n onSubmit?: () => void;\n /** Text to display in the submit button. */\n submitText?: string;\n /** Data test id for the footer.\n * @default kibble-popover-footer\n */\n 'data-testid'?: string;\n}\n\ninterface InternalPopoverFooterProps extends PopoverFooterProps {\n /** Trigger type of the popover.\n * @internal\n */\n trigger: PopoverTriggerType;\n}\n\nexport const PopoverFooter = ({\n children,\n disabled,\n hideButtons = false,\n hideCancelButton = false,\n destructive,\n loading,\n onCancel,\n onContrast = true,\n onSubmit,\n submitText = 'Submit',\n trigger,\n ['data-testid']: dataTestId = 'kibble-popover-footer',\n ...rest\n}: InternalPopoverFooterProps): React.JSX.Element => {\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe();\n const { setOpen } =\n // eslint-disable-next-line react-hooks/rules-of-hooks\n trigger === 'hover' ? useHoverCardContext() : usePopoverContext();\n\n const handleCancel = (): void => {\n if (onCancel) {\n onCancel();\n }\n setOpen(false);\n };\n\n return (\n <Flex className=\"Popover__Footer\" data-testid={dataTestId} css={styles.footer} {...rest}>\n {children}\n {!hideButtons && (\n <Flex w=\"100%\">\n {!hideCancelButton && (\n <Button variant=\"tertiary\" onContrast={onContrast} size=\"sm\" onClick={handleCancel}>\n Cancel\n </Button>\n )}\n <Spacer />\n <Button\n onClick={onSubmit}\n loading={loading}\n disabled={disabled}\n size=\"sm\"\n onContrast={onContrast}\n variant={destructive ? 'primaryDestructive' : 'primary'}\n >\n {submitText}\n </Button>\n </Flex>\n )}\n </Flex>\n );\n};\n","import React, { useRef } from 'react';\nimport { Popover as CPopover } from '@chakra-ui/react/popover';\nimport { HoverCard } from '@chakra-ui/react/hover-card';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Placement } from 'shared/types/placement';\nimport { Text } from 'components/Text/text.component';\nimport { PopoverSize, PopoverTriggerType, PopoverVariant } from './popover.types';\nimport { PopoverHeader, PopoverHeaderProps } from './components/PopoverHeader/popoverHeader.component';\nimport { PopoverFooter, PopoverFooterProps } from './components/PopoverFooter/popoverFooter.component';\nimport { Box } from '@chakra-ui/react/box';\nimport { ConditionalValue, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { popoverRecipe } from './popover.recipe';\nimport { PortalContext } from 'hooks/usePortalContentRef';\nimport { useDeviceType } from 'hooks/useDeviceType';\n\nexport interface KPopoverProps {\n /** The element that triggers the popover. */\n anchor: React.ReactNode;\n /** Props to customize the content of the popover. */\n contentProps?: CPopover.ContentProps;\n /**\n * If true, the popover will be disabled.\n * @default false\n */\n disabled?: boolean;\n /** Props to configure the footer of the popover. */\n footerProps?: PopoverFooterProps;\n /** Props to configure the header of the popover. */\n headerProps?: PopoverHeaderProps;\n /** Configuration for the positioner of the popover. */\n positionerProps?: CPopover.PositionerProps;\n /**\n * If true, the popover will be rendered in a portal.\n * @default true\n */\n portalled?: boolean;\n /**\n * Sets the placement of the popover in relation to the designated element. If the chosen placement puts the tooltip out-of-bounds of the viewport, the placement will automatically adjust. You should, however, choose a placement that works best with orientation of the element.\n * @default bottom\n */\n placement?: Placement;\n /** Whether to show the arrow of the popover. */\n showArrow?: boolean;\n /**\n * The size of the popover.\n * @default md\n */\n size?: ConditionalValue<PopoverSize>;\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: PopoverTriggerType;\n /**\n * The color variant of the popover.\n * @default contrast\n */\n variant?: PopoverVariant;\n /** Data test id for the popover.\n * @default kibble-popover\n */\n 'data-testid'?: string;\n}\n\ninterface ClickPopoverProps extends CPopover.RootProps {\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: 'click';\n}\n\ninterface HoverPopoverProps extends HoverCard.RootProps {\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: 'hover';\n}\n\nexport type PopoverProps = KPopoverProps & (Omit<ClickPopoverProps, 'size'> | Omit<HoverPopoverProps, 'size'>);\n\nexport const Popover = ({\n anchor,\n children,\n contentProps,\n footerProps,\n headerProps,\n disabled = false,\n portalled = true,\n placement = 'bottom',\n positioning,\n showArrow = true,\n size = 'sm',\n trigger = 'click',\n variant = 'contrast',\n positionerProps,\n ['data-testid']: dataTestId = 'kibble-popover',\n ...rest\n}: PopoverProps): React.ReactNode => {\n const contentRef = useRef<HTMLDivElement>(null!);\n const contextValue = { contentRef };\n const deviceType = useDeviceType();\n // Forces click trigger on mobile devices for better UX\n const effectiveTrigger = deviceType === 'mobile' ? 'click' : trigger;\n const Element = effectiveTrigger === 'hover' ? HoverCard : CPopover;\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe({ variant, size });\n\n if (disabled) return anchor;\n\n const onContrast = variant === 'contrast' || variant === 'contrastDestructive';\n\n return (\n <Element.Root\n closeOnEscape={true}\n closeOnInteractOutside={true}\n positioning={{\n ...positioning,\n placement: positioning?.placement || placement,\n }}\n {...rest}\n >\n <Element.Trigger\n asChild\n className=\"Popover__Trigger\"\n data-testid={`${dataTestId}-trigger`}\n cursor={effectiveTrigger === 'click' ? 'pointer' : 'default'}\n >\n {anchor}\n </Element.Trigger>\n <Portal disabled={!portalled}>\n <Element.Positioner className=\"Popover\" data-testid={dataTestId} {...positionerProps}>\n <PortalContext.Provider value={contextValue}>\n <Element.Content\n className=\"Popover__Content\"\n data-testid={`${dataTestId}-content`}\n ref={contentRef}\n {...contentProps}\n css={styles.content}\n >\n {showArrow && (\n <Element.Arrow className=\"Popover__Arrow\" data-testid={`${dataTestId}-arrow`} css={styles.arrow}>\n <Element.ArrowTip css={styles.arrowTip} />\n </Element.Arrow>\n )}\n {headerProps && <PopoverHeader trigger={effectiveTrigger} onContrast={onContrast} {...headerProps} />}\n <Box\n className=\"Popover__Body\"\n data-testid={`${dataTestId}-body`}\n css={styles.body}\n {...(!!headerProps && { pt: 0 })}\n >\n {typeof children === 'string' ? (\n <Text variant={onContrast ? 'onContrast' : 'default'} size=\"sm\">\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n {footerProps && (\n <PopoverFooter\n trigger={effectiveTrigger}\n destructive={variant === 'contrastDestructive' || variant === 'defaultDestructive'}\n onContrast={onContrast}\n {...footerProps}\n />\n )}\n </Element.Content>\n </PortalContext.Provider>\n </Element.Positioner>\n </Portal>\n </Element.Root>\n );\n};\n"],"names":["Spacer","chakra","PopoverHeader","children","color","hideCloseButton","onContrast","onClose","size","trigger","dataTestId","rest","styles","useSlotRecipe","popoverRecipe","setOpen","useHoverCardContext","usePopoverContext","jsxs","Flex","jsx","Heading","Button","PopoverFooter","disabled","hideButtons","hideCancelButton","destructive","loading","onCancel","onSubmit","submitText","handleCancel","Popover","anchor","contentProps","footerProps","headerProps","portalled","placement","positioning","showArrow","variant","positionerProps","contentRef","useRef","contextValue","effectiveTrigger","useDeviceType","Element","HoverCard","CPopover","Portal","PortalContext","Box","Text"],"mappings":"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","x_google_ignoreList":[0]}
|
|
1
|
+
{"version":3,"file":"popover.component-Cw6-018C.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/spacer/spacer.js","../../src/components/Popover/components/PopoverHeader/popoverHeader.component.tsx","../../src/components/Popover/components/PopoverFooter/popoverFooter.component.tsx","../../src/components/Popover/popover.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { chakra } from '../../styled-system/factory.js';\n\nconst Spacer = chakra(\"div\", {\n base: {\n flex: 1,\n justifySelf: \"stretch\",\n alignSelf: \"stretch\"\n }\n});\nSpacer.displayName = \"Spacer\";\n\nexport { Spacer };\n","import React, { ReactNode } from 'react';\nimport { usePopoverContext } from '@chakra-ui/react/popover';\nimport { useHoverCardContext } from '@chakra-ui/react/hover-card';\nimport { Heading, HeadingSize } from 'components/Heading';\nimport { Button } from 'components/Button/button.component';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { popoverRecipe } from '../../popover.recipe';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { PopoverTriggerType } from '../../popover.types';\n\nexport interface PopoverHeaderProps extends FlexProps {\n /** Content to be rendered in the header. */\n children?: ReactNode;\n /** If true, the close button will not be displayed.\n * @default false\n */\n hideCloseButton?: boolean;\n /** Callback function to be called when the close button is clicked. */\n onClose?: () => void;\n /** If true, the header will render in a contrasting color.\n * @default true\n */\n onContrast?: boolean;\n /** Size of the header.\n * @default sm\n */\n size?: HeadingSize;\n /** Data test id for the header.\n * @default kibble-popover-header\n */\n 'data-testid'?: string;\n}\n\ninterface InternalPopoverHeaderProps extends PopoverHeaderProps {\n /** Trigger type of the popover.\n * @internal\n */\n trigger: PopoverTriggerType;\n}\n\nexport const PopoverHeader = ({\n children,\n color,\n hideCloseButton = false,\n onContrast = true,\n onClose,\n size = 'sm',\n trigger,\n ['data-testid']: dataTestId = 'kibble-popover-header',\n ...rest\n}: InternalPopoverHeaderProps): React.JSX.Element => {\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe();\n const { setOpen } =\n // eslint-disable-next-line react-hooks/rules-of-hooks\n trigger === 'hover' ? useHoverCardContext() : usePopoverContext();\n\n return (\n <Flex className=\"Popover__HeaderWrapper\" data-testid={`${dataTestId}-wrapper`} css={styles.header} {...rest}>\n {typeof children === 'string' ? (\n <Heading\n className=\"Popover__Header\"\n data-testid={`${dataTestId}-header`}\n size={size}\n color={color || 'inherit'}\n w=\"100%\"\n >\n {children}\n </Heading>\n ) : (\n children\n )}\n {!hideCloseButton && trigger === 'click' && (\n <Button\n className=\"Popover__CloseButton\"\n data-testid={`${dataTestId}-close-button`}\n variant=\"ghostNeutral\"\n onContrast={onContrast}\n onClick={onClose ? onClose : (): void => setOpen(false)}\n iconName=\"close\"\n position=\"absolute\"\n right={1}\n top={1}\n size=\"xs\"\n />\n )}\n </Flex>\n );\n};\n","import React, { ReactNode } from 'react';\nimport { usePopoverContext } from '@chakra-ui/react/popover';\nimport { useHoverCardContext } from '@chakra-ui/react/hover-card';\nimport { Spacer } from '@chakra-ui/react/spacer';\nimport { Button } from 'components/Button/button.component';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { popoverRecipe } from '../../popover.recipe';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { PopoverTriggerType } from '../../popover.types';\n\nexport interface PopoverFooterProps extends FlexProps {\n /** Content to be rendered in the footer. */\n children?: ReactNode;\n /** If true, the footer will be disabled. */\n disabled?: boolean;\n /** If true, the buttons will not be displayed.\n * @default false\n */\n hideButtons?: boolean;\n /** If true, the cancel button will not be displayed.\n * @default false\n */\n hideCancelButton?: boolean;\n /** If true, the submit button will be displayed as a destructive button.\n * @default false\n */\n destructive?: boolean;\n /** If true, the submit button will be displayed with a loading state. */\n loading?: boolean;\n /** Callback function to be called when the cancel button is clicked. */\n onCancel?: () => void;\n /** If true, the buttons will render with a contrasting variant.\n * @default true\n */\n onContrast?: boolean;\n /** Callback function to be called when the submit button is clicked. */\n onSubmit?: () => void;\n /** Text to display in the submit button. */\n submitText?: string;\n /** Data test id for the footer.\n * @default kibble-popover-footer\n */\n 'data-testid'?: string;\n}\n\ninterface InternalPopoverFooterProps extends PopoverFooterProps {\n /** Trigger type of the popover.\n * @internal\n */\n trigger: PopoverTriggerType;\n}\n\nexport const PopoverFooter = ({\n children,\n disabled,\n hideButtons = false,\n hideCancelButton = false,\n destructive,\n loading,\n onCancel,\n onContrast = true,\n onSubmit,\n submitText = 'Submit',\n trigger,\n ['data-testid']: dataTestId = 'kibble-popover-footer',\n ...rest\n}: InternalPopoverFooterProps): React.JSX.Element => {\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe();\n const { setOpen } =\n // eslint-disable-next-line react-hooks/rules-of-hooks\n trigger === 'hover' ? useHoverCardContext() : usePopoverContext();\n\n const handleCancel = (): void => {\n if (onCancel) {\n onCancel();\n }\n setOpen(false);\n };\n\n return (\n <Flex className=\"Popover__Footer\" data-testid={dataTestId} css={styles.footer} {...rest}>\n {children}\n {!hideButtons && (\n <Flex w=\"100%\">\n {!hideCancelButton && (\n <Button variant=\"tertiary\" onContrast={onContrast} size=\"sm\" onClick={handleCancel}>\n Cancel\n </Button>\n )}\n <Spacer />\n <Button\n onClick={onSubmit}\n loading={loading}\n disabled={disabled}\n size=\"sm\"\n onContrast={onContrast}\n variant={destructive ? 'primaryDestructive' : 'primary'}\n >\n {submitText}\n </Button>\n </Flex>\n )}\n </Flex>\n );\n};\n","import React, { useRef } from 'react';\nimport { Popover as CPopover } from '@chakra-ui/react/popover';\nimport { HoverCard } from '@chakra-ui/react/hover-card';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Placement } from 'shared/types/placement';\nimport { Text } from 'components/Text/text.component';\nimport { PopoverSize, PopoverTriggerType, PopoverVariant } from './popover.types';\nimport { PopoverHeader, PopoverHeaderProps } from './components/PopoverHeader/popoverHeader.component';\nimport { PopoverFooter, PopoverFooterProps } from './components/PopoverFooter/popoverFooter.component';\nimport { Box } from '@chakra-ui/react/box';\nimport { ConditionalValue, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { popoverRecipe } from './popover.recipe';\nimport { PortalContext } from 'hooks/usePortalContentRef';\nimport { useDeviceType } from 'hooks/useDeviceType';\n\nexport interface KPopoverProps {\n /** The element that triggers the popover. */\n anchor: React.ReactNode;\n /** Props to customize the content of the popover. */\n contentProps?: CPopover.ContentProps;\n /**\n * If true, the popover will be disabled.\n * @default false\n */\n disabled?: boolean;\n /** Props to configure the footer of the popover. */\n footerProps?: PopoverFooterProps;\n /** Props to configure the header of the popover. */\n headerProps?: PopoverHeaderProps;\n /** Configuration for the positioner of the popover. */\n positionerProps?: CPopover.PositionerProps;\n /**\n * If true, the popover will be rendered in a portal.\n * @default true\n */\n portalled?: boolean;\n /**\n * Sets the placement of the popover in relation to the designated element. If the chosen placement puts the tooltip out-of-bounds of the viewport, the placement will automatically adjust. You should, however, choose a placement that works best with orientation of the element.\n * @default bottom\n */\n placement?: Placement;\n /** Whether to show the arrow of the popover. */\n showArrow?: boolean;\n /**\n * The size of the popover.\n * @default md\n */\n size?: ConditionalValue<PopoverSize>;\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: PopoverTriggerType;\n /**\n * The color variant of the popover.\n * @default contrast\n */\n variant?: PopoverVariant;\n /** Data test id for the popover.\n * @default kibble-popover\n */\n 'data-testid'?: string;\n}\n\ninterface ClickPopoverProps extends CPopover.RootProps {\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: 'click';\n}\n\ninterface HoverPopoverProps extends HoverCard.RootProps {\n /**\n * The trigger type of the popover.\n * @default click\n */\n trigger?: 'hover';\n}\n\nexport type PopoverProps = KPopoverProps & (Omit<ClickPopoverProps, 'size'> | Omit<HoverPopoverProps, 'size'>);\n\nexport const Popover = ({\n anchor,\n children,\n contentProps,\n footerProps,\n headerProps,\n disabled = false,\n portalled = true,\n placement = 'bottom',\n positioning,\n showArrow = true,\n size = 'sm',\n trigger = 'click',\n variant = 'contrast',\n positionerProps,\n ['data-testid']: dataTestId = 'kibble-popover',\n ...rest\n}: PopoverProps): React.ReactNode => {\n const contentRef = useRef<HTMLDivElement>(null!);\n const contextValue = { contentRef };\n const deviceType = useDeviceType();\n // Forces click trigger on mobile devices for better UX\n const effectiveTrigger = deviceType === 'mobile' ? 'click' : trigger;\n const Element = effectiveTrigger === 'hover' ? HoverCard : CPopover;\n const recipe = useSlotRecipe({ recipe: popoverRecipe });\n const styles = recipe({ variant, size });\n\n if (disabled) return anchor;\n\n const onContrast = variant === 'contrast' || variant === 'contrastDestructive';\n\n return (\n <Element.Root\n closeOnEscape={true}\n closeOnInteractOutside={true}\n positioning={{\n ...positioning,\n placement: positioning?.placement || placement,\n }}\n {...rest}\n >\n <Element.Trigger\n asChild\n className=\"Popover__Trigger\"\n data-testid={`${dataTestId}-trigger`}\n cursor={effectiveTrigger === 'click' ? 'pointer' : 'default'}\n >\n {anchor}\n </Element.Trigger>\n <Portal disabled={!portalled}>\n <Element.Positioner className=\"Popover\" data-testid={dataTestId} {...positionerProps}>\n <PortalContext.Provider value={contextValue}>\n <Element.Content\n className=\"Popover__Content\"\n data-testid={`${dataTestId}-content`}\n ref={contentRef}\n {...contentProps}\n css={styles.content}\n >\n {showArrow && (\n <Element.Arrow className=\"Popover__Arrow\" data-testid={`${dataTestId}-arrow`} css={styles.arrow}>\n <Element.ArrowTip css={styles.arrowTip} />\n </Element.Arrow>\n )}\n {headerProps && <PopoverHeader trigger={effectiveTrigger} onContrast={onContrast} {...headerProps} />}\n <Box\n className=\"Popover__Body\"\n data-testid={`${dataTestId}-body`}\n css={styles.body}\n {...(!!headerProps && { pt: 0 })}\n >\n {typeof children === 'string' ? (\n <Text variant={onContrast ? 'onContrast' : 'default'} size=\"sm\">\n {children}\n </Text>\n ) : (\n children\n )}\n </Box>\n {footerProps && (\n <PopoverFooter\n trigger={effectiveTrigger}\n destructive={variant === 'contrastDestructive' || variant === 'defaultDestructive'}\n onContrast={onContrast}\n {...footerProps}\n />\n )}\n </Element.Content>\n </PortalContext.Provider>\n </Element.Positioner>\n </Portal>\n </Element.Root>\n );\n};\n"],"names":["Spacer","chakra","PopoverHeader","children","color","hideCloseButton","onContrast","onClose","size","trigger","dataTestId","rest","styles","useSlotRecipe","popoverRecipe","setOpen","useHoverCardContext","usePopoverContext","jsxs","Flex","jsx","Heading","Button","PopoverFooter","disabled","hideButtons","hideCancelButton","destructive","loading","onCancel","onSubmit","submitText","handleCancel","Popover","anchor","contentProps","footerProps","headerProps","portalled","placement","positioning","showArrow","variant","positionerProps","contentRef","useRef","contextValue","effectiveTrigger","useDeviceType","Element","HoverCard","CPopover","Portal","PortalContext","Box","Text"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const s=require("./jsx-runtime-BjDatQAs.js"),g=require("./withFormControl-
|
|
2
|
-
//# sourceMappingURL=radioGroup.types-
|
|
1
|
+
"use strict";const s=require("./jsx-runtime-BjDatQAs.js"),g=require("./withFormControl-d2CEvsH2.js"),d=require("react"),T=require("./text.component-D5GpbfNx.js"),B=require("./create-slot-recipe-context-HXE1VazG.js"),F=require("./radiomark-Cj0NEJeE.js"),i=require("./use-locale-context-ym21RUxU.js"),v=require("./index-D6HBfqAu.js"),m=require("./index-CQURjLlA.js"),M=require("./buttonGroup.component-CHbRCpMI.js"),h=require("./button.recipe-DyIe5w68.js"),O=require("./stack-BE-r1yqU.js"),D=o=>o&&o.__esModule?o:{default:o},V=D(d),[E,x]=i.createContext({name:"RadioGroupContext",hookName:"useRadioGroupContext",providerName:"<RadioGroupProvider />"}),[J,K]=i.createContext({name:"RadioGroupItemContext",hookName:"useRadioGroupItemContext",providerName:"<RadioGroupItemProvider />"}),[Q,f]=i.createContext({name:"RadioGroupItemPropsContext",hookName:"useRadioGroupItemPropsContext",providerName:"<RadioGroupItemPropsProvider />"}),y=d.forwardRef((o,r)=>{const[t,e]=i.createSplitProps()(o,["value","disabled","invalid"]),a=x(),n=m.mergeProps(a.getItemProps(t),e),u=a.getItemState(t);return s.jsxRuntimeExports.jsx(J,{value:u,children:s.jsxRuntimeExports.jsx(Q,{value:t,children:s.jsxRuntimeExports.jsx(i.ark.label,{...n,ref:r})})})});y.displayName="RadioGroupItem";const U=o=>o.children(K()),C=d.forwardRef((o,r)=>{const t=x(),e=f(),a=m.mergeProps(t.getItemControlProps(e),o);return s.jsxRuntimeExports.jsx(i.ark.div,{...a,ref:r})});C.displayName="RadioGroupItemControl";const w=d.forwardRef((o,r)=>{const t=x(),e=f(),a=m.mergeProps(t.getItemHiddenInputProps(e),o);return s.jsxRuntimeExports.jsx(i.ark.input,{...a,ref:r})});w.displayName="RadioGroupItemHiddenInput";const b=d.forwardRef((o,r)=>{const t=x(),e=f(),a=m.mergeProps(t.getItemTextProps(e),o);return s.jsxRuntimeExports.jsx(i.ark.span,{...a,ref:r})});b.displayName="RadioGroupItemText";const k=d.forwardRef((o,r)=>{const t=x(),e=m.mergeProps(t.getLabelProps(),o);return s.jsxRuntimeExports.jsx(i.ark.label,{...e,ref:r})});k.displayName="RadioGroupLabel";const X=o=>{const r=d.useId(),{getRootNode:t}=i.useEnvironmentContext(),{dir:e}=i.useLocaleContext(),a={id:r,dir:e,getRootNode:t,...o},n=i.useMachine(v.machine,a);return v.connect(n,i.normalizeProps)},N=d.forwardRef((o,r)=>{const[t,e]=i.createSplitProps()(o,["defaultValue","disabled","form","id","ids","name","onValueChange","orientation","readOnly","value"]),a=X(t),n=m.mergeProps(a.getRootProps(),e);return s.jsxRuntimeExports.jsx(E,{value:a,children:s.jsxRuntimeExports.jsx(i.ark.div,{...n,ref:r})})});N.displayName="RadioGroupRoot";const _=d.forwardRef((o,r)=>{const[{value:t},e]=i.createSplitProps()(o,["value"]),a=m.mergeProps(t.getRootProps(),e);return s.jsxRuntimeExports.jsx(E,{value:t,children:s.jsxRuntimeExports.jsx(i.ark.div,{...a,ref:r})})});_.displayName="RadioGroupRootProvider";const{withProvider:S,withContext:G,useStyles:Y}=B.createSlotRecipeContext({key:"radioGroup"});S(_,"root",{forwardAsChild:!0});const Z=S(N,"root",{forwardAsChild:!0});G(k,"label",{forwardAsChild:!0});const z=G(y,"item",{forwardAsChild:!0}),oo=G(b,"itemText",{forwardAsChild:!0});G(C,"itemControl",{forwardAsChild:!0});const to=d.forwardRef(function(r,t){const e=Y();return s.jsxRuntimeExports.jsx(U,{children:a=>s.jsxRuntimeExports.jsx(C,{asChild:!0,children:s.jsxRuntimeExports.jsx(F.Radiomark,{ref:t,unstyled:!0,...r,checked:a.checked,disabled:a.disabled,css:[e.itemControl,r.css]})})})}),eo=w,q=V.default.forwardRef(({children:o,disabled:r=!1,invalid:t=!1,onContrast:e=!1,radioRef:a,radioType:n,rootRef:u,size:l="md",["data-testid"]:p="kibble-radio",...R},P)=>s.jsxRuntimeExports.jsxs(z,{className:"Radio","data-testid":p,invalid:t,disabled:r,ref:u,...R,children:[s.jsxRuntimeExports.jsx(eo,{className:"Radio__Input","data-testid":`${p}-input`,ref:a||P}),s.jsxRuntimeExports.jsx(to,{className:"Radio__Indicator","data-testid":`${p}-indicator`}),o&&s.jsxRuntimeExports.jsx(oo,{className:"Radio__Text","data-testid":`${p}-label`,...n==="cards"&&typeof o!="string"&&{mt:"-4px"},children:typeof o=="string"?s.jsxRuntimeExports.jsx(T.WrappedText,{size:l,lineHeight:"unset",variant:e?"onContrast":"default",children:o}):o})]}));q.displayName="Radio";const ro=g.withFormControl(q),$=({radios:o,defaultValue:r,direction:t="column",disabled:e,invalid:a,onContrast:n,size:u="md",radioType:l="default",onValueChange:p,value:R,gap:P=2,radioAlignment:A="start",["data-testid"]:H="kibble-radio-group",...L})=>{const W=n?"onContrast":"default";return s.jsxRuntimeExports.jsx(Z,{className:"RadioGroup","data-testid":H,disabled:e,defaultValue:r,value:R,size:u,variant:W,withCard:l==="cards",radioAlignment:A,onValueChange:p,...L,children:l==="buttons"?s.jsxRuntimeExports.jsx(M.ButtonGroup,{onContrast:n,variant:"secondarySubtle",size:u,buttons:o.map((c,j)=>{const I=r===c.value||R===c.value;return{key:`button-radio-${j}`,children:c.children,active:I,disabled:e,"data-testid":c["data-testid"],onClick:()=>p?.({value:c.value}),...e&&I&&{...n?h.secondarySubtleOnContrastButtonStyles:h.secondarySubtleButtonStyles}}})}):s.jsxRuntimeExports.jsx(O.Stack,{gap:P,direction:t,children:o.map((c,j)=>s.jsxRuntimeExports.jsx(ro,{invalid:a,disabled:e,size:u,radioType:l,onContrast:n,...t==="row"&&{fullWidth:!1},...c},`radio-${j}`))})})};$.displayName="RadioGroup";const so=g.withFormControl($),ao=["default","buttons","cards"],io=["start","center","end"];exports.WrappedRadioGroup=so;exports.radioAlignments=io;exports.radioTypes=ao;
|
|
2
|
+
//# sourceMappingURL=radioGroup.types-4D0zmi0v.js.map
|