carbon-react 159.11.0 → 159.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/esm/components/button/__next__/button.style.js +1 -1
  2. package/esm/components/button-toggle/button-toggle-group/__internal__/button-toggle-group.context.d.ts +2 -2
  3. package/esm/components/button-toggle/button-toggle-group/__internal__/button-toggle-group.context.js +1 -1
  4. package/esm/components/button-toggle/button-toggle-group/button-toggle-group.component.d.ts +36 -13
  5. package/esm/components/button-toggle/button-toggle-group/button-toggle-group.component.js +1 -1
  6. package/esm/components/button-toggle/button-toggle-group/button-toggle-group.style.d.ts +15 -7
  7. package/esm/components/button-toggle/button-toggle-group/button-toggle-group.style.js +1 -1
  8. package/esm/components/button-toggle/button-toggle.component.d.ts +20 -7
  9. package/esm/components/button-toggle/button-toggle.component.js +1 -1
  10. package/esm/components/button-toggle/button-toggle.style.d.ts +6 -36
  11. package/esm/components/button-toggle/button-toggle.style.js +1 -1
  12. package/esm/components/icon/icon.style.js +1 -1
  13. package/esm/components/time/__internal__/time-toggle/time-toggle.component.js +1 -1
  14. package/esm/components/tokens-wrapper/__internal__/static-tokens/index.d.ts +1 -1
  15. package/esm/components/tokens-wrapper/__internal__/static-tokens/index.js +1 -1
  16. package/lib/components/button/__next__/button.style.js +1 -1
  17. package/lib/components/button-toggle/button-toggle-group/__internal__/button-toggle-group.context.d.ts +2 -2
  18. package/lib/components/button-toggle/button-toggle-group/__internal__/button-toggle-group.context.js +1 -1
  19. package/lib/components/button-toggle/button-toggle-group/button-toggle-group.component.d.ts +36 -13
  20. package/lib/components/button-toggle/button-toggle-group/button-toggle-group.component.js +1 -1
  21. package/lib/components/button-toggle/button-toggle-group/button-toggle-group.style.d.ts +15 -7
  22. package/lib/components/button-toggle/button-toggle-group/button-toggle-group.style.js +1 -1
  23. package/lib/components/button-toggle/button-toggle.component.d.ts +20 -7
  24. package/lib/components/button-toggle/button-toggle.component.js +1 -1
  25. package/lib/components/button-toggle/button-toggle.style.d.ts +6 -36
  26. package/lib/components/button-toggle/button-toggle.style.js +1 -1
  27. package/lib/components/icon/icon.style.js +1 -1
  28. package/lib/components/time/__internal__/time-toggle/time-toggle.component.js +1 -1
  29. package/lib/components/tokens-wrapper/__internal__/static-tokens/index.d.ts +1 -1
  30. package/lib/components/tokens-wrapper/__internal__/static-tokens/index.js +1 -1
  31. package/package.json +2 -2
  32. package/esm/components/button-toggle/button-toggle-icon.component.d.ts +0 -15
  33. package/esm/components/button-toggle/button-toggle-icon.component.js +0 -1
  34. package/lib/components/button-toggle/button-toggle-icon.component.d.ts +0 -15
  35. package/lib/components/button-toggle/button-toggle-icon.component.js +0 -1
@@ -1,8 +1,16 @@
1
- import { ButtonToggleGroupProps } from ".";
2
- type StyledButtonToggleGroupProps = Pick<ButtonToggleGroupProps, "inputWidth" | "fullWidth" | "disabled" | "labelInline">;
3
- declare const StyledButtonToggleGroup: import("styled-components").StyledComponent<"div", any, {
1
+ interface StyledButtonToggle {
2
+ $size: "small" | "medium" | "large";
3
+ $fullWidth?: boolean;
4
+ $width?: number | string;
5
+ }
6
+ export declare const StyledButtonToggleGroup: import("styled-components").StyledComponent<"div", any, {
4
7
  theme: object;
5
- } & {
6
- type: string;
7
- } & StyledButtonToggleGroupProps, "theme" | "type">;
8
- export default StyledButtonToggleGroup;
8
+ } & StyledButtonToggle, "theme">;
9
+ export declare const StyledLabelWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
10
+ interface StyledButtonToggleWrapper {
11
+ $size: "small" | "medium" | "large";
12
+ $isDisabled?: boolean;
13
+ $fullWidth?: boolean;
14
+ }
15
+ export declare const StyledButtonToggleWrapper: import("styled-components").StyledComponent<"div", any, StyledButtonToggleWrapper, never>;
16
+ export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("styled-components"),e=require("styled-system"),o=require("../../../style/themes/apply-base-theme.js"),r=require("../button-toggle.style.js");function s(t){return t&&t.__esModule?t:{default:t}}const l=s(t).default.div.attrs(o.default).attrs({type:"button"}).withConfig({displayName:"button-toggle-group.style__StyledButtonToggleGroup",componentId:"sc-e2730b28-0"})([""," display:flex;box-shadow:inset 0px 0px 0px 1px var(--colorsActionMinor500);border-radius:var(--borderRadius100);padding:4px;gap:4px;width:fit-content;height:fit-content;flex-wrap:",";"," "," ",""],e.margin,(({labelInline:t})=>t?"nowrap":"wrap"),(({disabled:e})=>e&&t.css(["cursor:not-allowed;box-shadow:inset 0px 0px 0px 1px var(--button-typical-toggle-border-disabled);"])),(({fullWidth:e})=>e&&t.css(["width:100%;","{width:100%;}","{flex:auto;}"],r.StyledButtonToggle,r.StyledButtonToggleWrapper)),(({inputWidth:e})=>e&&t.css(["width:",";"],`${e}%`)));exports.default=l;
1
+ "use strict";var e=require("styled-components"),l=require("styled-system"),t=require("../../../style/themes/apply-base-theme.js");function a(e){return e&&e.__esModule?e:{default:e}}var o=a(e);const r={small:{gap:"var(--global-space-comp-xs)",borderRadius:"var(--global-radius-action-l)"},medium:{gap:"var(--global-space-comp-s)",borderRadius:"var(--global-radius-action-xl)"},large:{gap:"var(--global-space-comp-m)",borderRadius:"var(--global-radius-action-2-xl)"}},s=o.default.div.attrs(t.default).withConfig({displayName:"button-toggle-group.style__StyledButtonToggleGroup",componentId:"sc-9691d771-0"})([""," ",""],(({$size:l,$fullWidth:t,$width:a})=>e.css(["display:flex;flex-direction:column;gap:",";"," ",""],r[l].gap,t&&e.css(["width:100%;"]),a&&e.css(["width:","%;"],a))),l.margin),d=o.default.div.withConfig({displayName:"button-toggle-group.style__StyledLabelWrapper",componentId:"sc-9691d771-1"})(["display:flex;flex-direction:column;"]),i=o.default.div.withConfig({displayName:"button-toggle-group.style__StyledButtonToggleWrapper",componentId:"sc-9691d771-2"})(["",""],(({$size:l,$isDisabled:t,$fullWidth:a})=>e.css(["display:flex;flex-wrap:wrap;padding:var(--global-space-comp-xs);align-items:center;gap:var(--global-space-comp-s);"," border-radius:",";border:var(--global-borderwidth-xs) solid var(--button-typical-toggle-border-default);",""],!a&&e.css(["width:fit-content;"]),r[l].borderRadius,t&&e.css(["border-color:var(--button-typical-toggle-border-disabled);"]))));exports.StyledButtonToggleGroup=s,exports.StyledButtonToggleWrapper=i,exports.StyledLabelWrapper=d;
@@ -1,12 +1,12 @@
1
1
  import React from "react";
2
- import { StyledButtonToggleProps } from "./button-toggle.style";
3
2
  import { TagProps } from "../../__internal__/utils/helpers/tags";
4
- export interface ButtonToggleProps extends Partial<StyledButtonToggleProps>, TagProps {
3
+ import { IconType } from "../icon";
4
+ export interface ButtonToggleProps extends TagProps {
5
5
  /** Prop to specify the aria-label of the component */
6
6
  "aria-label"?: string;
7
7
  /** Prop to specify the aria-labelledby property of the component */
8
8
  "aria-labelledby"?: string;
9
- /** Text to display for the button. */
9
+ /** Content to display within the button. */
10
10
  children?: React.ReactNode;
11
11
  /** Callback triggered by blur event on the button. */
12
12
  onBlur?: (ev: React.FocusEvent<HTMLButtonElement>) => void;
@@ -15,17 +15,30 @@ export interface ButtonToggleProps extends Partial<StyledButtonToggleProps>, Tag
15
15
  /** Callback triggered by click event on the button. */
16
16
  onClick?: (ev: React.MouseEvent<HTMLButtonElement>) => void;
17
17
  /**
18
- * Set the pressed state of the toggle button
19
- * @deprecated
18
+ * Set the pressed state of the toggle button.
19
+ * @deprecated Please control the state of selected buttons through ButtonToggleGroup.
20
20
  * */
21
21
  pressed?: boolean;
22
- /** An optional string by which to identify the button in either an onClick handler, or an onChange handler on the parent ButtonToggleGroup. */
22
+ /** An optional string by which to identify the button in an onChange handler on the parent ButtonToggleGroup. */
23
23
  value?: string;
24
+ /** Icon rendered within the button. Will not be rendered if size is small. */
25
+ buttonIcon?: IconType;
26
+ /**
27
+ * Sets the size of the buttonIcon
28
+ * @deprecated `buttonIconSize` is no longer supported.
29
+ */
30
+ buttonIconSize?: "small" | "large";
31
+ /** Disable the ButtonToggle. */
32
+ disabled?: boolean;
33
+ /** ButtonToggle size */
34
+ size?: "small" | "medium" | "large";
35
+ /** Allow a selected button to be deselected. */
36
+ allowDeselect?: boolean;
24
37
  /** @private @internal @ignore */
25
38
  "data-component"?: string;
26
39
  }
27
40
  export declare const ButtonToggle: {
28
- ({ "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, buttonIcon, buttonIconSize, children, "data-component": dataComponent, "data-element": dataElement, "data-role": dataRole, disabled, onBlur, onFocus, onClick, pressed, size, value, }: ButtonToggleProps): React.JSX.Element;
41
+ ({ "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, buttonIcon, buttonIconSize, children, disabled, onBlur, onFocus, onClick, pressed, size, value, "data-component": dataComponent, ...rest }: ButtonToggleProps): React.JSX.Element;
29
42
  displayName: string;
30
43
  };
31
44
  export default ButtonToggle;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("invariant"),o=require("./button-toggle.style.js"),r=require("../../__internal__/utils/helpers/guid/index.js"),u=require("./button-toggle-group/__internal__/button-toggle-group.context.js"),l=require("./button-toggle-icon.component.js"),a=require("../../__internal__/input-behaviour/input-group-behaviour.component.js"),i=require("../../__internal__/utils/logger/index.js");function s(e){return e&&e.__esModule?e:{default:e}}var c=s(n);function d(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function b(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){d(e,t,n[t])}))}return e}let p=!1;const g=({"aria-label":n,"aria-labelledby":s,buttonIcon:d,buttonIconSize:g="small",children:f,"data-component":y,"data-element":j,"data-role":O,disabled:h,onBlur:m,onFocus:_,onClick:v,pressed:x,size:w="medium",value:B})=>{c.default(!(!f&&!d),"Either prop `buttonIcon` must be defined, or this node must have children"),x&&!p&&(i.default.deprecate("The `pressed` prop is deprecated."),p=!0);const I=t.useRef(null),{onMouseEnter:P,onMouseLeave:q,onBlur:C,onFocus:D}=t.useContext(a.InputGroupContext),{onButtonClick:S,handleKeyDown:T,pressedButtonValue:k,onChange:M,allowDeselect:z,isInGroup:E,isDisabled:F,firstButton:G,childButtonCallbackRef:R,hintTextId:K}=u.useButtonToggleGroupContext(),L=t.useRef(r.default()),N=E?k&&k===B:x,V=I.current===G,W=!E||N||!k&&V;return e.jsx(o.StyledButtonToggleWrapper,{"data-component":y||"button-toggle","data-element":j,"data-role":O,children:e.jsxs(o.StyledButtonToggle,(A=b({"aria-label":n,"aria-labelledby":s,"aria-describedby":K,"aria-pressed":!!N,buttonIcon:d,buttonIconSize:g,"data-element":"button-toggle-button",disabled:h||F,id:L.current,onMouseEnter:P,onMouseLeave:q,size:w,value:B,onFocus:function(e){null==_||_(e),null==D||D()},onBlur:function(e){null==m||m(e),null==C||C()},onClick:function(e){v&&v(e),null==M||M(e,z&&k&&k===B?void 0:B),B&&S(B)},onKeyDown:T},W?{tabIndex:0}:{tabIndex:-1}),H={allowDeselect:z,ref:e=>{I.current=e,null==R||R(e)},children:[d&&e.jsx(l.default,{buttonIcon:d,buttonIconSize:g,disabled:h,hasContent:!!f}),f]},H=null!=H?H:{},Object.getOwnPropertyDescriptors?Object.defineProperties(A,Object.getOwnPropertyDescriptors(H)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t.push.apply(t,n)}return t}(Object(H)).forEach((function(e){Object.defineProperty(A,e,Object.getOwnPropertyDescriptor(H,e))})),A))});var A,H};g.displayName="ButtonToggle",exports.ButtonToggle=g,exports.default=g;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("invariant"),r=require("./button-toggle.style.js"),o=require("../../__internal__/utils/helpers/guid/index.js"),l=require("./button-toggle-group/__internal__/button-toggle-group.context.js"),u=require("../../__internal__/utils/helpers/tags/tags.js"),i=require("../icon/icon.component.js"),a=require("../button/__next__/__internal__/utils/is-icon-only.js");function s(e){return e&&e.__esModule?e:{default:e}}var c=s(n);function b(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function d(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},r=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(n).filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable})))),r.forEach((function(t){b(e,t,n[t])}))}return e}function f(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t.push.apply(t,n)}return t}(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))})),e}const p=n=>{var{"aria-label":s,"aria-labelledby":b,buttonIcon:p,buttonIconSize:g,children:y,disabled:O,onBlur:j,onFocus:_,onClick:h,pressed:m,size:v,value:x,"data-component":w}=n,P=function(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},l=Object.keys(e);for(r=0;r<l.length;r++)n=l[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(r=0;r<l.length;r++)n=l[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}(n,["aria-label","aria-labelledby","buttonIcon","buttonIconSize","children","disabled","onBlur","onFocus","onClick","pressed","size","value","data-component"]);const q=t.useRef(null),B=t.useRef(o.default()),{handleKeyDown:I,pressedButtonValue:D,onChange:S,allowDeselect:k,isDisabled:z,firstButton:C,childButtonCallbackRef:E,hintTextId:T,size:$,fullWidth:F}=l.useButtonToggleGroupContext(),R=D===x||m,K=q.current===C,M=R||!D&&K,N=v||$,W=p&&!y||a.default(y);return c.default(!(!y&&!p),"Either prop `buttonIcon` must be defined, or this node must have children"),c.default(!(W&&"small"===N),"Cannot render an icon-only button in small size."),e.jsxs(r.default,f(d(f(d({className:"button-toggle","data-button-toggle-internal":!0,"aria-label":s,"aria-labelledby":b,"aria-describedby":T,"aria-pressed":!!R,disabled:O||z,id:B.current,$size:N,$active:!!R,$iconOnly:W,$fullWidth:F,value:x,onFocus:_,onBlur:j,onClick:function(e){null==h||h(e),null==S||S(e,k&&D===x?void 0:x)},onKeyDown:I},M?{tabIndex:0}:{tabIndex:-1}),{ref:e=>{q.current=e,null==E||E(e)}}),P,u.default(w||"button-toggle",P)),{children:[p&&"small"!==N&&e.jsx(i.default,{"aria-hidden":!0,type:p}),y]}))};p.displayName="ButtonToggle",exports.ButtonToggle=p,exports.default=p;
@@ -1,41 +1,11 @@
1
- import { IconType } from "../icon";
2
- export type ButtonToggleIconSizes = "small" | "large";
3
- export declare const heightConfig: {
4
- small: number;
5
- medium: number;
6
- large: number;
7
- };
8
- export declare const fontSizeConfig: {
9
- small: number;
10
- medium: number;
11
- large: number;
12
- };
13
- export declare const paddingConfig: {
14
- small: number;
15
- medium: number;
16
- large: number;
17
- };
18
- declare const StyledButtonToggleContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
19
- export interface StyledButtonToggleProps {
20
- /** The icon to be rendered inside of the button */
21
- buttonIcon?: IconType;
22
- /** Sets the size of the buttonIcon (eg. large) */
23
- buttonIconSize?: ButtonToggleIconSizes;
24
- /** Disable all user interaction. */
1
+ interface StyledButtonToggleProps {
25
2
  disabled?: boolean;
26
- /** ButtonToggle size */
27
- size: "small" | "medium" | "large";
28
- /** Allow button to be deselected when already selected */
29
- allowDeselect?: boolean;
3
+ $size: "small" | "medium" | "large";
4
+ $active?: boolean;
5
+ $iconOnly?: boolean;
6
+ $fullWidth?: boolean;
30
7
  }
31
8
  declare const StyledButtonToggle: import("styled-components").StyledComponent<"button", any, {
32
9
  theme: object;
33
10
  } & StyledButtonToggleProps, "theme">;
34
- export interface StyledButtonToggleIconProps {
35
- /** Sets the size of the buttonIcon (eg. large) */
36
- buttonIconSize?: ButtonToggleIconSizes;
37
- hasContent?: boolean;
38
- }
39
- declare const StyledButtonToggleIcon: import("styled-components").StyledComponent<"div", any, StyledButtonToggleIconProps, never>;
40
- declare const StyledButtonToggleWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
41
- export { StyledButtonToggle, StyledButtonToggleWrapper, StyledButtonToggleIcon, StyledButtonToggleContentWrapper, };
11
+ export default StyledButtonToggle;
@@ -1 +1 @@
1
- "use strict";var o=require("styled-components"),e=require("../icon/icon.style.js"),t=require("../../style/themes/apply-base-theme.js"),r=require("../../style/utils/add-focus-styling.js");function i(o){return o&&o.__esModule?o:{default:o}}var n=i(o);const l={small:24,medium:32,large:40},a={small:14,medium:14,large:16},s={small:8,medium:8,large:12},d={small:72,medium:88,large:120},g={small:"var(--spacing100)",medium:"var(--spacing100) var(--spacing150) var(--spacing000)",large:"var(--spacing100) var(--spacing300)"},c=n.default.div.withConfig({displayName:"button-toggle.style__StyledButtonToggleContentWrapper",componentId:"sc-d02b9d63-0"})(["display:flex;justify-content:center;align-items:center;width:100%;height:100%;flex-flow:wrap;"]),u=n.default.button.attrs(t.default).withConfig({displayName:"button-toggle.style__StyledButtonToggle",componentId:"sc-d02b9d63-1"})(["display:inline-flex;justify-content:center;align-items:center;position:relative;box-sizing:border-box;max-width:100%;font-weight:500;background-color:transparent;cursor:pointer;text-align:center;color:var(--colorsActionMinor500);border:none;","{color:var(--colorsActionMinor500);height:var(--sizing250);width:var(--sizing250);}"," "," &:focus{"," z-index:100;}&:not(:disabled):hover{background-color:var(--colorsActionMinor600);color:var(--colorsActionMinorYang100);",'{color:var(--colorsActionMinorYang100);}}&[aria-pressed="true"]{background-color:var(--colorsActionMinor850);color:var(--colorsActionMinorYang100);',"{color:var(--colorsActionMinorYang100);}","}",""],e.default,(({size:e})=>o.css(["min-height:","px;padding:0 ","px;font-size:","px;"],l[e],s[e],a[e])),(({buttonIcon:e,buttonIconSize:t,size:r})=>e&&"large"===t&&o.css(["min-height:","px;padding:",";flex-direction:column;"],d[r],g[r])),r.default(),e.default,e.default,(({allowDeselect:e})=>!e&&o.css(["cursor:auto;"])),(({disabled:t})=>t&&o.css(["cursor:not-allowed;&{color:var(--button-typical-toggle-label-disabled);",'{color:var(--button-typical-toggle-label-disabled);}}&[aria-pressed="true"]{cursor:not-allowed;background-color:var(--colorsActionMinorYin030);}'],e.default))),p=n.default.div.withConfig({displayName:"button-toggle.style__StyledButtonToggleIcon",componentId:"sc-d02b9d63-2"})([""," ",""],(({hasContent:o})=>o&&"margin-right: 8px;"),(({buttonIconSize:t})=>"large"===t&&o.css(["margin-right:0;","{margin-left:0;margin-right:0;margin-bottom:8px;height:var(--sizing400);width:var(--sizing400);}","::before{font-size:var(--sizing400);line-height:var(--sizing400);}.carbon-icon__svg--credit-card-slash{margin-left:6px;}"],e.default,e.default))),m=n.default.div.withConfig({displayName:"button-toggle.style__StyledButtonToggleWrapper",componentId:"sc-d02b9d63-3"})(["display:inline-block;vertical-align:middle;&&&&{","{border-radius:var(--borderRadius050);}}"],u);exports.StyledButtonToggle=u,exports.StyledButtonToggleContentWrapper=c,exports.StyledButtonToggleIcon=p,exports.StyledButtonToggleWrapper=m,exports.fontSizeConfig=a,exports.heightConfig=l,exports.paddingConfig=s;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a=require("styled-components"),e=require("../../style/themes/apply-base-theme.js"),l=require("../../style/utils/add-focus-styling.js");function t(a){return a&&a.__esModule?a:{default:a}}const o={small:{size:"var(--global-size-xs)",padding:"var(--global-space-comp-2-xs) var(--global-space-comp-s)",borderRadius:"12px"},medium:{size:"var(--global-size-s)",padding:"var(--global-space-comp-xs) var(--global-space-comp-m)",borderRadius:"var(--global-radius-action-l)"},large:{size:"var(--global-size-m)",padding:"var(--global-space-comp-s) var(--global-space-comp-l)",borderRadius:"var(--global-radius-action-xl)"}},s=t(a).default.button.attrs(e.default).withConfig({displayName:"button-toggle.style__StyledButtonToggle",componentId:"sc-c4bff221-0"})(["",""],(({$active:e,$size:t,disabled:s,$iconOnly:r,$fullWidth:c})=>a.css(["display:inline-flex;justify-content:center;align-items:center;flex-wrap:nowrap;white-space:nowrap;cursor:pointer;gap:var(--global-space-comp-s);height:",";"," "," "," border-radius:",";border:none;background-color:transparent;color:var(--button-typical-toggle-label-default);font:var(--global-font-static-comp-medium-m);text-align:center;"," "," ",""],o[t].size,!r&&a.css(["padding:",";"],o[t].padding),r&&a.css(["width:",";"],o[t].size),c&&a.css(["flex:1 1 auto;"]),o[t].borderRadius,e&&a.css(["background:var(--button-typical-toggle-bg-active);color:var(--button-typical-toggle-label-active);"]),s&&a.css(["cursor:not-allowed;color:var(--button-typical-toggle-label-disabled);",""],e&&a.css(["background:var(--button-typical-toggle-bg-active-disabled);color:var(--button-typical-toggle-label-active-disabled);"])),!s&&a.css(["&:focus{","}&:hover{background:var(--button-typical-toggle-bg-hover);color:var(--button-typical-toggle-label-hover);}"],l.default()))));exports.default=s;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("styled-system"),o=require("../../style/themes/apply-base-theme.js"),r=require("../../style/utils/add-focus-styling.js"),i=require("../../style/utils/color.js"),n=require("../../__internal__/dom/globals.js"),s=require("../../__internal__/utils/helpers/browser-type-check/index.js"),l=require("./icon-config.js"),a=require("./icon-unicodes.js"),c=require("../button/__next__/button.style.js");function d(e){return e&&e.__esModule?e:{default:e}}var u=d(e);const f=e.css([""," &{color:currentColor;}.mentions-list-item &&{color:currentColor;}.mentions-list-item:hover &&,.mentions-list-item.selected &&{color:currentColor;}.search &{color:var(--colorsUtilityYin065);&:hover{color:var(--colorsUtilityYin100);}}.search.dark-background:not(.with-button) &{color:var(--colorsUtilityYang080);:hover{color:var(--colorsUtilityYang100);}}.multi-select &,.filterable-select &{cursor:pointer;}"],c.StyledButton),g=u.default.span.attrs(o.default).withConfig({displayName:"icon.style__StyledIcon",componentId:"sc-88df3881-0"})(["",""],(({theme:o,color:c,bg:d,isInteractive:u,bgSize:g,bgShape:m,type:h,fontSize:y,disabled:b,tabIndex:v,inverse:p})=>{let _=p?"var(--container-standard-inverse-icon)":"var(--container-standard-icon)",j="transparent";const q=n.getWindow(),x=n.getNavigator(),S=g?l.default.backgroundSize[g]:void 0;if(b)_="var(--colorsYin030)";else if(c){const{color:e}=i.default({color:c,theme:o});_=e}if(d){const{backgroundColor:e}=i.default({bg:d,theme:o});j=e}return e.css(["position:relative;color:",";background-color:",";vertical-align:middle;align-items:center;display:inline-flex;justify-content:center;height:",";width:",";",";",' &::before{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:CarbonIcons;content:"','";font-style:normal;font-weight:normal;vertical-align:middle;'," "," "," display:block;}"," "," ",""],_,j,S,S,m?`border-radius: ${l.default.backgroundShape[m]}`:"",u&&e.css(["&:not(:focus):hover{filter:brightness(0.9);}"]),a.default[h],y&&e.css(["font-size:",";line-height:",";"],l.default.iconSize[y],l.default.iconSize[y]),q&&"services"===h&&s.default(q)&&e.css(["margin-top:",";"],"small"===y?"-7px":"-8px"),x&&q&&"services"===h&&s.isSafari(x)&&!s.default(q)&&e.css(["margin-top:-6px;"]),void 0!==v&&`\n :focus {\n ${r.default()}\n }\n `,t.margin,f)}));exports.default=g;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("styled-system"),o=require("../../style/themes/apply-base-theme.js"),r=require("../../style/utils/add-focus-styling.js"),i=require("../../style/utils/color.js"),n=require("../../__internal__/dom/globals.js"),s=require("../../__internal__/utils/helpers/browser-type-check/index.js"),l=require("./icon-config.js"),a=require("./icon-unicodes.js"),c=require("../button/__next__/button.style.js");function u(e){return e&&e.__esModule?e:{default:e}}var d=u(e);const f=e.css([""," &{color:currentColor;}.mentions-list-item &&{color:currentColor;}.mentions-list-item:hover &&,.mentions-list-item.selected &&{color:currentColor;}.search &{color:var(--colorsUtilityYin065);&:hover{color:var(--colorsUtilityYin100);}}.search.dark-background:not(.with-button) &{color:var(--colorsUtilityYang080);:hover{color:var(--colorsUtilityYang100);}}.multi-select &,.filterable-select &{cursor:pointer;}.button-toggle &&{color:currentColor;}"],c.StyledButton),g=d.default.span.attrs(o.default).withConfig({displayName:"icon.style__StyledIcon",componentId:"sc-f9838ea5-0"})(["",""],(({theme:o,color:c,bg:u,isInteractive:d,bgSize:g,bgShape:m,type:b,fontSize:h,disabled:y,tabIndex:v,inverse:p})=>{let _=p?"var(--container-standard-inverse-icon)":"var(--container-standard-icon)",j="transparent";const q=n.getWindow(),x=n.getNavigator(),S=g?l.default.backgroundSize[g]:void 0;if(y)_="var(--colorsYin030)";else if(c){const{color:e}=i.default({color:c,theme:o});_=e}if(u){const{backgroundColor:e}=i.default({bg:u,theme:o});j=e}return e.css(["position:relative;color:",";background-color:",";vertical-align:middle;align-items:center;display:inline-flex;justify-content:center;height:",";width:",";",";",' &::before{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:CarbonIcons;content:"','";font-style:normal;font-weight:normal;vertical-align:middle;'," "," "," display:block;}"," "," ",""],_,j,S,S,m?`border-radius: ${l.default.backgroundShape[m]}`:"",d&&e.css(["&:not(:focus):hover{filter:brightness(0.9);}"]),a.default[b],h&&e.css(["font-size:",";line-height:",";"],l.default.iconSize[h],l.default.iconSize[h]),q&&"services"===b&&s.default(q)&&e.css(["margin-top:",";"],"small"===h?"-7px":"-8px"),x&&q&&"services"===b&&s.isSafari(x)&&!s.default(q)&&e.css(["margin-top:-6px;"]),void 0!==v&&`\n :focus {\n ${r.default()}\n }\n `,t.margin,f)}));exports.default=g;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../../../__internal__/utils/helpers/guid/index.js"),o=require("../../../../hooks/__internal__/useLocale/useLocale.js"),n=require("../../../button-toggle/button-toggle.component.js"),u=require("../../../button-toggle/button-toggle-group/button-toggle-group.component.js");function l(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function c(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),o.forEach((function(t){l(e,t,r[t])}))}return e}function a(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const i=({size:l,onChange:i,toggleValue:s,disabled:g,toggleProps:p})=>{const b=o.default(),f=b.time.amText(),d=b.time.pmText(),j=t.useRef(r.default()),{wrapperProps:m,amToggleProps:O,pmToggleProps:y}=p||{},P=t.useCallback((e=>{const t=e.target.value;t!==s&&i(t)}),[s,i]);return e.jsxs(u.default,a(c({},m),{"data-component":"time-button-toggle-group",m:"0px 0px 0px 16px",id:j.current,onChange:P,value:s,disabled:g,children:[e.jsx(n.ButtonToggle,a(c({},O),{"data-component":"am-button-toggle",value:"AM",size:l,children:f})),e.jsx(n.ButtonToggle,a(c({},y),{"data-component":"pm-button-toggle",value:"PM",size:l,children:d}))]}))};i.displayName="Toggle",exports.default=i;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("../../../../__internal__/utils/helpers/guid/index.js"),o=require("../../../../hooks/__internal__/useLocale/useLocale.js"),n=require("../../../button-toggle/button-toggle.component.js"),u=require("../../../button-toggle/button-toggle-group/button-toggle-group.component.js");function l(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function c(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),o.forEach((function(t){l(e,t,r[t])}))}return e}function a(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const g=({size:l,onChange:g,toggleValue:i,disabled:s,toggleProps:p})=>{const b=o.default(),f=b.time.amText(),d=b.time.pmText(),j=t.useRef(r.default()),{wrapperProps:m,amToggleProps:O,pmToggleProps:y}=p||{},P=t.useCallback((e=>{const t=e.target.value;t!==i&&g(t)}),[i,g]);return e.jsxs(u.default,a(c({},m),{"data-component":"time-button-toggle-group",m:"0px 0px 0px 16px",id:j.current,onChange:P,value:i,disabled:s,size:l,children:[e.jsx(n.ButtonToggle,a(c({},O),{"data-component":"am-button-toggle",value:"AM",children:f})),e.jsx(n.ButtonToggle,a(c({},y),{"data-component":"pm-button-toggle",value:"PM",children:d}))]}))};g.displayName="Toggle",exports.default=g;