carbon-react 111.9.1 → 111.10.0

package/lib/components/sidebar/sidebar.style.js

@@ -7,6 +7,8 @@ exports.default = void 0;
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
+var _width = _interopRequireDefault(require("../../style/utils/width"));
+
 var _base = _interopRequireDefault(require("../../style/themes/base"));
 
 var _iconButton = _interopRequireDefault(require("../icon-button/icon-button.style"));
@@ -42,7 +44,8 @@ const StyledSidebar = _styledComponents.default.div`
   onCancel,
   position,
   size,
-  theme
+  theme,
+  width
 }) => (0, _styledComponents.css)`
     background: var(--colorsUtilityMajor025);
     border-radius: 1px;
@@ -53,9 +56,12 @@ const StyledSidebar = _styledComponents.default.div`
     top: 0;
     z-index: ${theme.zIndex.fullScreenModal};
 
-    ${size && (0, _styledComponents.css)`
+    ${!width && size && (0, _styledComponents.css)`
       width: ${_sidebar.SIDEBAR_SIZES_CSS[size]};
     `}
+    ${width && (0, _width.default)({
+  width
+})}
 
     ${position && (0, _styledComponents.css)`
       box-shadow: var(--boxShadow300);

package/lib/components/text-editor/__internal__/decorators/index.d.ts

@@ -0,0 +1,3 @@
+declare var _default: CompositeDecorator;
+export default _default;
+import { CompositeDecorator } from "draft-js";

package/lib/components/text-editor/__internal__/decorators/link-decorator.d.ts

@@ -0,0 +1,7 @@
+declare namespace _default {
+    export { linkStrategy as strategy };
+    export { EditorLink as component };
+}
+export default _default;
+declare function linkStrategy(contentBlock: any, callback: any): void;
+import EditorLink from "../editor-link";

package/lib/components/text-editor/__internal__/utils/index.d.ts

@@ -0,0 +1 @@
+export { computeBlockType, getContent, getContentInfo, getDecoratedValue, getSelection, getSelectionInfo, getSelectedLength, moveSelectionToEnd, resetBlockType, isASCIIChar, replaceText, hasBlockStyle, hasInlineStyle, blockStyleFn } from "./utils";

package/lib/components/text-editor/__internal__/utils/utils.d.ts

@@ -0,0 +1,28 @@
+export function blockStyleFn(block: any): "" | "text-editor-block-unordered" | "text-editor-block-ordered";
+export function hasBlockStyle(value: any, type: any): boolean;
+export function hasInlineStyle(value: any, style: any): any;
+export function isASCIIChar(str: any): boolean;
+export function replaceText(editorState: any, text: any, inlineStyle: any, forceSelection: any): EditorState;
+export function computeBlockType(char: any, type: any): "ordered-list-item" | "unordered-list-item" | "unstyled";
+export function resetBlockType(value: any, newType?: string): EditorState;
+export function getDecoratedValue(value: any): EditorState;
+export function getContent(value: any): any;
+export function getSelection(value: any): any;
+export function getContentInfo(value: any): {
+    content: any;
+    currentBlock: any;
+    blockType: any;
+    blockLength: any;
+    blockText: any;
+    blockMap: any;
+};
+export function getSelectionInfo(value: any): {
+    selection: any;
+    startKey: any;
+    endKey: any;
+    startOffset: any;
+    endOffset: any;
+};
+export function moveSelectionToEnd(value: any): EditorState;
+export function getSelectedLength(value: any): number;
+import { EditorState } from "draft-js";

package/lib/components/text-editor/text-editor.component.d.ts

@@ -0,0 +1,8 @@
+export const EditorContext: React.Context<{}>;
+export const TextEditorState: typeof EditorState;
+export const TextEditorContentState: typeof ContentState;
+export default TextEditor;
+import React from "react";
+import { EditorState } from "draft-js";
+import { ContentState } from "draft-js";
+declare const TextEditor: React.ForwardRefExoticComponent<React.RefAttributes<any>>;

package/lib/components/text-editor/text-editor.style.d.ts

@@ -0,0 +1,3 @@
+export const StyledEditorWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledEditorContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export const StyledEditorOutline: import("styled-components").StyledComponent<"div", any, {}, never>;

package/lib/style/utils/width.d.ts

@@ -1,3 +1,3 @@
 import { styleFn } from "styled-system";
-declare const _default: ({ width }: Record<string, string>) => styleFn;
+declare const _default: ({ width }: Record<string, unknown>) => styleFn;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "111.9.1",
+  "version": "111.10.0",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",
@@ -138,8 +138,9 @@
     "file-loader": "^6.2.0",
     "fs-extra": "^10.0.0",
     "husky": "^4.3.6",
-    "jest": "^26.6.3",
+    "jest": "^27.5.1",
     "jest-canvas-mock": "^2.3.1",
+    "jest-environment-jsdom": "^27.5.1",
     "jest-fetch-mock": "^3.0.3",
     "jest-styled-components": "^6.3.1",
     "lint-staged": "^10.5.3",

package/esm/components/note/__internal__/status-with-tooltip/index.js

@@ -1 +0,0 @@
-export { default } from "./status.component";

package/esm/components/note/note.d.ts

@@ -1,30 +0,0 @@
-import * as React from "react";
-import { MarginProps } from "styled-system";
-
-export interface NoteProps extends MarginProps {
-  /**  The rich text content to display in the Note */
-  noteContent: Record<string, unknown>;
-  /** Set a percentage-based width for the whole Note component, relative to its parent. */
-  width?: number;
-  /** renders a control for the Note */
-  inlineControl?: React.ReactNode;
-  /** Adds a Title to the Note */
-  title?: string;
-  /** Adds a name to the Note footer */
-  name?: string;
-  /** Adds a created on date to the Note footer */
-  createdDate: string;
-  /** Adds a status and tooltip to the Note footer */
-  status?: {
-    text: string;
-    timeStamp: string;
-  };
-  /** The previews to display of any links added to the Editor */
-  previews?: React.ReactNode[];
-  /** Callback to report a url when a link is added */
-  onLinkAdded?: (url: string) => void;
-}
-
-declare function Note(props: NoteProps): JSX.Element;
-
-export default Note;

package/esm/components/numeral-date/numeral-date.d.ts

@@ -1,97 +0,0 @@
-import * as React from "react";
-import { MarginProps } from "styled-system";
-import { ValidationProps } from "../../__internal__/validations";
-
-interface DayMonthDate {
-  dd: string;
-  mm: string;
-}
-
-interface MonthYearDate {
-  mm: string;
-  yyyy: string;
-}
-
-interface FullDate extends DayMonthDate {
-  yyyy: string;
-}
-
-interface NumeralDateEvent {
-  target: {
-    name: string;
-    id: string;
-    value: DayMonthDate | MonthYearDate | FullDate;
-  };
-}
-
-export interface NumeralDateProps extends ValidationProps, MarginProps {
-  /** Identifier used for testing purposes, applied to the root element of the component. */
-  "data-component"?: string;
-  /** Identifier used for testing purposes, applied to the root element of the component. */
-  "data-element"?: string;
-  /** Identifier used for testing purposes, applied to the root element of the component. */
-  "data-role"?: string;
-  /** If true, the component will be disabled */
-  disabled?: boolean;
-  /** If true, the component will be read-only */
-  readOnly?: boolean;
-  /** Breakpoint for adaptive label (inline labels change to top aligned). Enables the adaptive behaviour when set */
-  adaptiveLabelBreakpoint?: number;
-  /* Array of strings to define custom input layout.
-  Allowed formats:
-  ['dd', 'mm', 'yyyy'],
-  ['mm', 'dd', 'yyyy'],
-  ['dd', 'mm'],
-  ['mm', 'dd'],
-  ['mm', 'yyyy'] */
-  dateFormat?:
-    | ["dd", "mm", "yyyy"]
-    | ["mm", "dd", "yyyy"]
-    | ["dd", "mm"]
-    | ["mm", "dd"]
-    | ["mm", "yyyy"];
-  /** Default value for use in uncontrolled mode  */
-  defaultValue?: DayMonthDate | MonthYearDate | FullDate;
-  /**  Value for use in controlled mode  */
-  value?: DayMonthDate | MonthYearDate | FullDate;
-  /** When true, enables the internal errors to be displayed */
-  enableInternalError?: boolean;
-  /** When true, enables the internal warnings to be displayed */
-  enableInternalWarning?: boolean;
-  /** Help content to be displayed under an input */
-  fieldHelp?: React.ReactNode;
-  /** `id` for events */
-  id?: string;
-  /** `name` for events */
-  name?: string;
-  /** Label */
-  label?: string;
-  /** Label alignment. Works only when labelInline is true */
-  labelAlign?: "left" | "right";
-  /** Text applied to label help tooltip */
-  labelHelp?: React.ReactNode;
-  /** When true, label is placed in line with an input */
-  labelInline?: boolean;
-  /** Label width */
-  labelWidth?: number;
-  /** Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8) */
-  labelSpacing?: 1 | 2;
-  /** Blur event handler */
-  onBlur?: (ev: NumeralDateEvent) => void;
-  /** Change event handler */
-  onChange?: (ev: NumeralDateEvent) => void;
-  /** Flag to configure component as mandatory */
-  required?: boolean;
-  /** Size of an input */
-  size?: "small" | "medium" | "large";
-  /** When true, validation icons will be placed on labels instead of being placed on the inputs */
-  validationOnLabel?: boolean;
-  /** Overrides the default tooltip position */
-  tooltipPosition?: "top" | "bottom" | "left" | "right";
-  /** Aria label for rendered help component */
-  helpAriaLabel?: string;
-}
-
-declare function NumeralDate(props: NumeralDateProps): JSX.Element;
-
-export default NumeralDate;

package/lib/components/note/note.d.ts

@@ -1,30 +0,0 @@
-import * as React from "react";
-import { MarginProps } from "styled-system";
-
-export interface NoteProps extends MarginProps {
-  /**  The rich text content to display in the Note */
-  noteContent: Record<string, unknown>;
-  /** Set a percentage-based width for the whole Note component, relative to its parent. */
-  width?: number;
-  /** renders a control for the Note */
-  inlineControl?: React.ReactNode;
-  /** Adds a Title to the Note */
-  title?: string;
-  /** Adds a name to the Note footer */
-  name?: string;
-  /** Adds a created on date to the Note footer */
-  createdDate: string;
-  /** Adds a status and tooltip to the Note footer */
-  status?: {
-    text: string;
-    timeStamp: string;
-  };
-  /** The previews to display of any links added to the Editor */
-  previews?: React.ReactNode[];
-  /** Callback to report a url when a link is added */
-  onLinkAdded?: (url: string) => void;
-}
-
-declare function Note(props: NoteProps): JSX.Element;
-
-export default Note;

package/lib/components/numeral-date/numeral-date.d.ts

@@ -1,97 +0,0 @@
-import * as React from "react";
-import { MarginProps } from "styled-system";
-import { ValidationProps } from "../../__internal__/validations";
-
-interface DayMonthDate {
-  dd: string;
-  mm: string;
-}
-
-interface MonthYearDate {
-  mm: string;
-  yyyy: string;
-}
-
-interface FullDate extends DayMonthDate {
-  yyyy: string;
-}
-
-interface NumeralDateEvent {
-  target: {
-    name: string;
-    id: string;
-    value: DayMonthDate | MonthYearDate | FullDate;
-  };
-}
-
-export interface NumeralDateProps extends ValidationProps, MarginProps {
-  /** Identifier used for testing purposes, applied to the root element of the component. */
-  "data-component"?: string;
-  /** Identifier used for testing purposes, applied to the root element of the component. */
-  "data-element"?: string;
-  /** Identifier used for testing purposes, applied to the root element of the component. */
-  "data-role"?: string;
-  /** If true, the component will be disabled */
-  disabled?: boolean;
-  /** If true, the component will be read-only */
-  readOnly?: boolean;
-  /** Breakpoint for adaptive label (inline labels change to top aligned). Enables the adaptive behaviour when set */
-  adaptiveLabelBreakpoint?: number;
-  /* Array of strings to define custom input layout.
-  Allowed formats:
-  ['dd', 'mm', 'yyyy'],
-  ['mm', 'dd', 'yyyy'],
-  ['dd', 'mm'],
-  ['mm', 'dd'],
-  ['mm', 'yyyy'] */
-  dateFormat?:
-    | ["dd", "mm", "yyyy"]
-    | ["mm", "dd", "yyyy"]
-    | ["dd", "mm"]
-    | ["mm", "dd"]
-    | ["mm", "yyyy"];
-  /** Default value for use in uncontrolled mode  */
-  defaultValue?: DayMonthDate | MonthYearDate | FullDate;
-  /**  Value for use in controlled mode  */
-  value?: DayMonthDate | MonthYearDate | FullDate;
-  /** When true, enables the internal errors to be displayed */
-  enableInternalError?: boolean;
-  /** When true, enables the internal warnings to be displayed */
-  enableInternalWarning?: boolean;
-  /** Help content to be displayed under an input */
-  fieldHelp?: React.ReactNode;
-  /** `id` for events */
-  id?: string;
-  /** `name` for events */
-  name?: string;
-  /** Label */
-  label?: string;
-  /** Label alignment. Works only when labelInline is true */
-  labelAlign?: "left" | "right";
-  /** Text applied to label help tooltip */
-  labelHelp?: React.ReactNode;
-  /** When true, label is placed in line with an input */
-  labelInline?: boolean;
-  /** Label width */
-  labelWidth?: number;
-  /** Spacing between label and a field for inline label, given number will be multiplied by base spacing unit (8) */
-  labelSpacing?: 1 | 2;
-  /** Blur event handler */
-  onBlur?: (ev: NumeralDateEvent) => void;
-  /** Change event handler */
-  onChange?: (ev: NumeralDateEvent) => void;
-  /** Flag to configure component as mandatory */
-  required?: boolean;
-  /** Size of an input */
-  size?: "small" | "medium" | "large";
-  /** When true, validation icons will be placed on labels instead of being placed on the inputs */
-  validationOnLabel?: boolean;
-  /** Overrides the default tooltip position */
-  tooltipPosition?: "top" | "bottom" | "left" | "right";
-  /** Aria label for rendered help component */
-  helpAriaLabel?: string;
-}
-
-declare function NumeralDate(props: NumeralDateProps): JSX.Element;
-
-export default NumeralDate;