@carbon/web-components 2.0.0-rc.1 → 2.0.0-rc.3

package/lib/components/modal/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":["MODAL_SIZE","exports"],"sources":["components/modal/defs.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Modal size.\n */\nexport enum MODAL_SIZE {\n  /**\n   * Extra small size.\n   */\n  EXTRA_SMALL = 'xs',\n\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n}\n"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA,IAGYA,UAAU;AAAAC,OAAA,CAAAD,UAAA,GAAAA,UAAA;AAAA,WAAVA,UAAU;EAAVA,UAAU;EAAVA,UAAU;EAAVA,UAAU;EAAVA,UAAU;AAAA,GAAVA,UAAU,KAAAC,OAAA,CAAAD,UAAA,GAAVA,UAAU"}
+{"version":3,"file":"defs.js","names":["MODAL_SIZE","exports"],"sources":["components/modal/defs.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Modal size.\n */\nexport enum MODAL_SIZE {\n  /**\n   * Extra small size.\n   */\n  EXTRA_SMALL = 'xs',\n\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n}\n"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAFA,IAGYA,UAAU;AAAAC,OAAA,CAAAD,UAAA,GAAAA,UAAA;AAAA,WAAVA,UAAU;EAAVA,UAAU;EAAVA,UAAU;EAAVA,UAAU;EAAVA,UAAU;AAAA,GAAVA,UAAU,KAAAC,OAAA,CAAAD,UAAA,GAAVA,UAAU"}

package/lib/components/stack/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":["_layout","require","STACK_ORIENTATION","exports","SPACING_STEPS","Array","from","length","spacing","map","_","step"],"sources":["components/stack/defs.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { spacing } from '@carbon/layout';\n\n/**\n * Stack orientation\n */\nexport enum STACK_ORIENTATION {\n  /**\n   * Default vertical orientation.\n   */\n  VERTICAL = 'vertical',\n\n  /**\n   * Horizontal.\n   */\n  HORIZONTAL = 'horizontal',\n}\n\n/**\n * The steps in the spacing scale\n *\n * @type {Array<number>}\n */\nexport const SPACING_STEPS = Array.from({ length: spacing.length - 1 }).map(\n  (_, step) => {\n    return step + 1;\n  }\n);\n"],"mappings":";;;;;;AASA,IAAAA,OAAA,GAAAC,OAAA;AATA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AAFA,IAGYC,iBAAiB;AAY7B;AACA;AACA;AACA;AACA;AAJAC,OAAA,CAAAD,iBAAA,GAAAA,iBAAA;AAAA,WAZYA,iBAAiB;EAAjBA,iBAAiB;EAAjBA,iBAAiB;AAAA,GAAjBA,iBAAiB,KAAAC,OAAA,CAAAD,iBAAA,GAAjBA,iBAAiB;AAiBtB,MAAME,aAAa,GAAGC,KAAK,CAACC,IAAI,CAAC;EAAEC,MAAM,EAAEC,eAAO,CAACD,MAAM,GAAG;AAAE,CAAC,CAAC,CAACE,GAAG,CACzE,CAACC,CAAC,EAAEC,IAAI,KAAK;EACX,OAAOA,IAAI,GAAG,CAAC;AACjB,CAAC,CACF;AAACR,OAAA,CAAAC,aAAA,GAAAA,aAAA"}
+{"version":3,"file":"defs.js","names":["_layout","require","STACK_ORIENTATION","exports","SPACING_STEPS","Array","from","length","spacing","map","_","step"],"sources":["components/stack/defs.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { spacing } from '@carbon/layout';\n\n/**\n * Stack orientation\n */\nexport enum STACK_ORIENTATION {\n  /**\n   * Default vertical orientation.\n   */\n  VERTICAL = 'vertical',\n\n  /**\n   * Horizontal.\n   */\n  HORIZONTAL = 'horizontal',\n}\n\n/**\n * The steps in the spacing scale\n *\n * @type {Array<number>}\n */\nexport const SPACING_STEPS = Array.from({ length: spacing.length - 1 }).map(\n  (_, step) => {\n    return step + 1;\n  }\n);\n"],"mappings":";;;;;;AASA,IAAAA,OAAA,GAAAC,OAAA;AATA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AAFA,IAGYC,iBAAiB;AAY7B;AACA;AACA;AACA;AACA;AAJAC,OAAA,CAAAD,iBAAA,GAAAA,iBAAA;AAAA,WAZYA,iBAAiB;EAAjBA,iBAAiB;EAAjBA,iBAAiB;AAAA,GAAjBA,iBAAiB,KAAAC,OAAA,CAAAD,iBAAA,GAAjBA,iBAAiB;AAiBtB,MAAME,aAAa,GAAGC,KAAK,CAACC,IAAI,CAAC;EAAEC,MAAM,EAAEC,eAAO,CAACD,MAAM,GAAG;AAAE,CAAC,CAAC,CAACE,GAAG,CACzE,CAACC,CAAC,EAAEC,IAAI,KAAK;EACX,OAAOA,IAAI,GAAG,CAAC;AACjB,CACF,CAAC;AAACR,OAAA,CAAAC,aAAA,GAAAA,aAAA"}

package/lib/globals/wrappers/createReactCustomElementType.js

@@ -19,6 +19,22 @@ var _on = _interopRequireDefault(require("../mixins/on"));
  * LICENSE file in the root directory of this source tree.
  */
 
+/**
+ * A descriptor for a React event prop of a custom element.
+ */
+
+/**
+ * A descriptor for a React prop for an attribute of a custom element.
+ */
+
+/**
+ * A descriptor for a set of React props for attributes of a custom element.
+ */
+
+/**
+ * React props for the component `createCustomElementType()` generates.
+ */
+
 /**
  * @param refs List of React refs to merge.
  * @returns Merged React ref.

package/lib/globals/wrappers/createReactCustomElementType.js.map

@@ -1 +1 @@
-{"version":3,"file":"createReactCustomElementType.js","names":["_react","require","_on","_interopRequireDefault","mergeRefs","refs","el","forEach","ref","Object","current","convertProp","prop","descriptor","event","serialize","undefined","convertProps","props","keys","reduce","acc","propName","descriptorItem","converted","attribute","_objectSpread2","default","attachEventListeners","elem","callback","handles","Set","eventDescriptor","name","options","add","on","release","handle","delete","createReactCustomElementType","nonAttributeProps","filter","CustomElementType","Component","constructor","args","_defineProperty2","listener","call","currentTarget","_elem","_eventListenersHandle","_handleEvent","updateProps","prevProps","prevValue","value","componentDidMount","componentDidUpdate","render","_this$props","children","innerRef","_objectWithoutProperties2","mergedRef","_handleElemRef","createElement","forwardRef","booleanSerializer","exports","numberSerializer","String","objectSerializer","JSON","stringify","_default"],"sources":["globals/wrappers/createReactCustomElementType.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport React, { Component, createElement, forwardRef } from 'react';\nimport on from '../mixins/on';\nimport Handle from '../internal/handle';\n\n/**\n * A descriptor for a React event prop of a custom element.\n */\ninterface CustomElementEventDescriptor {\n  /**\n   * The event name.\n   */\n  name: string;\n\n  /**\n   * A boolean to detemine usage of capture mode or the event options.\n   */\n  options?: boolean | EventListenerOptions;\n}\n\n/**\n * A descriptor for a React prop for an attribute of a custom element.\n */\ninterface CustomElementPropDescriptor {\n  /**\n   * The attribute name for the prop.\n   */\n  attribute?: string | false;\n\n  /**\n   * The event name (or descriptor) for the prop.\n   */\n  event?: string | CustomElementEventDescriptor;\n\n  /**\n   * A function that takes a property value and returns the corresponding attribute value.\n   */\n  serialize?: (value: any) => string | void;\n}\n\n/**\n * A descriptor for a set of React props for attributes of a custom element.\n */\ninterface CustomElementPropsDescriptor {\n  [propName: string]: CustomElementPropDescriptor;\n}\n\n/**\n * React props for the component `createCustomElementType()` generates.\n */\ninterface CustomElementTypeProps {\n  /**\n   * Ordinal prop.\n   */\n  [propName: string]: any;\n\n  /**\n   * Child nodes.\n   */\n  // eslint-disable-next-line react/no-unused-prop-types\n  children?: React.ReactNode;\n}\n\n/**\n * @param refs List of React refs to merge.\n * @returns Merged React ref.\n */\nconst mergeRefs =\n  <T>(...refs: React.Ref<T>[]) =>\n  (el) => {\n    refs.forEach((ref) => {\n      // https://github.com/facebook/react/issues/13029#issuecomment-410002316\n      if (typeof ref === 'function') {\n        ref(el);\n      } else if (Object(ref) === ref) {\n        // `React.Ref.current` is read-only for regular use case, but we update it here\n        (ref as { current: T }).current = el;\n      }\n    });\n  };\n\n/**\n * @param prop A prop value.\n * @param descriptor A React prop descriptor.\n * @returns The corresponding attribute value for the given prop value.\n */\nconst convertProp = (prop: any, descriptor: CustomElementPropDescriptor) => {\n  if (!descriptor) {\n    return prop;\n  }\n  const { event, serialize } = descriptor;\n  if (event) {\n    // Events are not set as props, we use DOM `addEventListener()` instead\n    return undefined;\n  }\n  return !serialize ? prop : serialize(prop);\n};\n\n/**\n * @param props A set of React props.\n * @param descriptor A set of React prop desciptor.\n * @returns The set of React props to set to a custom element, corresponding to the given React props.\n */\nconst convertProps = (\n  props: CustomElementTypeProps,\n  descriptor: CustomElementPropsDescriptor\n) =>\n  Object.keys(props).reduce((acc, propName) => {\n    const { [propName]: descriptorItem } = descriptor;\n    const converted = convertProp(props[propName], descriptorItem);\n    const { attribute } = descriptorItem ?? {};\n    return attribute === false\n      ? acc\n      : {\n          ...acc,\n          [attribute || propName]: converted,\n        };\n  }, {});\n\n/**\n * Attaches listeners of custom events, to a custom element.\n *\n * @param elem The custom element.\n * @param descriptor An object, keyed by prop name, of data that may have custom event names.\n * @param callback A callback function that runs as the custom events fire.\n * @returns A handle that allows to release all event listeners attached.\n */\nconst attachEventListeners = (\n  elem: HTMLElement,\n  descriptor: CustomElementPropsDescriptor,\n  callback: (name: string, event: Event) => void\n): Handle => {\n  const handles = new Set<Handle>();\n  Object.keys(descriptor).forEach((propName) => {\n    if (descriptor[propName]) {\n      const { event: eventDescriptor } = descriptor[propName];\n      const name =\n        Object(eventDescriptor) !== eventDescriptor\n          ? (eventDescriptor as string)\n          : (eventDescriptor as CustomElementEventDescriptor).name;\n      const options =\n        Object(eventDescriptor) !== eventDescriptor\n          ? undefined\n          : (eventDescriptor as CustomElementEventDescriptor).options;\n      if (name) {\n        handles.add(\n          on(\n            elem,\n            name,\n            (event) => {\n              callback(propName, event);\n            },\n            options\n          )\n        );\n      }\n    }\n  });\n  return {\n    release() {\n      handles.forEach((handle) => {\n        handle.release();\n        handles.delete(handle);\n      });\n      return null;\n    },\n  };\n};\n\n/**\n * @param name The tag name of the custom element.\n * @param descriptor A descriptor for a set of React props for attributes of a custom element.\n * @returns A React component working as a wrapper for the given custom element.\n * @example\n * import { render } from 'react-dom';\n * import createCustomElementType, { booleanSerializer } from '/path/to/createCustomElementType';\n *\n * const CDSDropdown = createCustomElementType(`${prefix}-dropdown`, {\n *   disabled: {\n *     // Sets `disabled` attribute when the React prop value is truthy, unsets otherwise\n *     serialize: booleanSerializer,\n *   },\n *   helperText: {\n *     // Maps `helperText` React prop to `helper-text` attribute\n *     attribute: 'helper-text',\n *   },\n *   onBeforeSelect: {\n *     // Sets `onBeforeSelect` React prop value as a listener of `cds-dropdown-beingselected` custom event\n *     event: `${prefix}-dropdown-beingselected`,\n *   },\n * });\n *\n * render(\n *   (\n *     <CDSDropdown\n *       disabled={true}\n *       helperText=\"some-helper-text\"\n *       onBeforeSelect={event => { console.log(`${prefix}-dropdown-beingselected is fired!`, event); }}>\n *       <cds-dropdown-item value=\"all\">Option 1</cds-dropdown-item>\n *       <cds-dropdown-item value=\"cloudFoundry\">Option 2</cds-dropdown-item>\n *       <cds-dropdown-item value=\"staging\">Option 3</cds-dropdown-item>\n *     </CDSDropdown>\n *   )\n *   document.body\n * );\n */\nconst createReactCustomElementType = (\n  name: string,\n  descriptor: CustomElementPropsDescriptor\n) => {\n  /**\n   * Array of React prop names that should be mapped to DOM properties instead of attributes.\n   */\n  const nonAttributeProps = Object.keys(descriptor).filter((propName) => {\n    const { [propName]: descriptorItem } = descriptor;\n    const { attribute } = descriptorItem ?? {};\n    return attribute === false;\n  });\n\n  /**\n   * A React component working as a wrapper for the custom element.\n   */\n  class CustomElementType extends Component<CustomElementTypeProps> {\n    /**\n     * The element.\n     */\n    private _elem: HTMLElement | null = null;\n\n    /**\n     * The handle that allows to release all event listeners attached to this custom element.\n     */\n    private _eventListenersHandle: Handle | null = null;\n\n    /**\n     * The callback function that runs as the custom events fire.\n     *\n     * @param propName The React prop name associated with the event listener.\n     * @param event The event.\n     */\n    private _handleEvent = (propName: string, event: Event) => {\n      const { [propName]: listener } = this.props;\n      if (listener) {\n        listener.call(event.currentTarget, event);\n      }\n    };\n\n    /**\n     * Handles getting/losing the React `ref` object of this custom element.\n     *\n     * @param elem The custom element.\n     */\n    private _handleElemRef = (elem: HTMLElement) => {\n      this._elem = elem;\n      if (this._eventListenersHandle) {\n        this._eventListenersHandle.release();\n        this._eventListenersHandle = null;\n      }\n      if (elem) {\n        this._eventListenersHandle = attachEventListeners(\n          elem,\n          descriptor,\n          this._handleEvent\n        );\n      }\n    };\n\n    /**\n     * Reflects change in React props to DOM properties.\n     *\n     * @param prevProps The previous props.\n     */\n    updateProps(prevProps: { [key: string]: any } = {}) {\n      const { props, _elem: elem } = this;\n      nonAttributeProps.forEach((propName) => {\n        const { [propName]: prevValue } = prevProps;\n        const { [propName]: value } = props;\n        if (prevValue !== value) {\n          elem![propName] = value;\n        }\n      });\n    }\n\n    componentDidMount() {\n      this.updateProps();\n    }\n\n    componentDidUpdate(prevProps) {\n      this.updateProps(prevProps);\n    }\n\n    render() {\n      // eslint-disable-next-line react/prop-types\n      const { children, innerRef, ...props } = this.props;\n      const mergedRef = mergeRefs<HTMLElement>(innerRef, this._handleElemRef);\n      return createElement(\n        name,\n        { ref: mergedRef, ...convertProps(props, descriptor) },\n        children\n      );\n    }\n  }\n\n  return forwardRef<HTMLElement, CustomElementTypeProps>((props, ref) =>\n    createElement(CustomElementType, { ...props, innerRef: ref })\n  );\n};\n\n/**\n * @param value A React prop value.\n * @returns Serialized version of React prop value, as a boolean attribute in a custom element.\n */\nexport const booleanSerializer = (value) => (!value ? undefined : '');\n\n/**\n * @param value A React prop value.\n * @returns Serialized version of React prop value, as a number attribute in a custom element.\n */\nexport const numberSerializer = (value) =>\n  value == null ? value : String(value);\n\n/**\n * @param value A React prop value.\n * @returns Serialized version of React prop value, as a object attribute in a custom element.\n */\nexport const objectSerializer = (value) =>\n  value == null ? value : JSON.stringify(value);\n\nexport default createReactCustomElementType;\n"],"mappings":"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"}
+{"version":3,"file":"createReactCustomElementType.js","names":["_react","require","_on","_interopRequireDefault","mergeRefs","refs","el","forEach","ref","Object","current","convertProp","prop","descriptor","event","serialize","undefined","convertProps","props","keys","reduce","acc","propName","descriptorItem","converted","attribute","_objectSpread2","default","attachEventListeners","elem","callback","handles","Set","eventDescriptor","name","options","add","on","release","handle","delete","createReactCustomElementType","nonAttributeProps","filter","CustomElementType","Component","constructor","args","_defineProperty2","listener","call","currentTarget","_elem","_eventListenersHandle","_handleEvent","updateProps","prevProps","prevValue","value","componentDidMount","componentDidUpdate","render","_this$props","children","innerRef","_objectWithoutProperties2","mergedRef","_handleElemRef","createElement","forwardRef","booleanSerializer","exports","numberSerializer","String","objectSerializer","JSON","stringify","_default"],"sources":["globals/wrappers/createReactCustomElementType.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport React, { Component, createElement, forwardRef } from 'react';\nimport on from '../mixins/on';\nimport Handle from '../internal/handle';\n\n/**\n * A descriptor for a React event prop of a custom element.\n */\ninterface CustomElementEventDescriptor {\n  /**\n   * The event name.\n   */\n  name: string;\n\n  /**\n   * A boolean to detemine usage of capture mode or the event options.\n   */\n  options?: boolean | EventListenerOptions;\n}\n\n/**\n * A descriptor for a React prop for an attribute of a custom element.\n */\ninterface CustomElementPropDescriptor {\n  /**\n   * The attribute name for the prop.\n   */\n  attribute?: string | false;\n\n  /**\n   * The event name (or descriptor) for the prop.\n   */\n  event?: string | CustomElementEventDescriptor;\n\n  /**\n   * A function that takes a property value and returns the corresponding attribute value.\n   */\n  serialize?: (value: any) => string | void;\n}\n\n/**\n * A descriptor for a set of React props for attributes of a custom element.\n */\ninterface CustomElementPropsDescriptor {\n  [propName: string]: CustomElementPropDescriptor;\n}\n\n/**\n * React props for the component `createCustomElementType()` generates.\n */\ninterface CustomElementTypeProps {\n  /**\n   * Ordinal prop.\n   */\n  [propName: string]: any;\n\n  /**\n   * Child nodes.\n   */\n  // eslint-disable-next-line react/no-unused-prop-types\n  children?: React.ReactNode;\n}\n\n/**\n * @param refs List of React refs to merge.\n * @returns Merged React ref.\n */\nconst mergeRefs =\n  <T>(...refs: React.Ref<T>[]) =>\n  (el) => {\n    refs.forEach((ref) => {\n      // https://github.com/facebook/react/issues/13029#issuecomment-410002316\n      if (typeof ref === 'function') {\n        ref(el);\n      } else if (Object(ref) === ref) {\n        // `React.Ref.current` is read-only for regular use case, but we update it here\n        (ref as { current: T }).current = el;\n      }\n    });\n  };\n\n/**\n * @param prop A prop value.\n * @param descriptor A React prop descriptor.\n * @returns The corresponding attribute value for the given prop value.\n */\nconst convertProp = (prop: any, descriptor: CustomElementPropDescriptor) => {\n  if (!descriptor) {\n    return prop;\n  }\n  const { event, serialize } = descriptor;\n  if (event) {\n    // Events are not set as props, we use DOM `addEventListener()` instead\n    return undefined;\n  }\n  return !serialize ? prop : serialize(prop);\n};\n\n/**\n * @param props A set of React props.\n * @param descriptor A set of React prop desciptor.\n * @returns The set of React props to set to a custom element, corresponding to the given React props.\n */\nconst convertProps = (\n  props: CustomElementTypeProps,\n  descriptor: CustomElementPropsDescriptor\n) =>\n  Object.keys(props).reduce((acc, propName) => {\n    const { [propName]: descriptorItem } = descriptor;\n    const converted = convertProp(props[propName], descriptorItem);\n    const { attribute } = descriptorItem ?? {};\n    return attribute === false\n      ? acc\n      : {\n          ...acc,\n          [attribute || propName]: converted,\n        };\n  }, {});\n\n/**\n * Attaches listeners of custom events, to a custom element.\n *\n * @param elem The custom element.\n * @param descriptor An object, keyed by prop name, of data that may have custom event names.\n * @param callback A callback function that runs as the custom events fire.\n * @returns A handle that allows to release all event listeners attached.\n */\nconst attachEventListeners = (\n  elem: HTMLElement,\n  descriptor: CustomElementPropsDescriptor,\n  callback: (name: string, event: Event) => void\n): Handle => {\n  const handles = new Set<Handle>();\n  Object.keys(descriptor).forEach((propName) => {\n    if (descriptor[propName]) {\n      const { event: eventDescriptor } = descriptor[propName];\n      const name =\n        Object(eventDescriptor) !== eventDescriptor\n          ? (eventDescriptor as string)\n          : (eventDescriptor as CustomElementEventDescriptor).name;\n      const options =\n        Object(eventDescriptor) !== eventDescriptor\n          ? undefined\n          : (eventDescriptor as CustomElementEventDescriptor).options;\n      if (name) {\n        handles.add(\n          on(\n            elem,\n            name,\n            (event) => {\n              callback(propName, event);\n            },\n            options\n          )\n        );\n      }\n    }\n  });\n  return {\n    release() {\n      handles.forEach((handle) => {\n        handle.release();\n        handles.delete(handle);\n      });\n      return null;\n    },\n  };\n};\n\n/**\n * @param name The tag name of the custom element.\n * @param descriptor A descriptor for a set of React props for attributes of a custom element.\n * @returns A React component working as a wrapper for the given custom element.\n * @example\n * import { render } from 'react-dom';\n * import createCustomElementType, { booleanSerializer } from '/path/to/createCustomElementType';\n *\n * const CDSDropdown = createCustomElementType(`${prefix}-dropdown`, {\n *   disabled: {\n *     // Sets `disabled` attribute when the React prop value is truthy, unsets otherwise\n *     serialize: booleanSerializer,\n *   },\n *   helperText: {\n *     // Maps `helperText` React prop to `helper-text` attribute\n *     attribute: 'helper-text',\n *   },\n *   onBeforeSelect: {\n *     // Sets `onBeforeSelect` React prop value as a listener of `cds-dropdown-beingselected` custom event\n *     event: `${prefix}-dropdown-beingselected`,\n *   },\n * });\n *\n * render(\n *   (\n *     <CDSDropdown\n *       disabled={true}\n *       helperText=\"some-helper-text\"\n *       onBeforeSelect={event => { console.log(`${prefix}-dropdown-beingselected is fired!`, event); }}>\n *       <cds-dropdown-item value=\"all\">Option 1</cds-dropdown-item>\n *       <cds-dropdown-item value=\"cloudFoundry\">Option 2</cds-dropdown-item>\n *       <cds-dropdown-item value=\"staging\">Option 3</cds-dropdown-item>\n *     </CDSDropdown>\n *   )\n *   document.body\n * );\n */\nconst createReactCustomElementType = (\n  name: string,\n  descriptor: CustomElementPropsDescriptor\n) => {\n  /**\n   * Array of React prop names that should be mapped to DOM properties instead of attributes.\n   */\n  const nonAttributeProps = Object.keys(descriptor).filter((propName) => {\n    const { [propName]: descriptorItem } = descriptor;\n    const { attribute } = descriptorItem ?? {};\n    return attribute === false;\n  });\n\n  /**\n   * A React component working as a wrapper for the custom element.\n   */\n  class CustomElementType extends Component<CustomElementTypeProps> {\n    /**\n     * The element.\n     */\n    private _elem: HTMLElement | null = null;\n\n    /**\n     * The handle that allows to release all event listeners attached to this custom element.\n     */\n    private _eventListenersHandle: Handle | null = null;\n\n    /**\n     * The callback function that runs as the custom events fire.\n     *\n     * @param propName The React prop name associated with the event listener.\n     * @param event The event.\n     */\n    private _handleEvent = (propName: string, event: Event) => {\n      const { [propName]: listener } = this.props;\n      if (listener) {\n        listener.call(event.currentTarget, event);\n      }\n    };\n\n    /**\n     * Handles getting/losing the React `ref` object of this custom element.\n     *\n     * @param elem The custom element.\n     */\n    private _handleElemRef = (elem: HTMLElement) => {\n      this._elem = elem;\n      if (this._eventListenersHandle) {\n        this._eventListenersHandle.release();\n        this._eventListenersHandle = null;\n      }\n      if (elem) {\n        this._eventListenersHandle = attachEventListeners(\n          elem,\n          descriptor,\n          this._handleEvent\n        );\n      }\n    };\n\n    /**\n     * Reflects change in React props to DOM properties.\n     *\n     * @param prevProps The previous props.\n     */\n    updateProps(prevProps: { [key: string]: any } = {}) {\n      const { props, _elem: elem } = this;\n      nonAttributeProps.forEach((propName) => {\n        const { [propName]: prevValue } = prevProps;\n        const { [propName]: value } = props;\n        if (prevValue !== value) {\n          elem![propName] = value;\n        }\n      });\n    }\n\n    componentDidMount() {\n      this.updateProps();\n    }\n\n    componentDidUpdate(prevProps) {\n      this.updateProps(prevProps);\n    }\n\n    render() {\n      // eslint-disable-next-line react/prop-types\n      const { children, innerRef, ...props } = this.props;\n      const mergedRef = mergeRefs<HTMLElement>(innerRef, this._handleElemRef);\n      return createElement(\n        name,\n        { ref: mergedRef, ...convertProps(props, descriptor) },\n        children\n      );\n    }\n  }\n\n  return forwardRef<HTMLElement, CustomElementTypeProps>((props, ref) =>\n    createElement(CustomElementType, { ...props, innerRef: ref })\n  );\n};\n\n/**\n * @param value A React prop value.\n * @returns Serialized version of React prop value, as a boolean attribute in a custom element.\n */\nexport const booleanSerializer = (value) => (!value ? undefined : '');\n\n/**\n * @param value A React prop value.\n * @returns Serialized version of React prop value, as a number attribute in a custom element.\n */\nexport const numberSerializer = (value) =>\n  value == null ? value : String(value);\n\n/**\n * @param value A React prop value.\n * @returns Serialized version of React prop value, as a object attribute in a custom element.\n */\nexport const objectSerializer = (value) =>\n  value == null ? value : JSON.stringify(value);\n\nexport default createReactCustomElementType;\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@carbon/web-components",
-  "version": "2.0.0-rc.1",
+  "version": "2.0.0-rc.3",
   "publishConfig": {
     "access": "public"
   },
@@ -30,6 +30,7 @@
     "./package.json": "./package.json"
   },
   "scripts": {
+    "prebuild": "node tools/fix-carbon-sass-imports.js",
     "build": "gulp build && yarn wca",
     "build:dist": "gulp build:dist",
     "build:dist:dev": "gulp build:dist:dev",
@@ -68,9 +69,9 @@
   ],
   "dependencies": {
     "@babel/runtime": "^7.16.3",
-    "@carbon/styles": "^1.30.0",
+    "@carbon/styles": "^1.34.1",
     "flatpickr": "4.6.1",
-    "lit": "^2.6.0",
+    "lit": "^2.7.6",
     "lodash-es": "^4.17.21"
   },
   "devDependencies": {
@@ -82,15 +83,15 @@
     "@babel/plugin-proposal-optional-chaining": "~7.12.0",
     "@babel/plugin-syntax-decorators": "~7.12.0",
     "@babel/plugin-transform-modules-commonjs": "~7.12.0",
-    "@babel/plugin-transform-runtime": "~7.12.0",
+    "@babel/plugin-transform-runtime": "7.18.5",
     "@babel/plugin-transform-template-literals": "~7.12.0",
     "@babel/plugin-transform-typescript": "~7.12.0",
     "@babel/preset-env": "~7.12.0",
-    "@babel/preset-modules": "~0.1.5",
+    "@babel/preset-modules": "^0.1.5",
     "@babel/template": "~7.12.0",
     "@babel/traverse": "~7.12.0",
-    "@carbon/icon-helpers": "^10.40.0",
-    "@carbon/icons": "^11.20.0",
+    "@carbon/icon-helpers": "^10.43.1",
+    "@carbon/icons": "^11.23.1",
     "@open-wc/semantic-dom-diff": "~0.18.0",
     "@percy-io/in-percy": "^0.1.11",
     "@percy/cli": "^1.8.1",
@@ -100,6 +101,7 @@
     "@rollup/plugin-commonjs": "^21.0.3",
     "@rollup/plugin-node-resolve": "^8.4.0",
     "@rollup/plugin-replace": "^4.0.0",
+    "@rollup/plugin-terser": "^0.4.3",
     "@rollup/pluginutils": "^4.2.0",
     "@storybook/addon-a11y": "^6.5.15",
     "@storybook/addon-actions": "^6.5.15",
@@ -122,12 +124,12 @@
     "@webcomponents/webcomponents-platform": "^1.0.1",
     "async-done": "^1.3.0",
     "autoprefixer": "^9.8.8",
-    "babel-eslint": "^10.0.3",
-    "babel-loader": "^8.0.0",
+    "babel-eslint": "^10.1.0",
+    "babel-loader": "^8.0.4",
     "babel-plugin-template-html-minifier": "^4.1.0",
     "cache-loader": "^4.1.0",
     "child-process-promise": "^2.2.1",
-    "commander": "^7.2.0",
+    "commander": "^4.1.0",
     "core-js": "^3.19.1",
     "cross-env": "^7.0.0",
     "css-loader": "^5.2.0",
@@ -168,10 +170,10 @@
     "karma-firefox-launcher": "^2.1.2",
     "karma-jasmine": "^4.0.1",
     "karma-snapshot": "^0.6.0",
-    "karma-sourcemap-loader": "^0.3.8",
+    "karma-sourcemap-loader": "^0.4.0",
     "karma-spec-reporter": "0.0.36",
     "karma-webpack": "^4.0.2",
-    "magic-string": "^0.27.0",
+    "magic-string": "^0.30.0",
     "mini-css-extract-plugin": "~2.7.0",
     "mkdirp": "^0.5.0",
     "null-loader": "^4.0.0",
@@ -180,7 +182,7 @@
     "postcss": "^8.2.10",
     "postcss-loader": "^3.0.0",
     "postcss-selector-parser": "^6.0.0",
-    "prop-types": "^15.7.0",
+    "prop-types": "^15.7.2",
     "puppeteer": "^13.0.0",
     "react": "16.14.0",
     "react-dom": "16.14.0",
@@ -190,9 +192,8 @@
     "resize-observer-polyfill": "^1.5.0",
     "rollup": "^2.55.1",
     "rollup-plugin-multi-input": "^1.3.1",
-    "rollup-plugin-terser": "^7.0.2",
     "rtlcss": "^3.0.0",
-    "sass": "~1.40.0",
+    "sass": "~1.62.0",
     "sass-loader": "^10.0.0",
     "strip-comments": "^1.0.0",
     "style-loader": "^2.0.0",
@@ -206,7 +207,7 @@
     "web-component-analyzer": "1.2.0-next.0",
     "webpack": "^4.46.0",
     "webpack-dev-server": "^4.0.0",
-    "zone.js": "~0.12.0"
+    "zone.js": "~0.13.0"
   },
   "typings": "es/index.d.ts"
 }

package/scss/components/accordion/accordion.scss

@@ -11,14 +11,13 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/type' as *;
 @use '@carbon/styles/scss/utilities/convert' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/components/accordion';
+@use '../../globals/mixins/temp-layout' as *;
 
 :host(#{$prefix}-accordion),
 :host(#{$prefix}-accordion-skeleton) {
   @extend .#{$prefix}--accordion;
-
-  @include layer-tokens.emit-layer-tokens(1);
+  @include emit-layout-tokens();
 }
 
 :host(#{$prefix}-accordion-item),
@@ -40,12 +39,18 @@ $css--plex: true !default;
 
 :host(#{$prefix}-accordion-item[size='sm']),
 :host(#{$prefix}-accordion-item-skeleton[size='sm']) {
-  @extend .#{$prefix}--accordion--sm;
+  button {
+    @extend .#{$prefix}--layout--size-sm;
+    min-height: var(--cds-layout-size-height-context);
+  }
 }
 
 :host(#{$prefix}-accordion-item[size='lg']),
 :host(#{$prefix}-accordion-item-skeleton[size='lg']) {
-  @extend .#{$prefix}--accordion--lg;
+  button {
+    @extend .#{$prefix}--layout--size-lg;
+    min-height: var(--cds-layout-size-height-context);
+  }
 }
 
 :host(#{$prefix}-accordion-item[alignment='start']),

package/scss/components/breadcrumb/breadcrumb.scss

@@ -8,6 +8,7 @@
 $css--plex: true !default;
 
 @use '@carbon/styles/scss/config' as *;
+@use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/motion' as *;
 @use '@carbon/styles/scss/utilities' as *;
@@ -17,11 +18,22 @@ $css--plex: true !default;
 :host(#{$prefix}-breadcrumb),
 :host(#{$prefix}-breadcrumb-skeleton) {
   @extend .#{$prefix}--breadcrumb;
+
+  .#{$prefix}--breadcrumb {
+    padding: 0;
+    margin: 0;
+  }
 }
 
 :host(#{$prefix}-breadcrumb-item),
 :host(#{$prefix}-breadcrumb-item-skeleton) {
   @extend .#{$prefix}--breadcrumb-item;
+
+  &::after {
+    margin-left: $spacing-03;
+    color: $text-primary;
+    content: '/';
+  }
 }
 
 :host(#{$prefix}-breadcrumb-overflow-menu) {

package/scss/components/button/button.scss

@@ -11,18 +11,32 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/utilities/convert' as *;
 @use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/components/button' as *;
 @use '@carbon/styles/scss/components/popover/index';
 @use '@carbon/styles/scss/components/code-snippet/code-snippet' as *;
 @use '@carbon/styles/scss/components/tooltip';
+@use '../../globals/mixins/temp-layout' as *;
 
 @include code-snippet;
 
 :host(#{$prefix}-button),
 :host(#{$prefix}-modal-footer-button) {
-  @include layer-tokens.emit-layer-tokens(1);
+  @include emit-layout-tokens();
+
   display: inline-flex;
+
+  ::slotted([slot='icon']) {
+    @extend .#{$prefix}--btn__icon;
+  }
+
+  .#{$prefix}--btn {
+    flex-grow: 1;
+    max-width: 100%;
+  }
+}
+
+:host(#{$prefix}-button-skeleton) {
+  @include emit-layout-tokens();
 }
 
 :host(#{$prefix}-button[isExpressive]) ::slotted([slot='icon']),

package/scss/components/code-snippet/code-snippet.scss

@@ -13,19 +13,13 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/motion' as *;
 @use '@carbon/styles/scss/utilities' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
-@use '@carbon/styles/scss/components/code-snippet/code-snippet' as *;
+@use '@carbon/styles/scss/components/code-snippet/index';
 @use '@carbon/styles/scss/components/copy-button/copy-button';
 
-// https://github.com/carbon-design-system/carbon/issues/11408
-@include code-snippet;
-
 :host(#{$prefix}-code-snippet),
 :host(#{$prefix}-code-snippet-skeleton) {
   @extend .#{$prefix}--snippet;
 
-  @include layer-tokens.emit-layer-tokens(1);
-
   .#{$prefix}--snippet-container {
     @extend .#{$prefix}--snippet-container;
   }
@@ -57,7 +51,11 @@ $css--plex: true !default;
   }
 
   #{$prefix}-copy-button {
-    @extend .#{$prefix}--snippet, .#{$prefix}--popover-container;
+    @include font-family('sans');
+
+    position: absolute;
+    top: 0;
+    right: 0;
 
     code: {
       overflow: hidden;

package/scss/components/combo-box/combo-box.scss

@@ -11,7 +11,6 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/utilities' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/components/combo-box/combo-box';
 @use '@carbon/styles/scss/components/form';
 @use '@carbon/styles/scss/components/text-input/text-input';
@@ -20,8 +19,6 @@ $css--plex: true !default;
 :host(#{$prefix}-combo-box) {
   @extend :host(#{$prefix}-dropdown);
 
-  @include layer-tokens.emit-layer-tokens(1);
-
   outline: none;
 
   .#{$prefix}--assistive-text {
@@ -30,13 +27,6 @@ $css--plex: true !default;
     top: -100%;
   }
 
-  .#{$prefix}--list-box__field,
-  // To get more specifity than:
-  // https://github.com/carbon-design-system/carbon/blob/v10.16.0/packages/components/src/components/list-box/_list-box.scss#L126
-  .#{$prefix}--list-box[data-invalid] .#{$prefix}--list-box__field {
-    padding: 0;
-  }
-
   .#{$prefix}--list-box__menu {
     outline: none;
     top: 100%;

package/scss/components/content-switcher/content-switcher.scss

@@ -10,16 +10,15 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/config' as *;
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/utilities/convert' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/components/content-switcher/content-switcher' as *;
+@use '../../globals/mixins/temp-layout' as *;
 
 // https://github.com/carbon-design-system/carbon/issues/11408
 @include content-switcher;
 
 :host(#{$prefix}-content-switcher) {
   @extend .#{$prefix}--content-switcher;
-
-  @include layer-tokens.emit-layer-tokens(1);
+  @include emit-layout-tokens();
 }
 
 :host(#{$prefix}-content-switcher[icon]) {
@@ -27,19 +26,22 @@ $css--plex: true !default;
 }
 
 :host(#{$prefix}-content-switcher[size='sm']) {
-  @extend .#{$prefix}--content-switcher--sm;
+  @extend .#{$prefix}--layout--size-sm;
 }
 
 :host(#{$prefix}-content-switcher[size='lg']) {
-  @extend .#{$prefix}--content-switcher--lg;
+  @extend .#{$prefix}--layout--size-lg;
 }
 
 :host(#{$prefix}-content-switcher-item) {
-  width: 100%;
   outline: none;
+  width: 100%;
 
   .#{$prefix}--content-switcher-btn {
     height: 100%;
+    width: 100%;
+    align-items: center;
+    padding: 0.5rem var(--cds-layout-density-padding-inline-local);
 
     &:first-child,
     &:last-child {
@@ -72,21 +74,6 @@ $css--plex: true !default;
       border-bottom-color: $border-inverse;
     }
   }
-
-  &[icon] {
-    width: initial;
-
-    .#{$prefix}--content-switcher-btn {
-      padding-left: rem(11px);
-      padding-right: rem(11px);
-      height: rem(40px);
-    }
-
-    .#{$prefix}--content-switcher__label {
-      display: flex;
-      align-items: center;
-    }
-  }
 }
 
 :host(#{$prefix}-content-switcher-item)[icon] {

package/scss/components/copy-button/copy-button.scss

@@ -12,19 +12,19 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/utilities' as *;
 @use '@carbon/styles/scss/utilities/keyframes' as *;
 @use '@carbon/styles/scss/motion' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/components/button';
 @use '@carbon/styles/scss/components/tooltip';
 @use '@carbon/styles/scss/components/code-snippet/code-snippet' as *;
 @use '@carbon/styles/scss/components/copy-button/index';
+@use '../../globals/mixins/temp-layout' as *;
 
 @include code-snippet;
 
 :host(#{$prefix}-copy-button) {
+  @include emit-layout-tokens();
+
   display: inline-flex;
   outline: none;
-
-  @include layer-tokens.emit-layer-tokens(1);
 }
 
 .#{$prefix}--snippet__icon {

package/scss/components/data-table/_table-action.scss

@@ -50,6 +50,10 @@
   @extend .#{$prefix}--toolbar-action;
   @extend .#{$prefix}--toolbar-search-container-expandable;
 
+  &:hover {
+    background-color: $field-hover;
+  }
+
   flex: none;
   transition: flex 175ms $standard-easing;
 

package/scss/components/data-table/_table-core.scss

@@ -10,8 +10,6 @@
 //
 
 :host(#{$prefix}-table) {
-  @include layer-tokens.emit-layer-tokens(1);
-
   @extend .#{$prefix}--data-table;
 
   display: table;

package/scss/components/data-table/data-table.scss

@@ -12,7 +12,6 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/type' as *;
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/spacing' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/motion' as *;
 @use '@carbon/styles/scss/utilities/convert' as *;
 @use '@carbon/styles/scss/components/checkbox';

package/scss/components/date-picker/date-picker.scss

@@ -11,7 +11,6 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/utilities' as *;
 @use '@carbon/styles/scss/colors' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/components/form';
 @use '@carbon/styles/scss/components/date-picker/date-picker' as *;
 
@@ -21,8 +20,6 @@ $css--plex: true !default;
 :host(#{$prefix}-date-picker) {
   @extend .#{$prefix}--date-picker;
 
-  @include layer-tokens.emit-layer-tokens(1);
-
   #floating-menu-container {
     position: absolute;
     width: 100%;

package/scss/components/dropdown/dropdown.scss

@@ -11,7 +11,6 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/theme' as *;
 @use '@carbon/styles/scss/utilities' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/components/list-box/list-box' as *;
 @use '@carbon/styles/scss/components/dropdown' as *;
 @use '@carbon/styles/scss/components/form';
@@ -22,7 +21,6 @@ $css--plex: true !default;
 @include list-box;
 
 :host(#{$prefix}-dropdown) {
-  @include layer-tokens.emit-layer-tokens(1);
   outline: none;
 
   .#{$prefix}--assistive-text {
@@ -67,6 +65,7 @@ $css--plex: true !default;
   }
 }
 
+:host(#{$prefix}-combo-box[direction='top']),
 :host(#{$prefix}-dropdown[direction='top']) {
   @extend .#{$prefix}--list-box--up;
 

package/scss/components/file-uploader/file-uploader.scss

@@ -9,8 +9,8 @@
 @use '@carbon/styles/scss/type' as *;
 @use '@carbon/styles/scss/spacing' as *;
 @use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/components/file-uploader/file-uploader' as *;
+@use '../../globals/mixins/temp-layout' as *;
 
 // https://github.com/carbon-design-system/carbon/issues/11408
 @include file-uploader;
@@ -23,15 +23,11 @@
 
 :host(#{$prefix}-file-drop-container) {
   @extend .#{$prefix}--file;
-
-  @include layer-tokens.emit-layer-tokens(1);
 }
 
 :host(#{$prefix}-file-uploader-item) {
   @extend .#{$prefix}--file__selected-file;
 
-  @include layer-tokens.emit-layer-tokens(1);
-
   .#{$prefix}--file-filename {
     margin-top: 0;
     margin-bottom: 0;
@@ -59,6 +55,8 @@
 }
 
 :host(#{$prefix}-file-uploader) {
+  @include emit-layout-tokens();
+
   .#{$prefix}--label-description,
   .#{$prefix}--file--label {
     margin-top: 0;

package/scss/components/icon-button/icon-button.scss

@@ -10,5 +10,10 @@ $css--plex: true !default;
 @use '@carbon/styles/scss/config' as *;
 @use '@carbon/styles/scss/utilities' as *;
 @use '@carbon/styles/scss/breakpoint' as *;
+@use '../../globals/mixins/temp-layout' as *;
 @use '../tooltip/tooltip';
 @use '../button/button';
+
+:host(#{$prefix}-icon-button) {
+  @include emit-layout-tokens();
+}

package/scss/components/inline-loading/inline-loading.scss

@@ -7,7 +7,6 @@
 
 @use '@carbon/styles/scss/config' as *;
 @use '@carbon/styles/scss/theme' as *;
-@use '@carbon/styles/scss/layer/layer-tokens';
 @use '@carbon/styles/scss/type';
 @use '@carbon/styles/scss/components/loading';
 @use '@carbon/styles/scss/components/inline-loading/inline-loading' as *;
@@ -16,6 +15,4 @@
 
 :host(#{$prefix}-inline-loading) {
   @extend .#{$prefix}--inline-loading;
-
-  @include layer-tokens.emit-layer-tokens(1);
 }