carbon-react 104.58.8 → 105.0.2

package/lib/components/vertical-divider/vertical-divider.style.d.ts

@@ -1,2 +1,4 @@
-export const StyledVerticalWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const StyledDivider: import("styled-components").StyledComponent<"div", any, {}, never>;
+import { VerticalDividerPropTypes } from "./vertical-divider.component";
+declare const StyledVerticalWrapper: import("styled-components").StyledComponent<"div", any, VerticalDividerPropTypes, never>;
+declare const StyledDivider: import("styled-components").StyledComponent<"div", any, Pick<VerticalDividerPropTypes, "tint">, never>;
+export { StyledVerticalWrapper, StyledDivider };

package/lib/components/vertical-divider/vertical-divider.style.js

@@ -20,7 +20,7 @@ const StyledVerticalWrapper = _styledComponents.default.div`
   ${({
   height
 }) => height && (0, _styledComponents.css)`
-      height: ${typeof height === "string" ? `${height};` : `${height}px;`};
+      height: ${typeof height === "string" ? `${height}` : `${height}px`};
     `}
   ${({
   displayInline

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "104.58.8",
+  "version": "105.0.2",
   "description": "A library of reusable React components for easily building user interfaces.",
   "engineStrict": true,
   "engines": {

package/esm/components/row/column/column.component.d.ts

@@ -1,30 +0,0 @@
-export default Column;
-declare function Column({ columnAlign, columns, columnSpan, columnOffset, columnClasses, className, ...props }: {
-    [x: string]: any;
-    columnAlign: any;
-    columns: any;
-    columnSpan: any;
-    columnOffset: any;
-    columnClasses: any;
-    className: any;
-}): JSX.Element;
-declare namespace Column {
-    namespace defaultProps {
-        const columnOffset: string;
-        const columnSpan: string;
-        const columnAlign: string;
-    }
-    namespace propTypes {
-        export const children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        export const className: PropTypes.Requireable<string>;
-        export const columns: PropTypes.Requireable<string | number>;
-        export const columnClasses: PropTypes.Requireable<string>;
-        const columnAlign_1: PropTypes.Requireable<string>;
-        export { columnAlign_1 as columnAlign };
-        const columnOffset_1: PropTypes.Requireable<string | number>;
-        export { columnOffset_1 as columnOffset };
-        const columnSpan_1: PropTypes.Requireable<string | number>;
-        export { columnSpan_1 as columnSpan };
-    }
-}
-import PropTypes from "prop-types";

package/esm/components/row/column/column.component.js

@@ -1,72 +0,0 @@
-import React from "react";
-import PropTypes from "prop-types";
-import classNames from "classnames";
-import StyledColumn from "./column.style";
-import Logger from "../../../__internal__/utils/logger";
-let deprecatedWarnTriggered = false;
-
-const Column = ({
-  columnAlign,
-  columns,
-  columnSpan,
-  columnOffset,
-  columnClasses,
-  className,
-  ...props
-}) => {
-  if (!deprecatedWarnTriggered) {
-    deprecatedWarnTriggered = true; // eslint-disable-next-line max-len
-
-    Logger.deprecate("`Column` component is deprecated and will soon be removed.");
-  }
-
-  return /*#__PURE__*/React.createElement(StyledColumn, {
-    columnAlign: columnAlign,
-    className: classNames(className, columnClasses),
-    columns: columns,
-    columnSpan: columnSpan,
-    columnOffset: columnOffset,
-    "data-component": "column"
-  }, props.children);
-};
-
-Column.defaultProps = {
-  columnOffset: "0",
-  columnSpan: "1",
-  columnAlign: "left"
-};
-/* eslint-disable react/no-unused-prop-types */
-
-Column.propTypes = {
-  /** Content. */
-  children: PropTypes.node,
-
-  /** Classes to apply to the component. */
-  className: PropTypes.string,
-
-  /**
-   * @private
-   * @ignore
-   */
-
-  /** Total column count */
-  columns: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-
-  /**
-   * @private
-   * @ignore
-   */
-
-  /** Classes applied by row component to affect all rows */
-  columnClasses: PropTypes.string,
-
-  /** Alignment of content within column. */
-  columnAlign: PropTypes.oneOf(["left", "center", "middle", "right"]),
-
-  /** Offset this column by a certain number of columns. */
-  columnOffset: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-
-  /** Span this column by a certain number of columns. */
-  columnSpan: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
-};
-export default Column;

package/esm/components/row/column/column.d.ts

@@ -1,22 +0,0 @@
-import * as React from "react";
-
-export interface ColumnProps {
-  /** Children. */
-  children?: React.ReactNode;
-  /** Classes to apply to the component. */
-  className?: string;
-  /** Total column count. */
-  columns?: number | string;
-  /** Classes applied by row component to affect all rows */
-  columnClasses?: string;
-  /** Alignment of content within column. */
-  columnAlign?: "left" | "center" | "middle" | "right";
-  /** Offset this column by a certain number of columns. */
-  columnOffset?: number | string;
-  /** Span this column by a certain number of columns. */
-  columnSpan?: number | string;
-}
-
-declare function Column(props: ColumnProps): JSX.Element;
-
-export default Column;

package/esm/components/row/column/column.style.d.ts

@@ -1,2 +0,0 @@
-export default StyledColumn;
-declare const StyledColumn: import("styled-components").StyledComponent<"div", any, {}, never>;

package/esm/components/row/column/column.style.js

@@ -1,32 +0,0 @@
-import styled, { css } from "styled-components";
-const StyledColumn = styled.div`
-  box-sizing: border-box;
-  float: left;
-  min-height: 1px;
-  width: 100%;
-  ${({
-  columnAlign
-}) => (columnAlign === "center" || columnAlign === "middle") && "text-align: center"}
-
-  ${({
-  columnAlign
-}) => columnAlign === "right" && "text-align: right"}
-  ${({
-  columns
-}) => css`
-    width: ${100 / columns}%;
-  `}
-  ${({
-  columns,
-  columnSpan
-}) => css`
-    width: ${100 / columns * +columnSpan}%;
-  `}
-  ${({
-  columns,
-  columnOffset
-}) => css`
-    margin-left: ${100 / columns * +columnOffset}%;
-  `}
-`;
-export default StyledColumn;

package/esm/components/row/index.d.ts

@@ -1,2 +0,0 @@
-export { default as Row } from "./row";
-export { default as Column } from "./column/column";

package/esm/components/row/index.js

@@ -1,2 +0,0 @@
-export { default as Row } from "./row.component";
-export { default as Column } from "./column/column.component";

package/esm/components/row/row.component.d.ts

@@ -1,24 +0,0 @@
-export default Row;
-declare function Row({ columns, children, columnClasses, columnDivide, gutter, className, }: {
-    columns: any;
-    children: any;
-    columnClasses: any;
-    columnDivide: any;
-    gutter: any;
-    className: any;
-}): JSX.Element;
-declare namespace Row {
-    namespace propTypes {
-        const children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        const className: PropTypes.Requireable<string>;
-        const gutter: PropTypes.Requireable<string>;
-        const columnDivide: PropTypes.Requireable<boolean>;
-        const columns: PropTypes.Requireable<string | number>;
-        const columnClasses: PropTypes.Requireable<string>;
-    }
-    namespace defaultProps {
-        const gutter_1: string;
-        export { gutter_1 as gutter };
-    }
-}
-import PropTypes from "prop-types";

package/esm/components/row/row.component.js

@@ -1,59 +0,0 @@
-import React from "react";
-import PropTypes from "prop-types";
-import StyledRow from "./row.style";
-import Logger from "../../__internal__/utils/logger";
-let deprecatedWarnTriggered = false;
-
-const Row = ({
-  columns,
-  children,
-  columnClasses,
-  columnDivide,
-  gutter,
-  className
-}) => {
-  const columnsCount = columns || React.Children.toArray(children).length;
-
-  if (!deprecatedWarnTriggered) {
-    deprecatedWarnTriggered = true; // eslint-disable-next-line max-len
-
-    Logger.deprecate("`Row` component is deprecated and will soon be removed.");
-  }
-
-  const buildColumns = () => React.Children.toArray(children).map(child => /*#__PURE__*/React.cloneElement(child, {
-    columnClasses,
-    columns: columnsCount
-  }, child.props.children));
-
-  return /*#__PURE__*/React.createElement(StyledRow, {
-    "data-component": "row",
-    columnDivide: columnDivide,
-    gutter: gutter,
-    className: className,
-    columns: columns || React.Children.toArray(children).length
-  }, buildColumns());
-};
-
-Row.propTypes = {
-  /** This component supports children of type Column. */
-  children: PropTypes.node.isRequired,
-
-  /** Classes to apply to the component. */
-  className: PropTypes.string,
-
-  /** Define how wide the gutter between the rows and columns should be. */
-  gutter: PropTypes.oneOf(["none", "extra-small", "small", "medium-small", "medium", "medium-large", "large", "extra-large"]),
-
-  /** Enable a divider between each column. */
-  columnDivide: PropTypes.bool,
-
-  /** Define a certain amount of columns, instead of basing it on the number of children. */
-  columns: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-
-  /** Classes to apply to all column children. */
-  columnClasses: PropTypes.string
-};
-Row.defaultProps = {
-  gutter: "medium"
-};
-export default Row;

package/esm/components/row/row.config.d.ts

@@ -1,11 +0,0 @@
-export const ROW_SIZES: string[];
-export const ROW_SIZES_CSS: {
-    none: number;
-    "extra-small": number;
-    small: number;
-    "medium-small": number;
-    medium: number;
-    "medium-large": number;
-    large: number;
-    "extra-large": number;
-};

package/esm/components/row/row.config.js

@@ -1,12 +0,0 @@
-// eslint-disable-next-line import/prefer-default-export
-export const ROW_SIZES = ["extra-small", "small", "medium-small", "medium", "medium-large", "large", "extra-large"];
-export const ROW_SIZES_CSS = {
-  none: 0,
-  "extra-small": 2,
-  small: 5,
-  "medium-small": 10,
-  medium: 15,
-  "medium-large": 30,
-  large: 60,
-  "extra-large": 90
-};

package/esm/components/row/row.d.ts

@@ -1,27 +0,0 @@
-import * as React from "react";
-
-export interface RowProps {
-  /** This component supports children of type Column. */
-  children: React.ReactNode;
-  /** Classes to apply to the component. */
-  className?: string;
-  /** Define how wide the gutter between the rows and columns should be. */
-  gutter?:
-    | "extra-small"
-    | "small"
-    | "medium-small"
-    | "medium"
-    | "medium-large"
-    | "large"
-    | "extra-large";
-  /** Enable a divider between each column. */
-  columnDivide?: boolean;
-  /** Define a certain amount of columns, instead of basing it on the number of children. */
-  columns?: number | string;
-  /** Classes to apply to all column children. */
-  columnClasses?: string;
-}
-
-declare function Row(props: RowProps): JSX.Element;
-
-export default Row;

package/esm/components/row/row.style.d.ts

@@ -1,2 +0,0 @@
-export default StyledRow;
-declare const StyledRow: import("styled-components").StyledComponent<"div", any, {}, never>;

package/esm/components/row/row.style.js

@@ -1,53 +0,0 @@
-import styled, { css } from "styled-components";
-import baseTheme from "../../style/themes/base";
-import StyledColumn from "./column/column.style";
-import { ROW_SIZES_CSS } from "./row.config";
-const StyledRow = styled.div`
-  clear: both;
-  position: relative;
-
-  ${({
-  gutter,
-  columnDivide
-}) => {
-  const size = ROW_SIZES_CSS[gutter];
-  return css`
-      margin-bottom: -${size}px;
-      margin-left: -${size}px;
-
-      ${StyledColumn} {
-        margin-bottom: ${size}px;
-        padding-left: ${size}px;
-
-        ${columnDivide && css`
-          position: relative;
-
-          &:before {
-            content: "";
-            position: absolute;
-            width: 1px;
-            height: 100%;
-            background-color: ${baseTheme.palette.slateTint(70)};
-            left: ${size / 2}px;
-            top: 0;
-          }
-
-          &:first-child:before {
-            display: none;
-          }
-        `}
-      }
-    `;
-}}
-
-  /* Clearfix */
-  &:before,
-  &:after {
-    content: "";
-    display: table;
-  }
-  &:after {
-    clear: both;
-  }
-`;
-export default StyledRow;

package/esm/components/vertical-divider/vertical-divider.d.ts

@@ -1,113 +0,0 @@
-import { SpaceProps } from "styled-system";
-
-type TintRange =
-  | 1
-  | 2
-  | 3
-  | 4
-  | 5
-  | 6
-  | 7
-  | 8
-  | 9
-  | 10
-  | 11
-  | 12
-  | 13
-  | 14
-  | 15
-  | 16
-  | 17
-  | 18
-  | 19
-  | 20
-  | 21
-  | 22
-  | 23
-  | 24
-  | 25
-  | 26
-  | 27
-  | 28
-  | 29
-  | 30
-  | 31
-  | 32
-  | 33
-  | 34
-  | 35
-  | 36
-  | 37
-  | 38
-  | 39
-  | 40
-  | 41
-  | 42
-  | 43
-  | 44
-  | 45
-  | 46
-  | 47
-  | 48
-  | 49
-  | 50
-  | 51
-  | 52
-  | 53
-  | 54
-  | 55
-  | 56
-  | 57
-  | 58
-  | 59
-  | 60
-  | 61
-  | 62
-  | 63
-  | 64
-  | 65
-  | 66
-  | 67
-  | 68
-  | 69
-  | 70
-  | 71
-  | 72
-  | 73
-  | 74
-  | 75
-  | 76
-  | 77
-  | 78
-  | 79
-  | 80
-  | 81
-  | 82
-  | 83
-  | 84
-  | 85
-  | 86
-  | 87
-  | 88
-  | 89
-  | 90
-  | 91
-  | 92
-  | 93
-  | 94
-  | 95
-  | 96
-  | 97
-  | 98
-  | 99
-  | 100;
-export interface VerticalDividerPropTypes extends SpaceProps {
-  h?: number | string;
-  displayInline?: boolean;
-  /** the supported rage is 1-100  */
-  tint?: TintRange;
-}
-
-declare function VerticalDivider(props: VerticalDividerPropTypes): JSX.Element;
-
-export default VerticalDivider;

package/lib/components/row/column/column.component.d.ts

@@ -1,30 +0,0 @@
-export default Column;
-declare function Column({ columnAlign, columns, columnSpan, columnOffset, columnClasses, className, ...props }: {
-    [x: string]: any;
-    columnAlign: any;
-    columns: any;
-    columnSpan: any;
-    columnOffset: any;
-    columnClasses: any;
-    className: any;
-}): JSX.Element;
-declare namespace Column {
-    namespace defaultProps {
-        const columnOffset: string;
-        const columnSpan: string;
-        const columnAlign: string;
-    }
-    namespace propTypes {
-        export const children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        export const className: PropTypes.Requireable<string>;
-        export const columns: PropTypes.Requireable<string | number>;
-        export const columnClasses: PropTypes.Requireable<string>;
-        const columnAlign_1: PropTypes.Requireable<string>;
-        export { columnAlign_1 as columnAlign };
-        const columnOffset_1: PropTypes.Requireable<string | number>;
-        export { columnOffset_1 as columnOffset };
-        const columnSpan_1: PropTypes.Requireable<string | number>;
-        export { columnSpan_1 as columnSpan };
-    }
-}
-import PropTypes from "prop-types";

package/lib/components/row/column/column.component.js

@@ -1,87 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _column = _interopRequireDefault(require("./column.style"));
-
-var _logger = _interopRequireDefault(require("../../../__internal__/utils/logger"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-let deprecatedWarnTriggered = false;
-
-const Column = ({
-  columnAlign,
-  columns,
-  columnSpan,
-  columnOffset,
-  columnClasses,
-  className,
-  ...props
-}) => {
-  if (!deprecatedWarnTriggered) {
-    deprecatedWarnTriggered = true; // eslint-disable-next-line max-len
-
-    _logger.default.deprecate("`Column` component is deprecated and will soon be removed.");
-  }
-
-  return /*#__PURE__*/_react.default.createElement(_column.default, {
-    columnAlign: columnAlign,
-    className: (0, _classnames.default)(className, columnClasses),
-    columns: columns,
-    columnSpan: columnSpan,
-    columnOffset: columnOffset,
-    "data-component": "column"
-  }, props.children);
-};
-
-Column.defaultProps = {
-  columnOffset: "0",
-  columnSpan: "1",
-  columnAlign: "left"
-};
-/* eslint-disable react/no-unused-prop-types */
-
-Column.propTypes = {
-  /** Content. */
-  children: _propTypes.default.node,
-
-  /** Classes to apply to the component. */
-  className: _propTypes.default.string,
-
-  /**
-   * @private
-   * @ignore
-   */
-
-  /** Total column count */
-  columns: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
-
-  /**
-   * @private
-   * @ignore
-   */
-
-  /** Classes applied by row component to affect all rows */
-  columnClasses: _propTypes.default.string,
-
-  /** Alignment of content within column. */
-  columnAlign: _propTypes.default.oneOf(["left", "center", "middle", "right"]),
-
-  /** Offset this column by a certain number of columns. */
-  columnOffset: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
-
-  /** Span this column by a certain number of columns. */
-  columnSpan: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string])
-};
-var _default = Column;
-exports.default = _default;

package/lib/components/row/column/column.d.ts

@@ -1,22 +0,0 @@
-import * as React from "react";
-
-export interface ColumnProps {
-  /** Children. */
-  children?: React.ReactNode;
-  /** Classes to apply to the component. */
-  className?: string;
-  /** Total column count. */
-  columns?: number | string;
-  /** Classes applied by row component to affect all rows */
-  columnClasses?: string;
-  /** Alignment of content within column. */
-  columnAlign?: "left" | "center" | "middle" | "right";
-  /** Offset this column by a certain number of columns. */
-  columnOffset?: number | string;
-  /** Span this column by a certain number of columns. */
-  columnSpan?: number | string;
-}
-
-declare function Column(props: ColumnProps): JSX.Element;
-
-export default Column;

package/lib/components/row/column/column.style.d.ts

@@ -1,2 +0,0 @@
-export default StyledColumn;
-declare const StyledColumn: import("styled-components").StyledComponent<"div", any, {}, never>;