Styled System Props Resolver (utils/getStyledSystemPropsAndRestProps.ts)

NativeBase · src/utils/getStyledSystemPropsAndRestProps.ts · typescript · MIT
ui, lang:typescript, fw:react, tag:knn-classified

Splits component props into styled system configuration props and rest props for UI styling. Reuse when building design system primitives.

// Source: https://github.com/GeekyAnts/NativeBase | License: MIT | Copyright 2021 GeekyAnts India Pvt Ltd
// Provided via justclaw.it.com; keep this notice with the code.
import { propConfig } from '../theme/styled-system';
/**
 * Common Logic Sharing between useSx and useStyledSystemPropResolver
 * @param props
 * @returns { styledSystemProps, restProps }
 */
export const getStyledSystemPropsAndRestProps = (props: any) => {
  const styledSystemProps: any = {};
  const restProps: any = {};

  for (let key in props) {
    if (key in propConfig) {
      styledSystemProps[key] = props[key];
    } else {
      restProps[key] = props[key];
    }
  }

  return { styledSystemProps, restProps };
};

See the full source, get the GitHub permalink, and search for more like it.

Get a free API key