react-native-ui-lib 7.39.1 → 7.40.0

package/src/components/textField/textField.api.json

@@ -2,9 +2,17 @@
   "name": "TextField",
   "category": "form",
   "description": "An enhanced customizable TextField with validation support",
-  "extends": ["TextInput"],
-  "extendsLink": ["https://reactnative.dev/docs/textinput"],
-  "modifiers": ["margin", "color", "typography"],
+  "extends": [
+    "TextInput"
+  ],
+  "extendsLink": [
+    "https://reactnative.dev/docs/textinput"
+  ],
+  "modifiers": [
+    "margin",
+    "color",
+    "typography"
+  ],
   "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/TextFieldScreen.tsx",
   "images": [
     "https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Incubator.TextField/FloatingPlaceholder.gif?raw=true, https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Incubator.TextField/Validation.gif?raw=true, https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Incubator.TextField/ColorByState.gif?raw=true, https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Incubator.TextField/CharCounter.gif?raw=true, https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Incubator.TextField/Hint.gif?raw=true"
@@ -276,7 +284,7 @@
             "type": "section",
             "layout": "horizontal",
             "title": "Structure",
-            "description": "1. **Label**\nDescribes the information that the user needs to enter. The label should be short and clear, preferably a noun.  \n2. **Placeholder** (optional)  \nPlaceholders can serve as an assistive text that can provide additional aid or context to the user. Don’t use it to display critical information - as it disappears when the users starts typing.  \n3. **Helper text** (optional)  \nUse this to provide a hint or a disclaimer about the content of the field. For example, “Passwords must contain at least 8 characters”  \n4. **Clear button**  \nLets the user to easily clear the input value. Appears only when value was typed.  \n5. **Character count**  \nShould be used if there is a character limit. Displays the amount of typed characters out of total allowed. If the limit is reached, the counter will become red and further typing is disabled.  \n6. **Validation message**  \nDemonstrates that a required input is missing something or the entry was invalid.",
+            "description": "Markdown:\n\n1. **Label**\nDescribes the information that the user needs to enter. The label should be short and clear, preferably a noun.  \n2. **Placeholder** (optional)  \nPlaceholders can serve as an assistive text that can provide additional aid or context to the user. Don’t use it to display critical information - as it disappears when the users starts typing.  \n3. **Helper text** (optional)  \nUse this to provide a hint or a disclaimer about the content of the field. For example, “Passwords must contain at least 8 characters”  \n4. **Clear button**  \nLets the user to easily clear the input value. Appears only when value was typed.  \n5. **Character count**  \nShould be used if there is a character limit. Displays the amount of typed characters out of total allowed. If the limit is reached, the counter will become red and further typing is disabled.  \n6. **Validation message**  \nDemonstrates that a required input is missing something or the entry was invalid.",
             "content": [
               {
                 "value": "https://wixmp-1d257fba8470f1b562a0f5f2.wixmp.com/mads-docs-assets/assets/Components Docs/textField/textField_overview_section_03.png"
@@ -285,7 +293,10 @@
           },
           {
             "type": "table",
-            "columns": ["Property", "Component", "New Column"],
+            "columns": [
+              "Property",
+              "Component"
+            ],
             "items": [
               {
                 "title": "Inactive (default)",
@@ -334,7 +345,7 @@
               },
               {
                 "title": "Warning",
-                "description": "",
+                "description": "(WIP)",
                 "content": [
                   {
                     "value": "https://wixmp-1d257fba8470f1b562a0f5f2.wixmp.com/mads-docs-assets/assets/Components Docs/textField/textField_overview_table_warning.png"
@@ -374,7 +385,10 @@
           },
           {
             "type": "table",
-            "columns": ["Property", "Component"],
+            "columns": [
+              "Property",
+              "Component"
+            ],
             "items": [
               {
                 "title": "Outline (Default)",
@@ -400,7 +414,10 @@
           },
           {
             "type": "table",
-            "columns": ["Property", "Component"],
+            "columns": [
+              "Property",
+              "Component"
+            ],
             "items": [
               {
                 "title": "Leading Accessory (Prefix)",
@@ -458,7 +475,7 @@
               }
             ],
             "title": "Spec",
-            "description": "**Label**\nbodySmall, $textNeutralHeavy  \n**Placeholder**\nbody, $textNeutralLight  \n**Value**  \nbody, $textDefault  \n**Helper Text**  \nsubtext, $textNeutralHeavy  \n**Character Count**  \nbodySmall, $textNeutralHeavy  \n**Validation message**  \nMessage - bodySmall, $textDangerLight\nIcon - exclamationFillSmall, $iconDangerLight  \n**Prefix & Suffix**  \nbody, $textNeutral  \n**Clear Button**  \nxFlat, $textNeutralLight  \n**Warning Message**  \nMessage - bodySmall, $textDefault\nIcon - exclamationFillSmall, $iconDefault  \n**Validation Success**  \nIcon - checkmarkFlatSmall, $iconSuccess  \n**Outline - Default/unfocused**  \n1p, $outlineNeutral  \n**Outline - Focused, typing**  \n1p, $outlinePrimary  \n**Outline - Validation**  \n1p, $outlineDanger  \n**Outline - Disabled**  \n1p, $outlineDisabled  \n**Outline - Read only**  \nfill background- $backgroundNeutralLight"
+            "description": "Markdown:\n\n**Label**\nbodySmall, $textNeutralHeavy  \n**Placeholder**\nbody, $textNeutralLight  \n**Value**  \nbody, $textDefault  \n**Helper Text**  \nsubtext, $textNeutralHeavy  \n**Character Count**  \nbodySmall, $textNeutralHeavy  \n**Validation message**  \nMessage - bodySmall, $textDangerLight\nIcon - exclamationFillSmall, $iconDangerLight  \n**Prefix & Suffix**  \nbody, $textNeutral  \n**Clear Button**  \nxFlat, $textNeutralLight  \n**Warning Message**  \nMessage - bodySmall, $textDefault\nIcon - exclamationFillSmall, $iconDefault  \n**Validation Success**  \nIcon - checkmarkFlatSmall, $iconSuccess  \n**Outline - Default/unfocused**  \n1p, $outlineNeutral  \n**Outline - Focused, typing**  \n1p, $outlinePrimary  \n**Outline - Validation**  \n1p, $outlineDanger  \n**Outline - Disabled**  \n1p, $outlineDisabled  \n**Outline - Read only**  \nfill background- $backgroundNeutralLight"
           }
         ]
       },

package/src/components/textField/useFieldState.js

@@ -52,9 +52,9 @@ export default function useFieldState({
       setValue(propsValue);
       if (validateOnChange) {
         if (validationDebounceTime) {
-          debouncedValidateField(propsValue);
+          debouncedValidateField(propsValue ?? '');
         } else {
-          validateField(propsValue);
+          validateField(propsValue ?? '');
         }
       }
     }

package/src/components/timeline/timeline.api.json

@@ -29,30 +29,18 @@
     }
   ],
   "snippet": [
-    "<Timeline ",
-    "  topLine={{",
-    "    state: Timeline.states.ERROR",
-    "  }$1}",
-    "  bottomLine={{",
-    "    type: Timeline.lineTypes.DASHED,",
-    "    color: Colors.orange40",
-    "  }$2}",
-    "  point={{",
-    "    type: Timeline.pointTypes.OUTLINE,",
-    "    color: Colors.orange40,",
-    "    icon: Assets.icons.demo.camera,",
-    "    anchorRef: alignToTitle ? titleRef : undefined",
-    "  }$3}",
+    "<Timeline",
+    "  topLine={{type: Timeline.lineTypes.DASHED}}",
+    "  bottomLine={{state: Timeline.states.SUCCESS}}",
+    "  point={{state: Timeline.states.SUCCESS}}",
     ">",
-    "    <View flex centerH paddingH-20>",
-    "      <Text text70 dark10 ref={titleRef}>",
-    "        {title}",
-    "      </Text>",
-    "      <Text dark40>",
-    "        {description}",
-    "      </Text>",
-    "    </View>",
-    "</Timeline>"
+    "   <View padding-20 bg-grey60 br30>",
+    "     <Text text70BO>Title</Text>",
+    "     <View marginT-5 padding-8 bg-white br30>",
+    "       <Text>Description</Text>",
+    "     </View>",
+    "   </View>",
+    " </Timeline>"
   ],
   "docs": {
     "hero": {
@@ -138,29 +126,7 @@
                 "title": "Current",
                 "content": [
                   {
-                    "props": {
-                      "state": "current",
-                      "point": {
-                        "type": {
-                          "type": "bullet"
-                        }
-                      },
-                      "bottomLine": {
-                        "type": {
-                          "type": "solid"
-                        }
-                      }
-                    }
-                  },
-                  {
-                    "props": {
-                      "point": {
-                        "type": {
-                          "type": "bullet",
-                          "color": "#116DFF"
-                        }
-                      }
-                    }
+                    "snippet": "<Timeline topLine={{state: Timeline.states.CURRENT}} bottomLine={{state: Timeline.states.CURRENT}} point={{state: Timeline.states.CURRENT}}><View style={{height: 88}}/></Timeline>"
                   }
                 ],
                 "description": "state: current"
@@ -169,19 +135,7 @@
                 "title": "Next",
                 "content": [
                   {
-                    "props": {
-                      "state": "next",
-                      "point": {
-                        "type": {
-                          "type": "bullet"
-                        }
-                      },
-                      "bottomLine": {
-                        "type": {
-                          "type": "solid"
-                        }
-                      }
-                    }
+                    "snippet": "<Timeline topLine={{state: Timeline.states.NEXT}} bottomLine={{state: Timeline.states.NEXT}} point={{state: Timeline.states.NEXT, type: Timeline.pointTypes.CIRCLE}}><View style={{height: 88}}/></Timeline>"
                   }
                 ],
                 "description": "state: next"
@@ -190,19 +144,7 @@
                 "title": "Error",
                 "content": [
                   {
-                    "props": {
-                      "state": "error",
-                      "point": {
-                        "type": {
-                          "type": "bullet"
-                        }
-                      },
-                      "bottomLine": {
-                        "type": {
-                          "type": "solid"
-                        }
-                      }
-                    }
+                    "snippet": "<Timeline topLine={{state: Timeline.states.ERROR}} bottomLine={{state: Timeline.states.ERROR}} point={{state: Timeline.states.ERROR}}><View style={{height: 88}}/></Timeline>"
                   }
                 ],
                 "description": "state: error"
@@ -211,19 +153,7 @@
                 "title": "Success",
                 "content": [
                   {
-                    "props": {
-                      "state": "success",
-                      "point": {
-                        "type": {
-                          "type": "bullet"
-                        }
-                      },
-                      "bottomLine": {
-                        "type": {
-                          "type": "solid"
-                        }
-                      }
-                    }
+                    "snippet": "<Timeline topLine={{state: Timeline.states.SUCCESS}} bottomLine={{state: Timeline.states.SUCCESS}} point={{state: Timeline.states.SUCCESS}}><View style={{height: 88}}/></Timeline>"
                   }
                 ],
                 "description": "state: success"
@@ -238,15 +168,30 @@
             "items": [
               {
                 "title": "Bullet",
-                "description": "type: bullet"
+                "description": "type: bullet",
+                "content": [
+                  {
+                    "snippet": "<Timeline point={{type: Timeline.pointTypes.BULLET}}><View style={{height: 88}}/></Timeline>"
+                  }
+                ]
               },
               {
                 "title": "Circle",
-                "description": "type: circle"
+                "description": "type: circle",
+                "content": [
+                  {
+                    "snippet": "<Timeline point={{state: Timeline.states.NEXT, type: Timeline.pointTypes.CIRCLE}}><View style={{height: 88}}/></Timeline>"
+                  }
+                ]
               },
               {
                 "title": "Outline",
-                "description": "type: outline"
+                "description": "type: outline",
+                "content": [
+                  {
+                    "snippet": "<Timeline point={{type: Timeline.pointTypes.OUTLINE}}><View style={{height: 88}}/></Timeline>"
+                  }
+                ]
               }
             ],
             "title": "Point",
@@ -260,14 +205,7 @@
                 "title": "Text",
                 "content": [
                   {
-                    "props": {
-                      "state": "current",
-                      "bottomLine": {
-                        "type": {
-                          "type": "solid"
-                        }
-                      }
-                    }
+                    "snippet": "<Timeline point={{label: '1'}}><View style={{height: 88}}/></Timeline>"
                   }
                 ],
                 "description": "text: “1”"
@@ -276,21 +214,19 @@
                 "title": "Icon",
                 "content": [
                   {
-                    "props": {
-                      "state": "current",
-                      "bottomLine": {
-                        "type": {
-                          "type": "dashed"
-                        }
-                      }
-                    }
+                    "snippet": "<Timeline point={{state: Timeline.states.SUCCESS, icon: Assets.internal.icons.checkSmall}}><View style={{height: 88}}/></Timeline>"
                   }
                 ],
-                "description": "icon: Assets.icons.general.checkmarkSmall"
+                "description": "icon: Assets.internal.icons.general.checkmarkSmall"
               },
               {
                 "title": "Icon without background",
-                "description": "icon: Assets.icons.general.favorite, removeIconBackground: true"
+                "content": [
+                  {
+                    "snippet": "<Timeline point={{state: Timeline.states.SUCCESS, icon: Assets.internal.icons.search, removeIconBackground: true}}><View style={{height: 88}}/></Timeline>"
+                  }
+                ],
+                "description": "icon: Assets.internal.icons.general.favorite, removeIconBackground: true"
               }
             ],
             "name": "Point Accessories"
@@ -301,10 +237,20 @@
             "items": [
               {
                 "title": "Solid",
+                "content": [
+                  {
+                    "snippet": "<Timeline topLine={{state: Timeline.states.CURRENT}} point={{removeIconBackground: true}}><View style={{height: 88}}/></Timeline>"
+                  }
+                ],
                 "description": "type: solid"
               },
               {
                 "title": "Dashed",
+                "content": [
+                  {
+                    "snippet": "<Timeline topLine={{state: Timeline.states.CURRENT, type: Timeline.lineTypes.DASHED}} point={{removeIconBackground: true}}><View style={{height: 88}}/></Timeline>"
+                  }
+                ],
                 "description": "type: dashed"
               }
             ],
@@ -317,6 +263,11 @@
             "items": [
               {
                 "title": "Entry",
+                "content": [
+                  {
+                    "snippet": "<Timeline topLine={{state: Timeline.states.NEXT, entry: true}} bottomLine={{state: Timeline.states.NEXT, entry: true}} point={{removeIconBackground: true}}><View style={{height: 88}}/></Timeline>"
+                  }
+                ],
                 "description": "entry: true"
               }
             ],

package/src/components/toast/index.js

@@ -239,7 +239,7 @@ export default class Toast extends PureBaseComponent {
         <Button
           link
           iconStyle={{tintColor: textColor}}
-          iconSource={Assets.icons.x}
+          iconSource={Assets.internal.icons.x}
           onPress={this.onDismiss}
           paddingR-20
           accessibilityLabel={'dismiss'}

package/src/components/touchableOpacity/touchableOpacity.api.json

@@ -35,8 +35,19 @@
     }
   ],
   "snippet": [
+    "<View flex center>",
     "<TouchableOpacity onPress={() => console.log('pressed')$1}>",
-    "   <Text text40>Click Me!</Text>",
-    "</TouchableOpacity>"
-  ]
+    "   <Text text40>Touchable</Text>",
+    "</TouchableOpacity>",
+    "</View>"
+  ],
+  "docs": {
+    "hero": {
+      "title": "TouchableOpacity",
+      "description": "An enhanced version of React Native's TouchableOpacity component providing additional features and modifiers support",
+      "type": "hero",
+      "layout": "horizontal",
+      "content": [{}]
+    }
+  }
 }

package/src/components/view/view.api.json

@@ -26,13 +26,22 @@
     {"name": "style", "type": "ViewStyle", "description": "Custom style"}
   ],
   "snippet": [
-   "<View row gap-s5 centerV>",
-   "  <View style={{width: 200, height: 200}} bg-purple40 centerH>",
-   "  <View style={{width: 60, height: 60}} bg-green20/>",
-   "  </View>",
-   "  <View style={{width: 150, height: 150}} bg-orange30 bottom right>",
-   "  <View style={{width: 50, height: 50}} bg-yellow40 br100 margin-s2/>",
-   "  </View>",
-   "</View>"
-  ]
+    "<View row gap-s5 centerV>",
+    "  <View style={{width: 200, height: 200}} bg-purple40 centerH>",
+    "  <View style={{width: 60, height: 60}} bg-green20/>",
+    "  </View>",
+    "  <View style={{width: 150, height: 150}} bg-orange30 bottom right>",
+    "  <View style={{width: 50, height: 50}} bg-yellow40 br100 margin-s2/>",
+    "  </View>",
+    "</View>"
+  ],
+  "docs": {
+    "hero": {
+      "title": "View",
+      "description": "An enhanced version of React Native's View component providing additional features and modifiers support",
+      "type": "hero",
+      "layout": "horizontal",
+      "content": [{}]
+    }
+  }
 }

package/src/components/wizard/WizardStates.js

@@ -1,6 +1,5 @@
 import Colors from "../../style/colors";
-const checkMarkSmall = require("./assets/checkMarkSmall.png");
-const exclamationSmall = require("./assets/exclamationSmall.png");
+import Assets from "../../assets";
 export const StatesConfig = {
   enabled: {
     color: Colors.$textNeutralHeavy,
@@ -14,7 +13,7 @@ export const StatesConfig = {
   error: {
     color: Colors.$iconDangerLight,
     circleColor: Colors.$outlineDanger,
-    icon: exclamationSmall,
+    icon: Assets.internal.icons.exclamationSmall,
     enabled: true,
     accessibilityInfo: 'Validation Error'
   },
@@ -27,7 +26,7 @@ export const StatesConfig = {
   completed: {
     color: Colors.$iconNeutral,
     circleColor: Colors.$outlineDisabled,
-    icon: checkMarkSmall,
+    icon: Assets.internal.icons.checkMarkSmall,
     enabled: true,
     accessibilityInfo: 'Completed'
   },

package/src/components/wizard/wizard.api.json

@@ -62,7 +62,7 @@
             "type": "section",
             "content": [
               {
-                "value": "https://wixmp-1d257fba8470f1b562a0f5f2.wixmp.com/mads-docs-assets/assets/Components Docs/Wizard/wizard_overview_section_01.png"
+                "value": "https://embed.figma.com/design/xFjvYNkGTmYTGYMLrmz9Ir/Guidelines-to-Docs?node-id=10116-50439&embed-host=share"
               }
             ],
             "title": "Product Examples",
@@ -73,7 +73,7 @@
             "layout": "horizontal",
             "content": [
               {
-                "value": "https://wixmp-1d257fba8470f1b562a0f5f2.wixmp.com/mads-docs-assets/assets/Components Docs/Wizard/wizard_overview_section_02.png"
+                "value": "https://embed.figma.com/design/xFjvYNkGTmYTGYMLrmz9Ir/Guidelines-to-Docs?node-id=10116-104277&embed-host=share"
               }
             ],
             "title": "Wizard Alternative",

package/src/hooks/useScrollTo/index.js

@@ -1,7 +1,5 @@
 import _isFunction from "lodash/isFunction";
-import _isUndefined from "lodash/isUndefined";
 import { useCallback, useRef } from 'react';
-import { Constants } from "../../commons/new";
 const useScrollTo = props => {
   const {
     scrollViewRef: propsScrollViewRef,
@@ -26,10 +24,17 @@ const useScrollTo = props => {
     containerSize.current = horizontal ? width : height;
   }, [horizontal]);
   const scrollTo = useCallback((offset, animated = true) => {
-    if (horizontal && Constants.isRTL && Constants.isAndroid && !_isUndefined(contentSize.current) && !_isUndefined(containerSize.current)) {
+    // Fix that was for Android RTL. Scrolling is now aligned between IOS and Android and offset is ok.
+    /* if (
+      horizontal &&
+        Constants.isRTL &&
+        Constants.isAndroid &&
+        !_.isUndefined(contentSize.current) &&
+        !_.isUndefined(containerSize.current)
+    ) {
       const scrollingWidth = Math.max(0, contentSize.current - containerSize.current);
       offset = scrollingWidth - offset;
-    }
+    } */
 
     // @ts-ignore
     if (_isFunction(scrollViewRef.current?.scrollToOffset)) {

package/src/incubator/dialog/useDialogContent.js

@@ -23,7 +23,7 @@ const useDialogContent = props => {
     }
     return <View left centerV pointerEvents={'box-none'}>
         <TouchableOpacity paddingB-s2 row onPress={close}>
-          <Icon source={Assets.icons.xMedium} tintColor={Colors.white} {...closeButtonProps?.iconProps} />
+          <Icon source={Assets.internal.icons.xMedium} tintColor={Colors.white} {...closeButtonProps?.iconProps} />
           <Text recorderTag={'unmask'} text70BO white {...closeButtonProps?.labelProps}>
             {closeButtonProps?.label || 'Close'}
           </Text>

package/src/incubator/expandableOverlay/index.js

@@ -75,4 +75,5 @@ const ExpandableOverlay = (props, ref) => {
       {renderOverlay()}
     </TouchableOpacity>;
 };
+ExpandableOverlay.displayName = 'IGNORE';
 export default forwardRef(ExpandableOverlay);

package/src/incubator/panView/index.js

@@ -53,6 +53,6 @@ const PanView = props => {
       </GestureDetector>
     </View>;
 };
-PanView.displayName = 'PanView';
+PanView.displayName = 'IGNORE';
 PanView.directions = PanViewDirectionsEnum;
 export default asBaseComponent(gestureHandlerRootHOC(PanView));

package/src/incubator/slider/Thumb.js

@@ -7,13 +7,20 @@ import View from "../../components/view";
 import { Constants } from "../../commons/new";
 const SHADOW_RADIUS = 4;
 const THUMB_SIZE = 24;
+const THUMB_ACCESSIBLE_HITSLOP = Math.max(0, 48 - THUMB_SIZE) / 2;
+const DEFAULT_THUMB_HIT_SLOP = {
+  top: THUMB_ACCESSIBLE_HITSLOP,
+  bottom: THUMB_ACCESSIBLE_HITSLOP,
+  left: THUMB_ACCESSIBLE_HITSLOP,
+  right: THUMB_ACCESSIBLE_HITSLOP
+};
 const Thumb = props => {
   const {
     disabled,
     disableActiveStyling,
     activeStyle,
     defaultStyle,
-    hitSlop,
+    hitSlop = DEFAULT_THUMB_HIT_SLOP,
     onSeekStart,
     onSeekEnd,
     start,

package/src/incubator/toast/toast.api.json

@@ -104,19 +104,47 @@
                   {
                     "props": {
                       "visible": true,
-                      "message": "\"Mika Or\" was saved to contacts."
+                      "message": "Mika Or was saved to contacts.",
+                      "preset": "general"
                     }
                   }
                 ]
               },
               {
-                "title": "Success"
+                "title": "Success",
+                "content": [
+                  {
+                    "props": {
+                      "visible": true,
+                      "message": "Post published.",
+                      "preset": "success"
+                    }
+                  }
+                ]
               },
               {
-                "title": "Validation"
+                "title": "Validation",
+                "content": [
+                  {
+                    "props": {
+                      "visible": true,
+                      "message": "Enter a card number.",
+                      "preset": "failure"
+                    }
+                  }
+                ]
               },
               {
-                "title": "Offline Error"
+                "title": "Offline Error",
+                "content": [
+                  {
+                    "props": {
+                      "visible": true,
+                      "message": "This action is not available offline.",
+                      "preset": "offline"
+                    }
+                  }
+                ]
               }
             ],
             "title": "Types"
@@ -126,13 +154,35 @@
             "columns": ["Prop", "Preview"],
             "items": [
               {
-                "title": "None"
+                "title": "None",
+                "content": [
+                  {
+                    "props": {
+                      "visible": true,
+                      "message": "Action completed."
+                    }
+                  }
+                ]
               },
               {
-                "title": "With action"
+                "title": "With action",
+                "content": [
+                  {
+                    "snippet": "<Incubator.Toast visible message=\"Action completed.\" action={{label: 'Undo', onPress: () => {}}}/>"
+                  }
+                ]
               },
               {
-                "title": "With loader"
+                "title": "With loader",
+                "content": [
+                  {
+                    "props": {
+                      "visible": true,
+                      "message": "Action completed.",
+                      "showLoader": true
+                    }
+                  }
+                ]
               }
             ],
             "title": "Accessories"

package/src/assets/icons/index.js

@@ -1,26 +0,0 @@
-export const icons = {
-  get check() {
-    return require('./check.png');
-  },
-  get checkSmall() {
-    return require('./check-small.png');
-  },
-  get minusSmall() {
-    return require('./minusSmall.png');
-  },
-  get plusSmall() {
-    return require('./plusSmall.png');
-  },
-  get search() {
-    return require('./search.png');
-  },
-  get x() {
-    return require('./x.png');
-  },
-  get xMedium() {
-    return require('./xMedium.png');
-  },
-  get xFlat() {
-    return require('./xFlat.png');
-  }
-};

package/src/assets/images/index.js

@@ -1,5 +0,0 @@
-export const images = {
-  get gradient() {
-    return require('./gradient.png');
-  }
-};