@primer/react 38.0.0-rc.0 → 38.0.0-rc.1

package/dist/components.css

@@ -3774,91 +3774,6 @@ span wrapping svg or text */
   }
 }
 
-@keyframes prc_shimmer_DB3-6 {
-  from {
-    mask-position: 200%;
-  }
-
-  to {
-    mask-position: 0%;
-  }
-}
-
-.prc_SkeletonBox_nSZk3 {
-  display: block;
-  height: 1rem;
-  background-color: var(--skeletonLoader-bgColor);
-  border-radius: var(--borderRadius-small);
-  animation: prc_shimmer_DB3-6;
-
-  @media (prefers-reduced-motion: no-preference) {
-    mask-image: linear-gradient(75deg, #000 30%, rgba(0, 0, 0, 0.65) 80%);
-    mask-size: 200%;
-    animation: prc_shimmer_DB3-6;
-    animation-duration: var(--base-duration-1000);
-    animation-iteration-count: infinite;
-  }
-
-  @media (forced-colors: active) {
-    outline: 1px solid transparent;
-    outline-offset: -1px;
-  }
-}
-
-.prc_SkeletonAvatar_inefu {
-  &:where([data-component='SkeletonAvatar']) {
-    display: inline-block;
-    width: var(--avatarSize-regular);
-    height: var(--avatarSize-regular);
-    /* stylelint-disable-next-line primer/typography */
-    line-height: 1;
-    border-radius: 50%;
-  }
-
-  &:where([data-square]) {
-    /* stylelint-disable-next-line primer/borders */
-    border-radius: clamp(4px, var(--avatarSize-regular) - 24px, var(--borderRadius-medium));
-  }
-
-  &:where([data-responsive]) {
-    @media screen and (--viewportRange-narrow) {
-      width: var(--avatarSize-narrow);
-      height: var(--avatarSize-narrow);
-    }
-
-    @media screen and (--viewportRange-regular) {
-      width: var(--avatarSize-regular);
-      height: var(--avatarSize-regular);
-    }
-
-    @media screen and (--viewportRange-wide) {
-      width: var(--avatarSize-wide);
-      height: var(--avatarSize-wide);
-    }
-  }
-}
-
-.prc_AvatarPair_-TX3Y {
-  position: relative;
-  display: inline-flex;
-
-  [data-component='Avatar']:last-child,
-  [data-component='SkeletonAvatar']:last-child {
-    position: absolute;
-    right: -15%;
-    bottom: -9%;
-    box-shadow: var(--avatar-shadow);
-  }
-
-  [data-component='SkeletonAvatar']:last-child {
-    box-shadow: inset var(--avatar-shadow);
-  }
-}
-
-.prc_AvatarChild_8YokH {
-  background-color: var(--bgColor-default);
-}
-
 .prc_BranchName_jFtg- {
   display: inline-block;
   padding: var(--base-size-2) var(--base-size-6);
@@ -4191,11 +4106,48 @@ span wrapping svg or text */
   transform: translateY(-50%);
 }
 
+@keyframes prc_shimmer_DB3-6 {
+  from {
+    mask-position: 200%;
+  }
+
+  to {
+    mask-position: 0%;
+  }
+}
+
+.prc_SkeletonBox_nSZk3 {
+  display: block;
+  height: 1rem;
+  background-color: var(--skeletonLoader-bgColor);
+  border-radius: var(--borderRadius-small);
+  animation: prc_shimmer_DB3-6;
+
+  @media (prefers-reduced-motion: no-preference) {
+    mask-image: linear-gradient(75deg, #000 30%, rgba(0, 0, 0, 0.65) 80%);
+    mask-size: 200%;
+    animation: prc_shimmer_DB3-6;
+    animation-duration: var(--base-duration-1000);
+    animation-iteration-count: infinite;
+  }
+
+  @media (forced-colors: active) {
+    outline: 1px solid transparent;
+    outline-offset: -1px;
+  }
+}
+
 .prc_LoadingSkeleton_x9WXt {
   /* stylelint-disable-next-line primer/borders */
   border-radius: 4px;
 }
 
+.prc_Root_S5E74 {
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+
 .prc_Container_2A9NQ {
   display: flex;
   height: 100%;
@@ -5858,6 +5810,10 @@ span wrapping svg or text */
   justify-content: space-between;
 }
 
+.prc_Icon_NuDm4 {
+  margin-right: var(--base-size-4);
+}
+
 .prc_SubNav_rjui0 {
   display: flex;
   justify-content: space-between;
@@ -5928,6 +5884,90 @@ span wrapping svg or text */
   }
 }
 
+.prc_ToggleSwitch_E4lp0 {
+  display: inline-flex;
+  align-items: center;
+  flex-direction: row-reverse;
+}
+
+.prc_ToggleSwitch_E4lp0[data-status-label-position='start'] {
+  flex-direction: row;
+}
+
+.prc_StatusText_hWpj2 {
+  margin-left: var(--base-size-8);
+  margin-right: var(--base-size-8);
+  position: relative;
+  color: var(--fgColor-default);
+  font-size: var(--text-body-size-medium);
+  cursor: pointer;
+}
+
+.prc_StatusText_hWpj2[data-size='small'] {
+  font-size: var(--text-body-size-small);
+}
+
+.prc_StatusText_hWpj2[data-disabled='true'] {
+  color: var(--fgColor-muted);
+  cursor: not-allowed;
+}
+
+.prc_StatusTextItem_fvvXa {
+  text-align: right;
+}
+
+.prc_StatusTextItem_fvvXa[data-hidden='true'] {
+  visibility: hidden;
+  height: 0;
+}
+
+.prc_IconContainer_zLC02 {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+.prc_IconBox_NNOYG {
+  flex-grow: 1;
+  flex-shrink: 0;
+  flex-basis: 50%;
+  /* stylelint-disable-next-line primer/typography */
+  line-height: 0;
+  transition-property: transform;
+  transition-duration: 80ms;
+}
+
+.prc_IconBox_NNOYG[data-type='on'] {
+  color: var(--control-checked-fgColor-rest, var(--color-switch-track-checked-fg, var(--fgColor-onEmphasis)));
+  transform: translateX(0);
+}
+
+.prc_IconBox_NNOYG[data-type='on'][data-checked='false'] {
+  transform: translateX(-100%);
+}
+
+.prc_IconBox_NNOYG[data-type='on'][data-disabled='true'] {
+  color: var(
+    --control-checked-fgColor-disabled,
+    var(--color-switch-track-checked-disabled-fg, var(--fgColor-onEmphasis))
+  );
+}
+
+.prc_IconBox_NNOYG[data-type='off'] {
+  color: var(--controlTrack-fgColor-rest, var(--color-switch-track-fg, var(--fgColor-muted)));
+  transform: translateX(100%);
+}
+
+.prc_IconBox_NNOYG[data-type='off'][data-checked='false'] {
+  transform: translateX(0);
+}
+
+.prc_IconBox_NNOYG[data-type='off'][data-disabled='true'] {
+  color: var(--controlTrack-fgColor-disabled, var(--color-switch-track-disabled-fg, var(--fgColor-onEmphasis)));
+}
+
 .prc_Timeline_iQjcc {
   display: flex;
   flex-direction: column;
@@ -6037,43 +6077,6 @@ span wrapping svg or text */
   z-index: 1;
 }
 
-:root {
-  --spacing: calc(var(--base-size-4) * 2);
-}
-
-.prc_AvatarContainer_dBasr {
-  display: block;
-}
-
-.prc_Avatar_A1uRI {
-  width: 100%;
-  height: 100%;
-}
-
-.prc_Token_8GtFN {
-  padding-left: var(--base-size-4) !important;
-}
-
-.prc_AvatarContainer_dBasr:where([data-size='small']) {
-  width: calc(16px - var(--spacing));
-  height: calc(16px - var(--spacing));
-}
-
-.prc_AvatarContainer_dBasr:where([data-size='medium']) {
-  width: calc(20px - var(--spacing));
-  height: calc(20px - var(--spacing));
-}
-
-.prc_AvatarContainer_dBasr:where([data-size='large']) {
-  width: calc(24px - var(--spacing));
-  height: calc(24px - var(--spacing));
-}
-
-.prc_AvatarContainer_dBasr:where([data-size='xlarge']) {
-  width: calc(32px - var(--spacing));
-  height: calc(32px - var(--spacing));
-}
-
 .prc_TreeViewRootUlStyles_eZtxW {
   padding: 0;
   margin: 0;
@@ -6341,6 +6344,39 @@ span wrapping svg or text */
   width: var(--tree-item-loading-width, 67%);
 }
 
+.prc_SkeletonAvatar_inefu {
+  &:where([data-component='SkeletonAvatar']) {
+    display: inline-block;
+    width: var(--avatarSize-regular);
+    height: var(--avatarSize-regular);
+    /* stylelint-disable-next-line primer/typography */
+    line-height: 1;
+    border-radius: 50%;
+  }
+
+  &:where([data-square]) {
+    /* stylelint-disable-next-line primer/borders */
+    border-radius: clamp(4px, var(--avatarSize-regular) - 24px, var(--borderRadius-medium));
+  }
+
+  &:where([data-responsive]) {
+    @media screen and (--viewportRange-narrow) {
+      width: var(--avatarSize-narrow);
+      height: var(--avatarSize-narrow);
+    }
+
+    @media screen and (--viewportRange-regular) {
+      width: var(--avatarSize-regular);
+      height: var(--avatarSize-regular);
+    }
+
+    @media screen and (--viewportRange-wide) {
+      width: var(--avatarSize-wide);
+      height: var(--avatarSize-wide);
+    }
+  }
+}
+
 .prc_SkeletonText_tW5nH {
   --font-size: var(--text-body-size-medium);
   --line-height: var(--text-body-lineHeight-medium);

package/generated/components.json

@@ -796,7 +796,7 @@
       "stories": [
         {
           "id": "components-anchoredoverlay--default",
-          "code": "() => {\n  const [open, setOpen] = useState(false)\n  return (\n    <AnchoredOverlay\n      open={open}\n      onOpen={() => setOpen(true)}\n      onClose={() => setOpen(false)}\n      renderAnchor={(props) => <Button {...props}>Button</Button>}\n      overlayProps={{\n        role: 'dialog',\n        'aria-modal': true,\n        'aria-label': 'User Card Overlay',\n        sx: {\n          minWidth: '320px',\n        },\n      }}\n      focusZoneSettings={{\n        disabled: true,\n      }}\n      preventOverflow={false}\n    >\n      {hoverCard}\n    </AnchoredOverlay>\n  )\n}"
+          "code": "() => {\n  const [open, setOpen] = useState(false)\n  return (\n    <AnchoredOverlay\n      open={open}\n      onOpen={() => setOpen(true)}\n      onClose={() => setOpen(false)}\n      renderAnchor={(props) => <Button {...props}>Button</Button>}\n      overlayProps={{\n        role: 'dialog',\n        'aria-modal': true,\n        'aria-label': 'User Card Overlay',\n        style: {\n          minWidth: '320px',\n        },\n      }}\n      focusZoneSettings={{\n        disabled: true,\n      }}\n      preventOverflow={false}\n    >\n      {hoverCard}\n    </AnchoredOverlay>\n  )\n}"
         },
         {
           "id": "components-anchoredoverlay-features--portal-inside-scrolling-element",
@@ -4444,7 +4444,7 @@
       "stories": [
         {
           "id": "private-components-overlay--default",
-          "code": "(args: Args) => {\n  const [isOpen, setIsOpen] = useState(false)\n  const buttonRef = useRef<HTMLButtonElement>(null)\n  const confirmButtonRef = useRef<HTMLButtonElement>(null)\n  const anchorRef = useRef<HTMLDivElement>(null)\n  const closeOverlay = () => setIsOpen(false)\n  const containerRef = useRef<HTMLDivElement>(null)\n  useFocusTrap({\n    containerRef,\n    disabled: !isOpen,\n  })\n  return (\n    <Box ref={anchorRef}>\n      <Button\n        ref={buttonRef}\n        onClick={() => {\n          setIsOpen(!isOpen)\n        }}\n      >\n        Open overlay\n      </Button>\n      {isOpen || args.open ? (\n        <Overlay\n          initialFocusRef={confirmButtonRef}\n          returnFocusRef={buttonRef}\n          ignoreClickRefs={[buttonRef]}\n          onEscape={closeOverlay}\n          onClickOutside={closeOverlay}\n          width=\"large\"\n          anchorSide=\"inside-right\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-label=\"Sample overlay\"\n          ref={containerRef}\n        >\n          <Box\n            sx={{\n              height: '100vh',\n              maxWidth: 'calc(-1rem + 100vw)',\n              display: 'flex',\n              justifyContent: 'center',\n              alignItems: 'center',\n            }}\n          >\n            <IconButton\n              aria-label=\"Close\"\n              onClick={closeOverlay}\n              icon={XIcon}\n              variant=\"invisible\"\n              sx={{\n                position: 'absolute',\n                left: '5px',\n                top: '5px',\n              }}\n            />\n            <Text>Look! an overlay</Text>\n          </Box>\n        </Overlay>\n      ) : null}\n    </Box>\n  )\n}"
+          "code": "(args: Args) => {\n  const [isOpen, setIsOpen] = useState(false)\n  const buttonRef = useRef<HTMLButtonElement>(null)\n  const confirmButtonRef = useRef<HTMLButtonElement>(null)\n  const anchorRef = useRef<HTMLDivElement>(null)\n  const closeOverlay = () => setIsOpen(false)\n  const containerRef = useRef<HTMLDivElement>(null)\n  useFocusTrap({\n    containerRef,\n    disabled: !isOpen,\n  })\n  return (\n    <div ref={anchorRef}>\n      <Button\n        ref={buttonRef}\n        onClick={() => {\n          setIsOpen(!isOpen)\n        }}\n      >\n        Open overlay\n      </Button>\n      {isOpen || args.open ? (\n        <Overlay\n          initialFocusRef={confirmButtonRef}\n          returnFocusRef={buttonRef}\n          ignoreClickRefs={[buttonRef]}\n          onEscape={closeOverlay}\n          onClickOutside={closeOverlay}\n          width=\"large\"\n          anchorSide=\"inside-right\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-label=\"Sample overlay\"\n          ref={containerRef}\n        >\n          <div className={classes.FullHeightContent}>\n            <IconButton\n              aria-label=\"Close\"\n              onClick={closeOverlay}\n              icon={XIcon}\n              variant=\"invisible\"\n              className={classes.CloseButtonOverlay}\n            />\n            <Text>Look! an overlay</Text>\n          </div>\n        </Overlay>\n      ) : null}\n    </div>\n  )\n}"
         },
         {
           "id": "private-components-overlay-features--dialog-overlay",
@@ -6899,9 +6899,8 @@
       "importPath": "@primer/react",
       "props": [
         {
-          "name": "sx",
-          "type": "SystemStyleObject",
-          "deprecated": true
+          "name": "className",
+          "type": "string"
         }
       ],
       "subcomponents": [
@@ -6937,11 +6936,6 @@
               "type": "| boolean | { narrow?: boolean regular?: boolean wide?: boolean }",
               "defaultValue": "false",
               "description": "Whether the header is hidden."
-            },
-            {
-              "name": "sx",
-              "type": "SystemStyleObject",
-              "deprecated": true
             }
           ]
         },
@@ -6977,11 +6971,6 @@
               "type": "| boolean | { narrow?: boolean regular?: boolean wide?: boolean }",
               "defaultValue": "false",
               "description": "Whether the content is hidden."
-            },
-            {
-              "name": "sx",
-              "type": "SystemStyleObject",
-              "deprecated": true
             }
           ]
         },
@@ -7057,11 +7046,6 @@
               "type": "'end' | 'start' | {narrow?: 'end' | 'start', narrow?: 'end' | 'start', wide?: 'end' | 'start'}",
               "description": "Which side of the page the pane should be on. Can be changed for different viewport widths.",
               "defaultValue": "start"
-            },
-            {
-              "name": "sx",
-              "type": "SystemStyleObject",
-              "deprecated": true
             }
           ]
         },
@@ -7097,11 +7081,6 @@
               "type": "| boolean | { narrow?: boolean regular?: boolean wide?: boolean }",
               "defaultValue": "false",
               "description": "Whether the footer is hidden."
-            },
-            {
-              "name": "sx",
-              "type": "SystemStyleObject",
-              "deprecated": true
             }
           ]
         }
@@ -7253,11 +7232,6 @@
           "name": "status",
           "type": "'issueOpened' | 'issueClosed' | 'issueClosedNotPlanned' | 'pullOpened' | 'pullClosed' | 'pullMerged' | 'draft' | 'issueDraft' | 'unavailable' | 'open' | 'closed'",
           "required": true
-        },
-        {
-          "name": "sx",
-          "type": "SystemStyleObject",
-          "deprecated": true
         }
       ],
       "subcomponents": []
@@ -8339,56 +8313,6 @@
               "deprecated": true
             }
           ]
-        },
-        {
-          "name": "AvatarToken",
-          "props": [
-            {
-              "name": "avatarSrc",
-              "type": "string"
-            },
-            {
-              "name": "text",
-              "required": true,
-              "type": "string",
-              "description": "The text label inside the token"
-            },
-            {
-              "name": "as",
-              "type": "'button' | 'a' | 'span'",
-              "defaultValue": "'span'"
-            },
-            {
-              "name": "onRemove",
-              "type": "() => void",
-              "description": "The function that gets called when a user clicks the remove button, or keys `Backspace` or `Delete` when focused on the token"
-            },
-            {
-              "name": "hideRemoveButton",
-              "type": "boolean",
-              "description": "Whether the remove button should be rendered in the token"
-            },
-            {
-              "name": "isSelected",
-              "type": "boolean",
-              "description": "Whether the token is selected"
-            },
-            {
-              "name": "id",
-              "type": "number | string",
-              "description": "A unique identifier that can be associated with the token"
-            },
-            {
-              "name": "size",
-              "type": "'small' | 'medium' | 'large' | 'xlarge'",
-              "description": "Which size the token will be rendered at"
-            },
-            {
-              "name": "sx",
-              "type": "SystemStyleObject",
-              "deprecated": true
-            }
-          ]
         }
       ]
     },
@@ -8939,42 +8863,6 @@
         }
       ]
     },
-    "avatar_pair": {
-      "source": "https://github.com/primer/react/tree/main/packages/react/src/deprecated/AvatarPair",
-      "id": "avatar_pair",
-      "name": "AvatarPair",
-      "status": "alpha",
-      "a11yReviewed": "2025-01-08",
-      "stories": [
-        {
-          "id": "components-avatarpair--default",
-          "code": "() => (\n  <AvatarPair>\n    <Avatar\n      src=\"https://avatars.githubusercontent.com/u/7143434?v=4\"\n      alt=\"Primer avatar, parent\"\n    />\n    <Avatar\n      src=\"https://avatars.githubusercontent.com/primer\"\n      alt=\"Primer avatar, child\"\n    />\n  </AvatarPair>\n)"
-        },
-        {
-          "id": "components-avatarpair-features--parent-circle",
-          "code": "() => (\n  <AvatarPair>\n    <Avatar\n      src=\"https://avatars.githubusercontent.com/u/7143434?v=4\"\n      alt=\"Primer avatar, parent\"\n    />\n    <Avatar\n      square\n      src=\"https://avatars.githubusercontent.com/primer\"\n      alt=\"Primer avatar, child\"\n    />\n  </AvatarPair>\n)"
-        },
-        {
-          "id": "components-avatarpair-features--parent-square",
-          "code": "() => (\n  <AvatarPair>\n    <Avatar\n      square\n      src=\"https://avatars.githubusercontent.com/primer\"\n      alt=\"Primer avatar, parent\"\n    />\n    <Avatar\n      src=\"https://avatars.githubusercontent.com/u/7143434?v=4\"\n      alt=\"Primer avatar, child\"\n    />\n  </AvatarPair>\n)"
-        }
-      ],
-      "importPath": "@primer/react",
-      "props": [
-        {
-          "name": "children",
-          "type": "Avatar[]",
-          "defaultValue": "",
-          "description": ""
-        },
-        {
-          "name": "sx",
-          "type": "SystemStyleObject",
-          "deprecated": true
-        }
-      ],
-      "subcomponents": []
-    },
     "filtered_search": {
       "source": "https://github.com/primer/react/tree/main/packages/react/src/deprecated/FilteredSearch",
       "id": "filtered_search",
@@ -9039,11 +8927,6 @@
           "name": "aria-label",
           "type": "string",
           "description": "Used to set the `aria-label` on the top level `<nav>` element."
-        },
-        {
-          "name": "sx",
-          "type": "SystemStyleObject",
-          "deprecated": true
         }
       ],
       "subcomponents": [
@@ -9144,7 +9027,7 @@
         },
         {
           "id": "deprecated-components-selectpanel-features--with-warning",
-          "code": "() => {\n  /* Selection */\n\n  const initialAssigneeIds = data.issue.assigneeIds // mock initial state\n  const [selectedAssigneeIds, setSelectedAssigneeIds] =\n    React.useState<string[]>(initialAssigneeIds)\n  const MAX_LIMIT = 3\n  const onCollaboratorSelect = (colloratorId: string) => {\n    if (!selectedAssigneeIds.includes(colloratorId))\n      setSelectedAssigneeIds([...selectedAssigneeIds, colloratorId])\n    else\n      setSelectedAssigneeIds(\n        selectedAssigneeIds.filter((id) => id !== colloratorId),\n      )\n  }\n  const onClearSelection = () => setSelectedAssigneeIds([])\n  const onSubmit = () => {\n    data.issue.assigneeIds = selectedAssigneeIds // pretending to persist changes\n  }\n  const onCancel = () => {\n    setSelectedAssigneeIds(initialAssigneeIds)\n  }\n\n  /* Filtering */\n  const [filteredUsers, setFilteredUsers] = React.useState(data.collaborators)\n  const [query, setQuery] = React.useState('')\n  const onSearchInputChange: React.ChangeEventHandler<HTMLInputElement> = (\n    event,\n  ) => {\n    const query = event.currentTarget.value\n    setQuery(query)\n    if (query === '') setFilteredUsers(data.collaborators)\n    else {\n      setFilteredUsers(\n        data.collaborators\n          .map((collaborator) => {\n            if (collaborator.login.toLowerCase().startsWith(query))\n              return {\n                priority: 1,\n                collaborator,\n              }\n            else if (collaborator.name.startsWith(query))\n              return {\n                priority: 2,\n                collaborator,\n              }\n            else if (collaborator.login.toLowerCase().includes(query))\n              return {\n                priority: 3,\n                collaborator,\n              }\n            else if (collaborator.name.toLowerCase().includes(query))\n              return {\n                priority: 4,\n                collaborator,\n              }\n            else\n              return {\n                priority: -1,\n                collaborator,\n              }\n          })\n          .filter((result) => result.priority > 0)\n          .map((result) => result.collaborator),\n      )\n    }\n  }\n  const sortingFn = (\n    itemA: {\n      id: string\n    },\n    itemB: {\n      id: string\n    },\n  ) => {\n    const initialSelectedIds = data.issue.assigneeIds\n    if (\n      initialSelectedIds.includes(itemA.id) &&\n      initialSelectedIds.includes(itemB.id)\n    )\n      return 1\n    else if (initialSelectedIds.includes(itemA.id)) return -1\n    else if (initialSelectedIds.includes(itemB.id)) return 1\n    else return 1\n  }\n  const itemsToShow = query ? filteredUsers : data.collaborators.sort(sortingFn)\n  return (\n    <>\n      <h1>SelectPanel with warning</h1>\n\n      <SelectPanel\n        title=\"Set assignees\"\n        description={`Select up to ${MAX_LIMIT} people`}\n        onSubmit={onSubmit}\n        onCancel={onCancel}\n        onClearSelection={onClearSelection}\n      >\n        <SelectPanel.Button\n          variant=\"invisible\"\n          trailingAction={GearIcon}\n          sx={{\n            width: '200px',\n            '[data-component=buttonContent]': {\n              justifyContent: 'start',\n            },\n          }}\n        >\n          Assignees\n        </SelectPanel.Button>\n        <SelectPanel.Header>\n          <SelectPanel.SearchInput\n            onChange={onSearchInputChange}\n            aria-label=\"Search\"\n          />\n        </SelectPanel.Header>\n\n        {selectedAssigneeIds.length >= MAX_LIMIT ? (\n          <SelectPanel.Message variant=\"warning\" size=\"inline\">\n            You have reached the limit of {MAX_LIMIT} assignees on your free\n            account. <Link href=\"/upgrade\">Upgrade your account.</Link>\n          </SelectPanel.Message>\n        ) : null}\n\n        {itemsToShow.length === 0 ? (\n          <SelectPanel.Message\n            variant=\"empty\"\n            title={`No labels found for \"${query}\"`}\n          >\n            Try a different search term\n          </SelectPanel.Message>\n        ) : (\n          <ActionList>\n            {itemsToShow.map((collaborator) => (\n              <ActionList.Item\n                key={collaborator.id}\n                onSelect={() => onCollaboratorSelect(collaborator.id)}\n                selected={selectedAssigneeIds.includes(collaborator.id)}\n                disabled={\n                  selectedAssigneeIds.length >= MAX_LIMIT &&\n                  !selectedAssigneeIds.includes(collaborator.id)\n                }\n              >\n                <ActionList.LeadingVisual>\n                  <Avatar\n                    src={`https://github.com/${collaborator.login}.png`}\n                  />\n                </ActionList.LeadingVisual>\n                {collaborator.login}\n                <ActionList.Description>\n                  {collaborator.login}\n                </ActionList.Description>\n              </ActionList.Item>\n            ))}\n          </ActionList>\n        )}\n\n        <SelectPanel.Footer />\n      </SelectPanel>\n    </>\n  )\n}"
+          "code": "() => {\n  /* Selection */\n\n  const initialAssigneeIds = data.issue.assigneeIds // mock initial state\n  const [selectedAssigneeIds, setSelectedAssigneeIds] =\n    React.useState<string[]>(initialAssigneeIds)\n  const MAX_LIMIT = 3\n  const onCollaboratorSelect = (colloratorId: string) => {\n    if (!selectedAssigneeIds.includes(colloratorId))\n      setSelectedAssigneeIds([...selectedAssigneeIds, colloratorId])\n    else\n      setSelectedAssigneeIds(\n        selectedAssigneeIds.filter((id) => id !== colloratorId),\n      )\n  }\n  const onClearSelection = () => setSelectedAssigneeIds([])\n  const onSubmit = () => {\n    data.issue.assigneeIds = selectedAssigneeIds // pretending to persist changes\n  }\n  const onCancel = () => {\n    setSelectedAssigneeIds(initialAssigneeIds)\n  }\n\n  /* Filtering */\n  const [filteredUsers, setFilteredUsers] = React.useState(data.collaborators)\n  const [query, setQuery] = React.useState('')\n  const onSearchInputChange: React.ChangeEventHandler<HTMLInputElement> = (\n    event,\n  ) => {\n    const query = event.currentTarget.value\n    setQuery(query)\n    if (query === '') setFilteredUsers(data.collaborators)\n    else {\n      setFilteredUsers(\n        data.collaborators\n          .map((collaborator) => {\n            if (collaborator.login.toLowerCase().startsWith(query))\n              return {\n                priority: 1,\n                collaborator,\n              }\n            else if (collaborator.name.startsWith(query))\n              return {\n                priority: 2,\n                collaborator,\n              }\n            else if (collaborator.login.toLowerCase().includes(query))\n              return {\n                priority: 3,\n                collaborator,\n              }\n            else if (collaborator.name.toLowerCase().includes(query))\n              return {\n                priority: 4,\n                collaborator,\n              }\n            else\n              return {\n                priority: -1,\n                collaborator,\n              }\n          })\n          .filter((result) => result.priority > 0)\n          .map((result) => result.collaborator),\n      )\n    }\n  }\n  const sortingFn = (\n    itemA: {\n      id: string\n    },\n    itemB: {\n      id: string\n    },\n  ) => {\n    const initialSelectedIds = data.issue.assigneeIds\n    if (\n      initialSelectedIds.includes(itemA.id) &&\n      initialSelectedIds.includes(itemB.id)\n    )\n      return 1\n    else if (initialSelectedIds.includes(itemA.id)) return -1\n    else if (initialSelectedIds.includes(itemB.id)) return 1\n    else return 1\n  }\n  const itemsToShow = query ? filteredUsers : data.collaborators.sort(sortingFn)\n  return (\n    <>\n      <h1>SelectPanel with warning</h1>\n\n      <SelectPanel\n        title=\"Set assignees\"\n        description={`Select up to ${MAX_LIMIT} people`}\n        onSubmit={onSubmit}\n        onCancel={onCancel}\n        onClearSelection={onClearSelection}\n      >\n        <SelectPanel.Button\n          variant=\"invisible\"\n          trailingAction={GearIcon}\n          className={classes.ButtonCustom}\n        >\n          Assignees\n        </SelectPanel.Button>\n        <SelectPanel.Header>\n          <SelectPanel.SearchInput\n            onChange={onSearchInputChange}\n            aria-label=\"Search\"\n          />\n        </SelectPanel.Header>\n\n        {selectedAssigneeIds.length >= MAX_LIMIT ? (\n          <SelectPanel.Message variant=\"warning\" size=\"inline\">\n            You have reached the limit of {MAX_LIMIT} assignees on your free\n            account. <Link href=\"/upgrade\">Upgrade your account.</Link>\n          </SelectPanel.Message>\n        ) : null}\n\n        {itemsToShow.length === 0 ? (\n          <SelectPanel.Message\n            variant=\"empty\"\n            title={`No labels found for \"${query}\"`}\n          >\n            Try a different search term\n          </SelectPanel.Message>\n        ) : (\n          <ActionList>\n            {itemsToShow.map((collaborator) => (\n              <ActionList.Item\n                key={collaborator.id}\n                onSelect={() => onCollaboratorSelect(collaborator.id)}\n                selected={selectedAssigneeIds.includes(collaborator.id)}\n                disabled={\n                  selectedAssigneeIds.length >= MAX_LIMIT &&\n                  !selectedAssigneeIds.includes(collaborator.id)\n                }\n              >\n                <ActionList.LeadingVisual>\n                  <Avatar\n                    src={`https://github.com/${collaborator.login}.png`}\n                  />\n                </ActionList.LeadingVisual>\n                {collaborator.login}\n                <ActionList.Description>\n                  {collaborator.login}\n                </ActionList.Description>\n              </ActionList.Item>\n            ))}\n          </ActionList>\n        )}\n\n        <SelectPanel.Footer />\n      </SelectPanel>\n    </>\n  )\n}"
         },
         {
           "id": "deprecated-components-selectpanel-examples--open-from-menu",

package/lib/FilteredActionList/FilteredActionList-96b126d7.css

@@ -0,0 +1,2 @@
+.prc-FilteredActionList-Root-S5E74{display:flex;flex-direction:column;overflow:hidden}.prc-FilteredActionList-Container-2A9NQ{display:flex;flex-grow:1;height:100%;overflow:auto}.prc-FilteredActionList-ActionListItem-39lnB:focus{background:var(--control-transparent-bgColor-selected,var(--color-action-list-item-default-selected-bg))}.prc-FilteredActionList-ActionListItem-39lnB:focus:after{background:var(--borderColor-accent-emphasis,var(--color-accent-emphasis));border-radius:var(--borderRadius-medium,.375rem);content:"";height:var(--base-size-24,1.5rem);left:calc(var(--base-size-8,.5rem)*-1);position:absolute;top:calc(50% - var(--base-size-12,.75rem));width:var(--base-size-4,.25rem)}.prc-FilteredActionList-ActionListItem-39lnB:where([data-input-focused]):where([data-first-child]){background:var(--control-transparent-bgColor-selected,var(--color-action-list-item-default-selected-bg))}.prc-FilteredActionList-ActionListItem-39lnB:where([data-input-focused]):where([data-first-child]):after{background:var(--borderColor-accent-emphasis,var(--color-accent-emphasis));border-radius:var(--borderRadius-medium,.375rem);content:"";height:var(--base-size-24,1.5rem);left:calc(var(--base-size-8,.5rem)*-1);position:absolute;top:calc(50% - var(--base-size-12,.75rem));width:var(--base-size-4,.25rem)}@media screen and (max-width:calc(48rem - 0.02px)){@supports (-webkit-touch-callout:none){.prc-FilteredActionList-FullScreenTextInput-rCAiq{font-size:var(--text-title-size-small,1rem)}}}.prc-FilteredActionList-SelectAllContainer-w5otq{align-items:center;background:var(--bgColor-muted,var(--color-canvas-subtle));border-bottom:var(--borderWidth-thin,.0625rem) solid var(--borderColor-default,var(--color-border-default));display:flex;padding-block:var(--base-size-4,.25rem);padding-inline:var(--base-size-16,1rem)}.prc-FilteredActionList-SelectAllCheckbox-dq2yL{margin:var(--base-size-4,.25rem) var(--base-size-8,.5rem) calc(var(--base-size-4,.25rem) - 1px) 0}.prc-FilteredActionList-SelectAllLabel-l34LA{color:var(--fgColor-muted,var(--color-fg-muted));font-size:var(--text-body-size-medium,.875rem)}
+/*# sourceMappingURL=FilteredActionList-96b126d7.css.map */

package/lib/FilteredActionList/FilteredActionList-96b126d7.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/FilteredActionList/FilteredActionList.module.css","../../postcss-preset-primer/src/mixins/activeIndicatorLine.css"],"names":[],"mappings":"AAAA,mCACE,YAAa,CACb,qBAAsB,CACtB,eACF,CAEA,wCACE,YAAa,CAGb,WAAY,CAFZ,WAAY,CACZ,aAEF,CAEA,mDACE,wGAKF,CAHE,yDCRA,0EAA8C,CAC9C,gDAAyC,CAHzC,UAAW,CADX,iCAA2B,CAF3B,sCAAmC,CAFnC,iBAAkB,CAClB,0CAAoC,CAEpC,+BDcA,CAGF,mGACE,wGAKF,CAHE,yGChBA,0EAA8C,CAC9C,gDAAyC,CAHzC,UAAW,CADX,iCAA2B,CAF3B,sCAAmC,CAFnC,iBAAkB,CAClB,0CAAoC,CAEpC,+BDsBA,CAIA,mDAEE,uCAHJ,kDAIM,2CAGN,CAFI,CACF,CAGF,iDAEE,kBAAmB,CAGnB,0DAAgC,CAChC,2GAAuE,CALvE,YAAa,CAEb,uCAAiC,CACjC,uCAGF,CAEA,gDAGE,iGACF,CAEA,6CAEE,gDAA2B,CAD3B,8CAEF","file":"FilteredActionList-96b126d7.css","sourcesContent":[".Root {\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.Container {\n  display: flex;\n  height: 100%;\n  overflow: auto;\n  flex-grow: 1;\n}\n\n.ActionListItem:focus {\n  background: var(--control-transparent-bgColor-selected);\n\n  &::after {\n    @mixin activeIndicatorLine;\n  }\n}\n\n.ActionListItem:where([data-input-focused]):where([data-first-child]) {\n  background: var(--control-transparent-bgColor-selected);\n\n  &::after {\n    @mixin activeIndicatorLine;\n  }\n}\n\n.FullScreenTextInput {\n  @media screen and (--viewportRange-narrow) {\n    /* Ensures inputs don't zoom on mobile iPhone but are body-font size on iPad */\n    @supports (-webkit-touch-callout: none) {\n      font-size: var(--text-title-size-small);\n    }\n  }\n}\n\n.SelectAllContainer {\n  display: flex;\n  align-items: center;\n  padding-block: var(--base-size-4);\n  padding-inline: var(--base-size-16);\n  background: var(--bgColor-muted);\n  border-bottom: var(--borderWidth-thin) solid var(--borderColor-default);\n}\n\n.SelectAllCheckbox {\n  /* -1px hack to offset 1px border-bottom causing uneven alignment */\n  /* stylelint-disable-next-line primer/spacing */\n  margin: var(--base-size-4) var(--base-size-8) calc(var(--base-size-4) - 1px) 0;\n}\n\n.SelectAllLabel {\n  font-size: var(--text-body-size-medium);\n  color: var(--fgColor-muted);\n}\n","@define-mixin activeIndicatorLine {\n  position: absolute;\n  top: calc(50% - var(--base-size-12));\n  left: calc(-1 * var(--base-size-8));\n  width: var(--base-size-4);\n  height: var(--base-size-24);\n  content: '';\n  /* stylelint-disable-next-line primer/colors */\n  background: var(--borderColor-accent-emphasis);\n  border-radius: var(--borderRadius-medium);\n}\n"]}

package/lib/FilteredActionList/FilteredActionList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FilteredActionList.d.ts","sourceRoot":"","sources":["../../src/FilteredActionList/FilteredActionList.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,cAAc,CAAA;AAIhD,OAAO,KAAK,EAAC,gBAAgB,EAAE,aAAa,EAA0B,MAAM,IAAI,CAAA;AAOhF,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,OAAO,CAAA;AACjC,OAAO,KAAK,EAAC,6BAA6B,EAAC,MAAM,6BAA6B,CAAA;AAa9E,MAAM,WAAW,uBACf,SAAQ,OAAO,CAAC,IAAI,CAAC,gBAAgB,EAAE,MAAM,aAAa,CAAC,CAAC,EAC1D,aAAa,EACb,MAAM;IACR,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,WAAW,CAAC,EAAE,6BAA6B,CAAA;IAC3C,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,GAAG,IAAI,KAAK,IAAI,CAAA;IACtF,yBAAyB,CAAC,EAAE,CAAC,GAAG,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAA;IAC7D,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAA;IACpE,cAAc,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC,CAAA;IAC1D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IAC5C,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,WAAW,CAAC,EAAE;QACZ,KAAK,EAAE,MAAM,CAAA;QACb,WAAW,EAAE,MAAM,CAAA;KACpB,CAAA;IACD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;CAC/C;AAOD,wBAAgB,kBAAkB,CAAC,EACjC,OAAe,EACf,eAAe,EACf,WAAW,EAAE,mBAAmB,EAChC,WAAwD,EACxD,cAAc,EACd,yBAAyB,EACzB,iBAAiB,EACjB,KAAK,EACL,cAAc,EACd,QAAQ,EAAE,gBAAgB,EAC1B,EAAE,EACF,aAAa,EACb,gBAAgB,EAChB,OAAO,EACP,WAAW,EACX,SAAS,EACT,gBAAgB,EAChB,oBAA2B,EAC3B,kBAAkB,EAClB,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,uBAAuB,GAAG,GAAG,CAAC,OAAO,CAgUvC;yBAtVe,kBAAkB"}
+{"version":3,"file":"FilteredActionList.d.ts","sourceRoot":"","sources":["../../src/FilteredActionList/FilteredActionList.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,cAAc,CAAA;AAIhD,OAAO,KAAK,EAAC,gBAAgB,EAAE,aAAa,EAA0B,MAAM,IAAI,CAAA;AAOhF,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,OAAO,CAAA;AACjC,OAAO,KAAK,EAAC,6BAA6B,EAAC,MAAM,6BAA6B,CAAA;AAc9E,MAAM,WAAW,uBACf,SAAQ,OAAO,CAAC,IAAI,CAAC,gBAAgB,EAAE,MAAM,aAAa,CAAC,CAAC,EAC1D,aAAa,EACb,MAAM;IACR,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,WAAW,CAAC,EAAE,6BAA6B,CAAA;IAC3C,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,GAAG,IAAI,KAAK,IAAI,CAAA;IACtF,yBAAyB,CAAC,EAAE,CAAC,GAAG,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAA;IAC7D,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAA;IACpE,cAAc,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC,CAAA;IAC1D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IAC5C,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,WAAW,CAAC,EAAE;QACZ,KAAK,EAAE,MAAM,CAAA;QACb,WAAW,EAAE,MAAM,CAAA;KACpB,CAAA;IACD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;CAC/C;AAOD,wBAAgB,kBAAkB,CAAC,EACjC,OAAe,EACf,eAAe,EACf,WAAW,EAAE,mBAAmB,EAChC,WAAwD,EACxD,cAAc,EACd,yBAAyB,EACzB,iBAAiB,EACjB,KAAK,EACL,cAAc,EACd,QAAQ,EAAE,gBAAgB,EAC1B,EAAE,EACF,aAAa,EACb,gBAAgB,EAChB,OAAO,EACP,WAAW,EACX,SAAS,EACT,gBAAgB,EAChB,oBAA2B,EAC3B,kBAAkB,EAClB,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,uBAAuB,GAAG,GAAG,CAAC,OAAO,CA6TvC;yBAnVe,kBAAkB"}

package/lib/FilteredActionList/FilteredActionList.js

@@ -17,9 +17,9 @@ var ActionListContainerContext = require('../ActionList/ActionListContainerConte
 var reactIs = require('react-is');
 var useAnnouncements = require('./useAnnouncements.js');
 var clsx = require('clsx');
+var BoxWithFallback = require('../internal/components/BoxWithFallback.js');
 var jsxRuntime = require('react/jsx-runtime');
 var useFeatureFlag = require('../FeatureFlags/useFeatureFlag.js');
-var Box = require('../Box/Box.js');
 var TextInput = require('../TextInput/TextInput.js');
 var VisuallyHidden = require('../VisuallyHidden/VisuallyHidden.js');
 var Checkbox = require('../Checkbox/Checkbox.js');
@@ -276,13 +276,10 @@ function FilteredActionList({
       return actionListContent;
     }
   }
-  return /*#__PURE__*/jsxRuntime.jsxs(Box, {
+  return /*#__PURE__*/jsxRuntime.jsxs(BoxWithFallback.BoxWithFallback, {
     ref: inputAndListContainerRef,
-    display: "flex",
-    flexDirection: "column",
-    overflow: "hidden",
     sx: sx,
-    className: className,
+    className: clsx.clsx(className, FilteredActionList_module.Root),
     "data-testid": "filtered-action-list",
     children: [/*#__PURE__*/jsxRuntime.jsx(StyledHeader, {
       children: /*#__PURE__*/jsxRuntime.jsx(TextInput, {

package/lib/FilteredActionList/FilteredActionList.module.css.js

@@ -1,7 +1,7 @@
 'use strict';
 
-require('./FilteredActionList-d1d6d026.css');
+require('./FilteredActionList-96b126d7.css');
 
-var classes = {"Container":"prc-FilteredActionList-Container-2A9NQ","ActionListItem":"prc-FilteredActionList-ActionListItem-39lnB","FullScreenTextInput":"prc-FilteredActionList-FullScreenTextInput-rCAiq","SelectAllContainer":"prc-FilteredActionList-SelectAllContainer-w5otq","SelectAllCheckbox":"prc-FilteredActionList-SelectAllCheckbox-dq2yL","SelectAllLabel":"prc-FilteredActionList-SelectAllLabel-l34LA"};
+var classes = {"Root":"prc-FilteredActionList-Root-S5E74","Container":"prc-FilteredActionList-Container-2A9NQ","ActionListItem":"prc-FilteredActionList-ActionListItem-39lnB","FullScreenTextInput":"prc-FilteredActionList-FullScreenTextInput-rCAiq","SelectAllContainer":"prc-FilteredActionList-SelectAllContainer-w5otq","SelectAllCheckbox":"prc-FilteredActionList-SelectAllCheckbox-dq2yL","SelectAllLabel":"prc-FilteredActionList-SelectAllLabel-l34LA"};
 
 module.exports = classes;

package/lib/PointerBox/PointerBox.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { BoxProps } from '../Box';
-import type { CaretProps } from '../Caret';
+import type { CaretProps } from '../internal/components/Caret';
 import type { SxProp } from '../sx';
 type MutatedSxProps = {
     sx?: {

package/lib/PointerBox/PointerBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PointerBox.d.ts","sourceRoot":"","sources":["../../src/PointerBox/PointerBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,QAAQ,CAAA;AAEpC,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,UAAU,CAAA;AAGxC,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,OAAO,CAAA;AAGjC,KAAK,cAAc,GAAG;IACpB,EAAE,CAAC,EAAE;QACH,EAAE,CAAC,EAAE,MAAM,CAAA;QACX,eAAe,CAAC,EAAE,MAAM,CAAA;QACxB,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,CAAA;CACF,GAAG,MAAM,CAAA;AAEV,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAA;IAC9B,EAAE,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAA;IACrB,WAAW,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,CAAA;IACvC,MAAM,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,CAAA;CACnC,GAAG,QAAQ,GACV,cAAc,CAAA;AAEhB,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,qBAoCzC;AAED,eAAe,UAAU,CAAA"}
+{"version":3,"file":"PointerBox.d.ts","sourceRoot":"","sources":["../../src/PointerBox/PointerBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,QAAQ,CAAA;AAEpC,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,8BAA8B,CAAA;AAG5D,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,OAAO,CAAA;AAGjC,KAAK,cAAc,GAAG;IACpB,EAAE,CAAC,EAAE;QACH,EAAE,CAAC,EAAE,MAAM,CAAA;QACX,eAAe,CAAC,EAAE,MAAM,CAAA;QACxB,WAAW,CAAC,EAAE,MAAM,CAAA;KACrB,CAAA;CACF,GAAG,MAAM,CAAA;AAEV,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAA;IAC9B,EAAE,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAA;IACrB,WAAW,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,CAAA;IACvC,MAAM,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,CAAA;CACnC,GAAG,QAAQ,GACV,cAAc,CAAA;AAEhB,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,qBAoCzC;AAED,eAAe,UAAU,CAAA"}

package/lib/PointerBox/PointerBox.js

@@ -2,7 +2,7 @@
 
 var React = require('react');
 var styled = require('styled-components');
-var Caret = require('../Caret.js');
+var Caret = require('../internal/components/Caret.js');
 var constants = require('../constants.js');
 var jsxRuntime = require('react/jsx-runtime');
 var Box = require('../Box/Box.js');

package/lib/SplitPageLayout/SplitPageLayout.d.ts

@@ -1,7 +1,6 @@
 import type React from 'react';
-import type { SxProp } from '..';
 import type { PageLayoutContentProps, PageLayoutFooterProps, PageLayoutHeaderProps, PageLayoutPaneProps } from '../PageLayout';
-export type SplitPageLayoutProps = SxProp & {
+export type SplitPageLayoutProps = {
     className?: string;
 };
 export declare const Root: React.FC<React.PropsWithChildren<SplitPageLayoutProps>>;

package/lib/SplitPageLayout/SplitPageLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SplitPageLayout.d.ts","sourceRoot":"","sources":["../../src/SplitPageLayout/SplitPageLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,IAAI,CAAA;AAC9B,OAAO,KAAK,EACV,sBAAsB,EACtB,qBAAqB,EACrB,qBAAqB,EACrB,mBAAmB,EACpB,MAAM,eAAe,CAAA;AAMtB,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAC,CAAA;AAEhE,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAcxE,CAAA;AAOD,MAAM,MAAM,0BAA0B,GAAG,qBAAqB,CAAA;AAE9D,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,CAOhF,CAAA;AAOD,MAAM,MAAM,2BAA2B,GAAG,sBAAsB,CAAA;AAEhE,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,2BAA2B,CAAC,CAMlF,CAAA;AAOD,MAAM,MAAM,wBAAwB,GAAG,mBAAmB,CAAA;AAE1D,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,wBAAwB,CAAC,CAgB5E,CAAA;AAMD,MAAM,MAAM,0BAA0B,GAAG,qBAAqB,CAAA;AAE9D,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,CAOhF,CAAA;AAOD,eAAO,MAAM,eAAe;;;;;CAK1B,CAAA"}
+{"version":3,"file":"SplitPageLayout.d.ts","sourceRoot":"","sources":["../../src/SplitPageLayout/SplitPageLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EACV,sBAAsB,EACtB,qBAAqB,EACrB,qBAAqB,EACrB,mBAAmB,EACpB,MAAM,eAAe,CAAA;AAMtB,MAAM,MAAM,oBAAoB,GAAG;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAC,CAAA;AAEvD,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAcxE,CAAA;AAOD,MAAM,MAAM,0BAA0B,GAAG,qBAAqB,CAAA;AAE9D,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,CAOhF,CAAA;AAOD,MAAM,MAAM,2BAA2B,GAAG,sBAAsB,CAAA;AAEhE,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,2BAA2B,CAAC,CAMlF,CAAA;AAOD,MAAM,MAAM,wBAAwB,GAAG,mBAAmB,CAAA;AAE1D,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,wBAAwB,CAAC,CAgB5E,CAAA;AAMD,MAAM,MAAM,0BAA0B,GAAG,qBAAqB,CAAA;AAE9D,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,CAOhF,CAAA;AAOD,eAAO,MAAM,eAAe;;;;;CAK1B,CAAA"}