carbon-react 154.3.2 → 154.4.0-beta.0

package/esm/components/duelling-picklist/picklist-divider/picklist-divider.component.js

@@ -1,7 +1 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React from "react";
-import StyledPicklistDivider from "./picklist-divider.style";
-const PicklistDivider = props => /*#__PURE__*/React.createElement(StyledPicklistDivider, _extends({}, props, {
-  "data-element": "picklist-divider"
-}));
-export default PicklistDivider;
+import{jsx as e}from"react/jsx-runtime";import"react";import t from"./picklist-divider.style.js";function r(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const n=n=>{return e(t,(o=function(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},o=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(n).filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable})))),o.forEach((function(t){r(e,t,n[t])}))}return e}({},n),c=null!=(c={"data-element":"picklist-divider"})?c:{},Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(c)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(c)).forEach((function(e){Object.defineProperty(o,e,Object.getOwnPropertyDescriptor(c,e))})),o));var o,c};export{n as default};

package/esm/components/duelling-picklist/picklist-divider/picklist-divider.style.js

@@ -1,12 +1 @@
-import styled from "styled-components";
-const StyledPicklistDivider = styled.div`
-  min-width: 2px;
-  background-image: linear-gradient(
-    180deg,
-    #bfcbd1 0%,
-    rgba(191, 203, 209, 0) 99.9%
-  );
-  margin-left: 16px;
-  margin-right: 16px;
-`;
-export default StyledPicklistDivider;
+import i from"styled-components";const e=i.div.withConfig({displayName:"picklist-divider.style__StyledPicklistDivider",componentId:"sc-6d9e8575-0"})(["min-width:2px;background-image:linear-gradient( 180deg,#bfcbd1 0%,rgba(191,203,209,0) 99.9% );margin-left:16px;margin-right:16px;"]);export{e as default};

package/esm/components/duelling-picklist/picklist-group/picklist-group.component.js

@@ -1,91 +1 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React, { useCallback, useContext, useEffect, useMemo, useState } from "react";
-import { CSSTransition, TransitionGroup } from "react-transition-group";
-import { StyledGroupWrapper, StyledPicklistGroupUl, StyledPicklistGroup, StyledGroupButton } from "./picklist-group.style";
-import FocusContext from "../__internal__/duelling-picklist.context";
-import Events from "../../../__internal__/utils/helpers/events";
-export const PicklistGroup = /*#__PURE__*/React.forwardRef(({
-  title,
-  children,
-  type,
-  onChange,
-  index,
-  listIndex,
-  isLastGroup,
-  ...transitionGroupProps
-}, ref) => {
-  const {
-    setElementToFocus,
-    elementToFocus
-  } = useContext(FocusContext);
-  const [highlighted, setHighlighted] = useState(false);
-  const nodeRef = React.useRef(null);
-  const filteredChildren = React.Children.toArray(children);
-  const handleClick = useCallback(() => {
-    onChange();
-    setElementToFocus(index, listIndex);
-  }, [index, listIndex, onChange, setElementToFocus]);
-  const handleKeydown = useCallback(event => {
-    if (Events.isEnterKey(event) || Events.isSpaceKey(event)) {
-      event.preventDefault();
-      onChange();
-      setElementToFocus(index, listIndex);
-    }
-  }, [index, listIndex, onChange, setElementToFocus]);
-  const refs = useMemo(() => Array.from({
-    length: filteredChildren.length
-  }, () => /*#__PURE__*/React.createRef()), [filteredChildren.length]);
-  const content = React.Children.map(children, (child, childIndex) => {
-    if (! /*#__PURE__*/React.isValidElement(child)) {
-      return child;
-    }
-    const props = {
-      ref: refs[childIndex],
-      index: childIndex,
-      listIndex,
-      groupIndex: index,
-      isLastGroup,
-      isLastItem: childIndex === filteredChildren.length - 1
-    };
-    return /*#__PURE__*/React.cloneElement(child, props);
-  });
-  useEffect(() => {
-    if (elementToFocus.groupIndex === index && elementToFocus.listIndex === listIndex && elementToFocus.itemIndex !== undefined) {
-      refs[elementToFocus.itemIndex].current?.focus();
-      setElementToFocus();
-    }
-  }, [elementToFocus, index, isLastGroup, listIndex, refs, setElementToFocus]);
-  return /*#__PURE__*/React.createElement(CSSTransition, _extends({
-    timeout: {
-      appear: 500,
-      enter: 300,
-      exit: 0
-    },
-    nodeRef: nodeRef,
-    classNames: "picklist-group"
-  }, transitionGroupProps, type === "add" ? {
-    enter: false
-  } : {}), /*#__PURE__*/React.createElement(StyledGroupWrapper, {
-    ref: nodeRef,
-    highlighted: highlighted,
-    type: type
-  }, /*#__PURE__*/React.createElement(StyledPicklistGroupUl, null, /*#__PURE__*/React.createElement(StyledPicklistGroup, {
-    onKeyDown: handleKeydown,
-    "data-element": "picklist-group"
-  }, title, /*#__PURE__*/React.createElement(StyledGroupButton, {
-    "data-role": "picklist-group-button",
-    buttonType: "secondary",
-    destructive: type === "remove",
-    iconType: type,
-    onClick: handleClick,
-    onMouseEnter: () => setHighlighted(true),
-    onMouseLeave: () => setHighlighted(false),
-    onFocus: () => setHighlighted(true),
-    onBlur: () => setHighlighted(false),
-    ref: ref
-  })), /*#__PURE__*/React.createElement(TransitionGroup, {
-    component: null
-  }, content))));
-});
-PicklistGroup.displayName = "PicklistGroup";
-export default PicklistGroup;
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import r,{useContext as n,useState as o,useCallback as i,useMemo as l,useEffect as c}from"react";import{CSSTransition as s,TransitionGroup as u}from"react-transition-group";import{StyledGroupWrapper as p,StyledPicklistGroupUl as a,StyledPicklistGroup as f,StyledGroupButton as d}from"./picklist-group.style.js";import y from"../__internal__/duelling-picklist.context.js";import m from"../../../__internal__/utils/helpers/events/events.js";function b(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const g=r.forwardRef(((g,O)=>{var{title:h,children:j,type:v,onChange:x,index:P,listIndex:w,isLastGroup:k}=g,I=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(g,["title","children","type","onChange","index","listIndex","isLastGroup"]);const{setElementToFocus:E,elementToFocus:_}=n(y),[S,D]=o(!1),C=r.useRef(null),L=r.Children.toArray(j),G=i((()=>{x(),E(P,w)}),[P,w,x,E]),R=i((e=>{(m.isEnterKey(e)||m.isSpaceKey(e))&&(e.preventDefault(),x(),E(P,w))}),[P,w,x,E]),T=l((()=>Array.from({length:L.length},(()=>r.createRef()))),[L.length]),F=r.Children.map(j,((e,t)=>{if(!r.isValidElement(e))return e;const n={ref:T[t],index:t,listIndex:w,groupIndex:P,isLastGroup:k,isLastItem:t===L.length-1};return r.cloneElement(e,n)}));return c((()=>{var e;_.groupIndex===P&&_.listIndex===w&&void 0!==_.itemIndex&&(null===(e=T[_.itemIndex].current)||void 0===e||e.focus(),E())}),[_,P,k,w,T,E]),e(s,(K=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){b(e,t,r[t])}))}return e}({timeout:{appear:500,enter:300,exit:0},nodeRef:C,classNames:"picklist-group"},I,"add"===v?{enter:!1}:{}),A=null!=(A={children:e(p,{ref:C,highlighted:S,type:v,children:t(a,{children:[t(f,{onKeyDown:R,"data-element":"picklist-group",children:[h,e(d,{"data-role":"picklist-group-button",buttonType:"secondary",destructive:"remove"===v,iconType:v,onClick:G,onMouseEnter:()=>D(!0),onMouseLeave:()=>D(!1),onFocus:()=>D(!0),onBlur:()=>D(!1),ref:O})]}),e(u,{component:null,children:F})]})})})?A:{},Object.getOwnPropertyDescriptors?Object.defineProperties(K,Object.getOwnPropertyDescriptors(A)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(A)).forEach((function(e){Object.defineProperty(K,e,Object.getOwnPropertyDescriptor(A,e))})),K));var K,A}));g.displayName="PicklistGroup";export{g as PicklistGroup,g as default};

package/esm/components/duelling-picklist/picklist-group/picklist-group.style.js

@@ -1,46 +1 @@
-import styled, { css } from "styled-components";
-import Button from "../../button";
-import { StyledButton } from "../picklist-item/picklist-item.style";
-const StyledGroupWrapper = styled.li`
-  ${({
-  highlighted,
-  type
-}) => css`
-    &:not(:first-of-type) {
-      margin-top: 16px;
-    }
-
-    ${highlighted && css`
-      ${StyledButton} {
-        background: ${type === "add" ? "var(--colorsActionMajor600)" : "var(--colorsSemanticNegative600)"}
-    `}
-  `}
-`;
-const StyledPicklistGroupUl = styled.ul`
-  padding: 0;
-`;
-const StyledPicklistGroup = styled.li`
-  display: flex;
-  align-items: center;
-  width: 100%;
-  margin-bottom: 4px;
-`;
-const StyledGroupButton = styled(Button)`
-  ${({
-  iconType
-}) => css`
-    padding: 0;
-    margin-right: 0;
-    margin-left: auto;
-    height: 40px;
-    min-width: 40px;
-    border: none;
-
-    &:focus {
-      > span {
-        color: var(--colorsActionMajorYang100);
-      }
-      background: ${iconType === "add" ? "var(--colorsActionMajor600)" : "var(--colorsSemanticNegative600)"}
-  `}
-`;
-export { StyledGroupWrapper, StyledPicklistGroupUl, StyledPicklistGroup, StyledGroupButton };
+import o,{css as t}from"styled-components";import i from"../../button/button.component.js";import{StyledButton as e}from"../picklist-item/picklist-item.style.js";const n=o.li.withConfig({displayName:"picklist-group.style__StyledGroupWrapper",componentId:"sc-4f863755-0"})(["",""],(({highlighted:o,type:i})=>t(["&:not(:first-of-type){margin-top:16px;}",""],o&&t(["","{background:",""],e,"add"===i?"var(--colorsActionMajor600)":"var(--colorsSemanticNegative600)")))),p=o.ul.withConfig({displayName:"picklist-group.style__StyledPicklistGroupUl",componentId:"sc-4f863755-1"})(["padding:0;"]),r=o.li.withConfig({displayName:"picklist-group.style__StyledPicklistGroup",componentId:"sc-4f863755-2"})(["display:flex;align-items:center;width:100%;margin-bottom:4px;"]),l=o(i).withConfig({displayName:"picklist-group.style__StyledGroupButton",componentId:"sc-4f863755-3"})(["",""],(({iconType:o})=>t(["padding:0;margin-right:0;margin-left:auto;height:40px;min-width:40px;border:none;&:focus{> span{color:var(--colorsActionMajorYang100);}background:",""],"add"===o?"var(--colorsActionMajor600)":"var(--colorsSemanticNegative600)")));export{l as StyledGroupButton,n as StyledGroupWrapper,r as StyledPicklistGroup,p as StyledPicklistGroupUl};

package/esm/components/duelling-picklist/picklist-item/picklist-item.component.js

@@ -1,89 +1 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React, { useCallback, useContext, useRef } from "react";
-import { CSSTransition } from "react-transition-group";
-import { StyledPicklistItem, StyledButton, StyledLockIcon } from "./picklist-item.style";
-import FocusContext from "../__internal__/duelling-picklist.context";
-import Events from "../../../__internal__/utils/helpers/events";
-export const PicklistItem = /*#__PURE__*/React.forwardRef(({
-  children,
-  type,
-  onChange,
-  item,
-  locked,
-  tooltipMessage = "This item is locked and can not be moved",
-  index,
-  listIndex,
-  groupIndex,
-  isLastGroup,
-  isLastItem,
-  ...transitionGroupProps
-}, ref) => {
-  const {
-    setElementToFocus
-  } = useContext(FocusContext);
-  const picklistItemNodeRef = useRef(null);
-  const calculateFocusIndex = useCallback(() => {
-    if (isLastItem) {
-      const toggledListIndex = listIndex === 0 ? 1 : 0;
-      const incrementedGroupIndex = groupIndex === 0 && index !== 0 ? 1 : groupIndex;
-      return {
-        itemIndex: isLastGroup ? 0 : incrementedGroupIndex,
-        list: isLastGroup ? toggledListIndex : listIndex,
-        group: undefined
-      };
-    }
-    return {
-      itemIndex: index,
-      list: listIndex,
-      group: groupIndex
-    };
-  }, [groupIndex, index, isLastGroup, isLastItem, listIndex]);
-  const updateFocusElement = useCallback(() => {
-    const {
-      itemIndex,
-      list,
-      group
-    } = calculateFocusIndex();
-    setElementToFocus(itemIndex, list, group);
-  }, [calculateFocusIndex, setElementToFocus]);
-  const handleClick = useCallback(() => {
-    onChange(item);
-    updateFocusElement();
-  }, [onChange, item, updateFocusElement]);
-  const handleKeydown = useCallback(event => {
-    if (Events.isEnterKey(event) || Events.isSpaceKey(event)) {
-      event.preventDefault();
-      onChange(item);
-      updateFocusElement();
-    }
-  }, [onChange, item, updateFocusElement]);
-  return /*#__PURE__*/React.createElement(CSSTransition, _extends({
-    timeout: {
-      appear: 500,
-      enter: 300,
-      exit: 0
-    },
-    classNames: "picklist-item"
-  }, transitionGroupProps, type === "add" ? {
-    enter: false
-  } : {}, {
-    nodeRef: picklistItemNodeRef
-  }), /*#__PURE__*/React.createElement(StyledPicklistItem, {
-    onKeyDown: handleKeydown,
-    "data-element": "picklist-item",
-    locked: locked,
-    ref: picklistItemNodeRef
-  }, children, !locked && /*#__PURE__*/React.createElement(StyledButton, {
-    "data-role": "picklist-item-button",
-    buttonType: "primary",
-    destructive: type === "remove",
-    iconType: type,
-    onClick: handleClick,
-    ref: ref
-  }), locked && /*#__PURE__*/React.createElement(StyledLockIcon, {
-    type: "locked",
-    tooltipMessage: tooltipMessage
-  })));
-});
-PicklistItem.displayName = "PicklistItem";
-export default PicklistItem;
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import r,{useContext as n,useRef as o,useCallback as i}from"react";import{CSSTransition as s}from"react-transition-group";import{StyledPicklistItem as l,StyledButton as c,StyledLockIcon as p}from"./picklist-item.style.js";import a from"../__internal__/duelling-picklist.context.js";import u from"../../../__internal__/utils/helpers/events/events.js";function m(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const f=r.forwardRef(((r,f)=>{var{children:d,type:y,onChange:b,item:O,locked:g,tooltipMessage:j="This item is locked and can not be moved",index:v,listIndex:k,groupIndex:x,isLastGroup:h,isLastItem:P}=r,w=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(r,["children","type","onChange","item","locked","tooltipMessage","index","listIndex","groupIndex","isLastGroup","isLastItem"]);const{setElementToFocus:I}=n(a),_=o(null),S=i((()=>P?{itemIndex:h?0:0===x&&0!==v?1:x,list:h?0===k?1:0:k,group:void 0}:{itemIndex:v,list:k,group:x}),[x,v,h,P,k]),D=i((()=>{const{itemIndex:e,list:t,group:r}=S();I(e,t,r)}),[S,I]),E=i((()=>{b(O),D()}),[b,O,D]),L=i((e=>{(u.isEnterKey(e)||u.isSpaceKey(e))&&(e.preventDefault(),b(O),D())}),[b,O,D]);return e(s,(T=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){m(e,t,r[t])}))}return e}({timeout:{appear:500,enter:300,exit:0},classNames:"picklist-item"},w,"add"===y?{enter:!1}:{}),C=null!=(C={nodeRef:_,children:t(l,{onKeyDown:L,"data-element":"picklist-item",locked:g,ref:_,children:[d,!g&&e(c,{"data-role":"picklist-item-button",buttonType:"primary",destructive:"remove"===y,iconType:y,onClick:E,ref:f}),g&&e(p,{type:"locked",tooltipMessage:j})]})})?C:{},Object.getOwnPropertyDescriptors?Object.defineProperties(T,Object.getOwnPropertyDescriptors(C)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(C)).forEach((function(e){Object.defineProperty(T,e,Object.getOwnPropertyDescriptor(C,e))})),T));var T,C}));f.displayName="PicklistItem";export{f as PicklistItem,f as default};

package/esm/components/duelling-picklist/picklist-item/picklist-item.style.js

@@ -1,79 +1 @@
-import styled, { css } from "styled-components";
-import Button from "../../button";
-import Icon from "../../icon";
-import StyledIcon from "../../icon/icon.style";
-const StyledPicklistItem = styled.li`
-  border-radius: var(--borderRadius100);
-  ${({
-  locked
-}) => css`
-    display: flex;
-    align-items: center;
-    width: 100%;
-
-    background-color: ${locked ? "var(--colorsUtilityMajor025)" : "var(--colorsUtilityYang100)"};
-
-    ${!locked && css`
-      box-shadow: var(--boxShadow050);
-    `}
-
-    ${locked && css`
-      border: 1px solid var(--colorsUtilityMajor200);
-      color: var(--colorsUtilityYin065);
-
-      ${StyledIcon} {
-        color: var(--colorsUtilityMajor200);
-      }
-    `}
-
-    & + & {
-      margin-top: 8px;
-    }
-  `}
-`;
-const StyledButton = styled(Button)`
-  border-bottom-right-radius: var(--borderRadius100);
-  border-top-right-radius: var(--borderRadius100);
-  border-bottom-left-radius: var(--borderRadius000);
-  border-top-left-radius: var(--borderRadius000);
-
-  :hover {
-    border-bottom-right-radius: var(--borderRadius100);
-    border-top-right-radius: var(--borderRadius100);
-    border-bottom-left-radius: var(--borderRadius000);
-    border-top-left-radius: var(--borderRadius000);
-  }
-
-  :focus {
-    border-bottom-right-radius: var(--borderRadius100);
-    border-top-right-radius: var(--borderRadius100);
-    border-bottom-left-radius: var(--borderRadius000);
-    border-top-left-radius: var(--borderRadius000);
-  }
-
-  ${({
-  iconType
-}) => css`
-    padding: 0;
-    margin-right: 0;
-    margin-left: auto;
-    height: 40px;
-    min-width: 40px;
-
-    &:focus {
-      background: ${iconType === "add" ? "var(--colorsActionMajor600)" : "var(--colorsSemanticNegative600)"};
-  `}
-`;
-const StyledLockIcon = styled(Icon)`
-  margin-right: 0;
-  height: 40px;
-  min-width: 40px;
-
-  :focus {
-    border-bottom-right-radius: var(--borderRadius100);
-    border-top-right-radius: var(--borderRadius100);
-    border-bottom-left-radius: var(--borderRadius000);
-    border-top-left-radius: var(--borderRadius000);
-  }
-`;
-export { StyledPicklistItem, StyledButton, StyledLockIcon };
+import r,{css as o}from"styled-components";import i from"../../button/button.component.js";import t from"../../icon/icon.component.js";import d from"../../icon/icon.style.js";const a=r.li.withConfig({displayName:"picklist-item.style__StyledPicklistItem",componentId:"sc-eb1e700a-0"})(["border-radius:var(--borderRadius100);",""],(({locked:r})=>o(["display:flex;align-items:center;width:100%;background-color:",";"," "," & + &{margin-top:8px;}"],r?"var(--colorsUtilityMajor025)":"var(--colorsUtilityYang100)",!r&&o(["box-shadow:var(--boxShadow050);"]),r&&o(["border:1px solid var(--colorsUtilityMajor200);color:var(--colorsUtilityYin065);","{color:var(--colorsUtilityMajor200);}"],d)))),e=r(i).withConfig({displayName:"picklist-item.style__StyledButton",componentId:"sc-eb1e700a-1"})(["border-bottom-right-radius:var(--borderRadius100);border-top-right-radius:var(--borderRadius100);border-bottom-left-radius:var(--borderRadius000);border-top-left-radius:var(--borderRadius000);:hover{border-bottom-right-radius:var(--borderRadius100);border-top-right-radius:var(--borderRadius100);border-bottom-left-radius:var(--borderRadius000);border-top-left-radius:var(--borderRadius000);}:focus{border-bottom-right-radius:var(--borderRadius100);border-top-right-radius:var(--borderRadius100);border-bottom-left-radius:var(--borderRadius000);border-top-left-radius:var(--borderRadius000);}",""],(({iconType:r})=>o(["padding:0;margin-right:0;margin-left:auto;height:40px;min-width:40px;&:focus{background:",";"],"add"===r?"var(--colorsActionMajor600)":"var(--colorsSemanticNegative600)"))),s=r(t).withConfig({displayName:"picklist-item.style__StyledLockIcon",componentId:"sc-eb1e700a-2"})(["margin-right:0;height:40px;min-width:40px;:focus{border-bottom-right-radius:var(--borderRadius100);border-top-right-radius:var(--borderRadius100);border-bottom-left-radius:var(--borderRadius000);border-top-left-radius:var(--borderRadius000);}"]);export{e as StyledButton,s as StyledLockIcon,a as StyledPicklistItem};

package/esm/components/duelling-picklist/picklist-placeholder/picklist-placeholder.component.js

@@ -1,10 +1 @@
-import React from "react";
-import { StyledPicklistPlaceholder } from "../duelling-picklist.style";
-export const PicklistPlaceholder = ({
-  text
-}) => {
-  return /*#__PURE__*/React.createElement(StyledPicklistPlaceholder, {
-    "data-element": "picklist-placeholder"
-  }, text);
-};
-export default PicklistPlaceholder;
+import{jsx as t}from"react/jsx-runtime";import"react";import{StyledPicklistPlaceholder as e}from"../duelling-picklist.style.js";const r=({text:r})=>t(e,{"data-element":"picklist-placeholder",children:r});export{r as PicklistPlaceholder,r as default};

package/esm/components/fieldset/fieldset.component.js

@@ -1,46 +1 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React, { useState, useEffect, useContext } from "react";
-import tagComponent from "../../__internal__/utils/helpers/tags";
-import { FieldsetStyle, StyledLegend } from "./fieldset.style";
-import NewValidationContext from "../carbon-provider/__internal__/new-validation.context";
-import { filterStyledSystemMarginProps } from "../../style/utils";
-import useLocale from "../../hooks/__internal__/useLocale";
-import Logger from "../../__internal__/utils/logger";
-let deprecateOptionalWarnTriggered = false;
-export const Fieldset = ({
-  children,
-  legend,
-  required,
-  isOptional,
-  ...rest
-}) => {
-  if (!deprecateOptionalWarnTriggered && isOptional) {
-    deprecateOptionalWarnTriggered = true;
-    Logger.deprecate("`isOptional` is deprecated in Fieldset and support will soon be removed. If the value of this component is not required, use the `required` prop and set it to false instead.");
-  }
-  const [ref, setRef] = useState(null);
-  const marginProps = filterStyledSystemMarginProps(rest);
-  const {
-    validationRedesignOptIn
-  } = useContext(NewValidationContext);
-  const locale = useLocale();
-  const optionalLabel = locale.label.optional();
-  useEffect(() => {
-    if (ref && required) {
-      Array.from(ref.querySelectorAll("input") || /* istanbul ignore next */[]).forEach(el => {
-        el.setAttribute("required", "");
-      });
-    }
-  }, [ref, required]);
-  return /*#__PURE__*/React.createElement(FieldsetStyle, _extends({
-    ref: setRef,
-    newValidation: validationRedesignOptIn
-  }, rest, marginProps, tagComponent("fieldset", rest)), legend && /*#__PURE__*/React.createElement(StyledLegend, {
-    "data-element": "legend",
-    isRequired: required,
-    isOptional: isOptional,
-    optionalLabel: optionalLabel
-  }, legend), children);
-};
-Fieldset.displayName = "Fieldset";
-export default Fieldset;
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as r,useContext as n,useEffect as o}from"react";import i from"../../__internal__/utils/helpers/tags/tags.js";import{FieldsetStyle as l,StyledLegend as s}from"./fieldset.style.js";import a from"../carbon-provider/__internal__/new-validation.context.js";import"../../style/utils/filter-styled-system-padding-props.js";import p from"../../style/utils/filter-styled-system-margin-props.js";import c from"../../hooks/__internal__/useLocale/useLocale.js";import u from"../../__internal__/utils/logger/index.js";function f(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}let d=!1;const m=m=>{var{children:y,legend:O,required:b,isOptional:j}=m,g=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(m,["children","legend","required","isOptional"]);!d&&j&&(d=!0,u.deprecate("`isOptional` is deprecated in Fieldset and support will soon be removed. If the value of this component is not required, use the `required` prop and set it to false instead."));const[h,_]=r(null),v=p(g),{validationRedesignOptIn:w}=n(a),P=c().label.optional();return o((()=>{h&&b&&Array.from(h.querySelectorAll("input")||[]).forEach((e=>{e.setAttribute("required","")}))}),[h,b]),e(l,(q=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){f(e,t,r[t])}))}return e}({ref:_,newValidation:w},g,v,i("fieldset",g)),S=null!=(S={children:[O&&t(s,{"data-element":"legend",isRequired:b,isOptional:j,optionalLabel:P,children:O}),y]})?S:{},Object.getOwnPropertyDescriptors?Object.defineProperties(q,Object.getOwnPropertyDescriptors(S)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(S)).forEach((function(e){Object.defineProperty(q,e,Object.getOwnPropertyDescriptor(S,e))})),q));var q,S};m.displayName="Fieldset";export{m as Fieldset,m as default};

package/esm/components/fieldset/fieldset.style.js

@@ -1,70 +1 @@
-import styled, { css } from "styled-components";
-import { margin } from "styled-system";
-import FormFieldStyle from "../../__internal__/form-field/form-field.style";
-import baseTheme from "../../style/themes/base";
-import CheckboxStyle from "../checkbox/checkbox.style";
-const FieldsetStyle = styled.fieldset`
-  margin: 0;
-  margin-bottom: var(--fieldSpacing);
-  ${margin}
-  border: none;
-  padding: 0;
-
-  ${({
-  newValidation
-}) => !newValidation && css`
-      & * {
-        --fieldSpacing: 0;
-      }
-
-      &&&& ${FormFieldStyle} {
-        margin-top: 0;
-        margin-bottom: -1px;
-      }
-
-      & ${CheckboxStyle} {
-        padding-top: 8px;
-        padding-bottom: 8px;
-      }
-    `}
-`;
-FieldsetStyle.defaultProps = {
-  theme: baseTheme
-};
-const StyledLegend = styled.legend`
-  display: flex;
-  align-items: center;
-  margin-bottom: var(--spacing250);
-  font-size: var(--fontSizes400);
-  font-weight: var(--fontWeights500);
-  color: var(--colorsUtilityYin090);
-  line-height: 24px;
-
-  ${({
-  isRequired
-}) => isRequired && css`
-      ::after {
-        content: "*";
-        line-height: 24px;
-        color: var(--colorsSemanticNegative500);
-        font-weight: var(--fontWeights500);
-        margin-left: var(--spacing100);
-        position: relative;
-        top: 1px;
-        left: -4px;
-      }
-    `}
-
-  ${({
-  isOptional,
-  optionalLabel
-}) => isOptional && css`
-      ::after {
-        content: "(${optionalLabel})";
-        color: var(--colorsUtilityYin055);
-        font-weight: var(--fontWeights400);
-        margin-left: var(--spacing050);
-      }
-    `}
-`;
-export { FieldsetStyle, StyledLegend };
+import t,{css as e}from"styled-components";import{margin as i}from"styled-system";import o from"../../__internal__/form-field/form-field.style.js";import n from"../../style/themes/base/index.js";import r from"../checkbox/checkbox.style.js";const a=t.fieldset.withConfig({displayName:"fieldset.style__FieldsetStyle",componentId:"sc-51cb6b8e-0"})(["margin:0;margin-bottom:var(--fieldSpacing);"," border:none;padding:0;",""],i,(({newValidation:t})=>!t&&e(["& *{--fieldSpacing:0;}&&&& ","{margin-top:0;margin-bottom:-1px;}& ","{padding-top:8px;padding-bottom:8px;}"],o,r)));a.defaultProps={theme:n};const l=t.legend.withConfig({displayName:"fieldset.style__StyledLegend",componentId:"sc-51cb6b8e-1"})(["display:flex;align-items:center;margin-bottom:var(--spacing250);font-size:var(--fontSizes400);font-weight:var(--fontWeights500);color:var(--colorsUtilityYin090);line-height:24px;"," ",""],(({isRequired:t})=>t&&e(['::after{content:"*";line-height:24px;color:var(--colorsSemanticNegative500);font-weight:var(--fontWeights500);margin-left:var(--spacing100);position:relative;top:1px;left:-4px;}'])),(({isOptional:t,optionalLabel:i})=>t&&e(['::after{content:"(',')";color:var(--colorsUtilityYin055);font-weight:var(--fontWeights400);margin-left:var(--spacing050);}'],i)));export{a as FieldsetStyle,l as StyledLegend};

package/esm/components/fieldset/index.js

@@ -1 +1 @@
-export { default } from "./fieldset.component";
+export{Fieldset as default}from"./fieldset.component.js";

package/esm/components/file-input/__internal__/file-upload-status/file-upload-status.component.js

@@ -1,78 +1 @@
-import React from "react";
-import Link from "../../../link";
-import ButtonMinor from "../../../button-minor";
-import StyledTypography from "../../../typography/typography.style";
-import { StyledProgressBar, InnerBar } from "../../../progress-tracker/progress-tracker.style";
-import LoaderBar from "../../../loader-bar";
-import Icon from "../../../icon";
-import { StyledFileUploadStatus, StyledFileUploadStatusRow, StyledFileLinkContainer } from "./file-upload-status.style";
-import useLocale from "../../../../hooks/__internal__/useLocale";
-export const FileUploadStatus = ({
-  status,
-  filename,
-  message,
-  onAction,
-  iconType = "file_generic",
-  ...statusProps
-}) => {
-  const locale = useLocale();
-  const statusMessage = message || locale.fileInput.fileUploadStatus();
-  let buttonText;
-  let linkProps;
-  let progressBar = null;
-  switch (status) {
-    case "uploading":
-      buttonText = locale.fileInput.actions.cancel();
-      progressBar = statusProps.progress === undefined ? /*#__PURE__*/React.createElement(LoaderBar, null) : /*#__PURE__*/React.createElement(StyledProgressBar, {
-        "data-element": "progress-tracker-bar",
-        "data-role": "progress-tracker-bar",
-        progress: statusProps.progress,
-        "aria-hidden": "true"
-      }, /*#__PURE__*/React.createElement(InnerBar, {
-        "data-element": "inner-bar",
-        "data-role": "inner-bar",
-        size: "medium",
-        progress: statusProps.progress,
-        error: false
-      }));
-      break;
-    case "previously":
-    case "completed":
-      buttonText = locale.fileInput.actions.delete();
-      linkProps = {
-        ...statusProps,
-        icon: iconType
-      };
-      break;
-    case "error":
-      buttonText = locale.fileInput.actions.clear();
-      break;
-    // istanbul ignore next
-    default:
-      // no other cases if consumers are using TS, but ESLint still insists on it
-      break;
-  }
-  const actionButton = /*#__PURE__*/React.createElement(ButtonMinor, {
-    onClick: onAction,
-    buttonType: "tertiary"
-  }, buttonText);
-  const fileLink = linkProps ? /*#__PURE__*/React.createElement(Link, linkProps, filename) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Icon, {
-    type: iconType
-  }), /*#__PURE__*/React.createElement("span", null, filename));
-  const mainRow = status !== "previously" ? /*#__PURE__*/React.createElement(StyledFileUploadStatusRow, null, /*#__PURE__*/React.createElement(StyledTypography, {
-    as: "p",
-    mb: 0,
-    "aria-live": "polite"
-  }, statusMessage), actionButton) : /*#__PURE__*/React.createElement(StyledFileUploadStatusRow, {
-    onlyRow: true
-  }, /*#__PURE__*/React.createElement(StyledFileLinkContainer, null, fileLink), actionButton);
-  const secondRow = status !== "previously" ? /*#__PURE__*/React.createElement(StyledFileUploadStatusRow, {
-    upperPadding: true,
-    lowerPadding: true
-  }, /*#__PURE__*/React.createElement(StyledFileLinkContainer, null, fileLink)) : null;
-  return /*#__PURE__*/React.createElement(StyledFileUploadStatus, {
-    "data-role": "file-upload-status",
-    hasError: status === "error"
-  }, mainRow, secondRow, progressBar);
-};
-export default FileUploadStatus;
+import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import"react";import{Link as o}from"../../../link/link.component.js";import{ButtonMinor as n}from"../../../button-minor/button-minor.component.js";import i from"../../../typography/typography.style.js";import{StyledProgressBar as c,InnerBar as l}from"../../../progress-tracker/progress-tracker.style.js";import{LoaderBar as a}from"../../../loader-bar/loader-bar.component.js";import s from"../../../icon/icon.component.js";import{StyledFileUploadStatus as p,StyledFileUploadStatusRow as u,StyledFileLinkContainer as f}from"./file-upload-status.style.js";import m from"../../../../hooks/__internal__/useLocale/useLocale.js";function b(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function y(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),o.forEach((function(r){b(e,r,t[r])}))}return e}function d(e,r){return r=null!=r?r:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})),e}const g=b=>{var{status:g,filename:O,message:j,onAction:h,iconType:P="file_generic"}=b,v=function(e,r){if(null==e)return{};var t,o,n=function(e,r){if(null==e)return{};var t,o,n={},i=Object.keys(e);for(o=0;o<i.length;o++)t=i[o],r.indexOf(t)>=0||(n[t]=e[t]);return n}(e,r);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(o=0;o<i.length;o++)t=i[o],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(n[t]=e[t])}return n}(b,["status","filename","message","onAction","iconType"]);const w=m(),k=j||w.fileInput.fileUploadStatus();let S,I,_=null;switch(g){case"uploading":S=w.fileInput.actions.cancel(),_=void 0===v.progress?e(a,{}):e(c,{"data-element":"progress-tracker-bar","data-role":"progress-tracker-bar",progress:v.progress,"aria-hidden":"true",children:e(l,{"data-element":"inner-bar","data-role":"inner-bar",size:"medium",progress:v.progress,error:!1})});break;case"previously":case"completed":S=w.fileInput.actions.delete(),I=d(y({},v),{icon:P});break;case"error":S=w.fileInput.actions.clear()}const x=e(n,{onClick:h,buttonType:"tertiary",children:S}),D=I?e(o,d(y({},I),{children:O})):r(t,{children:[e(s,{type:P}),e("span",{children:O})]});return r(p,{"data-role":"file-upload-status",hasError:"error"===g,children:[r(u,"previously"!==g?{children:[e(i,{as:"p",mb:0,"aria-live":"polite",children:k}),x]}:{onlyRow:!0,children:[e(f,{children:D}),x]}),"previously"!==g?e(u,{upperPadding:!0,lowerPadding:!0,children:e(f,{children:D})}):null,_]})};export{g as FileUploadStatus,g as default};