@draftbit/core 47.0.1-cc5ccc.2 → 47.0.1-df014a.2

package/src/mappings/DatePickerModal.js

@@ -0,0 +1,73 @@
+import { COMPONENT_TYPES, FORM_TYPES, FIELD_NAME, Triggers, StylesPanelSections, createBoolProp, createTextProp, createTextEnumProp, createStaticBoolProp, createStaticNumberProp, } from "@draftbit/types";
+export const SHARED_SEED_DATA = {
+    triggers: [Triggers.OnDismiss, Triggers.OnConfirm, Triggers.OnChange],
+    category: COMPONENT_TYPES.input,
+    StylesPanelSections: [
+        StylesPanelSections.Typography,
+        StylesPanelSections.Background,
+        StylesPanelSections.Size,
+        StylesPanelSections.MarginsAndPaddings,
+        StylesPanelSections.Position,
+    ],
+    layout: null,
+};
+export const SHARED_SEED_DATA_PROPS = {
+    locale: {},
+    visible: createBoolProp({
+        label: "Visible",
+        description: "If true, show the modal. If false, hide the modal.",
+        required: true,
+    }),
+    label: createTextProp({
+        label: "Label",
+        description: "Label used as the header in the component, defaults to `Select Date`",
+    }),
+    saveLabel: createTextProp({
+        label: "Save Label",
+        description: "Label used to confirm a date selection. Defaults to `Save`.",
+    }),
+    saveLabelDisabled: createStaticBoolProp({
+        label: "Disable Save Label",
+        description: "Flag indicating if the save label should be disabled and unable to receive events",
+    }),
+    uppercase: createStaticBoolProp({
+        label: "Uppercase",
+        description: "Flag indicating if the text in the component should be uppercase. Defaults to true.",
+    }),
+    startYear: createStaticNumberProp({
+        label: "Start Year",
+        description: "The start year when the component is rendered. Defaults to 1800.",
+        required: false,
+    }),
+    endYear: createStaticNumberProp({
+        label: "End Year",
+        description: "The end year when the component is rendered. Defaults to 2200.",
+        required: false,
+    }),
+};
+export const SEED_DATA = [
+    {
+        name: "Single Date Picker Modal",
+        tag: "SingleDatePickerModal",
+        description: "A modal allowing date selection.",
+        ...SHARED_SEED_DATA,
+        props: {
+            mode: createTextEnumProp({
+                label: "Mode",
+                description: "The selection mode of the date picker",
+                required: true,
+                options: ["single", "multiple", "range"],
+                editable: false,
+                defaultValue: "single",
+                formType: FORM_TYPES.flatArray,
+            }),
+            fieldName: {
+                ...FIELD_NAME,
+                handlerPropName: "onConfirm",
+                valuePropName: "date",
+                defaultValue: "date",
+            },
+            ...SHARED_SEED_DATA_PROPS,
+        },
+    },
+];

package/src/mappings/DatePickerModal.ts

@@ -0,0 +1,91 @@
+import {
+  COMPONENT_TYPES,
+  FORM_TYPES,
+  FIELD_NAME,
+  Triggers,
+  StylesPanelSections,
+  createBoolProp,
+  createTextProp,
+  createTextEnumProp,
+  createStaticBoolProp,
+  createStaticNumberProp,
+} from "@draftbit/types";
+
+export const SHARED_SEED_DATA = {
+  triggers: [Triggers.OnDismiss, Triggers.OnConfirm, Triggers.OnChange],
+  category: COMPONENT_TYPES.input,
+  StylesPanelSections: [
+    StylesPanelSections.Typography,
+    StylesPanelSections.Background,
+    StylesPanelSections.Size,
+    StylesPanelSections.MarginsAndPaddings,
+    StylesPanelSections.Position,
+  ],
+  layout: null,
+};
+export const SHARED_SEED_DATA_PROPS = {
+  locale: {},
+  visible: createBoolProp({
+    label: "Visible",
+    description: "If true, show the modal. If false, hide the modal.",
+    required: true,
+  }),
+  label: createTextProp({
+    label: "Label",
+    description:
+      "Label used as the header in the component, defaults to `Select Date`",
+  }),
+  saveLabel: createTextProp({
+    label: "Save Label",
+    description: "Label used to confirm a date selection. Defaults to `Save`.",
+  }),
+  saveLabelDisabled: createStaticBoolProp({
+    label: "Disable Save Label",
+    description:
+      "Flag indicating if the save label should be disabled and unable to receive events",
+  }),
+  uppercase: createStaticBoolProp({
+    label: "Uppercase",
+    description:
+      "Flag indicating if the text in the component should be uppercase. Defaults to true.",
+  }),
+  startYear: createStaticNumberProp({
+    label: "Start Year",
+    description:
+      "The start year when the component is rendered. Defaults to 1800.",
+    required: false,
+  }),
+  endYear: createStaticNumberProp({
+    label: "End Year",
+    description:
+      "The end year when the component is rendered. Defaults to 2200.",
+    required: false,
+  }),
+};
+
+export const SEED_DATA = [
+  {
+    name: "Single Date Picker Modal",
+    tag: "SingleDatePickerModal",
+    description: "A modal allowing date selection.",
+    ...SHARED_SEED_DATA,
+    props: {
+      mode: createTextEnumProp({
+        label: "Mode",
+        description: "The selection mode of the date picker",
+        required: true,
+        options: ["single", "multiple", "range"],
+        editable: false,
+        defaultValue: "single",
+        formType: FORM_TYPES.flatArray,
+      }),
+      fieldName: {
+        ...FIELD_NAME,
+        handlerPropName: "onConfirm",
+        valuePropName: "date",
+        defaultValue: "date",
+      },
+      ...SHARED_SEED_DATA_PROPS,
+    },
+  },
+];

package/src/mappings/Touchable.js

@@ -0,0 +1,17 @@
+import { COMPONENT_TYPES, createActionProp, Triggers, StylesPanelSections, } from "@draftbit/types";
+export const SEED_DATA = {
+    name: "Touchable",
+    tag: "Touchable",
+    description: "Simple button with no styles",
+    category: COMPONENT_TYPES.button,
+    stylesPanelSections: [
+        StylesPanelSections.Size,
+        StylesPanelSections.Margins,
+        StylesPanelSections.Borders,
+    ],
+    layout: {},
+    triggers: [Triggers.OnPress],
+    props: {
+        onPress: createActionProp(),
+    },
+};

package/src/mappings/Touchable.ts

@@ -0,0 +1,23 @@
+import {
+  COMPONENT_TYPES,
+  createActionProp,
+  Triggers,
+  StylesPanelSections,
+} from "@draftbit/types";
+
+export const SEED_DATA = {
+  name: "Touchable",
+  tag: "Touchable",
+  description: "Simple button with no styles",
+  category: COMPONENT_TYPES.button,
+  stylesPanelSections: [
+    StylesPanelSections.Size,
+    StylesPanelSections.Margins,
+    StylesPanelSections.Borders,
+  ],
+  layout: {},
+  triggers: [Triggers.OnPress],
+  props: {
+    onPress: createActionProp(),
+  },
+};

package/lib/commonjs/components/Pressable.js

@@ -1,48 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = Pressable;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function Pressable(_ref) {
-  let {
-    children,
-    disabled,
-    onPress,
-    onLongPress,
-    hitSlop,
-    delayLongPress,
-    activeOpacity,
-    disabledOpacity,
-    style,
-    ...props
-  } = _ref;
-  const getOpacity = (0, _react.useCallback)(pressed => {
-    if (disabled) {
-      return disabledOpacity;
-    } else {
-      if (pressed) return activeOpacity;else return 1;
-    }
-  }, [activeOpacity, disabled, disabledOpacity]);
-  const _style = (0, _react.useCallback)(_ref2 => {
-    let {
-      pressed
-    } = _ref2;
-    return [style, {
-      opacity: getOpacity(pressed)
-    }];
-  }, [getOpacity, style]);
-  return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, _extends({
-    onPress: onPress,
-    onLongPress: onLongPress,
-    disabled: disabled,
-    delayLongPress: delayLongPress ? delayLongPress : 500,
-    hitSlop: hitSlop ? hitSlop : 8,
-    style: _style
-  }, props), children);
-}

package/lib/commonjs/mappings/Pressable.js

@@ -1,52 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SEED_DATA = void 0;
-var _types = require("@draftbit/types");
-const SEED_DATA_PROPS = {
-  stylesPanelSections: [_types.StylesPanelSections.Size, _types.StylesPanelSections.Margins, _types.StylesPanelSections.Borders],
-  layout: {},
-  triggers: [_types.Triggers.OnPress, _types.Triggers.OnLongPress],
-  props: {
-    onPress: (0, _types.createActionProp)(),
-    onLongPress: (0, _types.createActionProp)(),
-    activeOpacity: (0, _types.createNumberProp)({
-      label: "Active Opacity",
-      description: "The opacity when the button is pressed.",
-      defaultValue: 0.8,
-      group: _types.GROUPS.basic
-    }),
-    disabledOpacity: (0, _types.createNumberProp)({
-      label: "Disabled Opacity",
-      description: "The opacity when the button is disabled.",
-      defaultValue: 0.8,
-      group: _types.GROUPS.basic
-    }),
-    delayLongPress: (0, _types.createNumberProp)({
-      label: "Delay Long Press",
-      description: "Duration (in milliseconds) from onPressIn before onLongPress is called.",
-      group: _types.GROUPS.basic
-    }),
-    hitSlop: (0, _types.createNumberProp)({
-      label: "Hit Slop",
-      description: "Sets additional distance outside of element in which a press can be detected.",
-      group: _types.GROUPS.basic
-    })
-  }
-};
-const SEED_DATA = [{
-  name: "Touchable",
-  tag: "Touchable",
-  description: "An interactive view with no styles",
-  category: _types.COMPONENT_TYPES.button,
-  ...SEED_DATA_PROPS
-}, {
-  name: "Pressable",
-  tag: "Pressable",
-  description: "An interactive view with no styles",
-  category: _types.COMPONENT_TYPES.deprecated,
-  ...SEED_DATA_PROPS
-}];
-exports.SEED_DATA = SEED_DATA;

package/lib/module/components/Pressable.js

@@ -1,40 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import React, { useCallback } from "react";
-import { Pressable as NativePressable } from "react-native";
-export default function Pressable(_ref) {
-  let {
-    children,
-    disabled,
-    onPress,
-    onLongPress,
-    hitSlop,
-    delayLongPress,
-    activeOpacity,
-    disabledOpacity,
-    style,
-    ...props
-  } = _ref;
-  const getOpacity = useCallback(pressed => {
-    if (disabled) {
-      return disabledOpacity;
-    } else {
-      if (pressed) return activeOpacity;else return 1;
-    }
-  }, [activeOpacity, disabled, disabledOpacity]);
-  const _style = useCallback(_ref2 => {
-    let {
-      pressed
-    } = _ref2;
-    return [style, {
-      opacity: getOpacity(pressed)
-    }];
-  }, [getOpacity, style]);
-  return /*#__PURE__*/React.createElement(NativePressable, _extends({
-    onPress: onPress,
-    onLongPress: onLongPress,
-    disabled: disabled,
-    delayLongPress: delayLongPress ? delayLongPress : 500,
-    hitSlop: hitSlop ? hitSlop : 8,
-    style: _style
-  }, props), children);
-}

package/lib/module/mappings/Pressable.js

@@ -1,45 +0,0 @@
-import { COMPONENT_TYPES, createActionProp, Triggers, createNumberProp, StylesPanelSections, GROUPS } from "@draftbit/types";
-const SEED_DATA_PROPS = {
-  stylesPanelSections: [StylesPanelSections.Size, StylesPanelSections.Margins, StylesPanelSections.Borders],
-  layout: {},
-  triggers: [Triggers.OnPress, Triggers.OnLongPress],
-  props: {
-    onPress: createActionProp(),
-    onLongPress: createActionProp(),
-    activeOpacity: createNumberProp({
-      label: "Active Opacity",
-      description: "The opacity when the button is pressed.",
-      defaultValue: 0.8,
-      group: GROUPS.basic
-    }),
-    disabledOpacity: createNumberProp({
-      label: "Disabled Opacity",
-      description: "The opacity when the button is disabled.",
-      defaultValue: 0.8,
-      group: GROUPS.basic
-    }),
-    delayLongPress: createNumberProp({
-      label: "Delay Long Press",
-      description: "Duration (in milliseconds) from onPressIn before onLongPress is called.",
-      group: GROUPS.basic
-    }),
-    hitSlop: createNumberProp({
-      label: "Hit Slop",
-      description: "Sets additional distance outside of element in which a press can be detected.",
-      group: GROUPS.basic
-    })
-  }
-};
-export const SEED_DATA = [{
-  name: "Touchable",
-  tag: "Touchable",
-  description: "An interactive view with no styles",
-  category: COMPONENT_TYPES.button,
-  ...SEED_DATA_PROPS
-}, {
-  name: "Pressable",
-  tag: "Pressable",
-  description: "An interactive view with no styles",
-  category: COMPONENT_TYPES.deprecated,
-  ...SEED_DATA_PROPS
-}];

package/lib/typescript/src/components/Pressable.d.ts

@@ -1,18 +0,0 @@
-import React from "react";
-import { PressableProps, PressableStateCallbackType, StyleProp, ViewStyle } from "react-native";
-declare type Props = {
-    disabled?: boolean;
-    children: React.ReactNode;
-    style?: ViewStyle;
-    onPress?: () => void;
-    onLongPress?: () => void;
-    delayLongPress?: number;
-    hitSlop?: number;
-    pressRetentionOffset?: number;
-    activeOpacity?: number;
-    disabledOpacity?: number;
-} & PressableProps;
-export declare type StyleType = (state: PressableStateCallbackType) => StyleProp<ViewStyle>;
-export default function Pressable({ children, disabled, onPress, onLongPress, hitSlop, delayLongPress, activeOpacity, disabledOpacity, style, ...props }: Props): JSX.Element;
-export {};
-//# sourceMappingURL=Pressable.d.ts.map

package/lib/typescript/src/components/Pressable.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Pressable.d.ts","sourceRoot":"","sources":["../../../../src/components/Pressable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAEL,cAAc,EACd,0BAA0B,EAC1B,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AAEtB,aAAK,KAAK,GAAG;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,GAAG,cAAc,CAAC;AAEnB,oBAAY,SAAS,GAAG,CACtB,KAAK,EAAE,0BAA0B,KAC9B,SAAS,CAAC,SAAS,CAAC,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,WAAW,EACX,OAAO,EACP,cAAc,EACd,aAAa,EACb,eAAe,EACf,KAAK,EACL,GAAG,KAAK,EACT,EAAE,KAAK,eA6BP"}

package/lib/typescript/src/mappings/Pressable.d.ts

@@ -1,76 +0,0 @@
-export declare const SEED_DATA: {
-    stylesPanelSections: string[];
-    layout: {};
-    triggers: string[];
-    props: {
-        onPress: {
-            label: string;
-            description: string;
-            editable: boolean;
-            required: boolean;
-            formType: string;
-            propType: string;
-            defaultValue: null;
-            group: string;
-        };
-        onLongPress: {
-            label: string;
-            description: string;
-            editable: boolean;
-            required: boolean;
-            formType: string;
-            propType: string;
-            defaultValue: null;
-            group: string;
-        };
-        activeOpacity: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            group: string;
-            defaultValue: null;
-            editable: boolean;
-            required: boolean;
-            step: number;
-        };
-        disabledOpacity: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            group: string;
-            defaultValue: null;
-            editable: boolean;
-            required: boolean;
-            step: number;
-        };
-        delayLongPress: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            group: string;
-            defaultValue: null;
-            editable: boolean;
-            required: boolean;
-            step: number;
-        };
-        hitSlop: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            group: string;
-            defaultValue: null;
-            editable: boolean;
-            required: boolean;
-            step: number;
-        };
-    };
-    name: string;
-    tag: string;
-    description: string;
-    category: string;
-}[];
-//# sourceMappingURL=Pressable.d.ts.map

package/lib/typescript/src/mappings/Pressable.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Pressable.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Pressable.ts"],"names":[],"mappings":"AA+CA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAerB,CAAC"}

package/src/components/Pressable.js

@@ -1,17 +0,0 @@
-import React, { useCallback } from "react";
-import { Pressable as NativePressable, } from "react-native";
-export default function Pressable({ children, disabled, onPress, onLongPress, hitSlop, delayLongPress, activeOpacity, disabledOpacity, style, ...props }) {
-    const getOpacity = useCallback((pressed) => {
-        if (disabled) {
-            return disabledOpacity;
-        }
-        else {
-            if (pressed)
-                return activeOpacity;
-            else
-                return 1;
-        }
-    }, [activeOpacity, disabled, disabledOpacity]);
-    const _style = useCallback(({ pressed }) => [style, { opacity: getOpacity(pressed) }], [getOpacity, style]);
-    return (React.createElement(NativePressable, { onPress: onPress, onLongPress: onLongPress, disabled: disabled, delayLongPress: delayLongPress ? delayLongPress : 500, hitSlop: hitSlop ? hitSlop : 8, style: _style, ...props }, children));
-}

package/src/components/Pressable.tsx

@@ -1,67 +0,0 @@
-import React, { useCallback } from "react";
-import {
-  Pressable as NativePressable,
-  PressableProps,
-  PressableStateCallbackType,
-  StyleProp,
-  ViewStyle,
-} from "react-native";
-
-type Props = {
-  disabled?: boolean;
-  children: React.ReactNode;
-  style?: ViewStyle;
-  onPress?: () => void;
-  onLongPress?: () => void;
-  delayLongPress?: number;
-  hitSlop?: number;
-  pressRetentionOffset?: number;
-  activeOpacity?: number;
-  disabledOpacity?: number;
-} & PressableProps;
-
-export type StyleType = (
-  state: PressableStateCallbackType
-) => StyleProp<ViewStyle>;
-
-export default function Pressable({
-  children,
-  disabled,
-  onPress,
-  onLongPress,
-  hitSlop,
-  delayLongPress,
-  activeOpacity,
-  disabledOpacity,
-  style,
-  ...props
-}: Props) {
-  const getOpacity = useCallback(
-    (pressed: boolean) => {
-      if (disabled) {
-        return disabledOpacity;
-      } else {
-        if (pressed) return activeOpacity;
-        else return 1;
-      }
-    },
-    [activeOpacity, disabled, disabledOpacity]
-  );
-  const _style = useCallback<StyleType>(
-    ({ pressed }) => [style as ViewStyle, { opacity: getOpacity(pressed) }],
-    [getOpacity, style]
-  );
-  return (
-    <NativePressable
-      onPress={onPress}
-      onLongPress={onLongPress}
-      disabled={disabled}
-      delayLongPress={delayLongPress ? delayLongPress : 500}
-      hitSlop={hitSlop ? hitSlop : 8}
-      style={_style}
-      {...props}
-    >
-      {children}
-    </NativePressable>
-  );
-}

package/src/mappings/Pressable.js

@@ -1,52 +0,0 @@
-import { COMPONENT_TYPES, createActionProp, Triggers, createNumberProp, StylesPanelSections, GROUPS, } from "@draftbit/types";
-const SEED_DATA_PROPS = {
-    stylesPanelSections: [
-        StylesPanelSections.Size,
-        StylesPanelSections.Margins,
-        StylesPanelSections.Borders,
-    ],
-    layout: {},
-    triggers: [Triggers.OnPress, Triggers.OnLongPress],
-    props: {
-        onPress: createActionProp(),
-        onLongPress: createActionProp(),
-        activeOpacity: createNumberProp({
-            label: "Active Opacity",
-            description: "The opacity when the button is pressed.",
-            defaultValue: 0.8,
-            group: GROUPS.basic,
-        }),
-        disabledOpacity: createNumberProp({
-            label: "Disabled Opacity",
-            description: "The opacity when the button is disabled.",
-            defaultValue: 0.8,
-            group: GROUPS.basic,
-        }),
-        delayLongPress: createNumberProp({
-            label: "Delay Long Press",
-            description: "Duration (in milliseconds) from onPressIn before onLongPress is called.",
-            group: GROUPS.basic,
-        }),
-        hitSlop: createNumberProp({
-            label: "Hit Slop",
-            description: "Sets additional distance outside of element in which a press can be detected.",
-            group: GROUPS.basic,
-        }),
-    },
-};
-export const SEED_DATA = [
-    {
-        name: "Touchable",
-        tag: "Touchable",
-        description: "An interactive view with no styles",
-        category: COMPONENT_TYPES.button,
-        ...SEED_DATA_PROPS,
-    },
-    {
-        name: "Pressable",
-        tag: "Pressable",
-        description: "An interactive view with no styles",
-        category: COMPONENT_TYPES.deprecated,
-        ...SEED_DATA_PROPS,
-    },
-];