carbon-react 162.12.0-beta.1 → 162.13.0

package/esm/components/portrait/index.js

@@ -0,0 +1 @@
+export{Portrait as default}from"./portrait.component.js";

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

@@ -0,0 +1,75 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { IconType } from "../icon";
+import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
+export type PortraitShapes = "circle" | "square";
+export type PortraitSizes = "XS" | "S" | "M" | "ML" | "L" | "XL" | "XXL";
+export type PortraitVariant = "black" | "blue" | "teal" | "green" | "lime" | "orange" | "red" | "pink" | "purple" | "slate" | "gray";
+export interface PortraitProps extends MarginProps, TagProps {
+    /** @private @ignore */
+    className?: string;
+    /** A custom image URL. */
+    src?: string;
+    /** The size of the Portrait. */
+    size?: PortraitSizes;
+    /** @private @ignore */
+    name?: string;
+    /** The `alt` HTML string. */
+    alt?: string;
+    /** The shape of the Portrait. */
+    shape?: PortraitShapes;
+    /** Icon to be rendered as a fallback. */
+    iconType?: IconType;
+    /** The initials to render in the Portrait. */
+    initials?: string;
+    /** Use a dark background.
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    darkBackground?: boolean;
+    /** Prop for `onClick` events. */
+    onClick?: (ev: React.MouseEvent<HTMLElement>) => void;
+    /** [Legacy] The message to be displayed within the tooltip
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    tooltipMessage?: React.ReactNode;
+    /** [Legacy] The id attribute to use for the tooltip
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    tooltipId?: string;
+    /** [Legacy] Whether to to show the Tooltip
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    tooltipIsVisible?: boolean;
+    /** [Legacy] Sets position of the tooltip
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    tooltipPosition?: "top" | "bottom" | "left" | "right";
+    /** [Legacy] Defines the message type
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    tooltipType?: string;
+    /** [Legacy] Defines the size of the tooltip content
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    tooltipSize?: "medium" | "large";
+    /** [Legacy] Override background color of the Tooltip, provide any color from palette or any valid css color value.
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    tooltipBgColor?: string;
+    /** [Legacy] Override font color of the Tooltip, provide any color from palette or any valid css color value.
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    tooltipFontColor?: string;
+    /** The hex code of the background colour
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    backgroundColor?: string;
+    /** The hex code of the foreground colour. This will only take effect if use in conjunction with `backgroundColor`
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    foregroundColor?: string;
+    /** Color variant*/
+    variant?: PortraitVariant;
+}
+export declare const Portrait: ({ alt, backgroundColor, foregroundColor, className, name, darkBackground, iconType, initials, shape, size, src, onClick, tooltipMessage, tooltipId, tooltipIsVisible, tooltipPosition, tooltipType, tooltipSize, tooltipBgColor, tooltipFontColor, variant, ...rest }: PortraitProps) => React.JSX.Element;
+export default Portrait;

package/esm/components/portrait/portrait.component.js

@@ -0,0 +1 @@
+import{jsx as t}from"react/jsx-runtime";import{useState as o,useEffect as e}from"react";import{Tooltip as r}from"../tooltip/tooltip.component.js";import i from"../../__internal__/utils/helpers/tags/tags.js";import{StyledPortraitInitials as n,StyledPortraitContainer as l,StyledIcon as s,StyledCustomImg as a}from"./portrait.style.js";import"../../style/utils/filter-styled-system-padding-props.js";import p from"../../style/utils/filter-styled-system-margin-props.js";function c(t,o,e){return o in t?Object.defineProperty(t,o,{value:e,enumerable:!0,configurable:!0,writable:!0}):t[o]=e,t}function u(t){for(var o=1;o<arguments.length;o++){var e=null!=arguments[o]?arguments[o]:{},r=Object.keys(e);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(e).filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})))),r.forEach((function(o){c(t,o,e[o])}))}return t}function f(t,o){return o=null!=o?o:{},Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(o)):function(t){var o=Object.keys(t);if(Object.getOwnPropertySymbols){var e=Object.getOwnPropertySymbols(t);o.push.apply(o,e)}return o}(Object(o)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(o,e))})),t}const d=c=>{var{alt:d,backgroundColor:g,foregroundColor:m,className:y,name:b,darkBackground:O=!1,iconType:j="individual",initials:k,shape:C="circle",size:h="M",src:v,onClick:P,tooltipMessage:w,tooltipId:z,tooltipIsVisible:S,tooltipPosition:B,tooltipType:I,tooltipSize:V,tooltipBgColor:x,tooltipFontColor:D,variant:E}=c,N=function(t,o){if(null==t)return{};var e,r,i=function(t,o){if(null==t)return{};var e,r,i={},n=Object.keys(t);for(r=0;r<n.length;r++)e=n[r],o.indexOf(e)>=0||(i[e]=t[e]);return i}(t,o);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);for(r=0;r<n.length;r++)e=n[r],o.indexOf(e)>=0||Object.prototype.propertyIsEnumerable.call(t,e)&&(i[e]=t[e])}return i}(c,["alt","backgroundColor","foregroundColor","className","name","darkBackground","iconType","initials","shape","size","src","onClick","tooltipMessage","tooltipId","tooltipIsVisible","tooltipPosition","tooltipType","tooltipSize","tooltipBgColor","tooltipFontColor","variant"]);const[T,_]=o(!1),M=Boolean(v)&&!T;e((()=>{_(!1)}),[v]);const F=i("portrait",N);return(()=>{let o=t(s,{type:j,$portraitSize:h});return k&&(o=t(n,{size:h,"data-element":"initials",variant:E,children:k.slice(0,3).toUpperCase()})),v&&!T&&(o=t(a,{src:v,alt:d||b||"","data-element":"user-image",onError:()=>_(!0)})),w?t(r,{message:w,id:z,position:B,type:I,size:V,isVisible:S,bgColor:x,fontColor:D,children:t(l,f(u(f(u({},p(N)),{onClick:P,className:y}),F),{hasValidImg:M,darkBackground:O,size:h,shape:C,backgroundColor:g,foregroundColor:m,variant:E,children:o}))}):t(l,f(u(f(u({},p(N)),{onClick:P,className:y}),F),{hasValidImg:M,darkBackground:O,size:h,shape:C,backgroundColor:g,foregroundColor:m,variant:E,children:o}))})()};export{d as Portrait,d as default};

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

@@ -0,0 +1,9 @@
+import { PortraitShapes, PortraitSizes } from "./portrait.component";
+export declare const PORTRAIT_SHAPES: PortraitShapes[];
+export declare const PORTRAIT_SIZES: PortraitSizes[];
+type PortraitSizeParams = Record<PortraitSizes, {
+    dimensions: number;
+    iconDimensions: number;
+}>;
+export declare const PORTRAIT_SIZE_PARAMS: PortraitSizeParams;
+export {};

package/esm/components/portrait/portrait.config.js

@@ -0,0 +1 @@
+const i=["circle","square"],n=["XS","S","M","ML","L","XL","XXL"],s={XS:{dimensions:32,iconDimensions:16},S:{dimensions:32,iconDimensions:20},M:{dimensions:40,iconDimensions:24},ML:{dimensions:56,iconDimensions:32},L:{dimensions:72,iconDimensions:40},XL:{dimensions:104,iconDimensions:56},XXL:{dimensions:128,iconDimensions:64}};export{i as PORTRAIT_SHAPES,n as PORTRAIT_SIZES,s as PORTRAIT_SIZE_PARAMS};

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

@@ -0,0 +1,23 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { PortraitSizes, PortraitShapes, PortraitVariant } from "./portrait.component";
+type StyledPortraitProps = {
+    backgroundColor?: string;
+    foregroundColor?: string;
+    darkBackground?: boolean;
+    size: PortraitSizes;
+    shape?: PortraitShapes;
+    hasValidImg?: boolean;
+    onClick?: (ev: React.MouseEvent<HTMLElement>) => void;
+    variant?: PortraitVariant;
+};
+export declare const StyledPortraitInitials: import("styled-components").StyledComponent<"div", any, Pick<StyledPortraitProps, "size" | "variant">, never>;
+export declare const StyledCustomImg: import("styled-components").StyledComponent<"img", any, {}, never>;
+export declare const StyledIcon: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("../icon").IconProps & React.RefAttributes<HTMLSpanElement>>, any, {
+    $portraitSize: PortraitSizes;
+    variant?: PortraitVariant;
+}, never>;
+export declare const StyledPortraitContainer: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+} & StyledPortraitProps & MarginProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>>, "theme">;
+export {};

package/esm/components/portrait/portrait.style.js

@@ -0,0 +1 @@
+import"react";import t from"styled-components";import{margin as o}from"styled-system";import i from"../icon/icon.component.js";import"../icon/icon.style.js";import e from"../../style/themes/apply-base-theme.js";import r,{getPortraitFontSize as n,getPortraitColors as s,getPortraitDimensions as l,getPortraitIconFontSize as a,getPortraitBorderRadius as d}from"./__internal__/get-properties.js";const c=t.div.withConfig({displayName:"portrait.style__StyledPortraitInitials",componentId:"carbon_v162_12_0__sc-67607789-0"})(["font:",";display:flex;white-space:nowrap;align-items:center;justify-content:center;height:inherit;width:inherit;.mentions-list-item &&{color:var(--input-dropdown-label-default);}.mentions-list-item:hover &&,.mentions-list-item.selected &&{color:var(--popover-label-hover);}"],(({size:t})=>n(t))),m=t.img.withConfig({displayName:"portrait.style__StyledCustomImg",componentId:"carbon_v162_12_0__sc-67607789-1"})(["height:inherit;min-width:inherit;"]),p=t(i).withConfig({displayName:"portrait.style__StyledIcon",componentId:"carbon_v162_12_0__sc-67607789-2"})(["&&{color:",";height:",";min-width:",";::before{font-size:",";}}"],(({variant:t})=>s(t).color),(({$portraitSize:t})=>l(t).height),(({$portraitSize:t})=>l(t).width),(({$portraitSize:t})=>a(t))),h=t.div.attrs(e).withConfig({displayName:"portrait.style__StyledPortraitContainer",componentId:"carbon_v162_12_0__sc-67607789-3"})([""," ",";"," min-width:",";height:",";overflow:hidden;border-radius:",";border:var(--global-borderwidth-xs) solid var(--profile-border-default);display:inline-block;"," "," .mentions-list-item &&{color:currentColor;}.mentions-list-item:hover &&,.mentions-list-item.selected &&{color:currentColor;}"],(({variant:t})=>`\n    background-color: ${s(t).backgroundColor};\n    color: ${s(t).color};\n  `),(({darkBackground:t,backgroundColor:o,size:i,foregroundColor:e,variant:n})=>!n&&r(o,t,!["XS","S"].includes(i),!0,e)),(({hasValidImg:t,size:o})=>t&&`max-width: ${l(o).width};`),(({size:t})=>l(t).width),(({size:t})=>l(t).height),(({shape:t,size:o})=>d(t,o)),(({onClick:t})=>t&&"cursor: pointer"),o);export{m as StyledCustomImg,p as StyledIcon,h as StyledPortraitContainer,c as StyledPortraitInitials};

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

@@ -0,0 +1,2 @@
+export { default } from "./preview.component";
+export type { PreviewProps } from "./preview.component";

package/esm/components/preview/index.js

@@ -0,0 +1 @@
+export{Preview as default}from"./preview.component.js";

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

@@ -0,0 +1,22 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
+export type Shapes = "text" | "rectangle" | "rectangle-round" | "circle";
+export interface PreviewProps extends MarginProps, TagProps {
+    /** Children content to render in the component. */
+    children?: React.ReactNode;
+    /** Sets loading state. */
+    loading?: boolean;
+    /** Sets the height of the Preview. */
+    height?: string;
+    /** Sets the width of the Preview. */
+    width?: string;
+    /** The number of placeholder shapes to render. */
+    lines?: number;
+    /** Sets the preview's shape. */
+    shape?: Shapes;
+    /** Removes Preview's animation, is true when prefer reduce-motion is on. */
+    disableAnimation?: boolean;
+}
+export declare const Preview: ({ children, loading, lines, height, width, shape, disableAnimation, ...props }: PreviewProps) => React.JSX.Element;
+export default Preview;

package/esm/components/preview/preview.component.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import"react";import{StyledPreviewPlaceholder as r,StyledPreview as t}from"./preview.style.js";import"../../style/utils/filter-styled-system-padding-props.js";import n from"../../style/utils/filter-styled-system-margin-props.js";import i from"../../hooks/useMediaQuery/useMediaQuery.js";import o from"../../__internal__/utils/helpers/tags/tags.js";function s(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function l(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){s(e,r,t[r])}))}return e}function p(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 a=s=>{var{children:a,loading:c,lines:u=1,height:f,width:y,shape:b="text",disableAnimation:d}=s,O=function(e,r){if(null==e)return{};var t,n,i=function(e,r){if(null==e)return{};var t,n,i={},o=Object.keys(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||(i[t]=e[t]);return i}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(n=0;n<o.length;n++)t=o[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(i[t]=e[t])}return i}(s,["children","loading","lines","height","width","shape","disableAnimation"]);const m=n(O),h=null!=c?c:!a,j=!i("screen and (prefers-reduced-motion: no-preference)");if(h){const n=[];for(let t=0;t<u;t++)n.push(e(r,l({"data-role":"preview-placeholder",height:f,width:y,isLastLine:(g=t,u>1&&u===g+1),shape:b,disableAnimation:d||j},O,o("preview",O)),t));return e(t,p(l({"data-role":"preview-wrapper"},m),{children:n}))}var g;return e(t,p(l({"data-role":"preview-wrapper"},m),{children:a}))};export{a as Preview,a as default};

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

@@ -0,0 +1,13 @@
+import { Shapes } from "./preview.component";
+declare const StyledPreview: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+}, "theme">;
+interface StyledPreviewPlaceholderProps {
+    height?: string;
+    width?: string;
+    shape: Shapes;
+    disableAnimation?: boolean;
+    isLastLine: boolean;
+}
+declare const StyledPreviewPlaceholder: import("styled-components").StyledComponent<"span", any, StyledPreviewPlaceholderProps, never>;
+export { StyledPreview, StyledPreviewPlaceholder };

package/esm/components/preview/preview.style.js

@@ -0,0 +1 @@
+import e,{keyframes as i,css as r}from"styled-components";import{margin as t}from"styled-system";import a from"../../style/themes/apply-base-theme.js";const n=e.div.attrs(a).withConfig({displayName:"preview.style__StyledPreview",componentId:"carbon_v162_12_0__sc-a74c6505-0"})(["",""],t),o=i(["0%{opacity:0.1;}70%{opacity:1;}100%{opacity:0.1;}"]);function s(e){return e.includes("rectangle")?"var(--sizing400)":"circle"===e?"var(--sizing700)":"var(--sizing175)"}function c(e){return e.includes("rectangle")?"var(--sizing1500)":"100%"}const d=e.span.withConfig({displayName:"preview.style__StyledPreviewPlaceholder",componentId:"carbon_v162_12_0__sc-a74c6505-1"})(["",""],(({shape:e,disableAnimation:i,isLastLine:t,height:a,width:n})=>r(["display:block;background:linear-gradient( 135deg,var(--colorsUtilityMajor100),var(--colorsUtilityMajor040) );border-radius:",";height:",";width:",";animation:"," 2s ease infinite;"," "," "," & + &{margin-top:6px;}"],function(e){switch(e){case"rectangle-round":return"var(--borderRadius400)";case"circle":return"var(--borderRadiusCircle)";default:return"var(--borderRadius100)"}}(e),a||s(e),n||c(e),o,t&&"text"===e&&r(["width:calc(","*0.8);"],n||c(e)),"circle"===e&&r(["width:",";"],a||s(e)),i&&r(["animation:none;"]))));export{n as StyledPreview,d as StyledPreviewPlaceholder};

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

@@ -0,0 +1,2 @@
+export { default } from "./profile.component";
+export type { ProfileProps } from "./profile.component";

package/esm/components/profile/index.js

@@ -0,0 +1 @@
+export{Profile as default}from"./profile.component.js";

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

@@ -0,0 +1,48 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { TagProps } from "../../__internal__/utils/helpers/tags/tags";
+import type { PortraitProps } from "../portrait";
+import { ProfileSize } from "./profile.config";
+export interface ProfileProps extends MarginProps, TagProps {
+    /**
+     * @private
+     * @internal
+     * @ignore
+     * Sets className for component. INTERNAL USE ONLY. */
+    className?: string;
+    /** Custom source URL */
+    src?: string;
+    /** The `alt` HTML string. */
+    alt?: string;
+    /** Define the name to display. */
+    name?: string;
+    /** Define the email to use. */
+    email?: string;
+    /** Define read-only text to display. */
+    text?: string;
+    /** Define initials to display image. */
+    initials?: PortraitProps["initials"];
+    /** Allow to setup size for the component */
+    size?: ProfileSize;
+    /**
+     * Use a dark background.
+     * @deprecated This prop is deprecated and will be removed in a future release.
+     */
+    darkBackground?: PortraitProps["darkBackground"];
+    /**
+     * The hex code of the background colour to be passed to the avatar
+     * @deprecated This prop is deprecated and will be removed in a future release. Use `variant` instead.
+     */
+    backgroundColor?: PortraitProps["backgroundColor"];
+    /**
+     * The hex code of the foreground colour to be passed to the avatar. Must be used in conjunction with `backgroundColor`
+     * @deprecated This prop is deprecated and will be removed in a future release. Use `variant` instead.
+     */
+    foregroundColor?: PortraitProps["foregroundColor"];
+    /** Color variant to be passed to the avatar. */
+    variant?: PortraitProps["variant"];
+    /** Custom content rendered below the right side Profile content. */
+    children?: React.ReactNode;
+}
+export declare const Profile: ({ src, alt, className, initials, name, size, email, text, darkBackground, backgroundColor, foregroundColor, variant, children, ...props }: ProfileProps) => React.JSX.Element;
+export default Profile;

package/esm/components/profile/profile.component.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as r,Fragment as t}from"react/jsx-runtime";import"react";import"../../style/utils/filter-styled-system-padding-props.js";import n from"../../style/utils/filter-styled-system-margin-props.js";import o from"../../__internal__/utils/helpers/tags/tags.js";import a from"../../__internal__/utils/logger/index.js";import{Link as i}from"../link/link.component.js";import l from"./profile.config.js";import{ProfileStyle as s,ProfileAvatarStyle as c,ProfileDetailsStyle as p,ProfileNameStyle as m,ProfileTypography as u,ProfileCustomContentStyle as d}from"./profile.style.js";function f(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function g(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),n.forEach((function(r){f(e,r,t[r])}))}return e}function y(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}let b=!1;const O=f=>{var{src:O,alt:j,className:h,initials:k,name:w,size:P,email:v,text:x,darkBackground:S,backgroundColor:_,foregroundColor:C,variant:z,children:B}=f,$=function(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t,n,o={},a=Object.keys(e);for(n=0;n<a.length;n++)t=a[n],r.indexOf(t)>=0||(o[t]=e[t]);return o}(e,r);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)t=a[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}(f,["src","alt","className","initials","name","size","email","text","darkBackground","backgroundColor","foregroundColor","variant","children"]);const N=P||"M",D=y(g({darkBackground:S,alt:j,name:w,initials:k||function(e){if(!e)return"";const r=e.match(/\b\w/g);return r?r.join(""):""}(w).slice(0,3).toUpperCase(),size:N},z?{variant:z}:{backgroundColor:_,foregroundColor:C}),{"data-role":"profile-portrait"});return b||w||!v&&!x||(b=!0,a.warn("[WARNING] The `email` or `text` prop should not be used without the `name` prop in `Profile`. Please use the `name` prop as well as `email` or `text`.")),e(s,y(g({className:h,$darkBackground:S},o("profile",$),n($)),{children:[r(c,g(O?{src:O,"data-element":"user-image"}:{},D)),w||B?e(p,{$size:N,"data-element":"details",children:[w&&e(t,{children:[r(m,{$font:l[N].nameTypography.font,$darkBackground:S,"data-element":"name",children:w}),v&&r(i,{href:`mailto:${v}`,linkSize:l[N].emailLinkSize,inverse:S,"data-role":"email-link","data-element":"email",children:v}),x&&r(u,y(g({forwardedAs:"span"},l[N].textTypography),{inverse:S,$darkBackground:S,m:0,"data-element":"text",children:x}))]}),B&&r(d,{"data-role":"custom-content","data-element":"custom-content",children:B})]}):null]}))};export{O as Profile,O as default};

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

@@ -0,0 +1,83 @@
+export declare const PROFILE_SIZES: readonly ["XS", "S", "M", "ML", "L", "XL", "XXL"];
+type AllProfileSizes = typeof PROFILE_SIZES;
+export type ProfileSize = AllProfileSizes[number];
+declare const profileConfigSizes: {
+    readonly XS: {
+        readonly nameTypography: {
+            readonly font: "var(--profile-font-heading-xs)";
+        };
+        readonly emailLinkSize: "medium";
+        readonly textTypography: {
+            readonly variant: "p";
+            readonly size: "M";
+        };
+        readonly detailsMarginLeft: "var(--global-space-comp-s)";
+    };
+    readonly S: {
+        readonly nameTypography: {
+            readonly font: "var(--profile-font-heading-s)";
+        };
+        readonly emailLinkSize: "medium";
+        readonly textTypography: {
+            readonly variant: "p";
+            readonly size: "M";
+        };
+        readonly detailsMarginLeft: "var(--global-space-comp-m)";
+    };
+    readonly M: {
+        readonly nameTypography: {
+            readonly font: "var(--profile-font-heading-m)";
+        };
+        readonly emailLinkSize: "medium";
+        readonly textTypography: {
+            readonly variant: "p";
+            readonly size: "M";
+        };
+        readonly detailsMarginLeft: "var(--global-space-comp-l)";
+    };
+    readonly ML: {
+        readonly nameTypography: {
+            readonly font: "var(--profile-font-heading-ml)";
+        };
+        readonly emailLinkSize: "medium";
+        readonly textTypography: {
+            readonly variant: "p";
+            readonly size: "M";
+        };
+        readonly detailsMarginLeft: "var(--global-space-comp-l)";
+    };
+    readonly L: {
+        readonly nameTypography: {
+            readonly font: "var(--profile-font-heading-l)";
+        };
+        readonly emailLinkSize: "large";
+        readonly textTypography: {
+            readonly variant: "p";
+            readonly size: "L";
+        };
+        readonly detailsMarginLeft: "var(--global-space-comp-l)";
+    };
+    readonly XL: {
+        readonly nameTypography: {
+            readonly font: "var(--profile-font-heading-xl)";
+        };
+        readonly emailLinkSize: "large";
+        readonly textTypography: {
+            readonly variant: "p";
+            readonly size: "L";
+        };
+        readonly detailsMarginLeft: "var(--global-space-comp-xl)";
+    };
+    readonly XXL: {
+        readonly nameTypography: {
+            readonly font: "var(--profile-font-heading-xxl)";
+        };
+        readonly emailLinkSize: "large";
+        readonly textTypography: {
+            readonly variant: "p";
+            readonly size: "L";
+        };
+        readonly detailsMarginLeft: "var(--global-space-comp-2-xl)";
+    };
+};
+export default profileConfigSizes;

package/esm/components/profile/profile.config.js

@@ -0,0 +1 @@
+const a=["XS","S","M","ML","L","XL","XXL"],e={XS:{nameTypography:{font:"var(--profile-font-heading-xs)"},emailLinkSize:"medium",textTypography:{variant:"p",size:"M"},detailsMarginLeft:"var(--global-space-comp-s)"},S:{nameTypography:{font:"var(--profile-font-heading-s)"},emailLinkSize:"medium",textTypography:{variant:"p",size:"M"},detailsMarginLeft:"var(--global-space-comp-m)"},M:{nameTypography:{font:"var(--profile-font-heading-m)"},emailLinkSize:"medium",textTypography:{variant:"p",size:"M"},detailsMarginLeft:"var(--global-space-comp-l)"},ML:{nameTypography:{font:"var(--profile-font-heading-ml)"},emailLinkSize:"medium",textTypography:{variant:"p",size:"M"},detailsMarginLeft:"var(--global-space-comp-l)"},L:{nameTypography:{font:"var(--profile-font-heading-l)"},emailLinkSize:"large",textTypography:{variant:"p",size:"L"},detailsMarginLeft:"var(--global-space-comp-l)"},XL:{nameTypography:{font:"var(--profile-font-heading-xl)"},emailLinkSize:"large",textTypography:{variant:"p",size:"L"},detailsMarginLeft:"var(--global-space-comp-xl)"},XXL:{nameTypography:{font:"var(--profile-font-heading-xxl)"},emailLinkSize:"large",textTypography:{variant:"p",size:"L"},detailsMarginLeft:"var(--global-space-comp-2-xl)"}};export{a as PROFILE_SIZES,e as default};

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

@@ -0,0 +1,22 @@
+import { ProfileSize } from "./profile.config";
+interface ProfileRootStyleProps {
+    $darkBackground?: boolean;
+}
+interface ProfileDetailsStyleProps {
+    $size: ProfileSize;
+}
+interface ProfileNameStyleProps extends ProfileRootStyleProps {
+    $font: string;
+}
+declare const ProfileStyle: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+} & ProfileRootStyleProps, "theme">;
+declare const ProfileAvatarStyle: import("styled-components").StyledComponent<({ alt, backgroundColor, foregroundColor, className, name, darkBackground, iconType, initials, shape, size, src, onClick, tooltipMessage, tooltipId, tooltipIsVisible, tooltipPosition, tooltipType, tooltipSize, tooltipBgColor, tooltipFontColor, variant, ...rest }: import("../portrait").PortraitProps) => import("react").JSX.Element, any, {}, never>;
+declare const ProfileNameStyle: import("styled-components").StyledComponent<"span", any, ProfileNameStyleProps, never>;
+declare const ProfileTypography: import("styled-components").StyledComponent<{
+    ({ variant, as, id, fluid, inverse, size, color, tint, weight, truncate, children, screenReaderOnly, "aria-live": ariaLive, "aria-hidden": ariaHidden, ...rest }: import("../typography").TypographyProps): import("react").JSX.Element;
+    displayName: string;
+}, any, ProfileRootStyleProps, never>;
+declare const ProfileDetailsStyle: import("styled-components").StyledComponent<"div", any, ProfileDetailsStyleProps, never>;
+declare const ProfileCustomContentStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export { ProfileStyle, ProfileNameStyle, ProfileTypography, ProfileDetailsStyle, ProfileAvatarStyle, ProfileCustomContentStyle, };

package/esm/components/profile/profile.style.js

@@ -0,0 +1 @@
+import e from"styled-components";import{margin as r}from"styled-system";import{Portrait as t}from"../portrait/portrait.component.js";import{Typography as o}from"../typography/typography.component.js";import"react/jsx-runtime";import"react";import i from"../../style/themes/apply-base-theme.js";import a from"./profile.config.js";import{StyledPortraitContainer as n}from"../portrait/portrait.style.js";const l=e.div.attrs(i).withConfig({displayName:"profile.style__ProfileStyle",componentId:"carbon_v162_12_0__sc-29e860cc-0"})(["border-radius:inherit;color:",";background-color:",";display:flex;flex-direction:row;align-items:center;"," ","{flex-shrink:0;}"],(({$darkBackground:e})=>e?"var(--container-standard-inverse-txt-default)":"var(--profile-label-default)"),(({$darkBackground:e})=>e?"var(--container-standard-inverse-bg-default)":"transparent"),r,n),c=e(t).withConfig({displayName:"profile.style__ProfileAvatarStyle",componentId:"carbon_v162_12_0__sc-29e860cc-1"})(["display:inline-block;"]),s=e.span.withConfig({displayName:"profile.style__ProfileNameStyle",componentId:"carbon_v162_12_0__sc-29e860cc-2"})(["color:",";font:",";"],(({$darkBackground:e})=>e?"var(--container-standard-inverse-txt-default)":"var(--profile-label-default)"),(({$font:e})=>e)),d=e(o).withConfig({displayName:"profile.style__ProfileTypography",componentId:"carbon_v162_12_0__sc-29e860cc-3"})(["color:",";"],(({$darkBackground:e})=>e?"var(--container-standard-inverse-txt-default)":"var(--profile-label-default)")),p=e.div.withConfig({displayName:"profile.style__ProfileDetailsStyle",componentId:"carbon_v162_12_0__sc-29e860cc-4"})(["display:flex;flex-direction:column;justify-content:center;margin-left:",";min-width:0;word-wrap:break-word;"],(({$size:e})=>a[e].detailsMarginLeft)),f=e.div.withConfig({displayName:"profile.style__ProfileCustomContentStyle",componentId:"carbon_v162_12_0__sc-29e860cc-5"})(["display:flex;flex-direction:column;align-items:flex-start;min-width:0;"]);export{c as ProfileAvatarStyle,f as ProfileCustomContentStyle,p as ProfileDetailsStyle,s as ProfileNameStyle,l as ProfileStyle,d as ProfileTypography};

package/esm/components/progress-tracker/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./progress-tracker.component";
+export type { ProgressTrackerProps } from "./progress-tracker.component";

package/esm/components/progress-tracker/index.js

@@ -0,0 +1 @@
+export{ProgressTracker as default}from"./progress-tracker.component.js";

package/esm/components/progress-tracker/progress-tracker.component.d.ts

@@ -0,0 +1,36 @@
+import React from "react";
+import { MarginProps } from "styled-system";
+import { TagProps } from "../../__internal__/utils/helpers/tags";
+export type TrackerVariants = "neutral" | "warning" | "information" | "error" | "success";
+export interface ProgressTrackerProps extends MarginProps, TagProps {
+    /** Size of the progress bar. */
+    size?: "small" | "medium" | "large";
+    /** Length of the component, any valid css string. */
+    length?: string;
+    /** Current progress (percentage). */
+    progress?: number;
+    /**
+     * Flag to control error state.
+     * @deprecated Please use variant="error" instead.
+     */
+    error?: boolean;
+    /** Value to add a description to the label */
+    description?: string;
+    /** Value to display as current progress. */
+    currentProgressLabel?: string;
+    /** Value to display as the maximum progress limit. */
+    maxProgressLabel?: string;
+    /** Value of the preposition defined between Value1 and Value2 on the label. */
+    customValuePreposition?: string;
+    /** The position the value label are rendered in. */
+    labelsPosition?: "top" | "bottom" | "left";
+    /** Label width when position is "left" */
+    labelWidth?: string;
+    /** Variant of the progress bar */
+    variant?: TrackerVariants;
+}
+export declare const ProgressTracker: {
+    ({ size, length, error, progress, description, currentProgressLabel, customValuePreposition, maxProgressLabel, labelsPosition, labelWidth, variant, ...rest }: ProgressTrackerProps): React.JSX.Element;
+    displayName: string;
+};
+export default ProgressTracker;

package/esm/components/progress-tracker/progress-tracker.component.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as r,Fragment as t}from"react/jsx-runtime";import"react";import o from"../../hooks/__internal__/useLocale/useLocale.js";import n from"../../__internal__/utils/helpers/tags/tags.js";import{StyledProgressTracker as s,StyledProgressBar as a,StyledLabelWrapper as i,StyledValuesWrapper as l,StyledValue as c}from"./progress-tracker.style.js";function p(e,r,t){return r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}const u=u=>{var{size:b="medium",length:g="256px",error:m,progress:f=0,description:d,currentProgressLabel:O,customValuePreposition:y,maxProgressLabel:h,labelsPosition:P="top",labelWidth:j,variant:v="neutral"}=u,w=function(e,r){if(null==e)return{};var t,o,n=function(e,r){if(null==e)return{};var t,o,n={},s=Object.keys(e);for(o=0;o<s.length;o++)t=s[o],r.indexOf(t)>=0||(n[t]=e[t]);return n}(e,r);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(o=0;o<s.length;o++)t=s[o],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(n[t]=e[t])}return n}(u,["size","length","error","progress","description","currentProgressLabel","customValuePreposition","maxProgressLabel","labelsPosition","labelWidth","variant"]);const $=o(),k="bottom"!==P,x=m?"error":v,_=()=>{let o,n;return O?(o=O,n=h||void 0):(o=`${f}%`,n="100%"),e(i,{"data-role":"values-label",$size:b,$labelWidth:j,children:[e(l,{children:[r(c,{"data-element":"current-progress-label",$size:b,children:o}),n&&e(t,{children:[r("span",{"data-element":"custom-preposition",children:y||$.progressTracker.of()}),r(c,{"data-element":"max-progress-label",$size:b,children:n})]})]}),d&&r("span",{"data-element":"progress-tracker-description",children:d})]})};return e(s,(z=function(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){p(e,r,t[r])}))}return e}({$length:g,$labelsPosition:P,$size:b},w,n("progress-bar",w)),L=null!=(L={children:[k&&_(),r(a,{"data-role":"progress-bar","aria-hidden":"true",$variant:x,$size:b,$progress:f}),!k&&_()]})?L:{},Object.getOwnPropertyDescriptors?Object.defineProperties(z,Object.getOwnPropertyDescriptors(L)):function(e){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);r.push.apply(r,t)}return r}(Object(L)).forEach((function(e){Object.defineProperty(z,e,Object.getOwnPropertyDescriptor(L,e))})),z));var z,L};u.displayName="ProgressTracker";export{u as ProgressTracker,u as default};

package/esm/components/progress-tracker/progress-tracker.config.d.ts

@@ -0,0 +1,30 @@
+export declare const progressTrackerSizeMap: {
+    small: {
+        gap: string;
+        barHeight: string;
+        barBorderRadius: string;
+        valueFont: string;
+        regularFont: string;
+    };
+    medium: {
+        gap: string;
+        barHeight: string;
+        barBorderRadius: string;
+        valueFont: string;
+        regularFont: string;
+    };
+    large: {
+        gap: string;
+        barHeight: string;
+        barBorderRadius: string;
+        valueFont: string;
+        regularFont: string;
+    };
+};
+export declare const progressBarVariants: {
+    neutral: string;
+    warning: string;
+    information: string;
+    error: string;
+    success: string;
+};

package/esm/components/progress-tracker/progress-tracker.config.js

@@ -0,0 +1 @@
+const a={small:{gap:"var(--global-space-comp-s)",barHeight:"var(--global-size-5-xs)",barBorderRadius:"var(--global-radius-action-xs)",valueFont:"var(--global-font-static-comp-medium-m)",regularFont:"var(--global-font-static-comp-regular-m)"},medium:{gap:"var(--global-space-comp-s)",barHeight:"var(--global-size-4-xs)",barBorderRadius:"var(--global-radius-action-s)",valueFont:"var(--global-font-static-comp-medium-l)",regularFont:"var(--global-font-static-comp-regular-l)"},large:{gap:"var(--global-space-comp-m)",barHeight:"var(--global-size-3-xs)",barBorderRadius:"var(--global-radius-action-m)",valueFont:"var(--global-font-static-comp-medium-l)",regularFont:"var(--global-font-static-comp-regular-l)"}},r={neutral:"var(--progress-fg-default)",warning:"var(--progress-fg-caution)",information:"var(--progress-fg-info)",error:"var(--progress-fg-error)",success:"var(--progress-fg-alt)"};export{r as progressBarVariants,a as progressTrackerSizeMap};

package/esm/components/progress-tracker/progress-tracker.style.d.ts

@@ -0,0 +1,25 @@
+import { TrackerVariants } from "./progress-tracker.component";
+interface StyledProgressTrackerProps {
+    $length?: string;
+    $labelsPosition?: "top" | "bottom" | "left";
+    $size: "small" | "medium" | "large";
+}
+export declare const StyledProgressTracker: import("styled-components").StyledComponent<"div", any, {
+    theme: object;
+} & StyledProgressTrackerProps, "theme">;
+interface StyledProgressBarProps {
+    $variant: TrackerVariants;
+    $size: "small" | "medium" | "large";
+    $progress?: number;
+}
+export declare const StyledProgressBar: import("styled-components").StyledComponent<"span", any, {
+    theme: object;
+} & StyledProgressBarProps, "theme">;
+interface StyledLabelProps {
+    $size: "small" | "medium" | "large";
+    $labelWidth?: string;
+}
+export declare const StyledValue: import("styled-components").StyledComponent<"span", any, StyledLabelProps, never>;
+export declare const StyledValuesWrapper: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const StyledLabelWrapper: import("styled-components").StyledComponent<"div", any, StyledLabelProps, never>;
+export {};

package/esm/components/progress-tracker/progress-tracker.style.js

@@ -0,0 +1 @@
+import e,{css as r}from"styled-components";import{margin as a}from"styled-system";import s from"../../style/themes/apply-base-theme.js";import{progressTrackerSizeMap as o,progressBarVariants as t}from"./progress-tracker.config.js";const l=e.div.attrs(s).withConfig({displayName:"progress-tracker.style__StyledProgressTracker",componentId:"carbon_v162_12_0__sc-2541d4c3-0"})([""," ",";"],a,(({$length:e,$labelsPosition:a,$size:s})=>r(["display:flex;flex-direction:column;gap:",";width:",";",""],o[s].gap,e,"left"===a&&r(["flex-direction:row;align-items:center;"])))),i=e.span.attrs(s).withConfig({displayName:"progress-tracker.style__StyledProgressBar",componentId:"carbon_v162_12_0__sc-2541d4c3-1"})(["",""],(({$variant:e,$size:a,$progress:s})=>r(["display:block;overflow:hidden;width:100%;height:",";border-radius:",';background:var(--progress-bg-default);box-shadow:inset 0 0 0 var(--global-borderwidth-xs) var(--progress-border-default);::after{content:"";display:block;width:',"%;height:",";background-color:",";border-radius:",";}"],o[a].barHeight,o[a].barBorderRadius,s,o[a].barHeight,t[e],o[a].barBorderRadius))),d=e.span.withConfig({displayName:"progress-tracker.style__StyledValue",componentId:"carbon_v162_12_0__sc-2541d4c3-2"})(["",";"],(({$size:e})=>r(["font:",";"],o[e].valueFont))),p=e.span.withConfig({displayName:"progress-tracker.style__StyledValuesWrapper",componentId:"carbon_v162_12_0__sc-2541d4c3-3"})(["display:flex;gap:var(--global-space-comp-xs);"]),n=e.div.withConfig({displayName:"progress-tracker.style__StyledLabelWrapper",componentId:"carbon_v162_12_0__sc-2541d4c3-4"})(["",";"],(({$size:e,$labelWidth:a})=>r(["display:flex;flex-wrap:wrap;gap:0 var(--global-space-comp-s);white-space:nowrap;color:var(--progress-label-default);font:",";",""],o[e].regularFont,a&&r(["width:",";flex-shrink:0;"],a))));export{n as StyledLabelWrapper,i as StyledProgressBar,l as StyledProgressTracker,d as StyledValue,p as StyledValuesWrapper};

package/esm/components/radio-button/___internal___/radio-button-group.context.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+interface RadioButtonGroupContextType {
+    inline?: boolean;
+    error?: boolean;
+    warning?: boolean;
+    name?: string;
+    onBlur?: (ev: React.FocusEvent<HTMLInputElement>) => void;
+    onChange?: (ev: React.ChangeEvent<HTMLInputElement>) => void;
+    value?: string;
+    size: "small" | "medium" | "large";
+    disabled?: boolean;
+    required?: boolean;
+}
+declare const RadioButtonGroupProvider: React.Provider<RadioButtonGroupContextType | null>, useRadioButtonGroupContext: () => RadioButtonGroupContextType;
+export { RadioButtonGroupProvider, useRadioButtonGroupContext };

package/esm/components/radio-button/___internal___/radio-button-group.context.js

@@ -0,0 +1 @@
+import"react";import t from"../../../__internal__/utils/createStrictContext/createStrictContext.js";const[e,o]=t({name:"RadioButtonGroupContext",errorMessage:"Carbon RadioButtonGroup: Context not found. Have you wrapped your Carbon subcomponents properly? See stack trace for more details.",defaultValue:{size:"medium"}});export{e as RadioButtonGroupProvider,o as useRadioButtonGroupContext};

package/esm/components/radio-button/___internal___/radio-button-svg.component.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const _default: React.MemoExoticComponent<() => React.JSX.Element>;
+export default _default;

package/esm/components/radio-button/___internal___/radio-button-svg.component.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import r from"react";const o=()=>e("div",{"data-role":"checkable-input-svg-wrapper",children:e("svg",{"data-role":"radio-svg",focusable:"false",viewBox:"0 0 15 15",children:e("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd",children:e("circle",{className:"radio-button-check",fill:"#FFFFFF",cx:"7.5",cy:"7.5",r:"4"})})})});var l=r.memo(o,(()=>!0));export{l as default};

package/esm/components/radio-button/index.d.ts

@@ -0,0 +1,6 @@
+import RadioButton from "./radio-button.component";
+import RadioButtonGroup from "./radio-button-group/radio-button-group.component";
+export { RadioButton, RadioButtonGroup };
+export default RadioButton;
+export type { RadioButtonProps } from "./radio-button.component";
+export type { RadioButtonGroupProps } from "./radio-button-group/radio-button-group.component";

package/esm/components/radio-button/index.js

@@ -0,0 +1 @@
+import{RadioButton as o}from"./radio-button.component.js";export{RadioButtonGroup}from"./radio-button-group/radio-button-group.component.js";export{o as RadioButton,o as default};