@draftbit/core 46.11.1-d7a8f7.2 → 46.11.1-e9ee84.2

package/src/mappings/DeckSwiperCard.ts

@@ -1,16 +1,20 @@
-import {
-  COMPONENT_TYPES,
-  CONTAINER_COMPONENT_STYLES_SECTIONS,
-} from "@draftbit/types";
+import { COMPONENT_TYPES, StylesPanelSections } from "@draftbit/types";
 
 export const SEED_DATA = {
   name: "Deck Swiper Card",
   tag: "DeckSwiperCard",
   description: "Single Deck Swiper Card item to be used in DeckSwiper",
   category: COMPONENT_TYPES.swiper,
-  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
+  stylesPanelSections: [
+    StylesPanelSections.LayoutFlexItems,
+    StylesPanelSections.LayoutContent,
+    StylesPanelSections.Background,
+    StylesPanelSections.Size,
+    StylesPanelSections.MarginsAndPaddings,
+    StylesPanelSections.Borders,
+    StylesPanelSections.Effects,
+  ],
   layout: {
-    flex: 1,
     alignItems: "center",
     justifyContent: "center",
     padding: 20,

package/src/mappings/Shadow.js

@@ -1,10 +1,16 @@
-import { COMPONENT_TYPES, CONTAINER_COMPONENT_STYLES_SECTIONS, createColorProp, createStaticNumberProp, createStaticBoolProp, createDisabledProp, GROUPS, } from "@draftbit/types";
+import { COMPONENT_TYPES, createColorProp, createStaticNumberProp, createStaticBoolProp, createDisabledProp, GROUPS, StylesPanelSections, } from "@draftbit/types";
 export const SEED_DATA = {
     name: "Shadow",
     tag: "Shadow",
     description: "A cross-platform, universal shadow.",
     category: COMPONENT_TYPES.view,
-    stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
+    stylesPanelSections: [
+        StylesPanelSections.Size,
+        StylesPanelSections.Margins,
+        StylesPanelSections.Position,
+        StylesPanelSections.Borders,
+        StylesPanelSections.Effects,
+    ],
     props: {
         disabled: createDisabledProp({
             description: "Disables the shadow.",
@@ -26,7 +32,7 @@ export const SEED_DATA = {
         paintInside: createStaticBoolProp({
             label: "Paint Inside",
             description: "Apply the shadow below/inside the content.",
-            defaultValue: false,
+            defaultValue: true,
         }),
         stretch: createStaticBoolProp({
             label: "Stretch",

package/src/mappings/Shadow.ts

@@ -1,11 +1,11 @@
 import {
   COMPONENT_TYPES,
-  CONTAINER_COMPONENT_STYLES_SECTIONS,
   createColorProp,
   createStaticNumberProp,
   createStaticBoolProp,
   createDisabledProp,
   GROUPS,
+  StylesPanelSections,
 } from "@draftbit/types";
 
 export const SEED_DATA = {
@@ -13,7 +13,13 @@ export const SEED_DATA = {
   tag: "Shadow",
   description: "A cross-platform, universal shadow.",
   category: COMPONENT_TYPES.view,
-  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
+  stylesPanelSections: [
+    StylesPanelSections.Size,
+    StylesPanelSections.Margins,
+    StylesPanelSections.Position,
+    StylesPanelSections.Borders,
+    StylesPanelSections.Effects,
+  ],
   props: {
     disabled: createDisabledProp({
       description: "Disables the shadow.",
@@ -35,7 +41,7 @@ export const SEED_DATA = {
     paintInside: createStaticBoolProp({
       label: "Paint Inside",
       description: "Apply the shadow below/inside the content.",
-      defaultValue: false,
+      defaultValue: true,
     }),
     stretch: createStaticBoolProp({
       label: "Stretch",

package/src/utilities.js

@@ -65,6 +65,15 @@ export function extractBorderAndMarginStyles(style, additionalBorderStyles, addi
     ]), identity);
     return { borderStyles, marginStyles };
 }
+export const sizeStyleNames = ["width", "height"];
+export function extractSizeStyles(style, additionalSizeStyles) {
+    const flatStyle = StyleSheet.flatten(style || {});
+    const sizeStyles = pickBy(pick(flatStyle, [
+        ...sizeStyleNames,
+        ...(additionalSizeStyles ? additionalSizeStyles : []),
+    ]), identity);
+    return sizeStyles;
+}
 /**
  * Merges a style object on top of another style object. In React Native,
  * keys with undefined values in a style object will still override styles

package/src/utilities.ts

@@ -98,6 +98,25 @@ export function extractBorderAndMarginStyles(
   return { borderStyles, marginStyles };
 }
 
+export const sizeStyleNames = ["width", "height"];
+
+export function extractSizeStyles(
+  style: StyleProp<any>,
+  additionalSizeStyles?: string[]
+) {
+  const flatStyle = StyleSheet.flatten(style || {});
+
+  const sizeStyles = pickBy(
+    pick(flatStyle, [
+      ...sizeStyleNames,
+      ...(additionalSizeStyles ? additionalSizeStyles : []),
+    ]),
+    identity
+  );
+
+  return sizeStyles;
+}
+
 /**
  * Merges a style object on top of another style object. In React Native,
  * keys with undefined values in a style object will still override styles