@wordpress/block-library/build-module/column/column-preview.native.js

Block library for the WordPress editor.

import { createElement } from "@wordpress/element";

/**
 * External dependencies
 */
import { View } from 'react-native';
/**
 * WordPress dependencies
 */

import { usePreferredColorSchemeStyle } from '@wordpress/compose';
import { useConvertUnitToMobile } from '@wordpress/components';
/**
 * Internal dependencies
 */

import styles from './editor.scss';

function ColumnPreviewItem(_ref) {
  let {
    index,
    selectedColumnIndex,
    width
  } = _ref;
  const columnIndicatorStyle = usePreferredColorSchemeStyle(styles.columnIndicator, styles.columnIndicatorDark);
  const isSelectedColumn = index === selectedColumnIndex;
  const convertedWidth = useConvertUnitToMobile(width);
  return createElement(View, {
    style: [isSelectedColumn && columnIndicatorStyle, {
      flex: convertedWidth
    }],
    key: index
  });
}

function ColumnsPreview(_ref2) {
  let {
    columnWidths,
    selectedColumnIndex
  } = _ref2;
  const columnsPreviewStyle = usePreferredColorSchemeStyle(styles.columnsPreview, styles.columnsPreviewDark);
  return createElement(View, {
    style: columnsPreviewStyle
  }, columnWidths.map((width, index) => {
    return createElement(ColumnPreviewItem, {
      index: index,
      selectedColumnIndex: selectedColumnIndex,
      width: width,
      key: index
    });
  }));
}

export default ColumnsPreview;
//# sourceMappingURL=column-preview.native.js.map