@jetshop/ui 5.13.1 → 5.13.11-0
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/Accordion/Accordion.d.ts +33 -33
- package/Accordion/Accordion.js +58 -58
- package/Accordion/Accordion.test.js +73 -73
- package/Accordion/__doc_utils__/AccordionHeader.js +12 -12
- package/Auth/FormFields/CountriesInput.d.ts +14 -14
- package/Auth/FormFields/CountriesInput.js +27 -27
- package/Auth/LogInBehavior.d.ts +22 -22
- package/Auth/LogInBehavior.js +23 -23
- package/Auth/LogInFormProvider.d.ts +7 -7
- package/Auth/LogInFormProvider.js +70 -70
- package/Auth/LogOut.d.ts +10 -10
- package/Auth/LogOut.js +23 -23
- package/Auth/logInValidator.d.ts +8 -8
- package/Auth/logInValidator.js +15 -15
- package/Breadcrumbs/Breadcrumbs.d.ts +14 -14
- package/Breadcrumbs/Breadcrumbs.js +83 -83
- package/Breadcrumbs/getParentsOrCanonicalRoute.d.ts +3 -3
- package/Breadcrumbs/getParentsOrCanonicalRoute.js +13 -13
- package/Breadcrumbs/index.d.ts +1 -1
- package/Breadcrumbs/index.js +1 -1
- package/Breakpoints.d.ts +12 -12
- package/Breakpoints.js +35 -35
- package/Button/Button.d.ts +14 -14
- package/Button/Button.js +59 -59
- package/Button/OutlineButton.d.ts +4 -4
- package/Button/OutlineButton.js +9 -9
- package/Button/SecondaryButton.d.ts +3 -3
- package/Button/SecondaryButton.js +8 -8
- package/Button/TrendButton.d.ts +3 -3
- package/Button/TrendButton.js +7 -7
- package/Button/index.d.ts +4 -4
- package/Button/index.js +4 -4
- package/CategoryLink.d.ts +9 -9
- package/CategoryLink.js +42 -42
- package/ChannelSelector/ChannelListItem.d.ts +10 -10
- package/ChannelSelector/ChannelListItem.js +50 -50
- package/ChannelSelector/ChannelListItem.test.js +85 -85
- package/ChannelSelector/ChannelSelector.d.ts +63 -63
- package/ChannelSelector/ChannelSelector.js +79 -79
- package/ChannelSelector/ChannelSelector.test.js +167 -167
- package/ChannelSelector/ChannelSelectorButtons.d.ts +3 -3
- package/ChannelSelector/ChannelSelectorButtons.js +19 -19
- package/ChannelSelector/Channels.d.ts +17 -17
- package/ChannelSelector/Channels.js +11 -11
- package/ChannelSelector/Channels.test.js +90 -90
- package/ChannelSelector/LargeSelector.d.ts +3 -3
- package/ChannelSelector/LargeSelector.js +66 -66
- package/ChannelSelector/MiniSelector.d.ts +4 -4
- package/ChannelSelector/MiniSelector.js +57 -57
- package/ChannelSelector/Region.d.ts +28 -28
- package/ChannelSelector/Region.js +20 -20
- package/ChannelSelector/Region.test.js +37 -37
- package/ChannelSelector/exampleChannels.js +577 -577
- package/ChannelSelector/groupBy.d.ts +7 -7
- package/ChannelSelector/groupBy.js +15 -15
- package/ChannelSelector/groupBy.test.js +42 -42
- package/Checkbox/Checkbox.d.ts +10 -10
- package/Checkbox/Checkbox.js +68 -68
- package/Checkbox/Checkbox.js.map +1 -1
- package/Checkbox/CheckboxGroup.d.ts +23 -23
- package/Checkbox/CheckboxGroup.js +21 -21
- package/Checkbox/index.d.ts +2 -2
- package/Checkbox/index.js +2 -2
- package/ContentPageLink.d.ts +9 -9
- package/ContentPageLink.js +36 -36
- package/ContentRenderer.d.ts +9 -9
- package/ContentRenderer.js +35 -35
- package/DropdownMenu/Button.d.ts +7 -7
- package/DropdownMenu/Button.js +31 -31
- package/DropdownMenu/DropdownMenu.d.ts +21 -21
- package/DropdownMenu/DropdownMenu.js +71 -71
- package/DropdownMenu/Item.d.ts +13 -13
- package/DropdownMenu/Item.js +47 -47
- package/DropdownMenu/Items.d.ts +16 -16
- package/DropdownMenu/Items.js +52 -52
- package/DropdownMenu/index.d.ts +4 -4
- package/DropdownMenu/index.js +4 -4
- package/ErrorBoundary/Generic.d.ts +17 -17
- package/ErrorBoundary/Generic.js +68 -68
- package/ErrorBoundary/PassThrough.d.ts +3 -3
- package/ErrorBoundary/PassThrough.js +6 -6
- package/Gallery/Gallery.d.ts +39 -39
- package/Gallery/Gallery.js +121 -121
- package/Gallery/constructGallery.d.ts +15 -15
- package/Gallery/constructGallery.js +40 -40
- package/Image/B2BImage.d.ts +50 -50
- package/Image/B2BImage.js +52 -52
- package/Image/BaseImage.d.ts +39 -39
- package/Image/BaseImage.js +191 -191
- package/Image/Fallback.d.ts +5 -5
- package/Image/Fallback.js +3 -3
- package/Image/FlightImage.d.ts +52 -52
- package/Image/FlightImage.js +57 -57
- package/Image/FlightImage.test.js +277 -277
- package/Image/Image.d.ts +2 -2
- package/Image/Image.js +2 -2
- package/Image/index.d.ts +1 -1
- package/Image/index.js +1 -1
- package/Image/useConstructImage.d.ts +46 -46
- package/Image/useConstructImage.js +96 -96
- package/Image/utils/aspectRatioToFraction.d.ts +2 -2
- package/Image/utils/aspectRatioToFraction.js +10 -10
- package/Image/utils/getFullUrl.d.ts +6 -6
- package/Image/utils/getFullUrl.js +17 -17
- package/Image/utils/getImageWidth.d.ts +1 -1
- package/Image/utils/getImageWidth.js +11 -11
- package/Image/utils/getImageWidths.d.ts +2 -2
- package/Image/utils/getImageWidths.js +13 -13
- package/Image/utils/getLQIP.d.ts +8 -8
- package/Image/utils/getLQIP.js +19 -19
- package/Image/utils/getLargestSize.d.ts +7 -7
- package/Image/utils/getLargestSize.js +16 -16
- package/Image/utils/getSizeForBreakpoint.d.ts +2 -2
- package/Image/utils/getSizeForBreakpoint.js +15 -15
- package/Image/utils/getSizesMap.d.ts +2 -2
- package/Image/utils/getSizesMap.js +21 -21
- package/Image/utils/getSmallestSize.d.ts +2 -2
- package/Image/utils/getSmallestSize.js +11 -11
- package/Image/utils/getSrcSetFromWidths.d.ts +10 -10
- package/Image/utils/getSrcSetFromWidths.js +8 -8
- package/Image/utils/getSrcWithParams.d.ts +3 -3
- package/Image/utils/getSrcWithParams.js +28 -28
- package/Image/utils/paddingForAspectRatio.d.ts +1 -1
- package/Image/utils/paddingForAspectRatio.js +5 -5
- package/Image/utils/remToPx.d.ts +1 -1
- package/Image/utils/remToPx.js +1 -1
- package/Image/utils/sizeToNumber.d.ts +2 -2
- package/Image/utils/sizeToNumber.js +26 -26
- package/Input/Input.d.ts +6 -6
- package/Input/Input.js +44 -44
- package/Input/index.d.ts +3 -3
- package/Input/index.js +3 -3
- package/JetshopText.d.ts +3 -3
- package/JetshopText.js +11 -11
- package/Loading/LoadingBar.d.ts +8 -8
- package/Loading/LoadingBar.js +57 -57
- package/Loading/LoadingLine.d.ts +31 -31
- package/Loading/LoadingLine.js +25 -25
- package/Loading/LoadingLine.test.js +18 -18
- package/Loading/NetworkStatusNotifier.d.ts +2 -2
- package/Loading/NetworkStatusNotifier.js +3 -3
- package/Menu/GetMoreSubcategoriesQuery.gql +25 -25
- package/Menu/MenuContainer.d.ts +28 -28
- package/Menu/MenuContainer.js +45 -45
- package/Menu/MenuContainer.test.js +245 -245
- package/Menu/RecursiveTree.d.ts +28 -28
- package/Menu/RecursiveTree.js +90 -90
- package/Menu/RecursiveTree.test.js +416 -416
- package/Modal/Drawer/Drawer.d.ts +11 -11
- package/Modal/Drawer/Drawer.js +30 -30
- package/Modal/Drawer/DrawerTarget.d.ts +6 -6
- package/Modal/Drawer/DrawerTarget.js +11 -11
- package/Modal/Drawer/DrawerTarget.test.js +92 -92
- package/Modal/Drawer/DrawerTrigger.d.ts +11 -11
- package/Modal/Drawer/DrawerTrigger.js +15 -15
- package/Modal/Drawer/DrawerTrigger.test.js +51 -51
- package/Modal/Drawer/index.d.ts +3 -3
- package/Modal/Drawer/index.js +3 -3
- package/Modal/Flyout/FlyoutTarget.d.ts +10 -10
- package/Modal/Flyout/FlyoutTarget.js +14 -14
- package/Modal/Flyout/FlyoutTarget.test.js +84 -84
- package/Modal/Flyout/FlyoutTrigger.d.ts +15 -15
- package/Modal/Flyout/FlyoutTrigger.js +17 -17
- package/Modal/Flyout/FlyoutTrigger.test.js +72 -72
- package/Modal/Flyout/index.d.ts +2 -2
- package/Modal/Flyout/index.js +2 -2
- package/Modal/ModalContext.d.ts +26 -26
- package/Modal/ModalContext.js +8 -8
- package/Modal/ModalProvider.d.ts +5 -5
- package/Modal/ModalProvider.js +82 -82
- package/Modal/ModalProvider.test.js +26 -26
- package/Modal/ModalRoot.d.ts +3 -3
- package/Modal/ModalRoot.js +43 -43
- package/Modal/ModalRoot.test.js +80 -80
- package/Modal/ModalTrigger.d.ts +9 -9
- package/Modal/ModalTrigger.js +8 -8
- package/Modal/__test_utils__/getComponentWithModalContext.js +29 -29
- package/Pagination/Pagination.d.ts +7 -7
- package/Pagination/Pagination.js +22 -22
- package/Pagination/PaginationBehaviour.d.ts +52 -52
- package/Pagination/PaginationBehaviour.js +67 -67
- package/Pagination/index.d.ts +2 -2
- package/Pagination/index.js +2 -2
- package/Pagination/usePagination.d.ts +15 -15
- package/Pagination/usePagination.js +45 -45
- package/PreOrderDateSelector/PreOrderDateSelector.d.ts +20 -20
- package/PreOrderDateSelector/PreOrderDateSelector.js +73 -73
- package/PreOrderDateSelector/index.d.ts +2 -2
- package/PreOrderDateSelector/index.js +2 -2
- package/Price/Currency.d.ts +9 -9
- package/Price/Currency.js +10 -10
- package/Price/Price.d.ts +28 -28
- package/Price/Price.js +34 -34
- package/Price/index.d.ts +1 -1
- package/Price/index.js +1 -1
- package/ProductLink.d.ts +21 -21
- package/ProductLink.js +81 -81
- package/ProductList/Badges.d.ts +6 -6
- package/ProductList/Badges.js +55 -55
- package/ProductList/GridProduct.d.ts +24 -24
- package/ProductList/GridProduct.js +57 -57
- package/ProductList/ProductGrid.d.ts +16 -16
- package/ProductList/ProductGrid.js +29 -29
- package/ProductList/ProductImage.d.ts +12 -12
- package/ProductList/ProductImage.js +20 -20
- package/ProductSpecifications/ProductSpecifications.d.ts +8 -8
- package/ProductSpecifications/ProductSpecifications.js +77 -77
- package/ScrollRestorationHandler/ScrollRestorationHandler.d.ts +8 -8
- package/ScrollRestorationHandler/ScrollRestorationHandler.js +16 -16
- package/ScrollRestorationHandler/ScrollRestorationHandler.test.js +75 -75
- package/ScrollRestorationHandler/index.d.ts +1 -1
- package/ScrollRestorationHandler/index.js +1 -1
- package/ScrollRestorationHandler/isInIgnoredRouteTypes.d.ts +6 -6
- package/ScrollRestorationHandler/isInIgnoredRouteTypes.js +7 -7
- package/ScrollRestorationHandler/useScrollRestore.d.ts +7 -7
- package/ScrollRestorationHandler/useScrollRestore.js +19 -19
- package/Search/AutocompleteQuery.gql +10 -10
- package/Search/SearchAutoCompleteContainer.d.ts +45 -45
- package/Search/SearchAutoCompleteContainer.js +171 -171
- package/Search/SearchAutoCompleteContainer.test.js +460 -460
- package/Search/SearchField.d.ts +15 -15
- package/Search/SearchField.js +96 -96
- package/Search/SearchPage/PageOf.d.ts +5 -5
- package/Search/SearchPage/PageOf.js +6 -6
- package/Search/SearchPage/SearchMeta.d.ts +16 -16
- package/Search/SearchPage/SearchMeta.js +19 -19
- package/Search/SearchPage/SearchPageBehaviour.d.ts +19 -19
- package/Search/SearchPage/SearchPageBehaviour.js +66 -66
- package/Search/SuggestedTerm.d.ts +16 -16
- package/Search/SuggestedTerm.js +34 -34
- package/Search/index.d.ts +1 -1
- package/Search/index.js +1 -1
- package/Select/Components.d.ts +28 -28
- package/Select/Components.js +90 -90
- package/Select/SelectComponents/Quantity.d.ts +5 -5
- package/Select/SelectComponents/Quantity.js +7 -7
- package/Select/index.d.ts +5 -5
- package/Select/index.js +1 -1
- package/SortOrder/SortOrder.d.ts +16 -16
- package/SortOrder/SortOrder.js +31 -31
- package/SortOrder/SortOrderDropdown.d.ts +9 -9
- package/SortOrder/SortOrderDropdown.js +24 -24
- package/SortOrder/SortOrderList.d.ts +7 -7
- package/SortOrder/SortOrderList.js +16 -16
- package/StartPageRenderer/StartPageRenderer.d.ts +17 -17
- package/StartPageRenderer/StartPageRenderer.js +51 -51
- package/StartPageRenderer/index.d.ts +1 -1
- package/StartPageRenderer/index.js +1 -1
- package/Stock/StockStatusContainer.d.ts +16 -16
- package/Stock/StockStatusContainer.js +39 -39
- package/Stock/__tests__/StockStatusContainer.test.js +65 -65
- package/Text/Text.d.ts +11 -11
- package/Text/Text.js +21 -21
- package/Text/index.d.ts +3 -3
- package/Text/index.js +3 -3
- package/Theme/createTheme.d.ts +16 -16
- package/Theme/createTheme.js +4 -4
- package/Theme/cssReset.d.ts +1 -1
- package/Theme/cssReset.js +159 -159
- package/Theme/normalizeCss.d.ts +1 -1
- package/Theme/normalizeCss.js +356 -356
- package/Theme/sanitizeCss.d.ts +1 -1
- package/Theme/sanitizeCss.js +571 -571
- package/WindowGrid/WindowGrid.d.ts +11 -11
- package/WindowGrid/WindowGrid.js +57 -57
- package/WindowGrid/index.d.ts +1 -1
- package/WindowGrid/index.js +1 -1
- package/WindowGrid/useResizeObserver.d.ts +8 -8
- package/WindowGrid/useResizeObserver.js +13 -13
- package/WindowGrid/useScrollWithWindow.d.ts +12 -12
- package/WindowGrid/useScrollWithWindow.js +38 -38
- package/dependencies.d.ts +98 -98
- package/fuzzySearch/fuzzySearch.d.ts +8 -8
- package/fuzzySearch/fuzzySearch.js +42 -42
- package/fuzzySearch/index.d.ts +1 -1
- package/fuzzySearch/index.js +1 -1
- package/global.d.ts +1 -1
- package/hooks/index.d.ts +2 -2
- package/hooks/index.js +2 -2
- package/hooks/useOnClickOutside.d.ts +6 -6
- package/hooks/useOnClickOutside.js +16 -16
- package/hooks/useOnEsc.d.ts +4 -4
- package/hooks/useOnEsc.js +16 -16
- package/package.json +1 -1
- package/setupTests.js +2 -2
- package/svg/flags/ad.svg +150 -150
- package/svg/flags/ae.svg +6 -6
- package/svg/flags/af.svg +81 -81
- package/svg/flags/ag.svg +14 -14
- package/svg/flags/ai.svg +767 -767
- package/svg/flags/al.svg +5 -5
- package/svg/flags/am.svg +5 -5
- package/svg/flags/ao.svg +13 -13
- package/svg/flags/aq.svg +6 -6
- package/svg/flags/ar.svg +31 -31
- package/svg/flags/as.svg +33 -33
- package/svg/flags/at.svg +6 -6
- package/svg/flags/au.svg +9 -9
- package/svg/flags/aw.svg +186 -186
- package/svg/flags/ax.svg +18 -18
- package/svg/flags/az.svg +8 -8
- package/svg/flags/ba.svg +12 -12
- package/svg/flags/bb.svg +6 -6
- package/svg/flags/bd.svg +4 -4
- package/svg/flags/be.svg +7 -7
- package/svg/flags/bf.svg +7 -7
- package/svg/flags/bg.svg +7 -7
- package/svg/flags/bh.svg +11 -11
- package/svg/flags/bi.svg +15 -15
- package/svg/flags/bj.svg +14 -14
- package/svg/flags/bl.svg +7 -7
- package/svg/flags/bm.svg +98 -98
- package/svg/flags/bn.svg +36 -36
- package/svg/flags/bo.svg +676 -676
- package/svg/flags/bq.svg +5 -5
- package/svg/flags/br.svg +45 -45
- package/svg/flags/bs.svg +13 -13
- package/svg/flags/bt.svg +89 -89
- package/svg/flags/bv.svg +13 -13
- package/svg/flags/bw.svg +7 -7
- package/svg/flags/by.svg +20 -20
- package/svg/flags/bz.svg +145 -145
- package/svg/flags/ca.svg +4 -4
- package/svg/flags/cc.svg +19 -19
- package/svg/flags/cd.svg +5 -5
- package/svg/flags/cf.svg +15 -15
- package/svg/flags/cg.svg +12 -12
- package/svg/flags/ch.svg +9 -9
- package/svg/flags/ci.svg +7 -7
- package/svg/flags/ck.svg +9 -9
- package/svg/flags/cl.svg +13 -13
- package/svg/flags/cm.svg +15 -15
- package/svg/flags/cn.svg +11 -11
- package/svg/flags/co.svg +7 -7
- package/svg/flags/cr.svg +7 -7
- package/svg/flags/cu.svg +13 -13
- package/svg/flags/cv.svg +13 -13
- package/svg/flags/cw.svg +14 -14
- package/svg/flags/cx.svg +15 -15
- package/svg/flags/cy.svg +6 -6
- package/svg/flags/cz.svg +12 -12
- package/svg/flags/de.svg +5 -5
- package/svg/flags/dj.svg +13 -13
- package/svg/flags/dk.svg +5 -5
- package/svg/flags/dm.svg +152 -152
- package/svg/flags/do.svg +6745 -6745
- package/svg/flags/dz.svg +5 -5
- package/svg/flags/ec.svg +138 -138
- package/svg/flags/ee.svg +7 -7
- package/svg/flags/eg.svg +38 -38
- package/svg/flags/eh.svg +15 -15
- package/svg/flags/er.svg +8 -8
- package/svg/flags/es-ct.svg +4 -4
- package/svg/flags/es.svg +544 -544
- package/svg/flags/et.svg +14 -14
- package/svg/flags/eu.svg +28 -28
- package/svg/flags/fi.svg +5 -5
- package/svg/flags/fj.svg +120 -120
- package/svg/flags/fk.svg +89 -89
- package/svg/flags/fm.svg +11 -11
- package/svg/flags/fo.svg +12 -12
- package/svg/flags/fr.svg +7 -7
- package/svg/flags/ga.svg +7 -7
- package/svg/flags/gb-eng.svg +5 -5
- package/svg/flags/gb-nir.svg +131 -131
- package/svg/flags/gb-sct.svg +4 -4
- package/svg/flags/gb-wls.svg +9 -9
- package/svg/flags/gb.svg +15 -15
- package/svg/flags/gd.svg +27 -27
- package/svg/flags/ge.svg +6 -6
- package/svg/flags/gf.svg +5 -5
- package/svg/flags/gg.svg +9 -9
- package/svg/flags/gh.svg +6 -6
- package/svg/flags/gi.svg +32 -32
- package/svg/flags/gl.svg +4 -4
- package/svg/flags/gm.svg +14 -14
- package/svg/flags/gn.svg +7 -7
- package/svg/flags/gp.svg +7 -7
- package/svg/flags/gq.svg +23 -23
- package/svg/flags/gr.svg +22 -22
- package/svg/flags/gs.svg +201 -201
- package/svg/flags/gt.svg +204 -204
- package/svg/flags/gu.svg +39 -39
- package/svg/flags/gw.svg +13 -13
- package/svg/flags/gy.svg +9 -9
- package/svg/flags/hk.svg +30 -30
- package/svg/flags/hm.svg +9 -9
- package/svg/flags/hn.svg +18 -18
- package/svg/flags/hr.svg +58 -58
- package/svg/flags/ht.svg +116 -116
- package/svg/flags/hu.svg +7 -7
- package/svg/flags/id.svg +6 -6
- package/svg/flags/ie.svg +7 -7
- package/svg/flags/il.svg +14 -14
- package/svg/flags/im.svg +36 -36
- package/svg/flags/in.svg +25 -25
- package/svg/flags/io.svg +138 -138
- package/svg/flags/iq.svg +10 -10
- package/svg/flags/ir.svg +219 -219
- package/svg/flags/is.svg +12 -12
- package/svg/flags/it.svg +7 -7
- package/svg/flags/je.svg +31 -31
- package/svg/flags/jm.svg +8 -8
- package/svg/flags/jo.svg +16 -16
- package/svg/flags/jp.svg +11 -11
- package/svg/flags/ke.svg +23 -23
- package/svg/flags/kg.svg +15 -15
- package/svg/flags/kh.svg +61 -61
- package/svg/flags/ki.svg +36 -36
- package/svg/flags/km.svg +16 -16
- package/svg/flags/kn.svg +14 -14
- package/svg/flags/kp.svg +15 -15
- package/svg/flags/kr.svg +24 -24
- package/svg/flags/kw.svg +13 -13
- package/svg/flags/ky.svg +63 -63
- package/svg/flags/kz.svg +23 -23
- package/svg/flags/la.svg +12 -12
- package/svg/flags/lb.svg +15 -15
- package/svg/flags/lc.svg +8 -8
- package/svg/flags/li.svg +43 -43
- package/svg/flags/lk.svg +22 -22
- package/svg/flags/lr.svg +14 -14
- package/svg/flags/ls.svg +8 -8
- package/svg/flags/lt.svg +7 -7
- package/svg/flags/lu.svg +5 -5
- package/svg/flags/lv.svg +6 -6
- package/svg/flags/ly.svg +13 -13
- package/svg/flags/ma.svg +4 -4
- package/svg/flags/mc.svg +6 -6
- package/svg/flags/md.svg +70 -70
- package/svg/flags/me.svg +116 -116
- package/svg/flags/mf.svg +7 -7
- package/svg/flags/mg.svg +7 -7
- package/svg/flags/mh.svg +7 -7
- package/svg/flags/mk.svg +5 -5
- package/svg/flags/ml.svg +7 -7
- package/svg/flags/mm.svg +16 -16
- package/svg/flags/mn.svg +13 -13
- package/svg/flags/mo.svg +9 -9
- package/svg/flags/mp.svg +86 -86
- package/svg/flags/mq.svg +7 -7
- package/svg/flags/mr.svg +6 -6
- package/svg/flags/ms.svg +39 -39
- package/svg/flags/mt.svg +49 -49
- package/svg/flags/mu.svg +8 -8
- package/svg/flags/mv.svg +6 -6
- package/svg/flags/mw.svg +10 -10
- package/svg/flags/mx.svg +382 -382
- package/svg/flags/my.svg +15 -15
- package/svg/flags/mz.svg +21 -21
- package/svg/flags/na.svg +16 -16
- package/svg/flags/nc.svg +7 -7
- package/svg/flags/ne.svg +6 -6
- package/svg/flags/nf.svg +9 -9
- package/svg/flags/ng.svg +6 -6
- package/svg/flags/ni.svg +129 -129
- package/svg/flags/nl.svg +7 -7
- package/svg/flags/no.svg +7 -7
- package/svg/flags/np.svg +14 -14
- package/svg/flags/nr.svg +12 -12
- package/svg/flags/nu.svg +26 -26
- package/svg/flags/nz.svg +41 -41
- package/svg/flags/om.svg +115 -115
- package/svg/flags/pa.svg +14 -14
- package/svg/flags/pe.svg +244 -244
- package/svg/flags/pf.svg +19 -19
- package/svg/flags/pg.svg +9 -9
- package/svg/flags/ph.svg +13 -13
- package/svg/flags/pk.svg +15 -15
- package/svg/flags/pl.svg +6 -6
- package/svg/flags/pm.svg +7 -7
- package/svg/flags/pn.svg +62 -62
- package/svg/flags/pr.svg +13 -13
- package/svg/flags/ps.svg +15 -15
- package/svg/flags/pt.svg +57 -57
- package/svg/flags/pw.svg +11 -11
- package/svg/flags/py.svg +157 -157
- package/svg/flags/qa.svg +4 -4
- package/svg/flags/re.svg +7 -7
- package/svg/flags/ro.svg +7 -7
- package/svg/flags/rs.svg +292 -292
- package/svg/flags/ru.svg +7 -7
- package/svg/flags/rw.svg +13 -13
- package/svg/flags/sa.svg +26 -26
- package/svg/flags/sb.svg +13 -13
- package/svg/flags/sc.svg +14 -14
- package/svg/flags/sd.svg +13 -13
- package/svg/flags/se.svg +16 -16
- package/svg/flags/sg.svg +13 -13
- package/svg/flags/sh.svg +74 -74
- package/svg/flags/si.svg +18 -18
- package/svg/flags/sj.svg +7 -7
- package/svg/flags/sk.svg +9 -9
- package/svg/flags/sl.svg +7 -7
- package/svg/flags/sm.svg +91 -91
- package/svg/flags/sn.svg +8 -8
- package/svg/flags/so.svg +11 -11
- package/svg/flags/sr.svg +6 -6
- package/svg/flags/ss.svg +8 -8
- package/svg/flags/st.svg +16 -16
- package/svg/flags/sv.svg +606 -606
- package/svg/flags/sx.svg +56 -56
- package/svg/flags/sy.svg +6 -6
- package/svg/flags/sz.svg +45 -45
- package/svg/flags/tc.svg +67 -67
- package/svg/flags/td.svg +7 -7
- package/svg/flags/tf.svg +15 -15
- package/svg/flags/tg.svg +14 -14
- package/svg/flags/th.svg +7 -7
- package/svg/flags/tj.svg +22 -22
- package/svg/flags/tk.svg +5 -5
- package/svg/flags/tl.svg +13 -13
- package/svg/flags/tm.svg +206 -206
- package/svg/flags/tn.svg +13 -13
- package/svg/flags/to.svg +10 -10
- package/svg/flags/tr.svg +8 -8
- package/svg/flags/tt.svg +5 -5
- package/svg/flags/tv.svg +27 -27
- package/svg/flags/tw.svg +14 -14
- package/svg/flags/tz.svg +13 -13
- package/svg/flags/ua.svg +6 -6
- package/svg/flags/ug.svg +30 -30
- package/svg/flags/um.svg +15 -15
- package/svg/flags/un.svg +16 -16
- package/svg/flags/us.svg +10 -10
- package/svg/flags/uy.svg +28 -28
- package/svg/flags/uz.svg +30 -30
- package/svg/flags/va.svg +479 -479
- package/svg/flags/vc.svg +8 -8
- package/svg/flags/ve.svg +26 -26
- package/svg/flags/vg.svg +127 -127
- package/svg/flags/vi.svg +28 -28
- package/svg/flags/vn.svg +11 -11
- package/svg/flags/vu.svg +18 -18
- package/svg/flags/wf.svg +7 -7
- package/svg/flags/ws.svg +7 -7
- package/svg/flags/ye.svg +7 -7
- package/svg/flags/yt.svg +7 -7
- package/svg/flags/za.svg +17 -17
- package/svg/flags/zm.svg +27 -27
- package/svg/flags/zw.svg +21 -21
- package/test-utils/mock-response/product-status.js +44 -44
- package/utils/breakpoints.d.ts +23 -23
- package/utils/breakpoints.js +89 -89
- package/utils/callAllEventHandlers.d.ts +5 -5
- package/utils/callAllEventHandlers.js +8 -8
- package/utils/text.d.ts +1 -1
- package/utils/text.js +22 -22
- package/utils/theme.d.ts +3 -3
- package/utils/theme.js +4 -4
- package/utils/useHoverIntent.d.ts +10 -10
- package/utils/useHoverIntent.js +77 -77
- package/utils/usePropsOfType.d.ts +11 -11
- package/utils/usePropsOfType.js +17 -17
- package/withFlightUI.d.ts +17 -17
- package/withFlightUI.js +19 -19
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
import { aspectRatioToFraction } from './aspectRatioToFraction';
|
|
2
|
-
export function getSrcWithParams(width, aspect, src, includeViewportSize = true, options = { crop: false, webp: false }, timestamp) {
|
|
3
|
-
const resizeMethod = options.crop ? 'crop' : 'fit';
|
|
4
|
-
const gravity = options.gravity;
|
|
5
|
-
const quality = options.quality;
|
|
6
|
-
const height = aspect
|
|
7
|
-
? Math.round(width * aspectRatioToFraction(aspect))
|
|
8
|
-
: null;
|
|
9
|
-
let qstring;
|
|
10
|
-
if (height) {
|
|
11
|
-
qstring = `?extend=copy&width=${width}&method=${resizeMethod}&height=${height}`;
|
|
12
|
-
if (gravity)
|
|
13
|
-
qstring += `&gravity=${gravity}`;
|
|
14
|
-
}
|
|
15
|
-
else {
|
|
16
|
-
qstring = `?extend=copy&width=${width}&method=resize`;
|
|
17
|
-
}
|
|
18
|
-
if (quality)
|
|
19
|
-
qstring += `&quality=${quality}`;
|
|
20
|
-
if (options.webp)
|
|
21
|
-
qstring += `&type=webp`;
|
|
22
|
-
if (timestamp)
|
|
23
|
-
qstring += `×tamp=${timestamp}`;
|
|
24
|
-
if (options.focalPointX && options.focalPointY) {
|
|
25
|
-
qstring += `&im=RegionOfInterestCrop=(${width},${height}),style=crop,gravity=Center,regionOfInterest=(anchor=(x=${options.focalPointX},y=${options.focalPointY}),width=${width},height=${height})`;
|
|
26
|
-
}
|
|
27
|
-
return src + qstring + `${includeViewportSize ? ` ${width}w` : ''}`;
|
|
28
|
-
}
|
|
1
|
+
import { aspectRatioToFraction } from './aspectRatioToFraction';
|
|
2
|
+
export function getSrcWithParams(width, aspect, src, includeViewportSize = true, options = { crop: false, webp: false }, timestamp) {
|
|
3
|
+
const resizeMethod = options.crop ? 'crop' : 'fit';
|
|
4
|
+
const gravity = options.gravity;
|
|
5
|
+
const quality = options.quality;
|
|
6
|
+
const height = aspect
|
|
7
|
+
? Math.round(width * aspectRatioToFraction(aspect))
|
|
8
|
+
: null;
|
|
9
|
+
let qstring;
|
|
10
|
+
if (height) {
|
|
11
|
+
qstring = `?extend=copy&width=${width}&method=${resizeMethod}&height=${height}`;
|
|
12
|
+
if (gravity)
|
|
13
|
+
qstring += `&gravity=${gravity}`;
|
|
14
|
+
}
|
|
15
|
+
else {
|
|
16
|
+
qstring = `?extend=copy&width=${width}&method=resize`;
|
|
17
|
+
}
|
|
18
|
+
if (quality)
|
|
19
|
+
qstring += `&quality=${quality}`;
|
|
20
|
+
if (options.webp)
|
|
21
|
+
qstring += `&type=webp`;
|
|
22
|
+
if (timestamp)
|
|
23
|
+
qstring += `×tamp=${timestamp}`;
|
|
24
|
+
if (options.focalPointX && options.focalPointY) {
|
|
25
|
+
qstring += `&im=RegionOfInterestCrop=(${width},${height}),style=crop,gravity=Center,regionOfInterest=(anchor=(x=${options.focalPointX},y=${options.focalPointY}),width=${width},height=${height})`;
|
|
26
|
+
}
|
|
27
|
+
return src + qstring + `${includeViewportSize ? ` ${width}w` : ''}`;
|
|
28
|
+
}
|
|
29
29
|
//# sourceMappingURL=getSrcWithParams.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const paddingForAspectRatio: (aspect?: string) => string;
|
|
1
|
+
export declare const paddingForAspectRatio: (aspect?: string) => string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export const paddingForAspectRatio = (aspect = '1:1') => {
|
|
2
|
-
const numbers = aspect.split(/[^\d]/).map(Number);
|
|
3
|
-
const ratio = numbers[1] / numbers[0];
|
|
4
|
-
return `${(ratio * 100).toFixed(4)}%`;
|
|
5
|
-
};
|
|
1
|
+
export const paddingForAspectRatio = (aspect = '1:1') => {
|
|
2
|
+
const numbers = aspect.split(/[^\d]/).map(Number);
|
|
3
|
+
const ratio = numbers[1] / numbers[0];
|
|
4
|
+
return `${(ratio * 100).toFixed(4)}%`;
|
|
5
|
+
};
|
|
6
6
|
//# sourceMappingURL=paddingForAspectRatio.js.map
|
package/Image/utils/remToPx.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const remToPx: (rems: string, base?: number) => number;
|
|
1
|
+
export declare const remToPx: (rems: string, base?: number) => number;
|
package/Image/utils/remToPx.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export const remToPx = (rems, base = 16) => parseInt(rems) * base;
|
|
1
|
+
export const remToPx = (rems, base = 16) => parseInt(rems) * base;
|
|
2
2
|
//# sourceMappingURL=remToPx.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ImageBreakpointSize } from '../Image';
|
|
2
|
-
export declare const sizeToNumber: (size: ImageBreakpointSize) => number;
|
|
1
|
+
import { ImageBreakpointSize } from '../Image';
|
|
2
|
+
export declare const sizeToNumber: (size: ImageBreakpointSize) => number;
|
|
@@ -1,27 +1,27 @@
|
|
|
1
|
-
import { remToPx } from './remToPx';
|
|
2
|
-
const sizeRegexp = new RegExp(/(\d+)\s?(\w+)?/g);
|
|
3
|
-
export const sizeToNumber = (size) => {
|
|
4
|
-
if (typeof size === 'string') {
|
|
5
|
-
try {
|
|
6
|
-
sizeRegexp.lastIndex = 0;
|
|
7
|
-
const matches = sizeRegexp.exec(size.toLowerCase().trim());
|
|
8
|
-
const num = matches && matches[1];
|
|
9
|
-
const unit = matches && matches[2];
|
|
10
|
-
if ((!unit || unit === 'px') && num) {
|
|
11
|
-
return +num;
|
|
12
|
-
}
|
|
13
|
-
else if (unit === 'rem') {
|
|
14
|
-
return remToPx(num);
|
|
15
|
-
}
|
|
16
|
-
else {
|
|
17
|
-
throw Error('Unknown unit ' + unit);
|
|
18
|
-
}
|
|
19
|
-
}
|
|
20
|
-
catch (e) {
|
|
21
|
-
console.error('Responsive Image: Unit conversion failed for', size, e);
|
|
22
|
-
return 1;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
return size;
|
|
26
|
-
};
|
|
1
|
+
import { remToPx } from './remToPx';
|
|
2
|
+
const sizeRegexp = new RegExp(/(\d+)\s?(\w+)?/g);
|
|
3
|
+
export const sizeToNumber = (size) => {
|
|
4
|
+
if (typeof size === 'string') {
|
|
5
|
+
try {
|
|
6
|
+
sizeRegexp.lastIndex = 0;
|
|
7
|
+
const matches = sizeRegexp.exec(size.toLowerCase().trim());
|
|
8
|
+
const num = matches && matches[1];
|
|
9
|
+
const unit = matches && matches[2];
|
|
10
|
+
if ((!unit || unit === 'px') && num) {
|
|
11
|
+
return +num;
|
|
12
|
+
}
|
|
13
|
+
else if (unit === 'rem') {
|
|
14
|
+
return remToPx(num);
|
|
15
|
+
}
|
|
16
|
+
else {
|
|
17
|
+
throw Error('Unknown unit ' + unit);
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
catch (e) {
|
|
21
|
+
console.error('Responsive Image: Unit conversion failed for', size, e);
|
|
22
|
+
return 1;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
return size;
|
|
26
|
+
};
|
|
27
27
|
//# sourceMappingURL=sizeToNumber.js.map
|
package/Input/Input.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import React, { InputHTMLAttributes } from 'react';
|
|
2
|
-
declare const TrendInput: import("linaria/lib/StyledMeta").StyledMeta & React.FunctionComponent<React.ClassAttributes<HTMLInputElement> & React.InputHTMLAttributes<HTMLInputElement> & {
|
|
3
|
-
as?: React.ElementType<any>;
|
|
4
|
-
}>;
|
|
5
|
-
export default TrendInput;
|
|
6
|
-
export declare const Quantity: React.SFC<InputHTMLAttributes<HTMLInputElement>>;
|
|
1
|
+
import React, { InputHTMLAttributes } from 'react';
|
|
2
|
+
declare const TrendInput: import("linaria/lib/StyledMeta").StyledMeta & React.FunctionComponent<React.ClassAttributes<HTMLInputElement> & React.InputHTMLAttributes<HTMLInputElement> & {
|
|
3
|
+
as?: React.ElementType<any>;
|
|
4
|
+
}>;
|
|
5
|
+
export default TrendInput;
|
|
6
|
+
export declare const Quantity: React.SFC<InputHTMLAttributes<HTMLInputElement>>;
|
package/Input/Input.js
CHANGED
|
@@ -1,45 +1,45 @@
|
|
|
1
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
-
var t = {};
|
|
3
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
-
t[p] = s[p];
|
|
5
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
-
t[p[i]] = s[p[i]];
|
|
9
|
-
}
|
|
10
|
-
return t;
|
|
11
|
-
};
|
|
12
|
-
import { styled } from 'linaria/react';
|
|
13
|
-
import React from 'react';
|
|
14
|
-
const QuantityWrapper = styled('div') `
|
|
15
|
-
display: flex;
|
|
16
|
-
flex-direction: column;
|
|
17
|
-
align-items: center;
|
|
18
|
-
`;
|
|
19
|
-
const TrendInput = styled('input') `
|
|
20
|
-
border: 0.5px solid #bfbdbd;
|
|
21
|
-
height: 35px;
|
|
22
|
-
font-size: 20px;
|
|
23
|
-
`;
|
|
24
|
-
export default TrendInput;
|
|
25
|
-
const QuantityInput = styled('input') `
|
|
26
|
-
border: 1px solid #000000;
|
|
27
|
-
width: 54px;
|
|
28
|
-
height: 54px;
|
|
29
|
-
font-size: 20px;
|
|
30
|
-
text-align: center;
|
|
31
|
-
padding: 0px;
|
|
32
|
-
`;
|
|
33
|
-
const QuantityLabel = styled('label') `
|
|
34
|
-
font-size: 12px;
|
|
35
|
-
text-align: center;
|
|
36
|
-
letter-spacing: 0.05em;
|
|
37
|
-
margin-bottom: 10px;
|
|
38
|
-
`;
|
|
39
|
-
export const Quantity = (_a) => {
|
|
40
|
-
var { className } = _a, rest = __rest(_a, ["className"]);
|
|
41
|
-
return (React.createElement(QuantityWrapper, { className: className },
|
|
42
|
-
React.createElement(QuantityLabel, null, "Quantity"),
|
|
43
|
-
React.createElement(QuantityInput, Object.assign({}, rest))));
|
|
44
|
-
};
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
12
|
+
import { styled } from 'linaria/react';
|
|
13
|
+
import React from 'react';
|
|
14
|
+
const QuantityWrapper = styled('div') `
|
|
15
|
+
display: flex;
|
|
16
|
+
flex-direction: column;
|
|
17
|
+
align-items: center;
|
|
18
|
+
`;
|
|
19
|
+
const TrendInput = styled('input') `
|
|
20
|
+
border: 0.5px solid #bfbdbd;
|
|
21
|
+
height: 35px;
|
|
22
|
+
font-size: 20px;
|
|
23
|
+
`;
|
|
24
|
+
export default TrendInput;
|
|
25
|
+
const QuantityInput = styled('input') `
|
|
26
|
+
border: 1px solid #000000;
|
|
27
|
+
width: 54px;
|
|
28
|
+
height: 54px;
|
|
29
|
+
font-size: 20px;
|
|
30
|
+
text-align: center;
|
|
31
|
+
padding: 0px;
|
|
32
|
+
`;
|
|
33
|
+
const QuantityLabel = styled('label') `
|
|
34
|
+
font-size: 12px;
|
|
35
|
+
text-align: center;
|
|
36
|
+
letter-spacing: 0.05em;
|
|
37
|
+
margin-bottom: 10px;
|
|
38
|
+
`;
|
|
39
|
+
export const Quantity = (_a) => {
|
|
40
|
+
var { className } = _a, rest = __rest(_a, ["className"]);
|
|
41
|
+
return (React.createElement(QuantityWrapper, { className: className },
|
|
42
|
+
React.createElement(QuantityLabel, null, "Quantity"),
|
|
43
|
+
React.createElement(QuantityInput, Object.assign({}, rest))));
|
|
44
|
+
};
|
|
45
45
|
//# sourceMappingURL=Input.js.map
|
package/Input/index.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import Input, { Quantity } from './Input';
|
|
2
|
-
export default Input;
|
|
3
|
-
export { Quantity };
|
|
1
|
+
import Input, { Quantity } from './Input';
|
|
2
|
+
export default Input;
|
|
3
|
+
export { Quantity };
|
package/Input/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import Input, { Quantity } from './Input';
|
|
2
|
-
export default Input;
|
|
3
|
-
export { Quantity };
|
|
1
|
+
import Input, { Quantity } from './Input';
|
|
2
|
+
export default Input;
|
|
3
|
+
export { Quantity };
|
|
4
4
|
//# sourceMappingURL=index.js.map
|
package/JetshopText.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
declare const JetshopText: React.FC;
|
|
3
|
-
export default JetshopText;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
declare const JetshopText: React.FC;
|
|
3
|
+
export default JetshopText;
|
package/JetshopText.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { styled } from 'linaria/react';
|
|
3
|
-
import t from '@jetshop/intl';
|
|
4
|
-
const SmallText = styled('p') `
|
|
5
|
-
font-size: 12px;
|
|
6
|
-
`;
|
|
7
|
-
const JetshopText = () => {
|
|
8
|
-
return (React.createElement(SmallText, null,
|
|
9
|
-
React.createElement("a", { href: "https://www.norce.io" }, t('Powered by Norce'))));
|
|
10
|
-
};
|
|
11
|
-
export default JetshopText;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { styled } from 'linaria/react';
|
|
3
|
+
import t from '@jetshop/intl';
|
|
4
|
+
const SmallText = styled('p') `
|
|
5
|
+
font-size: 12px;
|
|
6
|
+
`;
|
|
7
|
+
const JetshopText = () => {
|
|
8
|
+
return (React.createElement(SmallText, null,
|
|
9
|
+
React.createElement("a", { href: "https://www.norce.io" }, t('Powered by Norce'))));
|
|
10
|
+
};
|
|
11
|
+
export default JetshopText;
|
|
12
12
|
//# sourceMappingURL=JetshopText.js.map
|
package/Loading/LoadingBar.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { RouteComponentProps } from 'react-router';
|
|
3
|
-
interface LoadingBarProps extends RouteComponentProps {
|
|
4
|
-
loading: boolean;
|
|
5
|
-
color: string;
|
|
6
|
-
}
|
|
7
|
-
declare const _default: React.ComponentClass<Pick<LoadingBarProps, "color" | "loading">, any> & import("react-router").WithRouterStatics<React.FC<LoadingBarProps>>;
|
|
8
|
-
export default _default;
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { RouteComponentProps } from 'react-router';
|
|
3
|
+
interface LoadingBarProps extends RouteComponentProps {
|
|
4
|
+
loading: boolean;
|
|
5
|
+
color: string;
|
|
6
|
+
}
|
|
7
|
+
declare const _default: React.ComponentClass<Pick<LoadingBarProps, "color" | "loading">, any> & import("react-router").WithRouterStatics<React.FC<LoadingBarProps>>;
|
|
8
|
+
export default _default;
|
package/Loading/LoadingBar.js
CHANGED
|
@@ -1,58 +1,58 @@
|
|
|
1
|
-
import { NProgress } from '@tanem/react-nprogress';
|
|
2
|
-
import { css, cx } from 'linaria';
|
|
3
|
-
import { styled } from 'linaria/react';
|
|
4
|
-
import React, { useEffect, useState } from 'react';
|
|
5
|
-
import ReactDOM from 'react-dom';
|
|
6
|
-
import { withRouter } from 'react-router';
|
|
7
|
-
import { useApolloNetworkStatus } from './NetworkStatusNotifier';
|
|
8
|
-
const canUseDOM = !!(typeof window !== 'undefined' &&
|
|
9
|
-
window.document &&
|
|
10
|
-
window.document.createElement);
|
|
11
|
-
const containerStyles = css `
|
|
12
|
-
position: fixed;
|
|
13
|
-
top: 0;
|
|
14
|
-
left: 0;
|
|
15
|
-
width: 100%;
|
|
16
|
-
z-index: 2147483647;
|
|
17
|
-
opacity: 1;
|
|
18
|
-
transition: opacity 0.4s ease-out;
|
|
19
|
-
&.is-finished {
|
|
20
|
-
opacity: 0;
|
|
21
|
-
}
|
|
22
|
-
`;
|
|
23
|
-
const Bar = styled('div') `
|
|
24
|
-
height: 2px;
|
|
25
|
-
transition: width 0.1s linear;
|
|
26
|
-
`;
|
|
27
|
-
const Container = function Container({ progress, className, color }) {
|
|
28
|
-
return (React.createElement("div", { className: cx(containerStyles, className) },
|
|
29
|
-
React.createElement(Bar, { className: "loading-bar", style: {
|
|
30
|
-
width: `${progress * 100}%`,
|
|
31
|
-
background: color
|
|
32
|
-
} })));
|
|
33
|
-
};
|
|
34
|
-
const MemoizedNProgress = React.memo(({ loading, color }) => {
|
|
35
|
-
return (React.createElement(NProgress, { isAnimating: loading }, ({ isFinished, progress }) => (React.createElement(Container, { progress: progress, className: isFinished && 'is-finished', color: color }))));
|
|
36
|
-
});
|
|
37
|
-
const LoadingBarClient = function LoadingBarClient(props) {
|
|
38
|
-
const [mounted, setMounted] = useState(false);
|
|
39
|
-
useEffect(() => {
|
|
40
|
-
setMounted(true);
|
|
41
|
-
}, []);
|
|
42
|
-
const status = useApolloNetworkStatus({
|
|
43
|
-
shouldHandleOperation: (operation) => operation.getContext().useNetworkStatusNotifier !== false
|
|
44
|
-
});
|
|
45
|
-
return (mounted &&
|
|
46
|
-
canUseDOM &&
|
|
47
|
-
ReactDOM.createPortal(React.createElement(MemoizedNProgress, { loading: status.numPendingMutations + status.numPendingQueries > 0, key: props.location.key, color: props.color }), document.getElementById('root')));
|
|
48
|
-
};
|
|
49
|
-
const LoadingBar = function LoadingBar(props) {
|
|
50
|
-
if (__IN_SERVER__) {
|
|
51
|
-
return null;
|
|
52
|
-
}
|
|
53
|
-
else {
|
|
54
|
-
return React.createElement(LoadingBarClient, Object.assign({}, props));
|
|
55
|
-
}
|
|
56
|
-
};
|
|
57
|
-
export default withRouter(LoadingBar);
|
|
1
|
+
import { NProgress } from '@tanem/react-nprogress';
|
|
2
|
+
import { css, cx } from 'linaria';
|
|
3
|
+
import { styled } from 'linaria/react';
|
|
4
|
+
import React, { useEffect, useState } from 'react';
|
|
5
|
+
import ReactDOM from 'react-dom';
|
|
6
|
+
import { withRouter } from 'react-router';
|
|
7
|
+
import { useApolloNetworkStatus } from './NetworkStatusNotifier';
|
|
8
|
+
const canUseDOM = !!(typeof window !== 'undefined' &&
|
|
9
|
+
window.document &&
|
|
10
|
+
window.document.createElement);
|
|
11
|
+
const containerStyles = css `
|
|
12
|
+
position: fixed;
|
|
13
|
+
top: 0;
|
|
14
|
+
left: 0;
|
|
15
|
+
width: 100%;
|
|
16
|
+
z-index: 2147483647;
|
|
17
|
+
opacity: 1;
|
|
18
|
+
transition: opacity 0.4s ease-out;
|
|
19
|
+
&.is-finished {
|
|
20
|
+
opacity: 0;
|
|
21
|
+
}
|
|
22
|
+
`;
|
|
23
|
+
const Bar = styled('div') `
|
|
24
|
+
height: 2px;
|
|
25
|
+
transition: width 0.1s linear;
|
|
26
|
+
`;
|
|
27
|
+
const Container = function Container({ progress, className, color }) {
|
|
28
|
+
return (React.createElement("div", { className: cx(containerStyles, className) },
|
|
29
|
+
React.createElement(Bar, { className: "loading-bar", style: {
|
|
30
|
+
width: `${progress * 100}%`,
|
|
31
|
+
background: color
|
|
32
|
+
} })));
|
|
33
|
+
};
|
|
34
|
+
const MemoizedNProgress = React.memo(({ loading, color }) => {
|
|
35
|
+
return (React.createElement(NProgress, { isAnimating: loading }, ({ isFinished, progress }) => (React.createElement(Container, { progress: progress, className: isFinished && 'is-finished', color: color }))));
|
|
36
|
+
});
|
|
37
|
+
const LoadingBarClient = function LoadingBarClient(props) {
|
|
38
|
+
const [mounted, setMounted] = useState(false);
|
|
39
|
+
useEffect(() => {
|
|
40
|
+
setMounted(true);
|
|
41
|
+
}, []);
|
|
42
|
+
const status = useApolloNetworkStatus({
|
|
43
|
+
shouldHandleOperation: (operation) => operation.getContext().useNetworkStatusNotifier !== false
|
|
44
|
+
});
|
|
45
|
+
return (mounted &&
|
|
46
|
+
canUseDOM &&
|
|
47
|
+
ReactDOM.createPortal(React.createElement(MemoizedNProgress, { loading: status.numPendingMutations + status.numPendingQueries > 0, key: props.location.key, color: props.color }), document.getElementById('root')));
|
|
48
|
+
};
|
|
49
|
+
const LoadingBar = function LoadingBar(props) {
|
|
50
|
+
if (__IN_SERVER__) {
|
|
51
|
+
return null;
|
|
52
|
+
}
|
|
53
|
+
else {
|
|
54
|
+
return React.createElement(LoadingBarClient, Object.assign({}, props));
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
export default withRouter(LoadingBar);
|
|
58
58
|
//# sourceMappingURL=LoadingBar.js.map
|
package/Loading/LoadingLine.d.ts
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
interface LoadingLineProps {
|
|
3
|
-
/** The color of each line
|
|
4
|
-
* @default #f5f5f5
|
|
5
|
-
*/
|
|
6
|
-
color?: string;
|
|
7
|
-
/** Width in rems
|
|
8
|
-
* @default 5
|
|
9
|
-
*/
|
|
10
|
-
widthRem?: number;
|
|
11
|
-
/**
|
|
12
|
-
* Rems to randomize the width of each line by. Will randomize on every
|
|
13
|
-
* render.
|
|
14
|
-
* @default 0
|
|
15
|
-
*/
|
|
16
|
-
randomizeWidthBy?: number;
|
|
17
|
-
/** How many lines to render
|
|
18
|
-
* @default 1
|
|
19
|
-
*/
|
|
20
|
-
count?: number;
|
|
21
|
-
/** The height of each line, in pixels
|
|
22
|
-
* @default 16
|
|
23
|
-
*/
|
|
24
|
-
heightPx?: number;
|
|
25
|
-
/** Optional className to apply to each line */
|
|
26
|
-
className?: string;
|
|
27
|
-
style?: any;
|
|
28
|
-
}
|
|
29
|
-
export declare const LoadingLine: React.FC<LoadingLineProps>;
|
|
30
|
-
export declare function randomizeWithinRange(value: number, range: number): number;
|
|
31
|
-
export {};
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
interface LoadingLineProps {
|
|
3
|
+
/** The color of each line
|
|
4
|
+
* @default #f5f5f5
|
|
5
|
+
*/
|
|
6
|
+
color?: string;
|
|
7
|
+
/** Width in rems
|
|
8
|
+
* @default 5
|
|
9
|
+
*/
|
|
10
|
+
widthRem?: number;
|
|
11
|
+
/**
|
|
12
|
+
* Rems to randomize the width of each line by. Will randomize on every
|
|
13
|
+
* render.
|
|
14
|
+
* @default 0
|
|
15
|
+
*/
|
|
16
|
+
randomizeWidthBy?: number;
|
|
17
|
+
/** How many lines to render
|
|
18
|
+
* @default 1
|
|
19
|
+
*/
|
|
20
|
+
count?: number;
|
|
21
|
+
/** The height of each line, in pixels
|
|
22
|
+
* @default 16
|
|
23
|
+
*/
|
|
24
|
+
heightPx?: number;
|
|
25
|
+
/** Optional className to apply to each line */
|
|
26
|
+
className?: string;
|
|
27
|
+
style?: any;
|
|
28
|
+
}
|
|
29
|
+
export declare const LoadingLine: React.FC<LoadingLineProps>;
|
|
30
|
+
export declare function randomizeWithinRange(value: number, range: number): number;
|
|
31
|
+
export {};
|
package/Loading/LoadingLine.js
CHANGED
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
-
var t = {};
|
|
3
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
-
t[p] = s[p];
|
|
5
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
-
t[p[i]] = s[p[i]];
|
|
9
|
-
}
|
|
10
|
-
return t;
|
|
11
|
-
};
|
|
12
|
-
import * as React from 'react';
|
|
13
|
-
export const LoadingLine = React.memo(function LoadingLine(_a) {
|
|
14
|
-
var { widthRem = 5, randomizeWidthBy = 0, count = 1, color = '#F5F5F5', heightPx = 16, className, children, style } = _a, rest = __rest(_a, ["widthRem", "randomizeWidthBy", "count", "color", "heightPx", "className", "children", "style"]);
|
|
15
|
-
const times = new Array(count).fill(null);
|
|
16
|
-
return (React.createElement(React.Fragment, null, times.map((_, index) => (React.createElement("div", Object.assign({}, rest, { key: index, className: className, style: Object.assign({ maxWidth: '100%', background: color, height: `${heightPx}px`, width: `${randomizeWidthBy
|
|
17
|
-
? randomizeWithinRange(widthRem, randomizeWidthBy)
|
|
18
|
-
: widthRem}rem` }, style) }), children)))));
|
|
19
|
-
});
|
|
20
|
-
export function randomizeWithinRange(value, range) {
|
|
21
|
-
const lowerBound = value - range;
|
|
22
|
-
const upperBound = value + range;
|
|
23
|
-
return (Math.round((Math.random() * (upperBound - lowerBound) + lowerBound) * 100) /
|
|
24
|
-
100);
|
|
25
|
-
}
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
12
|
+
import * as React from 'react';
|
|
13
|
+
export const LoadingLine = React.memo(function LoadingLine(_a) {
|
|
14
|
+
var { widthRem = 5, randomizeWidthBy = 0, count = 1, color = '#F5F5F5', heightPx = 16, className, children, style } = _a, rest = __rest(_a, ["widthRem", "randomizeWidthBy", "count", "color", "heightPx", "className", "children", "style"]);
|
|
15
|
+
const times = new Array(count).fill(null);
|
|
16
|
+
return (React.createElement(React.Fragment, null, times.map((_, index) => (React.createElement("div", Object.assign({}, rest, { key: index, className: className, style: Object.assign({ maxWidth: '100%', background: color, height: `${heightPx}px`, width: `${randomizeWidthBy
|
|
17
|
+
? randomizeWithinRange(widthRem, randomizeWidthBy)
|
|
18
|
+
: widthRem}rem` }, style) }), children)))));
|
|
19
|
+
});
|
|
20
|
+
export function randomizeWithinRange(value, range) {
|
|
21
|
+
const lowerBound = value - range;
|
|
22
|
+
const upperBound = value + range;
|
|
23
|
+
return (Math.round((Math.random() * (upperBound - lowerBound) + lowerBound) * 100) /
|
|
24
|
+
100);
|
|
25
|
+
}
|
|
26
26
|
//# sourceMappingURL=LoadingLine.js.map
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import { render } from '@testing-library/react';
|
|
2
|
-
import { LoadingLine, randomizeWithinRange } from './LoadingLine';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
|
|
5
|
-
describe('LoadingLine', () => {
|
|
6
|
-
it('renders a div n times defined by `count` prop', () => {
|
|
7
|
-
const { container } = render(<LoadingLine count={3} />);
|
|
8
|
-
expect(container.childNodes.length).toBe(3);
|
|
9
|
-
});
|
|
10
|
-
});
|
|
11
|
-
|
|
12
|
-
describe('randomizeWithinRange', () => {
|
|
13
|
-
it('randomizes a number within the given range', () => {
|
|
14
|
-
const val = randomizeWithinRange(10, 2);
|
|
15
|
-
|
|
16
|
-
expect(val <= 12 && val >= 8).toBe(true);
|
|
17
|
-
});
|
|
18
|
-
});
|
|
1
|
+
import { render } from '@testing-library/react';
|
|
2
|
+
import { LoadingLine, randomizeWithinRange } from './LoadingLine';
|
|
3
|
+
import React from 'react';
|
|
4
|
+
|
|
5
|
+
describe('LoadingLine', () => {
|
|
6
|
+
it('renders a div n times defined by `count` prop', () => {
|
|
7
|
+
const { container } = render(<LoadingLine count={3} />);
|
|
8
|
+
expect(container.childNodes.length).toBe(3);
|
|
9
|
+
});
|
|
10
|
+
});
|
|
11
|
+
|
|
12
|
+
describe('randomizeWithinRange', () => {
|
|
13
|
+
it('randomizes a number within the given range', () => {
|
|
14
|
+
const val = randomizeWithinRange(10, 2);
|
|
15
|
+
|
|
16
|
+
expect(val <= 12 && val >= 8).toBe(true);
|
|
17
|
+
});
|
|
18
|
+
});
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const link: import("react-apollo-network-status/dist/src/ApolloLinkNetworkStatus").default, useApolloNetworkStatus: (options?: import("react-apollo-network-status/dist/src/useApolloNetworkStatus").UseApolloNetworkStatusOptions) => import("react-apollo-network-status").NetworkStatus;
|
|
2
|
-
export { link, useApolloNetworkStatus };
|
|
1
|
+
declare const link: import("react-apollo-network-status/dist/src/ApolloLinkNetworkStatus").default, useApolloNetworkStatus: (options?: import("react-apollo-network-status/dist/src/useApolloNetworkStatus").UseApolloNetworkStatusOptions) => import("react-apollo-network-status").NetworkStatus;
|
|
2
|
+
export { link, useApolloNetworkStatus };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createNetworkStatusNotifier } from 'react-apollo-network-status';
|
|
2
|
-
const { link, useApolloNetworkStatus } = createNetworkStatusNotifier();
|
|
3
|
-
export { link, useApolloNetworkStatus };
|
|
1
|
+
import { createNetworkStatusNotifier } from 'react-apollo-network-status';
|
|
2
|
+
const { link, useApolloNetworkStatus } = createNetworkStatusNotifier();
|
|
3
|
+
export { link, useApolloNetworkStatus };
|
|
4
4
|
//# sourceMappingURL=NetworkStatusNotifier.js.map
|