pixel-react 1.8.9 → 1.9.1
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/lib/components/Comment/Comments.d.ts +1 -1
- package/lib/components/Comment/type.d.ts +3 -3
- package/lib/components/MobileSkin/types.d.ts +1 -1
- package/lib/components/Tabs/types.d.ts +1 -0
- package/lib/index.d.ts +9 -22
- package/lib/index.esm.js +4510 -905
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +4511 -904
- package/lib/index.js.map +1 -1
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/utils/indexDBStore/indexDB.d.ts +2 -0
- package/package.json +2 -1
- package/src/assets/icons/clear_cache.svg +5 -0
- package/src/components/Comment/Comments.scss +0 -1
- package/src/components/Comment/Comments.stories.tsx +22 -4
- package/src/components/Comment/Comments.tsx +20 -1
- package/src/components/Comment/type.ts +3 -3
- package/src/components/Icon/iconList.ts +2 -0
- package/src/components/MobileSkin/MobileSkin.scss +44 -44
- package/src/components/MobileSkin/MobileSkin.tsx +15 -14
- package/src/components/MobileSkin/types.ts +1 -1
- package/src/components/Tabs/Tabs.scss +19 -0
- package/src/components/Tabs/Tabs.tsx +9 -0
- package/src/components/Tabs/types.ts +1 -0
- package/src/index.ts +3 -0
- package/src/utils/indexDBStore/indexDB.ts +37 -0
package/lib/tsconfig.tsbuildinfo
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"root":["../src/index.ts","../src/styleguide/colorpalette/colorpalette.tsx","../src/styleguide/colorpalette/colorpalettelist.ts","../src/styleguide/colorpalette/index.ts","../src/styleguide/colorpalette/types.ts","../src/styleguide/typography/typography.tsx","../src/styleguide/typography/typographylist.ts","../src/styleguide/typography/types.ts","../src/assets/utils/functionutils.ts","../src/components/accordion/accordion.tsx","../src/components/accordion/index.ts","../src/components/accordion/types.ts","../src/components/addresourcebutton/addbutton.tsx","../src/components/addresourcebutton/index.ts","../src/components/addresourcebutton/type.ts","../src/components/addresourcebutton/arrowsbutton/arrowsbutton.tsx","../src/components/allprojectsdropdown/allprojectsdropdown.tsx","../src/components/allprojectsdropdown/index.ts","../src/components/allprojectsdropdown/types.ts","../src/components/appheader/appheader.tsx","../src/components/appheader/index.ts","../src/components/appheader/types.ts","../src/components/attachimage/attachimage.tsx","../src/components/attachimage/index.ts","../src/components/attachimage/types.ts","../src/components/attachmentbutton/attachmentbutton.tsx","../src/components/attachmentbutton/index.ts","../src/components/attachmentbutton/types.ts","../src/components/avatar/avatar.tsx","../src/components/avatar/index.ts","../src/components/avatar/types.ts","../src/components/button/button.tsx","../src/components/button/index.ts","../src/components/button/types.ts","../src/components/charts/barchart/barchart.tsx","../src/components/charts/barchart/index.ts","../src/components/charts/barchart/types.ts","../src/components/charts/dashboarddonutchart/dashboarddonutchart.tsx","../src/components/charts/dashboarddonutchart/index.ts","../src/components/charts/dashboarddonutchart/types.ts","../src/components/charts/donutchart/donutchart.tsx","../src/components/charts/donutchart/index.ts","../src/components/charts/donutchart/type.ts","../src/components/charts/iconradialchart/iconradialchart.tsx","../src/components/charts/iconradialchart/index.ts","../src/components/charts/iconradialchart/types.ts","../src/components/charts/linechart/linechart.tsx","../src/components/charts/linechart/index.ts","../src/components/charts/linechart/types.ts","../src/components/charts/multiradialchart/multiradialchart.tsx","../src/components/charts/multiradialchart/index.ts","../src/components/charts/multiradialchart/types.ts","../src/components/charts/piechart/piechart.tsx","../src/components/charts/piechart/index.ts","../src/components/charts/piechart/types.ts","../src/components/charts/radialchart/radialchart.tsx","../src/components/charts/radialchart/index.ts","../src/components/charts/radialchart/types.ts","../src/components/checkbox/checkbox.tsx","../src/components/checkbox/index.ts","../src/components/checkbox/types.ts","../src/components/chip/chip.tsx","../src/components/chip/index.ts","../src/components/chip/types.ts","../src/components/choosefile/choosefile.tsx","../src/components/choosefile/types.ts","../src/components/comment/comments.tsx","../src/components/comment/index.ts","../src/components/comment/type.ts","../src/components/comment/comment/comment.tsx","../src/components/comment/comment/usenode.ts","../src/components/conditionaldropdown/conditionaldropdown.tsx","../src/components/conditionaldropdown/optionsdropdown.tsx","../src/components/conditionaldropdown/index.ts","../src/components/conditionaldropdown/types.ts","../src/components/connectingbranch/connectingbranch.tsx","../src/components/connectingbranch/data.tsx","../src/components/connectingbranch/index.ts","../src/components/connectingbranch/types.ts","../src/components/connectingbranch/branchcomponents/machineinstances.tsx","../src/components/createvariable/createvariableslider.tsx","../src/components/createvariable/index.ts","../src/components/createvariable/types.ts","../src/components/datepicker/datepicker.tsx","../src/components/datepicker/timepicker.tsx","../src/components/datepicker/index.ts","../src/components/datepicker/types.ts","../src/components/downloadclient/downloadclient.tsx","../src/components/downloadclient/index.ts","../src/components/downloadclient/type.ts","../src/components/draganddrop/draganddrop.ts","../src/components/draganddrop/draganddroplist.tsx","../src/components/draganddrop/index.ts","../src/components/drawer/drawer.tsx","../src/components/drawer/types.ts","../src/components/drawer/index.ts","../src/components/edittextfield/edittextfield.tsx","../src/components/edittextfield/index.ts","../src/components/edittextfield/types.ts","../src/components/editor/editor.tsx","../src/components/editor/variabledropdown.tsx","../src/components/editor/constants.ts","../src/components/editor/index.ts","../src/components/editor/types.ts","../src/components/excel/types.ts","../src/components/excel/dataconversion.ts","../src/components/excel/index.ts","../src/components/excel/colorbarselector/colorbarselector.tsx","../src/components/excel/excelcontextmenu/excelcontextmenu.tsx","../src/components/excel/excelfile/excelfile.tsx","../src/components/excel/excelfile/excelfilecomponents/activecell.tsx","../src/components/excel/excelfile/excelfilecomponents/cell.tsx","../src/components/excel/excelfile/excelfilecomponents/columnindicator.tsx","../src/components/excel/excelfile/excelfilecomponents/copied.tsx","../src/components/excel/excelfile/excelfilecomponents/cornerindicator.tsx","../src/components/excel/excelfile/excelfilecomponents/dataeditor.tsx","../src/components/excel/excelfile/excelfilecomponents/dataviewer.tsx","../src/components/excel/excelfile/excelfilecomponents/floatingrect.tsx","../src/components/excel/excelfile/excelfilecomponents/headerrow.tsx","../src/components/excel/excelfile/excelfilecomponents/row.tsx","../src/components/excel/excelfile/excelfilecomponents/rowindicator.tsx","../src/components/excel/excelfile/excelfilecomponents/selected.tsx","../src/components/excel/excelfile/excelfilecomponents/spreadsheet.tsx","../src/components/excel/excelfile/excelfilecomponents/table.tsx","../src/components/excel/excelfile/excelfilecomponents/actions.ts","../src/components/excel/excelfile/excelfilecomponents/aremodelsequal.ts","../src/components/excel/excelfile/excelfilecomponents/context.ts","../src/components/excel/excelfile/excelfilecomponents/index.ts","../src/components/excel/excelfile/excelfilecomponents/matrix.ts","../src/components/excel/excelfile/excelfilecomponents/point-range.ts","../src/components/excel/excelfile/excelfilecomponents/point.ts","../src/components/excel/excelfile/excelfilecomponents/reducer.ts","../src/components/excel/excelfile/excelfilecomponents/reducerfunctions.ts","../src/components/excel/excelfile/excelfilecomponents/selection.ts","../src/components/excel/excelfile/excelfilecomponents/types.ts","../src/components/excel/excelfile/excelfilecomponents/use-dispatch.ts","../src/components/excel/excelfile/excelfilecomponents/use-selector.ts","../src/components/excel/excelfile/excelfilecomponents/util.ts","../src/components/excel/excelfile/excelfilecomponents/engine/engine.ts","../src/components/excel/excelfile/excelfilecomponents/engine/formula.ts","../src/components/excel/excelfile/excelfilecomponents/engine/index.ts","../src/components/excel/excelfile/excelfilecomponents/engine/point-graph.ts","../src/components/excel/excelfile/excelfilecomponents/engine/point-hash.ts","../src/components/excel/excelfile/excelfilecomponents/engine/point-set.ts","../src/components/excel/excelfile/excelfilecomponents/typings/fast-formula-parser.d.ts","../src/components/excel/exceltoolbar/exceltoolbar.tsx","../src/components/expandablemenu/expandablemenu.tsx","../src/components/expandablemenu/index.ts","../src/components/expandablemenu/types.ts","../src/components/ff_captcha/recaptcha.tsx","../src/components/ff_captcha/index.ts","../src/components/ff_captcha/types.ts","../src/components/fieldset/fieldset.tsx","../src/components/fieldset/index.ts","../src/components/fieldset/types.ts","../src/components/filedropzone/dropzone.tsx","../src/components/filedropzone/filedropzone.tsx","../src/components/filedropzone/filepreview.tsx","../src/components/filedropzone/radiofilepreview.tsx","../src/components/filedropzone/index.ts","../src/components/filedropzone/types.ts","../src/components/form/form.ts","../src/components/form/forms.tsx","../src/components/form/index.ts","../src/components/form/types.ts","../src/components/gridlayout/gridlayout.tsx","../src/components/gridlayout/index.ts","../src/components/gridlayout/types.ts","../src/components/highlighttext/highlighttext.tsx","../src/components/highlighttext/index.ts","../src/components/highlighttext/types.ts","../src/components/icon/icon.tsx","../src/components/icon/iconlist.ts","../src/components/icon/index.ts","../src/components/icon/types.ts","../src/components/iconbutton/iconbutton.tsx","../src/components/iconbutton/index.ts","../src/components/iconbutton/types.ts","../src/components/iconradiogroup/iconradiogroup.tsx","../src/components/iconradiogroup/index.ts","../src/components/iconradiogroup/type.ts","../src/components/input/input.tsx","../src/components/input/index.ts","../src/components/input/types.ts","../src/components/inputwithdropdown/inputwithdropdown.tsx","../src/components/inputwithdropdown/index.ts","../src/components/inputwithdropdown/types.ts","../src/components/labeledittextfield/labeledittextfield.tsx","../src/components/labeledittextfield/index.ts","../src/components/labeledittextfield/types.ts","../src/components/lazyload/lazyload.ts","../src/components/lazyload/lazyloading.tsx","../src/components/lazyload/index.ts","../src/components/machineinputfield/machineinputfield.tsx","../src/components/machineinputfield/index.ts","../src/components/machineinputfield/types.ts","../src/components/menuoption/menuoption.tsx","../src/components/menuoption/index.ts","../src/components/menuoption/types.ts","../src/components/minimodal/minimodal.tsx","../src/components/minimodal/index.ts","../src/components/minimodal/types.ts","../src/components/mobileskin/mobileskin.tsx","../src/components/mobileskin/mobileskininterface.ts","../src/components/mobileskin/index.ts","../src/components/mobileskin/types.ts","../src/components/modal/modal.tsx","../src/components/modal/index.tsx","../src/components/modal/types.ts","../src/components/moduleschip/modulechip.tsx","../src/components/moduleschip/index.ts","../src/components/moduleschip/types.ts","../src/components/multiselect/dropdown.tsx","../src/components/multiselect/multiselect.tsx","../src/components/multiselect/multiselecttypes.ts","../src/components/multiselect/dropdowntypes.ts","../src/components/multiselect/index.ts","../src/components/nlpinput/nlpinput.tsx","../src/components/nlpinput/index.ts","../src/components/nlpinput/sampledata.ts","../src/components/nlpinput/types.tsx","../src/components/nlpinput/components/nlpdropdown/nlpdropdowntype.ts","../src/components/nlpinput/components/nlpdropdown/nlpdropdown.tsx","../src/components/paper/paper.tsx","../src/components/paper/index.ts","../src/components/paper/types.ts","../src/components/phoneinput/phoneinput.tsx","../src/components/phoneinput/index.ts","../src/components/phoneinput/types.ts","../src/components/popupmodal/popupmodal.tsx","../src/components/popupmodal/types.ts","../src/components/progressbar/progressbar.tsx","../src/components/progressbar/index.ts","../src/components/progressbar/types.ts","../src/components/radiobutton/radiobutton.tsx","../src/components/radiobutton/index.ts","../src/components/radiobutton/radiobuttontypes.tsx","../src/components/radiogroup/radiogroup.tsx","../src/components/radiogroup/index.ts","../src/components/radiogroup/radiogrouptypes.tsx","../src/components/scriptswitchbutton/scriptswitchbutton.tsx","../src/components/scriptswitchbutton/index.ts","../src/components/search/search.tsx","../src/components/search/index.ts","../src/components/search/types.ts","../src/components/select/select.tsx","../src/components/select/index.ts","../src/components/select/types.ts","../src/components/select/components/dropdown.tsx","../src/components/select/components/types.ts","../src/components/sequentialconnectingbranch/sequentialconnectingbranch.tsx","../src/components/sequentialconnectingbranch/index.ts","../src/components/sequentialconnectingbranch/types.ts","../src/components/sequentialconnectingbranch/components/branches/branches.tsx","../src/components/sequentialconnectingbranch/components/branches/types.ts","../src/components/sequentialconnectingbranch/components/connectingbranches/connectingbranches.tsx","../src/components/sequentialconnectingbranch/components/connectingbranches/types.ts","../src/components/statedropdown/statedropdown.tsx","../src/components/statedropdown/statedropdowntypes.tsx","../src/components/statedropdown/index.ts","../src/components/statusbutton/statusbutton.tsx","../src/components/statusbutton/index.ts","../src/components/statusbutton/types.ts","../src/components/statuscard/statuscard.tsx","../src/components/statuscard/index.ts","../src/components/statuscard/types.ts","../src/components/table/table.tsx","../src/components/table/types.ts","../src/components/table/index.ts","../src/components/tabletree/tabletree.tsx","../src/components/tabletree/data.ts","../src/components/tabletree/index.ts","../src/components/tabletree/types.ts","../src/components/tabletree/components/tablebody.tsx","../src/components/tabletree/components/tablecell.tsx","../src/components/tabletree/components/tablehead.tsx","../src/components/tabletree/components/tablerow.tsx","../src/components/tabletree/utils/getallchildids.ts","../src/components/tabletree/utils/renderspaces.ts","../src/components/tablewithaccordion/tablewithaccordion.tsx","../src/components/tablewithaccordion/data.ts","../src/components/tablewithaccordion/index.ts","../src/components/tablewithaccordion/types.ts","../src/components/tabs/tabs.tsx","../src/components/tabs/index.ts","../src/components/tabs/types.ts","../src/components/textarea/textarea.tsx","../src/components/textarea/types.ts","../src/components/textarea/index.tsx","../src/components/themeprovider/themeprovider.tsx","../src/components/themeprovider/index.ts","../src/components/themeprovider/types.ts","../src/components/toast/toast.tsx","../src/components/toast/index.ts","../src/components/toast/types.ts","../src/components/toastify/toastify.tsx","../src/components/toastify/index.ts","../src/components/toastify/types.ts","../src/components/toggle/toggle.tsx","../src/components/toggle/index.ts","../src/components/toggle/types.ts","../src/components/toggleswitch/toggleswitch.tsx","../src/components/toggleswitch/index.ts","../src/components/tooltip/tooltip.tsx","../src/components/tooltip/index.ts","../src/components/tooltip/types.ts","../src/components/typography/typography.tsx","../src/components/typography/index.ts","../src/components/typography/types.ts","../src/components/variableinput/variableinput.tsx","../src/components/variableinput/index.ts","../src/components/variableinput/types.ts","../src/hooks/useclickoutside.tsx","../src/hooks/usefiledropzone.tsx","../src/hooks/useintersectionobserver.tsx","../src/hooks/useportalposition.tsx","../src/hooks/usetheme.tsx","../src/hooks/keyboardevents/useesckeyevent.tsx","../src/utils/formatstring/formatstring.tsx","../src/utils/tablecell/tablecell.ts","../src/utils/capitalize/capitalize.tsx","../src/utils/checkduplicates/checkduplicates.ts","../src/utils/checkempty/checkempty.ts","../src/utils/comparearrays/comparearrays.ts","../src/utils/compareobjects/compareobjects.ts","../src/utils/debounce/debounce.ts","../src/utils/downloadfile/savefilefromblob.ts","../src/utils/ffid/ffid.ts","../src/utils/findandinsert/findandinsert.ts","../src/utils/formdata/convertformdatatoobject.ts","../src/utils/functioncheck/functioncheck.ts","../src/utils/getencrypteddata/getencrypteddata.ts","../src/utils/getextension/getextension.ts","../src/utils/getselectoptionvalue/getselectoptionvalue.ts","../src/utils/getsequentialpayload/getsequentialpayload.ts","../src/utils/getsequentialpayload/types.ts","../src/utils/keyboardactionutil/usekeyboardactions.tsx","../src/utils/keyboardactionutil/types.ts","../src/utils/throttle/throttle.ts","../src/utils/truncatetext/truncatetext.ts","../src/utils/validatefile/validatefile.ts","../src/validations/regex.ts"],"version":"5.6.3"}
|
1
|
+
{"root":["../src/index.ts","../src/styleguide/colorpalette/colorpalette.tsx","../src/styleguide/colorpalette/colorpalettelist.ts","../src/styleguide/colorpalette/index.ts","../src/styleguide/colorpalette/types.ts","../src/styleguide/typography/typography.tsx","../src/styleguide/typography/typographylist.ts","../src/styleguide/typography/types.ts","../src/assets/utils/functionutils.ts","../src/components/accordion/accordion.tsx","../src/components/accordion/index.ts","../src/components/accordion/types.ts","../src/components/addresourcebutton/addbutton.tsx","../src/components/addresourcebutton/index.ts","../src/components/addresourcebutton/type.ts","../src/components/addresourcebutton/arrowsbutton/arrowsbutton.tsx","../src/components/allprojectsdropdown/allprojectsdropdown.tsx","../src/components/allprojectsdropdown/index.ts","../src/components/allprojectsdropdown/types.ts","../src/components/appheader/appheader.tsx","../src/components/appheader/index.ts","../src/components/appheader/types.ts","../src/components/attachimage/attachimage.tsx","../src/components/attachimage/index.ts","../src/components/attachimage/types.ts","../src/components/attachmentbutton/attachmentbutton.tsx","../src/components/attachmentbutton/index.ts","../src/components/attachmentbutton/types.ts","../src/components/avatar/avatar.tsx","../src/components/avatar/index.ts","../src/components/avatar/types.ts","../src/components/button/button.tsx","../src/components/button/index.ts","../src/components/button/types.ts","../src/components/charts/barchart/barchart.tsx","../src/components/charts/barchart/index.ts","../src/components/charts/barchart/types.ts","../src/components/charts/dashboarddonutchart/dashboarddonutchart.tsx","../src/components/charts/dashboarddonutchart/index.ts","../src/components/charts/dashboarddonutchart/types.ts","../src/components/charts/donutchart/donutchart.tsx","../src/components/charts/donutchart/index.ts","../src/components/charts/donutchart/type.ts","../src/components/charts/iconradialchart/iconradialchart.tsx","../src/components/charts/iconradialchart/index.ts","../src/components/charts/iconradialchart/types.ts","../src/components/charts/linechart/linechart.tsx","../src/components/charts/linechart/index.ts","../src/components/charts/linechart/types.ts","../src/components/charts/multiradialchart/multiradialchart.tsx","../src/components/charts/multiradialchart/index.ts","../src/components/charts/multiradialchart/types.ts","../src/components/charts/piechart/piechart.tsx","../src/components/charts/piechart/index.ts","../src/components/charts/piechart/types.ts","../src/components/charts/radialchart/radialchart.tsx","../src/components/charts/radialchart/index.ts","../src/components/charts/radialchart/types.ts","../src/components/checkbox/checkbox.tsx","../src/components/checkbox/index.ts","../src/components/checkbox/types.ts","../src/components/chip/chip.tsx","../src/components/chip/index.ts","../src/components/chip/types.ts","../src/components/choosefile/choosefile.tsx","../src/components/choosefile/types.ts","../src/components/comment/comments.tsx","../src/components/comment/index.ts","../src/components/comment/type.ts","../src/components/comment/comment/comment.tsx","../src/components/comment/comment/usenode.ts","../src/components/conditionaldropdown/conditionaldropdown.tsx","../src/components/conditionaldropdown/optionsdropdown.tsx","../src/components/conditionaldropdown/index.ts","../src/components/conditionaldropdown/types.ts","../src/components/connectingbranch/connectingbranch.tsx","../src/components/connectingbranch/data.tsx","../src/components/connectingbranch/index.ts","../src/components/connectingbranch/types.ts","../src/components/connectingbranch/branchcomponents/machineinstances.tsx","../src/components/createvariable/createvariableslider.tsx","../src/components/createvariable/index.ts","../src/components/createvariable/types.ts","../src/components/datepicker/datepicker.tsx","../src/components/datepicker/timepicker.tsx","../src/components/datepicker/index.ts","../src/components/datepicker/types.ts","../src/components/downloadclient/downloadclient.tsx","../src/components/downloadclient/index.ts","../src/components/downloadclient/type.ts","../src/components/draganddrop/draganddrop.ts","../src/components/draganddrop/draganddroplist.tsx","../src/components/draganddrop/index.ts","../src/components/drawer/drawer.tsx","../src/components/drawer/types.ts","../src/components/drawer/index.ts","../src/components/edittextfield/edittextfield.tsx","../src/components/edittextfield/index.ts","../src/components/edittextfield/types.ts","../src/components/editor/editor.tsx","../src/components/editor/variabledropdown.tsx","../src/components/editor/constants.ts","../src/components/editor/index.ts","../src/components/editor/types.ts","../src/components/excel/types.ts","../src/components/excel/dataconversion.ts","../src/components/excel/index.ts","../src/components/excel/colorbarselector/colorbarselector.tsx","../src/components/excel/excelcontextmenu/excelcontextmenu.tsx","../src/components/excel/excelfile/excelfile.tsx","../src/components/excel/excelfile/excelfilecomponents/activecell.tsx","../src/components/excel/excelfile/excelfilecomponents/cell.tsx","../src/components/excel/excelfile/excelfilecomponents/columnindicator.tsx","../src/components/excel/excelfile/excelfilecomponents/copied.tsx","../src/components/excel/excelfile/excelfilecomponents/cornerindicator.tsx","../src/components/excel/excelfile/excelfilecomponents/dataeditor.tsx","../src/components/excel/excelfile/excelfilecomponents/dataviewer.tsx","../src/components/excel/excelfile/excelfilecomponents/floatingrect.tsx","../src/components/excel/excelfile/excelfilecomponents/headerrow.tsx","../src/components/excel/excelfile/excelfilecomponents/row.tsx","../src/components/excel/excelfile/excelfilecomponents/rowindicator.tsx","../src/components/excel/excelfile/excelfilecomponents/selected.tsx","../src/components/excel/excelfile/excelfilecomponents/spreadsheet.tsx","../src/components/excel/excelfile/excelfilecomponents/table.tsx","../src/components/excel/excelfile/excelfilecomponents/actions.ts","../src/components/excel/excelfile/excelfilecomponents/aremodelsequal.ts","../src/components/excel/excelfile/excelfilecomponents/context.ts","../src/components/excel/excelfile/excelfilecomponents/index.ts","../src/components/excel/excelfile/excelfilecomponents/matrix.ts","../src/components/excel/excelfile/excelfilecomponents/point-range.ts","../src/components/excel/excelfile/excelfilecomponents/point.ts","../src/components/excel/excelfile/excelfilecomponents/reducer.ts","../src/components/excel/excelfile/excelfilecomponents/reducerfunctions.ts","../src/components/excel/excelfile/excelfilecomponents/selection.ts","../src/components/excel/excelfile/excelfilecomponents/types.ts","../src/components/excel/excelfile/excelfilecomponents/use-dispatch.ts","../src/components/excel/excelfile/excelfilecomponents/use-selector.ts","../src/components/excel/excelfile/excelfilecomponents/util.ts","../src/components/excel/excelfile/excelfilecomponents/engine/engine.ts","../src/components/excel/excelfile/excelfilecomponents/engine/formula.ts","../src/components/excel/excelfile/excelfilecomponents/engine/index.ts","../src/components/excel/excelfile/excelfilecomponents/engine/point-graph.ts","../src/components/excel/excelfile/excelfilecomponents/engine/point-hash.ts","../src/components/excel/excelfile/excelfilecomponents/engine/point-set.ts","../src/components/excel/excelfile/excelfilecomponents/typings/fast-formula-parser.d.ts","../src/components/excel/exceltoolbar/exceltoolbar.tsx","../src/components/expandablemenu/expandablemenu.tsx","../src/components/expandablemenu/index.ts","../src/components/expandablemenu/types.ts","../src/components/ff_captcha/recaptcha.tsx","../src/components/ff_captcha/index.ts","../src/components/ff_captcha/types.ts","../src/components/fieldset/fieldset.tsx","../src/components/fieldset/index.ts","../src/components/fieldset/types.ts","../src/components/filedropzone/dropzone.tsx","../src/components/filedropzone/filedropzone.tsx","../src/components/filedropzone/filepreview.tsx","../src/components/filedropzone/radiofilepreview.tsx","../src/components/filedropzone/index.ts","../src/components/filedropzone/types.ts","../src/components/form/form.ts","../src/components/form/forms.tsx","../src/components/form/index.ts","../src/components/form/types.ts","../src/components/gridlayout/gridlayout.tsx","../src/components/gridlayout/index.ts","../src/components/gridlayout/types.ts","../src/components/highlighttext/highlighttext.tsx","../src/components/highlighttext/index.ts","../src/components/highlighttext/types.ts","../src/components/icon/icon.tsx","../src/components/icon/iconlist.ts","../src/components/icon/index.ts","../src/components/icon/types.ts","../src/components/iconbutton/iconbutton.tsx","../src/components/iconbutton/index.ts","../src/components/iconbutton/types.ts","../src/components/iconradiogroup/iconradiogroup.tsx","../src/components/iconradiogroup/index.ts","../src/components/iconradiogroup/type.ts","../src/components/input/input.tsx","../src/components/input/index.ts","../src/components/input/types.ts","../src/components/inputwithdropdown/inputwithdropdown.tsx","../src/components/inputwithdropdown/index.ts","../src/components/inputwithdropdown/types.ts","../src/components/labeledittextfield/labeledittextfield.tsx","../src/components/labeledittextfield/index.ts","../src/components/labeledittextfield/types.ts","../src/components/lazyload/lazyload.ts","../src/components/lazyload/lazyloading.tsx","../src/components/lazyload/index.ts","../src/components/machineinputfield/machineinputfield.tsx","../src/components/machineinputfield/index.ts","../src/components/machineinputfield/types.ts","../src/components/menuoption/menuoption.tsx","../src/components/menuoption/index.ts","../src/components/menuoption/types.ts","../src/components/minimodal/minimodal.tsx","../src/components/minimodal/index.ts","../src/components/minimodal/types.ts","../src/components/mobileskin/mobileskin.tsx","../src/components/mobileskin/mobileskininterface.ts","../src/components/mobileskin/index.ts","../src/components/mobileskin/types.ts","../src/components/modal/modal.tsx","../src/components/modal/index.tsx","../src/components/modal/types.ts","../src/components/moduleschip/modulechip.tsx","../src/components/moduleschip/index.ts","../src/components/moduleschip/types.ts","../src/components/multiselect/dropdown.tsx","../src/components/multiselect/multiselect.tsx","../src/components/multiselect/multiselecttypes.ts","../src/components/multiselect/dropdowntypes.ts","../src/components/multiselect/index.ts","../src/components/nlpinput/nlpinput.tsx","../src/components/nlpinput/index.ts","../src/components/nlpinput/sampledata.ts","../src/components/nlpinput/types.tsx","../src/components/nlpinput/components/nlpdropdown/nlpdropdowntype.ts","../src/components/nlpinput/components/nlpdropdown/nlpdropdown.tsx","../src/components/paper/paper.tsx","../src/components/paper/index.ts","../src/components/paper/types.ts","../src/components/phoneinput/phoneinput.tsx","../src/components/phoneinput/index.ts","../src/components/phoneinput/types.ts","../src/components/popupmodal/popupmodal.tsx","../src/components/popupmodal/types.ts","../src/components/progressbar/progressbar.tsx","../src/components/progressbar/index.ts","../src/components/progressbar/types.ts","../src/components/radiobutton/radiobutton.tsx","../src/components/radiobutton/index.ts","../src/components/radiobutton/radiobuttontypes.tsx","../src/components/radiogroup/radiogroup.tsx","../src/components/radiogroup/index.ts","../src/components/radiogroup/radiogrouptypes.tsx","../src/components/scriptswitchbutton/scriptswitchbutton.tsx","../src/components/scriptswitchbutton/index.ts","../src/components/search/search.tsx","../src/components/search/index.ts","../src/components/search/types.ts","../src/components/select/select.tsx","../src/components/select/index.ts","../src/components/select/types.ts","../src/components/select/components/dropdown.tsx","../src/components/select/components/types.ts","../src/components/sequentialconnectingbranch/sequentialconnectingbranch.tsx","../src/components/sequentialconnectingbranch/index.ts","../src/components/sequentialconnectingbranch/types.ts","../src/components/sequentialconnectingbranch/components/branches/branches.tsx","../src/components/sequentialconnectingbranch/components/branches/types.ts","../src/components/sequentialconnectingbranch/components/connectingbranches/connectingbranches.tsx","../src/components/sequentialconnectingbranch/components/connectingbranches/types.ts","../src/components/statedropdown/statedropdown.tsx","../src/components/statedropdown/statedropdowntypes.tsx","../src/components/statedropdown/index.ts","../src/components/statusbutton/statusbutton.tsx","../src/components/statusbutton/index.ts","../src/components/statusbutton/types.ts","../src/components/statuscard/statuscard.tsx","../src/components/statuscard/index.ts","../src/components/statuscard/types.ts","../src/components/table/table.tsx","../src/components/table/types.ts","../src/components/table/index.ts","../src/components/tabletree/tabletree.tsx","../src/components/tabletree/data.ts","../src/components/tabletree/index.ts","../src/components/tabletree/types.ts","../src/components/tabletree/components/tablebody.tsx","../src/components/tabletree/components/tablecell.tsx","../src/components/tabletree/components/tablehead.tsx","../src/components/tabletree/components/tablerow.tsx","../src/components/tabletree/utils/getallchildids.ts","../src/components/tabletree/utils/renderspaces.ts","../src/components/tablewithaccordion/tablewithaccordion.tsx","../src/components/tablewithaccordion/data.ts","../src/components/tablewithaccordion/index.ts","../src/components/tablewithaccordion/types.ts","../src/components/tabs/tabs.tsx","../src/components/tabs/index.ts","../src/components/tabs/types.ts","../src/components/textarea/textarea.tsx","../src/components/textarea/types.ts","../src/components/textarea/index.tsx","../src/components/themeprovider/themeprovider.tsx","../src/components/themeprovider/index.ts","../src/components/themeprovider/types.ts","../src/components/toast/toast.tsx","../src/components/toast/index.ts","../src/components/toast/types.ts","../src/components/toastify/toastify.tsx","../src/components/toastify/index.ts","../src/components/toastify/types.ts","../src/components/toggle/toggle.tsx","../src/components/toggle/index.ts","../src/components/toggle/types.ts","../src/components/toggleswitch/toggleswitch.tsx","../src/components/toggleswitch/index.ts","../src/components/tooltip/tooltip.tsx","../src/components/tooltip/index.ts","../src/components/tooltip/types.ts","../src/components/typography/typography.tsx","../src/components/typography/index.ts","../src/components/typography/types.ts","../src/components/variableinput/variableinput.tsx","../src/components/variableinput/index.ts","../src/components/variableinput/types.ts","../src/hooks/useclickoutside.tsx","../src/hooks/usefiledropzone.tsx","../src/hooks/useintersectionobserver.tsx","../src/hooks/useportalposition.tsx","../src/hooks/usetheme.tsx","../src/hooks/keyboardevents/useesckeyevent.tsx","../src/utils/formatstring/formatstring.tsx","../src/utils/tablecell/tablecell.ts","../src/utils/capitalize/capitalize.tsx","../src/utils/checkduplicates/checkduplicates.ts","../src/utils/checkempty/checkempty.ts","../src/utils/comparearrays/comparearrays.ts","../src/utils/compareobjects/compareobjects.ts","../src/utils/debounce/debounce.ts","../src/utils/downloadfile/savefilefromblob.ts","../src/utils/ffid/ffid.ts","../src/utils/findandinsert/findandinsert.ts","../src/utils/formdata/convertformdatatoobject.ts","../src/utils/functioncheck/functioncheck.ts","../src/utils/getencrypteddata/getencrypteddata.ts","../src/utils/getextension/getextension.ts","../src/utils/getselectoptionvalue/getselectoptionvalue.ts","../src/utils/getsequentialpayload/getsequentialpayload.ts","../src/utils/getsequentialpayload/types.ts","../src/utils/indexdbstore/indexdb.ts","../src/utils/keyboardactionutil/usekeyboardactions.tsx","../src/utils/keyboardactionutil/types.ts","../src/utils/throttle/throttle.ts","../src/utils/truncatetext/truncatetext.ts","../src/utils/validatefile/validatefile.ts","../src/validations/regex.ts"],"version":"5.6.3"}
|
package/package.json
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"name": "pixel-react",
|
3
3
|
"description": "Great for pixel-perfect, design-focused components in React",
|
4
|
-
"version": "1.
|
4
|
+
"version": "1.9.1",
|
5
5
|
"main": "lib/index.js",
|
6
6
|
"module": "lib/index.esm.js",
|
7
7
|
"types": "lib/index.d.ts",
|
@@ -67,6 +67,7 @@
|
|
67
67
|
"classnames": "^2.5.1",
|
68
68
|
"date-fns": "^3.0.0",
|
69
69
|
"date-fns-tz": "^3.2.0",
|
70
|
+
"idb": "^8.0.1",
|
70
71
|
"js-beautify": "^1.15.1",
|
71
72
|
"jsencrypt": "^3.3.2",
|
72
73
|
"monaco-editor": "^0.52.2",
|
@@ -0,0 +1,5 @@
|
|
1
|
+
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
2
|
+
<path d="M3.28279 6.0971C3.71351 6.0971 4.06267 5.74793 4.06267 5.31721C4.06267 4.88652 3.71351 4.53735 3.28279 4.53735C2.85209 4.53735 2.50293 4.88652 2.50293 5.31721C2.50293 5.74793 2.85209 6.0971 3.28279 6.0971Z" fill="currentColor"/>
|
3
|
+
<path d="M1.15974 8.49431C1.59046 8.49431 1.93963 8.14515 1.93963 7.71443C1.93963 7.28373 1.59046 6.93457 1.15974 6.93457C0.729046 6.93457 0.379883 7.28373 0.379883 7.71443C0.379883 8.14515 0.729046 8.49431 1.15974 8.49431Z" fill="currentColor"/>
|
4
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.6477 0.202053C13.765 -0.255167 12.6787 0.0897742 12.2215 0.97249L10.2245 4.8279C10.2138 4.84857 10.2046 4.86962 10.1968 4.89091C9.21861 4.85737 8.24963 5.28947 7.59613 6.0543C6.82617 6.95541 5.87889 7.93878 5.06942 8.44093C3.91537 9.15685 2.9613 9.41487 2.36881 9.50645C2.0223 9.56001 1.74105 9.7831 1.60404 10.0724C1.46093 10.3746 1.47172 10.7706 1.74982 11.077C2.3544 11.7433 3.53312 12.8345 5.6951 14.2095C7.19254 15.1619 8.53507 15.6887 9.25762 15.9327C9.81137 16.1197 10.4031 15.9058 10.7209 15.4299C11.1226 14.8283 11.8281 13.6938 12.4338 12.3132C12.8819 11.2919 13.268 10.2392 13.6375 9.18836C13.9491 8.30189 13.809 7.36679 13.3351 6.6277L15.4162 2.63184C15.8762 1.74875 15.5318 0.659995 14.6477 0.202053ZM12.5502 5.80392L14.4614 2.1345C14.6462 1.77962 14.5078 1.34209 14.1525 1.15807C13.7978 0.974333 13.3612 1.11295 13.1775 1.46768L11.2804 5.13019C11.344 5.15715 11.407 5.18642 11.4695 5.2181L12.1627 5.56956C12.2992 5.63878 12.4285 5.71727 12.5502 5.80392ZM12.6218 8.83125C12.5451 9.04941 12.4642 9.27634 12.3804 9.5074L8.01139 7.21465C8.15203 7.05783 8.28697 6.90315 8.41465 6.7537C9.06494 5.99266 10.1323 5.74725 10.9826 6.17836L11.6758 6.52985C12.5298 6.96286 12.9337 7.94412 12.6218 8.83125ZM5.63698 9.35582C6.16822 9.02629 6.72256 8.54468 7.24273 8.0271L7.2497 8.03083L12.0011 10.5242C11.8183 10.9995 11.6305 11.4645 11.4479 11.8806C10.8759 13.1842 10.2063 14.2617 9.82549 14.8321C9.77122 14.9134 9.68306 14.94 9.60213 14.9126C9.28437 14.8053 8.83038 14.6365 8.2892 14.3916C8.54039 14.1267 8.90473 13.6938 9.25387 13.0989C9.40475 12.8419 9.31756 12.5156 9.05912 12.3701C8.80069 12.2246 8.46888 12.3151 8.31802 12.5721C8.03737 13.0503 7.69459 13.5212 7.27428 13.8886C6.95373 13.7156 6.61772 13.5204 6.27288 13.3011C5.9925 13.1227 5.72992 12.9498 5.48414 12.7826C5.61203 12.6966 5.75226 12.5912 5.9028 12.4621C6.12923 12.2679 6.15172 11.9322 5.95303 11.7124C5.75435 11.4925 5.40977 11.4717 5.18336 11.6658C4.85012 11.9516 4.6174 12.0604 4.52359 12.097C3.66637 11.453 3.09205 10.9242 2.72036 10.5386C3.44046 10.4046 4.45768 10.0874 5.63698 9.35582Z" fill="currentColor"/>
|
5
|
+
</svg>
|
@@ -2,6 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react';
|
|
2
2
|
import Comments from './Comments';
|
3
3
|
import '../../assets/styles/_colors.scss';
|
4
4
|
import './Comments.scss';
|
5
|
+
import { CommentType } from './type';
|
5
6
|
import React from 'react';
|
6
7
|
|
7
8
|
const meta: Meta<typeof Comments> = {
|
@@ -37,9 +38,26 @@ export const basicCommentWithOutData: Story = {
|
|
37
38
|
export const basicCommentWithData: Story = {
|
38
39
|
render: () => {
|
39
40
|
const handleCommentsDataChange = (inputValue: string) => {
|
40
|
-
//DEMO: we are getting that value from
|
41
|
+
//DEMO: we are getting that value from Comment
|
41
42
|
console.info('Confirmed input value:', inputValue);
|
42
43
|
};
|
44
|
+
const handleAddComment = (
|
45
|
+
newComment: CommentType,
|
46
|
+
parentNode: CommentType | null
|
47
|
+
) => {
|
48
|
+
console.info('Adding', newComment, parentNode);
|
49
|
+
};
|
50
|
+
|
51
|
+
const handleEditComment = (
|
52
|
+
commentId: string,
|
53
|
+
updatedDescription: string,
|
54
|
+
updatedNode: CommentType | null
|
55
|
+
) => {
|
56
|
+
console.info('Updated', commentId, updatedDescription, updatedNode);
|
57
|
+
};
|
58
|
+
const handleDelete = (id: string | number) => {
|
59
|
+
console.info('Delete Comment ID:', id);
|
60
|
+
};
|
43
61
|
return (
|
44
62
|
<Comments
|
45
63
|
onCommentsDataChange={handleCommentsDataChange}
|
@@ -201,9 +219,9 @@ export const basicCommentWithData: Story = {
|
|
201
219
|
},
|
202
220
|
],
|
203
221
|
}}
|
204
|
-
|
205
|
-
|
206
|
-
handleDeleteComment={
|
222
|
+
handleEditComment={handleEditComment}
|
223
|
+
handleAddComment={handleAddComment}
|
224
|
+
handleDeleteComment={handleDelete}
|
207
225
|
/>
|
208
226
|
);
|
209
227
|
},
|
@@ -10,7 +10,9 @@ const initialComments: CommentType = {
|
|
10
10
|
|
11
11
|
const Comments = ({
|
12
12
|
commentsData,
|
13
|
-
|
13
|
+
handleAddComment,
|
14
|
+
handleEditComment,
|
15
|
+
handleDeleteComment,
|
14
16
|
onCommentsDataChange,
|
15
17
|
}: CommentsProps) => {
|
16
18
|
const [commentData, setCommentsData] = useState(
|
@@ -21,21 +23,38 @@ const Comments = ({
|
|
21
23
|
const handleInsertNode: HandleNodeFunction = (commentId, item) => {
|
22
24
|
const updatedTree = insertNode(commentData, commentId, item);
|
23
25
|
setCommentsData({ ...updatedTree });
|
26
|
+
const updatedNode = findNode(updatedTree, commentId);
|
27
|
+
if (handleAddComment) handleAddComment(item, updatedNode);
|
24
28
|
};
|
25
29
|
|
26
30
|
const handleEditNode: HandleNodeFunction = (commentId, value) => {
|
27
31
|
const updatedTree = editNode(commentData, commentId, value);
|
28
32
|
setCommentsData({ ...updatedTree });
|
33
|
+
const updatedNode = findNode(updatedTree, commentId);
|
34
|
+
if (handleEditComment) handleEditComment(commentId, value, updatedNode);
|
29
35
|
};
|
30
36
|
|
31
37
|
const handleDeleteNode = (commentId: number) => {
|
32
38
|
const updatedTree = deleteNode(commentData, commentId);
|
33
39
|
setCommentsData({ ...updatedTree });
|
40
|
+
if (handleDeleteComment) handleDeleteComment(commentId);
|
34
41
|
};
|
35
42
|
useEffect(() => {
|
36
43
|
onCommentsDataChange(commentData);
|
37
44
|
}, [commentData, onCommentsDataChange]);
|
45
|
+
const findNode = (
|
46
|
+
node: CommentType,
|
47
|
+
id: number | string
|
48
|
+
): CommentType | null => {
|
49
|
+
if (node.id === id) return node;
|
50
|
+
|
51
|
+
for (const child of node.comments) {
|
52
|
+
const found = findNode(child, id);
|
53
|
+
if (found) return found;
|
54
|
+
}
|
38
55
|
|
56
|
+
return null;
|
57
|
+
};
|
39
58
|
return (
|
40
59
|
<div className="ff-comments-container">
|
41
60
|
<Comment
|
@@ -29,8 +29,8 @@ export type HandleDeleteComment = (commentId: string) => void;
|
|
29
29
|
export type HandleNodeFunction = (commentId: string, value: string) => void;
|
30
30
|
export interface CommentsProps {
|
31
31
|
commentsData: any;
|
32
|
-
handleAddComment:
|
33
|
-
handleEditComment:
|
34
|
-
handleDeleteComment:
|
32
|
+
handleAddComment: any;
|
33
|
+
handleEditComment: any;
|
34
|
+
handleDeleteComment: any;
|
35
35
|
onCommentsDataChange: (data: any) => void;
|
36
36
|
}
|
@@ -127,6 +127,7 @@ import LabelPlusIcon from '../../assets/icons/label_plus.svg?react';
|
|
127
127
|
import Drag from '../../assets/icons/drag_icon.svg?react';
|
128
128
|
import BackwardIcon from '../../assets/icons/backward_icon.svg?react';
|
129
129
|
import ForwardIcon from '../../assets/icons/forward_icon.svg?react';
|
130
|
+
import ClearCache from '../../assets/icons/clear_cache.svg?react';
|
130
131
|
import Reload from '../../assets/icons/reload.svg?react';
|
131
132
|
import WindowMaximize from '../../assets/icons/window_maximize.svg?react';
|
132
133
|
import WindowRestore from '../../assets/icons/window_restore.svg?react';
|
@@ -384,6 +385,7 @@ Components['browser_stack_icon'] = BrowserStack;
|
|
384
385
|
Components['run_icon'] = Run;
|
385
386
|
Components['backward_icon'] = BackwardIcon;
|
386
387
|
Components['forward_icon'] = ForwardIcon;
|
388
|
+
Components['clear_cache'] = ClearCache;
|
387
389
|
Components['reload'] = Reload;
|
388
390
|
Components['window_maximize'] = WindowMaximize;
|
389
391
|
Components['window_restore'] = WindowRestore;
|
@@ -12,56 +12,56 @@
|
|
12
12
|
&.landscape {
|
13
13
|
gap: 38px;
|
14
14
|
}
|
15
|
-
}
|
16
15
|
|
17
|
-
.ff-mobileskin-container {
|
18
|
-
|
19
|
-
|
16
|
+
.ff-mobileskin-container {
|
17
|
+
@extend .ff-mobileskin-wrapper;
|
18
|
+
.ff-mobile-container {
|
19
|
+
@include center-content;
|
20
|
+
border: 8px solid var(--text-color);
|
21
|
+
border-radius: 30px;
|
22
|
+
position: relative;
|
23
|
+
overflow: hidden;
|
20
24
|
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
overflow: hidden;
|
25
|
+
&::-webkit-scrollbar {
|
26
|
+
width: 0;
|
27
|
+
height: 0;
|
28
|
+
}
|
26
29
|
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
+
&::-webkit-scrollbar-thumb {
|
31
|
+
background-color: transparent;
|
32
|
+
}
|
33
|
+
.ff-mobile-image-container {
|
34
|
+
@include center-content;
|
35
|
+
overflow: hidden;
|
36
|
+
}
|
37
|
+
}
|
30
38
|
}
|
31
39
|
|
32
|
-
|
33
|
-
background-color:
|
40
|
+
.ff-notch {
|
41
|
+
background-color: var(--text-color);
|
42
|
+
border-radius: 24px;
|
43
|
+
position: absolute;
|
44
|
+
&.android-notch {
|
45
|
+
border-radius: 50%;
|
46
|
+
}
|
34
47
|
}
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
height: 32px;
|
50
|
-
padding: 8px;
|
51
|
-
display: flex;
|
52
|
-
justify-content: space-evenly;
|
53
|
-
align-items: center;
|
54
|
-
border: 1px solid var(--brand-color);
|
55
|
-
border-radius: 24px;
|
56
|
-
}
|
57
|
-
|
58
|
-
.ff-nav-bar-icon {
|
59
|
-
height: 16px;
|
60
|
-
padding: 8px;
|
61
|
-
border-right: 1px solid var(--brand-color);
|
62
|
-
@include center-content;
|
48
|
+
.ff-nav-bar {
|
49
|
+
height: 32px;
|
50
|
+
padding: 8px;
|
51
|
+
display: flex;
|
52
|
+
justify-content: space-evenly;
|
53
|
+
align-items: center;
|
54
|
+
border: 1px solid var(--brand-color);
|
55
|
+
border-radius: 24px;
|
56
|
+
}
|
57
|
+
.ff-nav-bar-icon {
|
58
|
+
height: 16px;
|
59
|
+
padding: 8px;
|
60
|
+
border-right: 1px solid var(--brand-color);
|
61
|
+
@include center-content;
|
63
62
|
|
64
|
-
|
65
|
-
|
63
|
+
&.last-icon {
|
64
|
+
border-right: none;
|
65
|
+
}
|
66
66
|
}
|
67
67
|
}
|
@@ -22,7 +22,9 @@ const MobileSkin: React.FC<MobileSkinProps> = ({
|
|
22
22
|
|
23
23
|
return (
|
24
24
|
<div
|
25
|
-
className={`ff-mobileskin-wrapper ${
|
25
|
+
className={`ff-mobileskin-wrapper ${
|
26
|
+
isPortrait ? 'portrait' : 'landscape'
|
27
|
+
}`}
|
26
28
|
>
|
27
29
|
<div
|
28
30
|
className="ff-mobileskin-container"
|
@@ -36,7 +38,6 @@ const MobileSkin: React.FC<MobileSkinProps> = ({
|
|
36
38
|
style={{
|
37
39
|
width: containerWidth,
|
38
40
|
height: containerHeight,
|
39
|
-
borderRadius: isIos ? '30px' : '10px',
|
40
41
|
}}
|
41
42
|
>
|
42
43
|
<div className="ff-mobile-image-container">
|
@@ -55,18 +56,18 @@ const MobileSkin: React.FC<MobileSkinProps> = ({
|
|
55
56
|
</div>
|
56
57
|
</div>
|
57
58
|
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
59
|
+
<div
|
60
|
+
className={`ff-notch ${!isIos ? 'android-notch' : ''}`}
|
61
|
+
style={{
|
62
|
+
height: !isIos ? 15 : isPortrait ? notchHeight : notchWidth,
|
63
|
+
width: !isIos ? 15 : isPortrait ? notchWidth : notchHeight,
|
64
|
+
transform: isPortrait
|
65
|
+
? `translate(${mobileWidth * 0.01}px, ${mobileHeight * -0.43}px)`
|
66
|
+
: `translate(${containerWidth * -0.46}px, ${
|
67
|
+
containerHeight * -0.01
|
68
|
+
}px)`,
|
69
|
+
}}
|
70
|
+
></div>
|
70
71
|
</div>
|
71
72
|
<div className="ff-nav-bar">
|
72
73
|
{navBarIcons.map((icon, index) => (
|
@@ -13,6 +13,7 @@
|
|
13
13
|
|
14
14
|
.ff-tab-button {
|
15
15
|
&--default {
|
16
|
+
position: relative;
|
16
17
|
border: none;
|
17
18
|
background: none;
|
18
19
|
padding: 0 4px;
|
@@ -129,4 +130,22 @@
|
|
129
130
|
.ff-tab-content {
|
130
131
|
width: inherit;
|
131
132
|
}
|
133
|
+
.ff-defaultStatus {
|
134
|
+
position: absolute;
|
135
|
+
top: 2px;
|
136
|
+
right: 0px;
|
137
|
+
width: 6px;
|
138
|
+
height: 6px;
|
139
|
+
background-color: transparent;
|
140
|
+
border-radius: 50%;
|
141
|
+
|
142
|
+
&.ff-successStatus {
|
143
|
+
background-color: var(--confirm-tick-icon-color);
|
144
|
+
box-shadow: 0px 1px 1px 0px var(--toggle-strip-shadow);
|
145
|
+
}
|
146
|
+
&.ff-dangerStatus {
|
147
|
+
background-color: var(--delete-text-color);
|
148
|
+
box-shadow: 0px 1px 1px 0px var(--toggle-strip-shadow);
|
149
|
+
}
|
150
|
+
}
|
132
151
|
}
|
@@ -58,6 +58,15 @@ const Tabs = ({
|
|
58
58
|
'ff-tab-bar--active': activeTabId === tab.id,
|
59
59
|
})}
|
60
60
|
></div>
|
61
|
+
<span
|
62
|
+
className={`ff-defaultStatus ${
|
63
|
+
tab.status === 'success'
|
64
|
+
? 'ff-successStatus'
|
65
|
+
: tab.status === 'error'
|
66
|
+
? 'ff-dangerStatus'
|
67
|
+
: ''
|
68
|
+
}`}
|
69
|
+
></span>
|
61
70
|
</button>
|
62
71
|
))}
|
63
72
|
</div>
|
package/src/index.ts
CHANGED
@@ -162,6 +162,7 @@ import {
|
|
162
162
|
ELEMENTS_WHITE_SPACE_REGEX,
|
163
163
|
PARAMETER_ALPHANUMERIC_REGEX,
|
164
164
|
} from './validations/regex';
|
165
|
+
import { getFromIndexedDB, saveToIndexedDB } from './utils/indexDBStore/indexDB';
|
165
166
|
|
166
167
|
export {
|
167
168
|
Button,
|
@@ -270,6 +271,8 @@ export {
|
|
270
271
|
FormatString,
|
271
272
|
hasDuplicateFile,
|
272
273
|
useKeyboardActions,
|
274
|
+
saveToIndexedDB,
|
275
|
+
getFromIndexedDB,
|
273
276
|
|
274
277
|
EMAIL_REGEX,
|
275
278
|
URL_REGEX,
|
@@ -0,0 +1,37 @@
|
|
1
|
+
import { openDB, DBSchema } from 'idb';
|
2
|
+
|
3
|
+
// Define the database schema
|
4
|
+
interface MyDB extends DBSchema {
|
5
|
+
items: {
|
6
|
+
key: string; // Key for each item
|
7
|
+
value: string; // Stored value, encoded as a string
|
8
|
+
};
|
9
|
+
}
|
10
|
+
|
11
|
+
// Open the database
|
12
|
+
const dbPromise = openDB<MyDB>('my-database', 1, {
|
13
|
+
upgrade(db) {
|
14
|
+
if (!db.objectStoreNames.contains('items')) {
|
15
|
+
db.createObjectStore('items');
|
16
|
+
}
|
17
|
+
},
|
18
|
+
});
|
19
|
+
|
20
|
+
// Encoding utility
|
21
|
+
const encode = (data: string): string => btoa(unescape(encodeURIComponent(data))); // Example: Base64 encoding
|
22
|
+
// Decoding utility
|
23
|
+
const decode = (data: string): string => decodeURIComponent(escape(atob(data)));
|
24
|
+
|
25
|
+
// Save data to IndexedDB
|
26
|
+
export const saveToIndexedDB = async (key: string, value: string): Promise<void> => {
|
27
|
+
const db = await dbPromise;
|
28
|
+
const encodedValue = encode(value);
|
29
|
+
await db.put('items', encodedValue, key);
|
30
|
+
};
|
31
|
+
|
32
|
+
// Get data from IndexedDB
|
33
|
+
export const getFromIndexedDB = async (key: string): Promise<string | null> => {
|
34
|
+
const db = await dbPromise;
|
35
|
+
const encodedValue = await db.get('items', key);
|
36
|
+
return encodedValue ? decode(encodedValue) : null;
|
37
|
+
};
|