@primer/react 38.0.0-rc.0 → 38.0.0-rc.09f015db1

package/dist/ToggleSwitch/ToggleSwitch-d5c8dc81.css

@@ -0,0 +1,2 @@
+.prc-ToggleSwitch-ToggleSwitch-E4lp0{--toggleSwitch-transition-duration:80ms;--toggleSwitch-transition-easing:cubic-bezier(0.5,1,0.89,1);align-items:center;display:inline-flex}.prc-ToggleSwitch-ToggleSwitch-E4lp0:where([data-status-label-position=start]){flex-direction:row}.prc-ToggleSwitch-ToggleSwitch-E4lp0:where([data-status-label-position=end]){flex-direction:row-reverse}.prc-ToggleSwitch-LoadingSpinner-jCYtC{display:inline-flex}.prc-ToggleSwitch-LoadingSpinner-jCYtC:where([data-status-label-position=end]){margin-left:var(--base-size-8,.5rem);margin-right:0}.prc-ToggleSwitch-StatusText-hWpj2{color:var(--fgColor-default,var(--color-fg-default));cursor:pointer;font-size:var(--text-body-size-medium,.875rem);margin-left:var(--base-size-8,.5rem);margin-right:var(--base-size-8,.5rem);position:relative}.prc-ToggleSwitch-StatusText-hWpj2:where([data-disabled=true]){color:var(--fgColor-muted,var(--color-fg-muted));cursor:not-allowed}.prc-ToggleSwitch-StatusText-hWpj2:where([data-size=small]){font-size:var(--text-body-size-small,.75rem)}.prc-ToggleSwitch-StatusText-hWpj2:where([data-size=medium]){font-size:var(--text-body-size-medium,.875rem)}.prc-ToggleSwitch-StatusTextItem-fvvXa{display:block;text-align:right}.prc-ToggleSwitch-StatusTextItem-fvvXa:where([data-hidden=true]){height:0;visibility:hidden}.prc-ToggleSwitch-SwitchButton-5LRHX{appearance:none;border-radius:var(--borderRadius-medium,.375rem);border-style:solid;border-width:var(--borderWidth-thin,.0625rem);cursor:pointer;display:block;height:32px;overflow:hidden;padding:0;position:relative;-webkit-text-decoration:none;text-decoration:none;transition-duration:var(--toggleSwitch-transition-duration);transition-property:background-color,border-color;transition-timing-function:var(--toggleSwitch-transition-easing);-webkit-user-select:none;user-select:none;width:64px}.prc-ToggleSwitch-SwitchButton-5LRHX:focus-visible{outline:2px solid var(--focus-outlineColor,var(--color-accent-fg));outline-offset:3px}.prc-ToggleSwitch-SwitchButton-5LRHX:focus:not(:focus-visible){outline:1px solid transparent}@media (pointer:coarse){.prc-ToggleSwitch-SwitchButton-5LRHX:before{content:"";left:0;min-height:44px;position:absolute;right:0;top:50%;transform:translateY(-50%)}}@media (prefers-reduced-motion){.prc-ToggleSwitch-SwitchButton-5LRHX,.prc-ToggleSwitch-SwitchButton-5LRHX *{transition:none}}.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-size=small]){height:24px;width:48px}.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-disabled=true]){background-color:var(--controlTrack-bgColor-disabled,var(--color-switch-track-disabled-bg,#8c959f));border-color:transparent;cursor:not-allowed;transition-property:none}@media (forced-colors:active){.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-disabled=true]){border-color:GrayText}}.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=false]:not([data-disabled=true])){background-color:var(--controlTrack-bgColor-rest,var(--color-switch-track-bg,#eaeef2));border-color:var(--controlTrack-borderColor-rest,var(--color-switch-track-border))}.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=false]:not([data-disabled=true]):focus-visible),.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=false]:not([data-disabled=true]):hover){background-color:var(--controlTrack-bgColor-hover,var(--color-switch-track-hover-bg,#dfe6ec))}.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=false]:not([data-disabled=true]):active),.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=false]:not([data-disabled=true]):active:focus-visible){background-color:var(--controlTrack-bgColor-active,var(--color-switch-track-active-bg,#d9e0e8))}.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=true]:not([data-disabled=true])){background-color:var(--control-checked-bgColor-rest,var(--color-switch-track-checked-bg,#0969da));border-color:var(--control-checked-borderColor-rest,transparent)}.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=true]:not([data-disabled=true]):focus-visible),.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=true]:not([data-disabled=true]):hover){background-color:var(--control-checked-bgColor-hover,var(--color-switch-track-checked-hover-bg,#0860ca))}.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=true]:not([data-disabled=true]):active),.prc-ToggleSwitch-SwitchButton-5LRHX:where([data-checked=true]:not([data-disabled=true]):active:focus-visible){background-color:var(--control-checked-bgColor-active,var(--color-switch-track-checked-active-bg,#0757ba))}.prc-ToggleSwitch-SwitchButtonContent-nv4lE{align-items:center;display:flex;height:100%;overflow:hidden;width:100%}.prc-ToggleSwitch-IconContainer-zLC02{flex-basis:50%;flex-grow:1;flex-shrink:0;line-height:0;transition-duration:var(--toggleSwitch-transition-duration);transition-property:transform;transition-timing-function:var(--toggleSwitch-transition-easing)}@media (prefers-reduced-motion){.prc-ToggleSwitch-IconContainer-zLC02{transition:none}}.prc-ToggleSwitch-LineIconContainer-7sQm8{color:var(--control-checked-fgColor-rest,var(--color-switch-track-checked-fg,#fff))}.prc-ToggleSwitch-LineIconContainer-7sQm8:where([data-disabled=true]){color:var(--control-checked-fgColor-disabled,var(--color-switch-track-checked-disabled-fg,#fff))}.prc-ToggleSwitch-LineIconContainer-7sQm8:where([data-checked=true]){transform:translateX(0)}.prc-ToggleSwitch-LineIconContainer-7sQm8:where([data-checked=false]){transform:translateX(-100%)}.prc-ToggleSwitch-CircleIconContainer-gHYvi{color:var(--controlTrack-fgColor-rest,var(--color-switch-track-fg,#656d76))}.prc-ToggleSwitch-CircleIconContainer-gHYvi:where([data-disabled=true]){color:var(--controlTrack-fgColor-disabled,var(--color-switch-track-disabled-fg,#fff))}.prc-ToggleSwitch-CircleIconContainer-gHYvi:where([data-checked=true]){transform:translateX(100%)}.prc-ToggleSwitch-CircleIconContainer-gHYvi:where([data-checked=false]){transform:translateX(0)}.prc-ToggleSwitch-ToggleKnob-2e7Rm{background-color:var(--controlKnob-bgColor-rest,var(--color-switch-knob-bg,#fff));border-color:var(--controlKnob-borderColor-rest,var(--color-switch-knob-border,#858f99));border-radius:calc(var(--borderRadius-medium,.375rem) - var(--borderWidth-thin,.0625rem));border-style:solid;border-width:var(--borderWidth-thin,.0625rem);bottom:0;position:absolute;top:0;transition-duration:var(--toggleSwitch-transition-duration);transition-property:transform;transition-timing-function:var(--toggleSwitch-transition-easing);width:50%;z-index:1}@media (prefers-reduced-motion){.prc-ToggleSwitch-ToggleKnob-2e7Rm{transition:none}}.prc-ToggleSwitch-ToggleKnob-2e7Rm:where([data-checked=false]){transform:translateX(0)}.prc-ToggleSwitch-ToggleKnob-2e7Rm:where([data-checked=true]){border-color:var(--controlKnob-borderColor-checked,var(--color-switch-knob-checked-border,#0969da));transform:translateX(100%)}.prc-ToggleSwitch-ToggleKnob-2e7Rm:where([data-disabled=true]){background-color:var(--controlKnob-bgColor-disabled,var(--color-btn-bg));border-color:var(--controlTrack-bgColor-disabled,var(--color-switch-track-disabled-bg,#8c959f))}@media (forced-colors:active){.prc-ToggleSwitch-ToggleKnob-2e7Rm:where([data-disabled=true]){color:GrayText}}
+/*# sourceMappingURL=ToggleSwitch-d5c8dc81.css.map */

package/dist/ToggleSwitch/ToggleSwitch-d5c8dc81.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/ToggleSwitch/ToggleSwitch.module.css"],"names":[],"mappings":"AAAA,qCACE,uCAAwC,CACxC,2DAA+D,CAG/D,kBAAmB,CADnB,mBAEF,CAEA,+EACE,kBACF,CAEA,6EACE,0BACF,CAEA,uCACE,mBACF,CAEA,+EAEE,oCAA+B,CAD/B,cAEF,CAEA,mCAIE,oDAA6B,CAE7B,cAAe,CADf,8CAAuC,CAJvC,oCAA+B,CAC/B,qCAAgC,CAChC,iBAIF,CAEA,+DAEE,gDAA2B,CAD3B,kBAEF,CAEA,4DACE,4CACF,CAEA,6DACE,8CACF,CAEA,uCACE,aAAc,CACd,gBACF,CAEA,iEAEE,QAAS,CADT,iBAEF,CAEA,qCAGE,eAAgB,CAMhB,gDAAyC,CACzC,kBAAmB,CACnB,6CAAqC,CAVrC,cAAe,CAWf,aAAc,CAKd,WAAY,CAHZ,eAAgB,CAThB,SAAU,CAQV,iBAAkB,CATlB,4BAAqB,CAArB,oBAAqB,CAGrB,2DAA4D,CAD5D,iDAAmD,CAEnD,gEAAiE,CANjE,wBAAiB,CAAjB,gBAAiB,CAgBjB,UAiCF,CA9BE,mDACE,kEAA4C,CAC5C,kBACF,CAEA,+DACE,6BACF,CAGA,wBACE,4CACE,UAAW,CAEX,MAAO,CAIP,eAAgB,CALhB,iBAAkB,CAElB,OAAQ,CAER,OAAQ,CADR,0BAGF,CACF,CAGA,gCAGE,4EACE,eACF,CACF,CAIF,8DACE,WAAY,CACZ,UACF,CAGA,iEAEE,mGAAsG,CACtG,wBAAyB,CACzB,kBAAmB,CACnB,wBAKF,CAHE,8BAPF,iEAQI,qBAEJ,CADE,CAGF,2FAEE,sFAAyF,CACzF,kFACF,CAEA,0MAGE,6FACF,CAEA,kNAGE,+FACF,CAEA,0FAEE,iGAAoG,CACpG,gEACF,CAEA,wMAGE,wGACF,CAEA,gNAGE,0GACF,CAEA,4CAEE,kBAAmB,CADnB,YAAa,CAGb,WAAY,CACZ,eAAgB,CAFhB,UAGF,CAEA,sCAGE,cAAe,CAFf,WAAY,CACZ,aAAc,CAGd,aAAc,CAEd,2DAA4D,CAD5D,6BAA8B,CAE9B,gEAKF,CAHE,gCAVF,sCAWI,eAEJ,CADE,CAGF,0CAEE,mFACF,CAEA,sEAEE,gGACF,CAEA,qEACE,uBACF,CAEA,sEACE,2BACF,CAEA,4CAEE,2EACF,CAEA,wEAEE,qFACF,CAEA,uEACE,0BACF,CAEA,wEACE,uBACF,CAEA,mCAEE,iFAAoF,CAIpF,wFAA2F,CAG3F,yFAAyE,CALzE,kBAAmB,CADnB,6CAAqC,CAUrC,QAAS,CAFT,iBAAkB,CAClB,KAAM,CAGN,2DAA4D,CAD5D,6BAA8B,CAE9B,gEAAiE,CANjE,SAAU,CAOV,SAKF,CAHE,gCAnBF,mCAoBI,eAEJ,CADE,CAGF,+DACE,uBACF,CAEA,8DAGE,mGAAsG,CAFtG,0BAGF,CAEA,+DACE,wEAAqD,CAErD,+FAKF,CAHE,8BALF,+DAMI,cAEJ,CADE","file":"ToggleSwitch-d5c8dc81.css","sourcesContent":[".ToggleSwitch {\n  --toggleSwitch-transition-duration: 80ms;\n  --toggleSwitch-transition-easing: cubic-bezier(0.5, 1, 0.89, 1);\n\n  display: inline-flex;\n  align-items: center;\n}\n\n.ToggleSwitch:where([data-status-label-position='start']) {\n  flex-direction: row;\n}\n\n.ToggleSwitch:where([data-status-label-position='end']) {\n  flex-direction: row-reverse;\n}\n\n.LoadingSpinner {\n  display: inline-flex;\n}\n\n.LoadingSpinner:where([data-status-label-position='end']) {\n  margin-right: 0;\n  margin-left: var(--base-size-8);\n}\n\n.StatusText {\n  margin-left: var(--base-size-8);\n  margin-right: var(--base-size-8);\n  position: relative;\n  color: var(--fgColor-default);\n  font-size: var(--text-body-size-medium);\n  cursor: pointer;\n}\n\n.StatusText:where([data-disabled='true']) {\n  cursor: not-allowed;\n  color: var(--fgColor-muted);\n}\n\n.StatusText:where([data-size='small']) {\n  font-size: var(--text-body-size-small);\n}\n\n.StatusText:where([data-size='medium']) {\n  font-size: var(--text-body-size-medium);\n}\n\n.StatusTextItem {\n  display: block;\n  text-align: right;\n}\n\n.StatusTextItem:where([data-hidden='true']) {\n  visibility: hidden;\n  height: 0;\n}\n\n.SwitchButton {\n  cursor: pointer;\n  user-select: none;\n  appearance: none;\n  text-decoration: none;\n  padding: 0;\n  transition-property: background-color, border-color;\n  transition-duration: var(--toggleSwitch-transition-duration);\n  transition-timing-function: var(--toggleSwitch-transition-easing);\n  border-radius: var(--borderRadius-medium);\n  border-style: solid;\n  border-width: var(--borderWidth-thin);\n  display: block;\n  position: relative;\n  overflow: hidden;\n\n  /* Default medium size */\n  height: 32px;\n  width: 64px;\n\n  /* Focus styles */\n  &:focus-visible {\n    outline: 2px solid var(--focus-outlineColor);\n    outline-offset: 3px;\n  }\n\n  &:focus:not(:focus-visible) {\n    outline: solid 1px transparent;\n  }\n\n  /* Touch device support */\n  @media (pointer: coarse) {\n    &::before {\n      content: '';\n      position: absolute;\n      left: 0;\n      right: 0;\n      transform: translateY(-50%);\n      top: 50%;\n      min-height: 44px;\n    }\n  }\n\n  /* Reduced motion support */\n  @media (prefers-reduced-motion) {\n    transition: none;\n\n    * {\n      transition: none;\n    }\n  }\n}\n\n/* Size variants */\n.SwitchButton:where([data-size='small']) {\n  height: 24px;\n  width: 48px;\n}\n\n/* State variants */\n.SwitchButton:where([data-disabled='true']) {\n  /* stylelint-disable-next-line primer/colors */\n  background-color: var(--controlTrack-bgColor-disabled, var(--color-switch-track-disabled-bg, #8c959f));\n  border-color: transparent;\n  cursor: not-allowed;\n  transition-property: none;\n\n  @media (forced-colors: active) {\n    border-color: GrayText;\n  }\n}\n\n.SwitchButton:where([data-checked='false']:not([data-disabled='true'])) {\n  /* stylelint-disable-next-line primer/colors */\n  background-color: var(--controlTrack-bgColor-rest, var(--color-switch-track-bg, #eaeef2));\n  border-color: var(--controlTrack-borderColor-rest);\n}\n\n.SwitchButton:where([data-checked='false']:not([data-disabled='true']):hover),\n.SwitchButton:where([data-checked='false']:not([data-disabled='true']):focus-visible) {\n  /* stylelint-disable-next-line primer/colors */\n  background-color: var(--controlTrack-bgColor-hover, var(--color-switch-track-hover-bg, hsla(210deg, 24%, 90%, 1)));\n}\n\n.SwitchButton:where([data-checked='false']:not([data-disabled='true']):active),\n.SwitchButton:where([data-checked='false']:not([data-disabled='true']):active:focus-visible) {\n  /* stylelint-disable-next-line primer/colors */\n  background-color: var(--controlTrack-bgColor-active, var(--color-switch-track-active-bg, hsla(210deg, 24%, 88%, 1)));\n}\n\n.SwitchButton:where([data-checked='true']:not([data-disabled='true'])) {\n  /* stylelint-disable-next-line primer/colors */\n  background-color: var(--control-checked-bgColor-rest, var(--color-switch-track-checked-bg, #0969da));\n  border-color: var(--control-checked-borderColor-rest, transparent);\n}\n\n.SwitchButton:where([data-checked='true']:not([data-disabled='true']):hover),\n.SwitchButton:where([data-checked='true']:not([data-disabled='true']):focus-visible) {\n  /* stylelint-disable-next-line primer/colors */\n  background-color: var(--control-checked-bgColor-hover, var(--color-switch-track-checked-hover-bg, #0860ca));\n}\n\n.SwitchButton:where([data-checked='true']:not([data-disabled='true']):active),\n.SwitchButton:where([data-checked='true']:not([data-disabled='true']):active:focus-visible) {\n  /* stylelint-disable-next-line primer/colors */\n  background-color: var(--control-checked-bgColor-active, var(--color-switch-track-checked-active-bg, #0757ba));\n}\n\n.SwitchButtonContent {\n  display: flex;\n  align-items: center;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n\n.IconContainer {\n  flex-grow: 1;\n  flex-shrink: 0;\n  flex-basis: 50%;\n  /* stylelint-disable-next-line primer/typography */\n  line-height: 0;\n  transition-property: transform;\n  transition-duration: var(--toggleSwitch-transition-duration);\n  transition-timing-function: var(--toggleSwitch-transition-easing);\n\n  @media (prefers-reduced-motion) {\n    transition: none;\n  }\n}\n\n.LineIconContainer {\n  /* stylelint-disable-next-line primer/colors */\n  color: var(--control-checked-fgColor-rest, var(--color-switch-track-checked-fg, #fff));\n}\n\n.LineIconContainer:where([data-disabled='true']) {\n  /* stylelint-disable-next-line primer/colors */\n  color: var(--control-checked-fgColor-disabled, var(--color-switch-track-checked-disabled-fg, #fff));\n}\n\n.LineIconContainer:where([data-checked='true']) {\n  transform: translateX(0);\n}\n\n.LineIconContainer:where([data-checked='false']) {\n  transform: translateX(-100%);\n}\n\n.CircleIconContainer {\n  /* stylelint-disable-next-line primer/colors */\n  color: var(--controlTrack-fgColor-rest, var(--color-switch-track-fg, #656d76));\n}\n\n.CircleIconContainer:where([data-disabled='true']) {\n  /* stylelint-disable-next-line primer/colors */\n  color: var(--controlTrack-fgColor-disabled, var(--color-switch-track-disabled-fg, #fff));\n}\n\n.CircleIconContainer:where([data-checked='true']) {\n  transform: translateX(100%);\n}\n\n.CircleIconContainer:where([data-checked='false']) {\n  transform: translateX(0);\n}\n\n.ToggleKnob {\n  /* stylelint-disable-next-line primer/colors */\n  background-color: var(--controlKnob-bgColor-rest, var(--color-switch-knob-bg, #fff));\n  border-width: var(--borderWidth-thin);\n  border-style: solid;\n  /* stylelint-disable-next-line primer/colors */\n  border-color: var(--controlKnob-borderColor-rest, var(--color-switch-knob-border, #858f99));\n  /* Use calc to account for 1px border around the control */\n  /* stylelint-disable-next-line primer/borders */\n  border-radius: calc(var(--borderRadius-medium) - var(--borderWidth-thin));\n  width: 50%;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  transition-property: transform;\n  transition-duration: var(--toggleSwitch-transition-duration);\n  transition-timing-function: var(--toggleSwitch-transition-easing);\n  z-index: 1;\n\n  @media (prefers-reduced-motion) {\n    transition: none;\n  }\n}\n\n.ToggleKnob:where([data-checked='false']) {\n  transform: translateX(0);\n}\n\n.ToggleKnob:where([data-checked='true']) {\n  transform: translateX(100%);\n  /* stylelint-disable-next-line primer/colors */\n  border-color: var(--controlKnob-borderColor-checked, var(--color-switch-knob-checked-border, #0969da));\n}\n\n.ToggleKnob:where([data-disabled='true']) {\n  background-color: var(--controlKnob-bgColor-disabled);\n  /* stylelint-disable-next-line primer/colors */\n  border-color: var(--controlTrack-bgColor-disabled, var(--color-switch-track-disabled-bg, #8c959f));\n\n  @media (forced-colors: active) {\n    color: GrayText;\n  }\n}\n"]}

package/dist/ToggleSwitch/ToggleSwitch.d.ts

@@ -0,0 +1,44 @@
+import type { MouseEventHandler } from 'react';
+import React from 'react';
+import type { CellAlignment } from '../DataTable/column';
+export interface ToggleSwitchProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** The id of the DOM node that labels the switch */
+    ['aria-labelledby']: string;
+    /** Uncontrolled - whether the switch is turned on */
+    defaultChecked?: boolean;
+    /** Whether the switch is ready for user input */
+    disabled?: boolean;
+    /** Whether the switch's value is being calculated */
+    loading?: boolean;
+    /** Whether the switch is turned on */
+    checked?: boolean;
+    /** The callback that is called when the switch is toggled on or off */
+    onChange?: (checked: boolean) => void;
+    /** The callback that is called when the switch is clicked */
+    onClick?: MouseEventHandler;
+    /** Size of the switch */
+    size?: 'small' | 'medium';
+    /** Whether the "on" and "off" labels should appear before or after the switch.
+     * **This should only be changed when the switch's alignment needs to be adjusted.** For example: It needs to be left-aligned because the label appears above it and the caption appears below it.
+     */
+    statusLabelPosition?: CellAlignment;
+    /**
+     * If the switch is in the loading state, this value controls the amount of delay in milliseconds before
+     * the `loadingLabel` is announced to screen readers.
+     * @default 2000
+     */
+    loadingLabelDelay?: number;
+    /** The text to describe what is loading. It should be descriptive and not verbose.
+     * This is primarily used for AT (screen readers) to convey what is currently loading.
+     */
+    loadingLabel?: string;
+    /** type of button to account for behavior when added to a form*/
+    buttonType?: 'button' | 'submit' | 'reset';
+    /** Text to display when the toggle switch is in the 'on' position. Defaults to 'On'. Only customize this label if there is a more specific label for the context. For example, you might use 'Show' if the setting is 'Show images'. */
+    buttonLabelOn?: string;
+    /** Text to display when the toggle switch is in the 'off' position. Defaults to 'Off'. Only customize this label if there is a more specific label for the context. For example, you might use 'Hide' if the setting is 'Show images'. */
+    buttonLabelOff?: string;
+}
+declare const ToggleSwitch: React.ForwardRefExoticComponent<ToggleSwitchProps & React.RefAttributes<HTMLButtonElement>>;
+export default ToggleSwitch;
+//# sourceMappingURL=ToggleSwitch.d.ts.map

package/dist/ToggleSwitch/ToggleSwitch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleSwitch.d.ts","sourceRoot":"","sources":["../../src/ToggleSwitch/ToggleSwitch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAC5C,OAAO,KAA+B,MAAM,OAAO,CAAA;AAKnD,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAA;AAKtD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC/F,oDAAoD;IACpD,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC3B,qDAAqD;IACrD,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,iDAAiD;IACjD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,qDAAqD;IACrD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,sCAAsC;IACtC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,6DAA6D;IAC7D,OAAO,CAAC,EAAE,iBAAiB,CAAA;IAC3B,yBAAyB;IACzB,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACzB;;OAEG;IACH,mBAAmB,CAAC,EAAE,aAAa,CAAA;IACnC;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,iEAAiE;IACjE,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IAC1C,wOAAwO;IACxO,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,0OAA0O;IAC1O,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AA8BD,QAAA,MAAM,YAAY,6FAgIhB,CAAA;AAMF,eAAe,YAAY,CAAA"}

package/dist/ToggleSwitch/ToggleSwitch.js

@@ -0,0 +1,475 @@
+import { c } from 'react-compiler-runtime';
+import React, { useEffect } from 'react';
+import { clsx } from 'clsx';
+import VisuallyHidden from '../_VisuallyHidden.js';
+import useSafeTimeout from '../hooks/useSafeTimeout.js';
+import classes from './ToggleSwitch.module.css.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useProvidedStateOrCreate } from '../hooks/useProvidedStateOrCreate.js';
+import { useId } from '../hooks/useId.js';
+import { AriaStatus } from '../live-region/AriaStatus.js';
+import Spinner from '../Spinner/Spinner.js';
+
+const CircleIcon = t0 => {
+  const $ = c(4);
+  const {
+    size
+  } = t0;
+  const t1 = size === "small" ? "12" : "16";
+  const t2 = size === "small" ? "12" : "16";
+  let t3;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = /*#__PURE__*/jsx("path", {
+      fillRule: "evenodd",
+      d: "M8 12.5a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9ZM8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12Z"
+    });
+    $[0] = t3;
+  } else {
+    t3 = $[0];
+  }
+  let t4;
+  if ($[1] !== t1 || $[2] !== t2) {
+    t4 = /*#__PURE__*/jsx("svg", {
+      "aria-hidden": "true",
+      width: t1,
+      height: t2,
+      viewBox: "0 0 16 16",
+      fill: "currentColor",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: t3
+    });
+    $[1] = t1;
+    $[2] = t2;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  return t4;
+};
+const LineIcon = t0 => {
+  const $ = c(4);
+  const {
+    size
+  } = t0;
+  const t1 = size === "small" ? "12" : "16";
+  const t2 = size === "small" ? "12" : "16";
+  let t3;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = /*#__PURE__*/jsx("path", {
+      fillRule: "evenodd",
+      d: "M8 2a.75.75 0 0 1 .75.75v11.5a.75.75 0 0 1-1.5 0V2.75A.75.75 0 0 1 8 2Z"
+    });
+    $[0] = t3;
+  } else {
+    t3 = $[0];
+  }
+  let t4;
+  if ($[1] !== t1 || $[2] !== t2) {
+    t4 = /*#__PURE__*/jsx("svg", {
+      "aria-hidden": "true",
+      width: t1,
+      height: t2,
+      viewBox: "0 0 16 16",
+      fill: "currentColor",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: t3
+    });
+    $[1] = t1;
+    $[2] = t2;
+    $[3] = t4;
+  } else {
+    t4 = $[3];
+  }
+  return t4;
+};
+const ToggleSwitch = /*#__PURE__*/React.forwardRef(function ToggleSwitch(props, ref) {
+  var _buttonLabelOn, _buttonLabelOff;
+  const $ = c(95);
+  let ariaDescribedby;
+  let ariaLabelledby;
+  let buttonLabelOff;
+  let buttonLabelOn;
+  let checked;
+  let className;
+  let defaultChecked;
+  let disabled;
+  let loading;
+  let onChange;
+  let onClick;
+  let rest;
+  let t0;
+  let t1;
+  let t2;
+  let t3;
+  let t4;
+  if ($[0] !== props) {
+    ({
+      "aria-labelledby": ariaLabelledby,
+      "aria-describedby": ariaDescribedby,
+      defaultChecked,
+      disabled,
+      loading,
+      checked,
+      onChange,
+      onClick,
+      buttonType: t0,
+      size: t1,
+      statusLabelPosition: t2,
+      loadingLabelDelay: t3,
+      loadingLabel: t4,
+      className,
+      buttonLabelOn,
+      buttonLabelOff,
+      ...rest
+    } = props);
+    $[0] = props;
+    $[1] = ariaDescribedby;
+    $[2] = ariaLabelledby;
+    $[3] = buttonLabelOff;
+    $[4] = buttonLabelOn;
+    $[5] = checked;
+    $[6] = className;
+    $[7] = defaultChecked;
+    $[8] = disabled;
+    $[9] = loading;
+    $[10] = onChange;
+    $[11] = onClick;
+    $[12] = rest;
+    $[13] = t0;
+    $[14] = t1;
+    $[15] = t2;
+    $[16] = t3;
+    $[17] = t4;
+  } else {
+    ariaDescribedby = $[1];
+    ariaLabelledby = $[2];
+    buttonLabelOff = $[3];
+    buttonLabelOn = $[4];
+    checked = $[5];
+    className = $[6];
+    defaultChecked = $[7];
+    disabled = $[8];
+    loading = $[9];
+    onChange = $[10];
+    onClick = $[11];
+    rest = $[12];
+    t0 = $[13];
+    t1 = $[14];
+    t2 = $[15];
+    t3 = $[16];
+    t4 = $[17];
+  }
+  const buttonType = t0 === undefined ? "button" : t0;
+  const size = t1 === undefined ? "medium" : t1;
+  const statusLabelPosition = t2 === undefined ? "start" : t2;
+  const loadingLabelDelay = t3 === undefined ? 2000 : t3;
+  const loadingLabel = t4 === undefined ? "Loading" : t4;
+  const isControlled = typeof checked !== "undefined";
+  const [isOn, setIsOn] = useProvidedStateOrCreate(checked, onChange, Boolean(defaultChecked));
+  const acceptsInteraction = !disabled && !loading;
+  const [isLoadingLabelVisible, setIsLoadingLabelVisible] = React.useState(false);
+  const loadingLabelId = useId("loadingLabel");
+  const {
+    safeSetTimeout
+  } = useSafeTimeout();
+  let t5;
+  if ($[18] !== disabled || $[19] !== isControlled || $[20] !== isOn || $[21] !== loading || $[22] !== onClick || $[23] !== setIsOn) {
+    t5 = e => {
+      if (disabled || loading) {
+        return;
+      }
+      if (!isControlled) {
+        setIsOn(!isOn);
+      }
+      onClick && onClick(e);
+    };
+    $[18] = disabled;
+    $[19] = isControlled;
+    $[20] = isOn;
+    $[21] = loading;
+    $[22] = onClick;
+    $[23] = setIsOn;
+    $[24] = t5;
+  } else {
+    t5 = $[24];
+  }
+  const handleToggleClick = t5;
+  let t6;
+  let t7;
+  if ($[25] !== checked || $[26] !== disabled || $[27] !== isControlled || $[28] !== onChange) {
+    t6 = () => {
+      if (onChange && isControlled && !disabled) {
+        onChange(Boolean(checked));
+      }
+    };
+    t7 = [onChange, checked, isControlled, disabled];
+    $[25] = checked;
+    $[26] = disabled;
+    $[27] = isControlled;
+    $[28] = onChange;
+    $[29] = t6;
+    $[30] = t7;
+  } else {
+    t6 = $[29];
+    t7 = $[30];
+  }
+  useEffect(t6, t7);
+  let t8;
+  let t9;
+  if ($[31] !== isLoadingLabelVisible || $[32] !== loading || $[33] !== loadingLabelDelay || $[34] !== safeSetTimeout) {
+    t8 = () => {
+      if (!loading && isLoadingLabelVisible) {
+        setIsLoadingLabelVisible(false);
+      } else {
+        if (loading && !isLoadingLabelVisible) {
+          safeSetTimeout(() => {
+            setIsLoadingLabelVisible(true);
+          }, loadingLabelDelay);
+        }
+      }
+    };
+    t9 = [loading, isLoadingLabelVisible, loadingLabelDelay, safeSetTimeout];
+    $[31] = isLoadingLabelVisible;
+    $[32] = loading;
+    $[33] = loadingLabelDelay;
+    $[34] = safeSetTimeout;
+    $[35] = t8;
+    $[36] = t9;
+  } else {
+    t8 = $[35];
+    t9 = $[36];
+  }
+  useEffect(t8, t9);
+  let switchButtonDescribedBy = loadingLabelId;
+  if (ariaDescribedby) {
+    switchButtonDescribedBy = `${switchButtonDescribedBy} ${ariaDescribedby}`;
+  }
+  let t10;
+  if ($[37] !== className) {
+    t10 = clsx(classes.ToggleSwitch, className);
+    $[37] = className;
+    $[38] = t10;
+  } else {
+    t10 = $[38];
+  }
+  const t11 = isLoadingLabelVisible && loadingLabel;
+  let t12;
+  if ($[39] !== loadingLabelId || $[40] !== t11) {
+    t12 = /*#__PURE__*/jsx(VisuallyHidden, {
+      children: /*#__PURE__*/jsx(AriaStatus, {
+        announceOnShow: true,
+        id: loadingLabelId,
+        children: t11
+      })
+    });
+    $[39] = loadingLabelId;
+    $[40] = t11;
+    $[41] = t12;
+  } else {
+    t12 = $[41];
+  }
+  let t13;
+  if ($[42] !== loading || $[43] !== statusLabelPosition) {
+    t13 = loading ? /*#__PURE__*/jsx("div", {
+      className: classes.LoadingSpinner,
+      "data-status-label-position": statusLabelPosition,
+      children: /*#__PURE__*/jsx(Spinner, {
+        size: "small",
+        srText: null
+      })
+    }) : null;
+    $[42] = loading;
+    $[43] = statusLabelPosition;
+    $[44] = t13;
+  } else {
+    t13 = $[44];
+  }
+  const t14 = !acceptsInteraction;
+  const t15 = !isOn;
+  const t16 = (_buttonLabelOn = buttonLabelOn) !== null && _buttonLabelOn !== void 0 ? _buttonLabelOn : "On";
+  let t17;
+  if ($[45] !== t15 || $[46] !== t16) {
+    t17 = /*#__PURE__*/jsx("span", {
+      className: classes.StatusTextItem,
+      "data-hidden": t15,
+      children: t16
+    });
+    $[45] = t15;
+    $[46] = t16;
+    $[47] = t17;
+  } else {
+    t17 = $[47];
+  }
+  const t18 = (_buttonLabelOff = buttonLabelOff) !== null && _buttonLabelOff !== void 0 ? _buttonLabelOff : "Off";
+  let t19;
+  if ($[48] !== isOn || $[49] !== t18) {
+    t19 = /*#__PURE__*/jsx("span", {
+      className: classes.StatusTextItem,
+      "data-hidden": isOn,
+      children: t18
+    });
+    $[48] = isOn;
+    $[49] = t18;
+    $[50] = t19;
+  } else {
+    t19 = $[50];
+  }
+  let t20;
+  if ($[51] !== handleToggleClick || $[52] !== size || $[53] !== t14 || $[54] !== t17 || $[55] !== t19) {
+    t20 = /*#__PURE__*/jsxs("span", {
+      className: classes.StatusText,
+      "data-size": size,
+      "data-disabled": t14,
+      "aria-hidden": "true",
+      onClick: handleToggleClick,
+      children: [t17, t19]
+    });
+    $[51] = handleToggleClick;
+    $[52] = size;
+    $[53] = t14;
+    $[54] = t17;
+    $[55] = t19;
+    $[56] = t20;
+  } else {
+    t20 = $[56];
+  }
+  const t21 = !acceptsInteraction;
+  const t22 = isLoadingLabelVisible || ariaDescribedby ? switchButtonDescribedBy : undefined;
+  const t23 = !acceptsInteraction;
+  const t24 = !acceptsInteraction;
+  let t25;
+  if ($[57] !== size) {
+    t25 = /*#__PURE__*/jsx(LineIcon, {
+      size: size
+    });
+    $[57] = size;
+    $[58] = t25;
+  } else {
+    t25 = $[58];
+  }
+  let t26;
+  if ($[59] !== isOn || $[60] !== t24 || $[61] !== t25) {
+    t26 = /*#__PURE__*/jsx("div", {
+      className: `${classes.IconContainer} ${classes.LineIconContainer}`,
+      "data-checked": isOn,
+      "data-disabled": t24,
+      children: t25
+    });
+    $[59] = isOn;
+    $[60] = t24;
+    $[61] = t25;
+    $[62] = t26;
+  } else {
+    t26 = $[62];
+  }
+  const t27 = !acceptsInteraction;
+  let t28;
+  if ($[63] !== size) {
+    t28 = /*#__PURE__*/jsx(CircleIcon, {
+      size: size
+    });
+    $[63] = size;
+    $[64] = t28;
+  } else {
+    t28 = $[64];
+  }
+  let t29;
+  if ($[65] !== isOn || $[66] !== t27 || $[67] !== t28) {
+    t29 = /*#__PURE__*/jsx("div", {
+      className: `${classes.IconContainer} ${classes.CircleIconContainer}`,
+      "data-checked": isOn,
+      "data-disabled": t27,
+      children: t28
+    });
+    $[65] = isOn;
+    $[66] = t27;
+    $[67] = t28;
+    $[68] = t29;
+  } else {
+    t29 = $[68];
+  }
+  let t30;
+  if ($[69] !== t26 || $[70] !== t29) {
+    t30 = /*#__PURE__*/jsxs("div", {
+      className: classes.SwitchButtonContent,
+      "aria-hidden": "true",
+      children: [t26, t29]
+    });
+    $[69] = t26;
+    $[70] = t29;
+    $[71] = t30;
+  } else {
+    t30 = $[71];
+  }
+  const t31 = !acceptsInteraction;
+  let t32;
+  if ($[72] !== isOn || $[73] !== t31) {
+    t32 = /*#__PURE__*/jsx("div", {
+      className: classes.ToggleKnob,
+      "data-checked": isOn,
+      "data-disabled": t31,
+      "aria-hidden": "true"
+    });
+    $[72] = isOn;
+    $[73] = t31;
+    $[74] = t32;
+  } else {
+    t32 = $[74];
+  }
+  let t33;
+  if ($[75] !== ariaLabelledby || $[76] !== buttonType || $[77] !== handleToggleClick || $[78] !== isOn || $[79] !== ref || $[80] !== size || $[81] !== t21 || $[82] !== t22 || $[83] !== t23 || $[84] !== t30 || $[85] !== t32) {
+    t33 = /*#__PURE__*/jsxs("button", {
+      ref: ref,
+      type: buttonType,
+      className: classes.SwitchButton,
+      "data-size": size,
+      "data-checked": isOn,
+      "data-disabled": t21,
+      onClick: handleToggleClick,
+      "aria-labelledby": ariaLabelledby,
+      "aria-describedby": t22,
+      "aria-pressed": isOn,
+      "aria-disabled": t23,
+      children: [t30, t32]
+    });
+    $[75] = ariaLabelledby;
+    $[76] = buttonType;
+    $[77] = handleToggleClick;
+    $[78] = isOn;
+    $[79] = ref;
+    $[80] = size;
+    $[81] = t21;
+    $[82] = t22;
+    $[83] = t23;
+    $[84] = t30;
+    $[85] = t32;
+    $[86] = t33;
+  } else {
+    t33 = $[86];
+  }
+  let t34;
+  if ($[87] !== rest || $[88] !== statusLabelPosition || $[89] !== t10 || $[90] !== t12 || $[91] !== t13 || $[92] !== t20 || $[93] !== t33) {
+    t34 = /*#__PURE__*/jsxs("div", {
+      className: t10,
+      "data-status-label-position": statusLabelPosition,
+      ...rest,
+      children: [t12, t13, t20, t33]
+    });
+    $[87] = rest;
+    $[88] = statusLabelPosition;
+    $[89] = t10;
+    $[90] = t12;
+    $[91] = t13;
+    $[92] = t20;
+    $[93] = t33;
+    $[94] = t34;
+  } else {
+    t34 = $[94];
+  }
+  return t34;
+});
+if (process.env.NODE_ENV !== "production") {
+  ToggleSwitch.displayName = 'ToggleSwitch';
+}
+
+export { ToggleSwitch as default };

package/dist/ToggleSwitch/ToggleSwitch.module.css.js

@@ -0,0 +1,5 @@
+import './ToggleSwitch-d5c8dc81.css';
+
+var classes = {"ToggleSwitch":"prc-ToggleSwitch-ToggleSwitch-E4lp0","LoadingSpinner":"prc-ToggleSwitch-LoadingSpinner-jCYtC","StatusText":"prc-ToggleSwitch-StatusText-hWpj2","StatusTextItem":"prc-ToggleSwitch-StatusTextItem-fvvXa","SwitchButton":"prc-ToggleSwitch-SwitchButton-5LRHX","SwitchButtonContent":"prc-ToggleSwitch-SwitchButtonContent-nv4lE","IconContainer":"prc-ToggleSwitch-IconContainer-zLC02","LineIconContainer":"prc-ToggleSwitch-LineIconContainer-7sQm8","CircleIconContainer":"prc-ToggleSwitch-CircleIconContainer-gHYvi","ToggleKnob":"prc-ToggleSwitch-ToggleKnob-2e7Rm"};
+
+export { classes as default };

package/dist/ToggleSwitch/ToggleSwitchStoryWrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleSwitchStoryWrapper.d.ts","sourceRoot":"","sources":["../../src/ToggleSwitch/ToggleSwitchStoryWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,QAAA,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAE/D,CAAA;AAED,eAAe,wBAAwB,CAAA"}

package/dist/Token/IssueLabelToken-a5fe569e.css

@@ -0,0 +1,2 @@
+.prc-Token-IssueLabel-ZuoEW{--label-r:153;--label-g:153;--label-b:153;--label-h:0;--label-s:0;--label-l:60;--perceived-lightness:calc(var(--label-r)*0.2126/255 + var(--label-g)*0.7152/255 + var(--label-b)*0.0722/255);--lightness-switch:max(0,min(calc((var(--perceived-lightness) - var(--lightness-threshold))*-1000),1));border-style:solid;border-width:var(--borderWidth-thin,.0625rem);position:relative}@media (prefers-color-scheme:light){[data-color-mode=auto][data-light-theme*=light] .prc-Token-IssueLabel-ZuoEW{--lightness-threshold:0.453;--border-threshold:0.96;--border-alpha:max(0,min(calc((var(--perceived-lightness) - var(--border-threshold))*100),1));background:rgb(var(--label-r),var(--label-g),var(--label-b));border-color:hsla(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) - 25)*1%),var(--border-alpha));color:hsl(0deg,0%,calc(var(--lightness-switch)*100%))}:is([data-color-mode=auto][data-light-theme*=light] .prc-Token-IssueLabel-ZuoEW):where([data-selected=true]){background:hsl(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) - 5)*1%))}:is([data-color-mode=auto][data-light-theme*=light] .prc-Token-IssueLabel-ZuoEW):where([data-selected=true]):after{box-shadow:0 0 0 2px rgb(var(--label-r),var(--label-g),var(--label-b))}:is([data-color-mode=auto][data-light-theme*=light] .prc-Token-IssueLabel-ZuoEW):where([data-cursor-is-interactive=true]:hover){background-image:linear-gradient(rgba(0,0,0,.15),rgba(0,0,0,.15)),linear-gradient(rgb(var(--label-r),var(--label-g),var(--label-b)),rgb(var(--label-r),var(--label-g),var(--label-b)));box-shadow:var(--shadow-resting-medium,var(--color-shadow-medium))}[data-color-mode=auto][data-light-theme*=dark] .prc-Token-IssueLabel-ZuoEW{--lightness-threshold:0.6;--background-alpha:0.18;--border-alpha:0.3;--lighten-by:calc((var(--lightness-threshold) - var(--perceived-lightness))*100*var(--lightness-switch));background:rgba(var(--label-r),var(--label-g),var(--label-b),var(--background-alpha));border-color:hsla(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + var(--lighten-by))*1%),var(--border-alpha));color:hsl(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + var(--lighten-by))*1%))}:is([data-color-mode=auto][data-light-theme*=dark] .prc-Token-IssueLabel-ZuoEW):where([data-selected=true]):after{box-shadow:0 0 0 2px hsl(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + var(--lighten-by))*1%))}:is([data-color-mode=auto][data-light-theme*=dark] .prc-Token-IssueLabel-ZuoEW):where([data-cursor-is-interactive=true]:hover){background:hsla(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + 10)*1%),.3);box-shadow:var(--shadow-resting-medium,var(--color-shadow-medium))}}@media (prefers-color-scheme:dark){[data-color-mode=auto][data-dark-theme*=light] .prc-Token-IssueLabel-ZuoEW{--lightness-threshold:0.453;--border-threshold:0.96;--border-alpha:max(0,min(calc((var(--perceived-lightness) - var(--border-threshold))*100),1));background:rgb(var(--label-r),var(--label-g),var(--label-b));border-color:hsla(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) - 25)*1%),var(--border-alpha));color:hsl(0deg,0%,calc(var(--lightness-switch)*100%))}:is([data-color-mode=auto][data-dark-theme*=light] .prc-Token-IssueLabel-ZuoEW):where([data-selected=true]){background:hsl(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) - 5)*1%))}:is([data-color-mode=auto][data-dark-theme*=light] .prc-Token-IssueLabel-ZuoEW):where([data-selected=true]):after{box-shadow:0 0 0 2px rgb(var(--label-r),var(--label-g),var(--label-b))}:is([data-color-mode=auto][data-dark-theme*=light] .prc-Token-IssueLabel-ZuoEW):where([data-cursor-is-interactive=true]:hover){background-image:linear-gradient(rgba(0,0,0,.15),rgba(0,0,0,.15)),linear-gradient(rgb(var(--label-r),var(--label-g),var(--label-b)),rgb(var(--label-r),var(--label-g),var(--label-b)));box-shadow:var(--shadow-resting-medium,var(--color-shadow-medium))}[data-color-mode=auto][data-dark-theme*=dark] .prc-Token-IssueLabel-ZuoEW{--lightness-threshold:0.6;--background-alpha:0.18;--border-alpha:0.3;--lighten-by:calc((var(--lightness-threshold) - var(--perceived-lightness))*100*var(--lightness-switch));background:rgba(var(--label-r),var(--label-g),var(--label-b),var(--background-alpha));border-color:hsla(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + var(--lighten-by))*1%),var(--border-alpha));color:hsl(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + var(--lighten-by))*1%))}:is([data-color-mode=auto][data-dark-theme*=dark] .prc-Token-IssueLabel-ZuoEW):where([data-selected=true]):after{box-shadow:0 0 0 2px hsl(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + var(--lighten-by))*1%))}:is([data-color-mode=auto][data-dark-theme*=dark] .prc-Token-IssueLabel-ZuoEW):where([data-cursor-is-interactive=true]:hover){background:hsla(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + 10)*1%),.3);box-shadow:var(--shadow-resting-medium,var(--color-shadow-medium))}}[data-color-mode=light] .prc-Token-IssueLabel-ZuoEW{--lightness-threshold:0.453;--border-threshold:0.96;--border-alpha:max(0,min(calc((var(--perceived-lightness) - var(--border-threshold))*100),1));background:rgb(var(--label-r),var(--label-g),var(--label-b));border-color:hsla(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) - 25)*1%),var(--border-alpha));color:hsl(0deg,0%,calc(var(--lightness-switch)*100%))}:is([data-color-mode=light] .prc-Token-IssueLabel-ZuoEW):where([data-selected=true]){background:hsl(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) - 5)*1%))}:is([data-color-mode=light] .prc-Token-IssueLabel-ZuoEW):where([data-selected=true]):after{box-shadow:0 0 0 2px rgb(var(--label-r),var(--label-g),var(--label-b))}:is([data-color-mode=light] .prc-Token-IssueLabel-ZuoEW):where([data-cursor-is-interactive=true]:hover){background-image:linear-gradient(rgba(0,0,0,.15),rgba(0,0,0,.15)),linear-gradient(rgb(var(--label-r),var(--label-g),var(--label-b)),rgb(var(--label-r),var(--label-g),var(--label-b)));box-shadow:var(--shadow-resting-medium,var(--color-shadow-medium))}[data-color-mode=dark] .prc-Token-IssueLabel-ZuoEW{--lightness-threshold:0.6;--background-alpha:0.18;--border-alpha:0.3;--lighten-by:calc((var(--lightness-threshold) - var(--perceived-lightness))*100*var(--lightness-switch));background:rgba(var(--label-r),var(--label-g),var(--label-b),var(--background-alpha));border-color:hsla(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + var(--lighten-by))*1%),var(--border-alpha));color:hsl(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + var(--lighten-by))*1%))}:is([data-color-mode=dark] .prc-Token-IssueLabel-ZuoEW):where([data-selected=true]):after{box-shadow:0 0 0 2px hsl(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + var(--lighten-by))*1%))}:is([data-color-mode=dark] .prc-Token-IssueLabel-ZuoEW):where([data-cursor-is-interactive=true]:hover){background:hsla(var(--label-h),calc(var(--label-s)*1%),calc((var(--label-l) + 10)*1%),.3);box-shadow:var(--shadow-resting-medium,var(--color-shadow-medium))}.prc-Token-IssueLabel-ZuoEW:where([data-selected=true]){outline:none}.prc-Token-IssueLabel-ZuoEW:where([data-selected=true]):after{border-radius:var(--borderRadius-full,624.9375rem);bottom:calc(var(--base-size-2,.125rem)*-1);content:"";display:block;left:calc(var(--base-size-2,.125rem)*-1);pointer-events:none;position:absolute;right:calc(var(--base-size-2,.125rem)*-1);top:calc(var(--base-size-2,.125rem)*-1);z-index:1}.prc-Token-IssueLabel-ZuoEW:where([data-has-remove-button=true]){padding-right:0}.prc-Token-RemoveButton-H4Dmg:where([data-has-multiple-action-targets=true]){position:relative;z-index:1}
+/*# sourceMappingURL=IssueLabelToken-a5fe569e.css.map */

package/dist/Token/IssueLabelToken-a5fe569e.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Token/IssueLabelToken.module.css"],"names":[],"mappings":"AA4DA,4BAEE,aAAc,CACd,aAAc,CACd,aAAc,CACd,WAAY,CACZ,WAAY,CACZ,YAAa,CACb,6GAEC,CACD,sGAA2G,CAI3G,kBAAmB,CADnB,6CAAqC,CADrC,iBAGF,CAEA,oCACE,4EA7EA,2BAA4B,CAC5B,uBAAwB,CACxB,6FAAkG,CAElG,4DAA+D,CAE/D,4GAAoH,CADpH,qDA0EA,CAtEA,6GACE,oFACF,CAEA,mHAEE,sEACF,CAGA,gIACE,sLAIG,CACH,kEACF,CAuDA,2EAnDA,yBAA0B,CAC1B,uBAAwB,CACxB,kBAAmB,CACnB,wGAA+G,CAE/G,qFAAyF,CAEzF,2HAKC,CAND,+FA+CA,CAtCA,kHAEE,8GAEF,CAGA,+HACE,yFAAsG,CACtG,kEACF,CA6BF,CAEA,mCACE,2EAvFA,2BAA4B,CAC5B,uBAAwB,CACxB,6FAAkG,CAElG,4DAA+D,CAE/D,4GAAoH,CADpH,qDAoFA,CAhFA,4GACE,oFACF,CAEA,kHAEE,sEACF,CAGA,+HACE,sLAIG,CACH,kEACF,CAiEA,0EA7DA,yBAA0B,CAC1B,uBAAwB,CACxB,kBAAmB,CACnB,wGAA+G,CAE/G,qFAAyF,CAEzF,2HAKC,CAND,+FAyDA,CAhDA,iHAEE,8GAEF,CAGA,8HACE,yFAAsG,CACtG,kEACF,CAuCF,CAGA,oDAjGE,2BAA4B,CAC5B,uBAAwB,CACxB,6FAAkG,CAElG,4DAA+D,CAE/D,4GAAoH,CADpH,qDA8FF,CA1FE,qFACE,oFACF,CAEA,2FAEE,sEACF,CAGA,wGACE,sLAIG,CACH,kEACF,CA4EF,mDAxEE,yBAA0B,CAC1B,uBAAwB,CACxB,kBAAmB,CACnB,wGAA+G,CAE/G,qFAAyF,CAEzF,2HAKC,CAND,+FAoEF,CA3DE,0FAEE,8GAEF,CAGA,uGACE,yFAAsG,CACtG,kEACF,CAqDF,wDACE,YACF,CAEA,8DAUE,kDAAuC,CAJvC,0CAAqC,CALrC,UAAW,CAOX,aAAc,CADd,wCAAmC,CAEnC,mBAAoB,CAPpB,iBAAkB,CAGlB,yCAAoC,CADpC,uCAAkC,CADlC,SAQF,CAGA,iEACE,eACF,CAEA,6EACE,iBAAkB,CAClB,SACF","file":"IssueLabelToken-a5fe569e.css","sourcesContent":["/* stylelint-disable primer/colors */\n@define-mixin lightThemeIssueLabel {\n  --lightness-threshold: 0.453;\n  --border-threshold: 0.96;\n  --border-alpha: max(0, min(calc((var(--perceived-lightness) - var(--border-threshold)) * 100), 1));\n\n  background: rgb(var(--label-r), var(--label-g), var(--label-b));\n  color: hsl(0deg, 0%, calc(var(--lightness-switch) * 100%));\n  border-color: hsla(var(--label-h), calc(var(--label-s) * 1%), calc((var(--label-l) - 25) * 1%), var(--border-alpha));\n\n  /* Selected state */\n  &:where([data-selected='true']) {\n    background: hsl(var(--label-h), calc(var(--label-s) * 1%), calc((var(--label-l) - 5) * 1%));\n  }\n\n  &:where([data-selected='true'])::after {\n    /* stylelint-disable-next-line primer/box-shadow */\n    box-shadow: 0 0 0 2px rgb(var(--label-r), var(--label-g), var(--label-b));\n  }\n\n  /* Interactive hover states */\n  &:where([data-cursor-is-interactive='true']:hover) {\n    background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)),\n      linear-gradient(\n        rgb(var(--label-r), var(--label-g), var(--label-b)),\n        rgb(var(--label-r), var(--label-g), var(--label-b))\n      );\n    box-shadow: var(--shadow-resting-medium);\n  }\n}\n\n@define-mixin darkThemeIssueLabel {\n  --lightness-threshold: 0.6;\n  --background-alpha: 0.18;\n  --border-alpha: 0.3;\n  --lighten-by: calc(((var(--lightness-threshold) - var(--perceived-lightness)) * 100) * var(--lightness-switch));\n\n  background: rgba(var(--label-r), var(--label-g), var(--label-b), var(--background-alpha));\n  color: hsl(var(--label-h), calc(var(--label-s) * 1%), calc((var(--label-l) + var(--lighten-by)) * 1%));\n  border-color: hsla(\n    var(--label-h),\n    calc(var(--label-s) * 1%),\n    calc((var(--label-l) + var(--lighten-by)) * 1%),\n    var(--border-alpha)\n  );\n\n  /* Selected state */\n  &:where([data-selected='true'])::after {\n    /* stylelint-disable-next-line primer/box-shadow */\n    box-shadow: 0 0 0 2px\n      hsl(var(--label-h), calc(var(--label-s) * 1%), calc((var(--label-l) + var(--lighten-by)) * 1%));\n  }\n\n  /* Interactive hover states */\n  &:where([data-cursor-is-interactive='true']:hover) {\n    background: hsla(var(--label-h), calc(var(--label-s) * 1%), calc(calc(var(--label-l) + 10) * 1%), 0.3);\n    box-shadow: var(--shadow-resting-medium);\n  }\n}\n\n.IssueLabel {\n  /* Color variables - dynamically set via inline CSS custom properties */\n  --label-r: 153;\n  --label-g: 153;\n  --label-b: 153;\n  --label-h: 0;\n  --label-s: 0;\n  --label-l: 60;\n  --perceived-lightness: calc(\n    ((var(--label-r) * 0.2126) + (var(--label-g) * 0.7152) + (var(--label-b) * 0.0722)) / 255\n  );\n  --lightness-switch: max(0, min(calc((var(--perceived-lightness) - var(--lightness-threshold)) * -1000), 1));\n\n  position: relative;\n  border-width: var(--borderWidth-thin);\n  border-style: solid;\n}\n\n@media (prefers-color-scheme: light) {\n  [data-color-mode='auto'][data-light-theme*='light'] .IssueLabel {\n    @mixin lightThemeIssueLabel;\n  }\n\n  [data-color-mode='auto'][data-light-theme*='dark'] .IssueLabel {\n    @mixin darkThemeIssueLabel;\n  }\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-color-mode='auto'][data-dark-theme*='light'] .IssueLabel {\n    @mixin lightThemeIssueLabel;\n  }\n\n  [data-color-mode='auto'][data-dark-theme*='dark'] .IssueLabel {\n    @mixin darkThemeIssueLabel;\n  }\n}\n\n/* Light mode styles */\n[data-color-mode='light'] .IssueLabel {\n  @mixin lightThemeIssueLabel;\n}\n\n/* Dark mode styles */\n[data-color-mode='dark'] .IssueLabel {\n  @mixin darkThemeIssueLabel;\n}\n\n/* Selected state */\n\n.IssueLabel:where([data-selected='true']) {\n  outline: none;\n}\n\n.IssueLabel:where([data-selected='true'])::after {\n  content: '';\n  position: absolute;\n  z-index: 1;\n  top: calc(var(--base-size-2) * -1);\n  right: calc(var(--base-size-2) * -1);\n  bottom: calc(var(--base-size-2) * -1);\n  left: calc(var(--base-size-2) * -1);\n  display: block;\n  pointer-events: none;\n  border-radius: var(--borderRadius-full);\n}\n\n/* Remove button styling */\n.IssueLabel:where([data-has-remove-button='true']) {\n  padding-right: 0;\n}\n\n.RemoveButton:where([data-has-multiple-action-targets='true']) {\n  position: relative;\n  z-index: 1;\n}\n"]}

package/dist/Token/IssueLabelToken.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IssueLabelToken.d.ts","sourceRoot":"","sources":["../../src/Token/IssueLabelToken.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,aAAa,CAAA;AAK/C,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAI/F,MAAM,WAAW,oBAAqB,SAAQ,cAAc;IAC1D;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,QAAA,MAAM,eAAe,EAsEf,8BAA8B,CAAC,MAAM,GAAG,GAAG,GAAG,QAAQ,EAAE,oBAAoB,CAAC,CAAA;AAEnF,eAAe,eAAe,CAAA"}