@elliemae/ds-app-picker 3.80.0-next.51 → 3.80.0-next.53

package/dist/cjs/config/useValidateProps.js

@@ -44,10 +44,10 @@ const useValidateProps = (props, propTypes) => {
   const suppliedAppIds = [...props.apps, ...props.customApps].map((app) => app.id).filter((id) => id !== void 0);
   const seen = /* @__PURE__ */ new Set();
   const duplicates = /* @__PURE__ */ new Set();
-  for (const id of suppliedAppIds) {
+  suppliedAppIds.forEach((id) => {
     if (seen.has(id)) duplicates.add(id);
     else seen.add(id);
-  }
+  });
   const duplicatedAppIds = [...duplicates];
   if (duplicatedAppIds.length) {
     throw new Error(

package/dist/cjs/config/useValidateProps.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/config/useValidateProps.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { ValidationMap } from '@elliemae/ds-props-helpers';\nimport { type DSAppPickerT } from '../react-desc-prop-types.js';\nimport { DSAppPickerName } from '../constants/index.js';\n\nexport const useValidateProps = (props: DSAppPickerT.InternalProps, propTypes: ValidationMap<unknown>): void => {\n  useValidateTypescriptPropTypes(props, propTypes, DSAppPickerName);\n\n  if (!props.apps.length && !props.customApps.length) {\n    throw new Error(\n      `[${DSAppPickerName}] At least one of \"apps\" or \"customApps\" must contain items. ` +\n        `Providing both as empty arrays renders an empty picker.`,\n    );\n  }\n\n  /*\n   * An app's `id` is rendered verbatim as the chip's DOM id \u2014 it is the consumer's own value, deliberately\n   * left un-namespaced so they can address their chips by the identity they already know. `apps` and\n   * `customApps` are two independent arrays, so nothing about the shape of the API stops the same value\n   * appearing twice, and a duplicate DOM id is a broken document: `getElementById`, `document.querySelector`\n   * and every `aria-*` reference silently resolve to the first match only.\n   *\n   * We do not fix that by rewriting their ids \u2014 that would take away the surface the field exists to\n   * provide. We make it impossible to ship instead. Uniqueness stays the consumer's responsibility; this\n   * turns \"silently wrong in production\" into \"cannot render\", which is the only version of that\n   * responsibility that actually holds.\n   *\n   * Scoped to ids the consumer supplied: id-less apps are legal (AppSection falls back to a positional key\n   * and getChipId to a label-index identity), and no chip id is emitted for them at all.\n   */\n  const suppliedAppIds = [...props.apps, ...props.customApps]\n    .map((app) => app.id)\n    .filter((id): id is string => id !== undefined);\n\n  const seen = new Set<string>();\n  const duplicates = new Set<string>();\n  for (const id of suppliedAppIds) {\n    if (seen.has(id)) duplicates.add(id);\n    else seen.add(id);\n  }\n  const duplicatedAppIds = [...duplicates];\n  if (duplicatedAppIds.length) {\n    throw new Error(\n      `[${DSAppPickerName}] Every app \"id\" must be unique across \"apps\" and \"customApps\" \u2014 each one is ` +\n        `rendered as that chip's DOM id, and duplicates produce an invalid document. ` +\n        `Duplicated: ${duplicatedAppIds.map((id) => `\"${id}\"`).join(', ')}.`,\n    );\n  }\n\n  /*\n   * Same defect, one level up: the consumer's `id` lands unmodified on the ROOT (see util/instanceIds), so\n   * an app carrying that same value collides with it. Every id this component generates for itself is\n   * suffixed through that module and therefore cannot participate \u2014 this is the one remaining pair where\n   * two consumer-supplied values meet.\n   */\n  if (props.id !== undefined && suppliedAppIds.includes(props.id)) {\n    throw new Error(\n      `[${DSAppPickerName}] The app \"id\" \"${props.id}\" collides with the \"id\" given to the component, ` +\n        `which is rendered on the root element. Every other id is suffixed away from it \u2014 see ` +\n        `getIdForAppPickerTrigger / getIdForAppPickerSectionTitle / getIdForAppPickerCustomSectionTitle \u2014 but this one is not ours to move.`,\n    );\n  }\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA+C;AAG/C,uBAAgC;AAEzB,MAAM,mBAAmB,CAAC,OAAmC,cAA4C;AAC9G,8DAA+B,OAAO,WAAW,gCAAe;AAEhE,MAAI,CAAC,MAAM,KAAK,UAAU,CAAC,MAAM,WAAW,QAAQ;AAClD,UAAM,IAAI;AAAA,MACR,IAAI,gCAAe;AAAA,IAErB;AAAA,EACF;AAiBA,QAAM,iBAAiB,CAAC,GAAG,MAAM,MAAM,GAAG,MAAM,UAAU,EACvD,IAAI,CAAC,QAAQ,IAAI,EAAE,EACnB,OAAO,CAAC,OAAqB,OAAO,MAAS;AAEhD,QAAM,OAAO,oBAAI,IAAY;AAC7B,QAAM,aAAa,oBAAI,IAAY;AACnC,aAAW,MAAM,gBAAgB;AAC/B,QAAI,KAAK,IAAI,EAAE,EAAG,YAAW,IAAI,EAAE;AAAA,QAC9B,MAAK,IAAI,EAAE;AAAA,EAClB;AACA,QAAM,mBAAmB,CAAC,GAAG,UAAU;AACvC,MAAI,iBAAiB,QAAQ;AAC3B,UAAM,IAAI;AAAA,MACR,IAAI,gCAAe,6KAEF,iBAAiB,IAAI,CAAC,OAAO,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC;AAAA,IACrE;AAAA,EACF;AAQA,MAAI,MAAM,OAAO,UAAa,eAAe,SAAS,MAAM,EAAE,GAAG;AAC/D,UAAM,IAAI;AAAA,MACR,IAAI,gCAAe,mBAAmB,MAAM,EAAE;AAAA,IAGhD;AAAA,EACF;AACF;",
+  "sourcesContent": ["import { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { ValidationMap } from '@elliemae/ds-props-helpers';\nimport { type DSAppPickerT } from '../react-desc-prop-types.js';\nimport { DSAppPickerName } from '../constants/index.js';\n\nexport const useValidateProps = (props: DSAppPickerT.InternalProps, propTypes: ValidationMap<unknown>): void => {\n  useValidateTypescriptPropTypes(props, propTypes, DSAppPickerName);\n\n  if (!props.apps.length && !props.customApps.length) {\n    throw new Error(\n      `[${DSAppPickerName}] At least one of \"apps\" or \"customApps\" must contain items. ` +\n        `Providing both as empty arrays renders an empty picker.`,\n    );\n  }\n\n  /*\n   * An app's `id` is rendered verbatim as the chip's DOM id \u2014 it is the consumer's own value, deliberately\n   * left un-namespaced so they can address their chips by the identity they already know. `apps` and\n   * `customApps` are two independent arrays, so nothing about the shape of the API stops the same value\n   * appearing twice, and a duplicate DOM id is a broken document: `getElementById`, `document.querySelector`\n   * and every `aria-*` reference silently resolve to the first match only.\n   *\n   * We do not fix that by rewriting their ids \u2014 that would take away the surface the field exists to\n   * provide. We make it impossible to ship instead. Uniqueness stays the consumer's responsibility; this\n   * turns \"silently wrong in production\" into \"cannot render\", which is the only version of that\n   * responsibility that actually holds.\n   *\n   * Scoped to ids the consumer supplied: id-less apps are legal (AppSection falls back to a positional key\n   * and getChipId to a label-index identity), and no chip id is emitted for them at all.\n   */\n  const suppliedAppIds = [...props.apps, ...props.customApps]\n    .map((app) => app.id)\n    .filter((id): id is string => id !== undefined);\n\n  const seen = new Set<string>();\n  const duplicates = new Set<string>();\n  suppliedAppIds.forEach((id) => {\n    if (seen.has(id)) duplicates.add(id);\n    else seen.add(id);\n  });\n  const duplicatedAppIds = [...duplicates];\n  if (duplicatedAppIds.length) {\n    throw new Error(\n      `[${DSAppPickerName}] Every app \"id\" must be unique across \"apps\" and \"customApps\" \u2014 each one is ` +\n        `rendered as that chip's DOM id, and duplicates produce an invalid document. ` +\n        `Duplicated: ${duplicatedAppIds.map((id) => `\"${id}\"`).join(', ')}.`,\n    );\n  }\n\n  /*\n   * Same defect, one level up: the consumer's `id` lands unmodified on the ROOT (see util/instanceIds), so\n   * an app carrying that same value collides with it. Every id this component generates for itself is\n   * suffixed through that module and therefore cannot participate \u2014 this is the one remaining pair where\n   * two consumer-supplied values meet.\n   */\n  if (props.id !== undefined && suppliedAppIds.includes(props.id)) {\n    throw new Error(\n      `[${DSAppPickerName}] The app \"id\" \"${props.id}\" collides with the \"id\" given to the component, ` +\n        `which is rendered on the root element. Every other id is suffixed away from it \u2014 see ` +\n        `getIdForAppPickerTrigger / getIdForAppPickerSectionTitle / getIdForAppPickerCustomSectionTitle \u2014 but this one is not ours to move.`,\n    );\n  }\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA+C;AAG/C,uBAAgC;AAEzB,MAAM,mBAAmB,CAAC,OAAmC,cAA4C;AAC9G,8DAA+B,OAAO,WAAW,gCAAe;AAEhE,MAAI,CAAC,MAAM,KAAK,UAAU,CAAC,MAAM,WAAW,QAAQ;AAClD,UAAM,IAAI;AAAA,MACR,IAAI,gCAAe;AAAA,IAErB;AAAA,EACF;AAiBA,QAAM,iBAAiB,CAAC,GAAG,MAAM,MAAM,GAAG,MAAM,UAAU,EACvD,IAAI,CAAC,QAAQ,IAAI,EAAE,EACnB,OAAO,CAAC,OAAqB,OAAO,MAAS;AAEhD,QAAM,OAAO,oBAAI,IAAY;AAC7B,QAAM,aAAa,oBAAI,IAAY;AACnC,iBAAe,QAAQ,CAAC,OAAO;AAC7B,QAAI,KAAK,IAAI,EAAE,EAAG,YAAW,IAAI,EAAE;AAAA,QAC9B,MAAK,IAAI,EAAE;AAAA,EAClB,CAAC;AACD,QAAM,mBAAmB,CAAC,GAAG,UAAU;AACvC,MAAI,iBAAiB,QAAQ;AAC3B,UAAM,IAAI;AAAA,MACR,IAAI,gCAAe,6KAEF,iBAAiB,IAAI,CAAC,OAAO,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC;AAAA,IACrE;AAAA,EACF;AAQA,MAAI,MAAM,OAAO,UAAa,eAAe,SAAS,MAAM,EAAE,GAAG;AAC/D,UAAM,IAAI;AAAA,MACR,IAAI,gCAAe,mBAAmB,MAAM,EAAE;AAAA,IAGhD;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/cjs/parts/AppPanel.js

@@ -43,6 +43,7 @@ var import_AppSection = require("./AppSection.js");
 var import_shared_styles = require("./shared-styles.js");
 const StyledWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid, { name: import_constants.DSAppPickerName, slot: import_constants.DSAppPickerSlots.ROOT })`
   background-color: ${({ theme }) => theme.colors.neutral["000"]};
+  border-radius: 4px;
   min-width: 308px;
   min-height: 110px;
   max-height: 449px;

package/dist/cjs/parts/AppPanel.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/parts/AppPanel.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { Grid } from '@elliemae/ds-grid';\nimport { useFocusTrap } from '@elliemae/ds-hooks-focus-trap';\nimport { styled } from '@elliemae/ds-system';\nimport React, { memo, useCallback, useContext, useEffect } from 'react';\nimport {\n  APP_PICKER_REGION_FOCUSES,\n  DSAppPickerDataTestIds,\n  DSAppPickerName,\n  DSAppPickerSlots,\n} from '../constants/index.js';\nimport { DSAppPickerContext } from '../DSAppPickerCTX.js';\nimport { AppSection } from './AppSection.js';\nimport { StyledListItemFullRow } from './shared-styles.js';\n\nconst StyledWrapper = styled(Grid, { name: DSAppPickerName, slot: DSAppPickerSlots.ROOT })`\n  background-color: ${({ theme }) => theme.colors.neutral['000']};\n  min-width: 308px;\n  min-height: 110px;\n  max-height: 449px;\n  width: 308px;\n  overflow-y: auto;\n  overflow-x: hidden;\n  /* Baseline 2024: reserve scrollbar gutter so the layout doesn't shift between overflow/no-overflow.\n     Replaces a JS isOverflow detection effect that toggled right padding. */\n  scrollbar-gutter: stable;\n  margin: 0;\n  padding: 0 0 8px 16px;\n  &:focus {\n    outline: none;\n  }\n`;\n\nconst StyledSeparator = styled('hr', { name: DSAppPickerName, slot: DSAppPickerSlots.SEPARATOR })`\n  border-top: 1px solid ${({ theme }) => theme.colors.neutral[300]};\n  border-bottom: none;\n  width: 100%;\n  margin: 8px 0 0 0;\n`;\n\nconst wrapperGridLayout = {\n  cols: ['repeat(3, 92px)'],\n  // Row tracks are intentionally auto-sized:\n  // - title row picks up its own typography height\n  // - chip rows expand when `wrapText` causes a chip to wrap onto a second line (Reflow story)\n  // - separator row picks up its own 1px height + margin\n  rows: ['auto'],\n};\n\nconst useExecOnceAfterFirstRender = (callback: () => void) => {\n  const hasExecutedRef = React.useRef(false);\n  const executeInitialFocusRef = React.useRef(callback);\n  executeInitialFocusRef.current = callback;\n  useEffect(() => {\n    if (!hasExecutedRef.current) {\n      executeInitialFocusRef.current();\n      hasExecutedRef.current = true;\n    }\n  }, []);\n};\n\ntype MountedOpenAutofocusNuanceConfig = {\n  pendingRef: React.MutableRefObject<boolean>;\n  trackFocusPanel: () => void;\n};\n\n/**\n * NUANCE \u2014 the single case that initial-focus-on-open (useAppPickerFloatingContext's onOpen) cannot\n * cover: DSAppPicker rendered ALREADY open (declarative `isOpen` at mount, no user interaction).\n * That open is not a transition, so `onOpen` never fires for it. This mount-time hook seeds the panel\n * wrapper, which is what a pointer open seeds too: there was no gesture at all here, so the\n * keyboard-only \"land on the selected app\" rule does not apply, and the panel is the target that gets\n * the dialog announced. `pendingRef` is true only when the component started open and is flipped\n * false on first consume, so a later controlled reopen \u2014 a real transition handled by `onOpen` \u2014\n * does not double-seed. Every user-driven open (click/keyboard) is a transition handled by `onOpen`,\n * NOT here.\n *\n * REMOVABILITY: if the team decides declarative-open should not autofocus, delete this hook and its\n * call, and flip the \"rendered already-open \u2026 focuses the panel wrapper\" assertions in\n * DSAppPicker.keyboard.test.js. Nothing else depends on it.\n */\nconst useMountedOpenAutofocusNuance = ({ pendingRef, trackFocusPanel }: MountedOpenAutofocusNuanceConfig) => {\n  useExecOnceAfterFirstRender(() => {\n    if (!pendingRef.current) return;\n    pendingRef.current = false;\n    trackFocusPanel();\n  });\n};\n\nconst AppPanelBase = () => {\n  const {\n    propsWithDefault: { customApps, onKeyDown },\n    ownerPropsConfig,\n    globalAttributes,\n    xstyledProps,\n    mountedOpenAutofocusPendingRef,\n    focusTrackers: { focusRegion, firstFocusableRef, lastFocusableRef, trackFocusPanel },\n  } = useContext(DSAppPickerContext);\n\n  // Global attributes are spread here, on the panel root, which is this component's root for the purpose\n  // of the Dimsum convention that global attributes land on the styled root (see project_slots.md \u2014 it is\n  // gate 2 of `data-dimsum-parent-slot`, and a component spreading them on an inner control is treated as\n  // a defect, not a variant).\n  //\n  // There is no element containing both the trigger and the floating panel, so \"root\" has to be chosen\n  // rather than read off the tree. The panel is the right choice, and not merely the larger one: the\n  // floating context, the sections and the chips are what this component actually is, while the trigger is\n  // the replaceable part \u2014 `TriggerComponent` already lets a consumer supply their own, and the direction\n  // ds-menu-button points at (a behavioural layer wrapping arbitrary children, with the menu as its own\n  // part) would make it fully app-owned. The panel stays the root through that change; a trigger-rooted\n  // choice would not survive it.\n  //\n  // `wrap`, `onClick`, and `onKeyDown` are filtered out because they collide with the public component API\n  // (which uses these for different semantics).\n  const { wrap, onClick, onKeyDown: onKeyDownGlobal, ...safeGlobalAttributes } = globalAttributes;\n\n  // ---------------------------------------------------------------------------\n  // Initial focus on panel open.\n  // ---------------------------------------------------------------------------\n  // User-driven opens (click/keyboard) are open transitions, seeded by\n  // useAppPickerFloatingContext's onOpen. The one case that isn't a transition \u2014 being rendered\n  // already-open (declarative `isOpen` at mount) \u2014 is covered here, scoped to exactly that.\n  useMountedOpenAutofocusNuance({\n    pendingRef: mountedOpenAutofocusPendingRef,\n    trackFocusPanel,\n  });\n\n  // ---------------------------------------------------------------------------\n  // Panel wrapper \u2014 tracker-driven focus for the mouse-open announcement path.\n  // handleWrapperRef gets a new reference when isWrapperFocused changes \u2192 React\n  // re-invokes the callback with the DOM node \u2192 node.focus() fires.\n  // ---------------------------------------------------------------------------\n  const isWrapperFocused = focusRegion === APP_PICKER_REGION_FOCUSES.PANEL;\n\n  const handleWrapperRef = useCallback(\n    (node: HTMLElement | null) => {\n      if (node && isWrapperFocused) node.focus();\n    },\n    [isWrapperFocused],\n  );\n\n  // Default Escape-close/refocus is handled declaratively by useFloatingContext\n  // (see useAppPickerFloatingContext's closeOnEscape/onEscape wiring) whenever there is no consumer\n  // onKeyDown \u2014 a consumer-provided onKeyDown takes over keydown handling entirely.\n  const handleOnKeyDown = useFocusTrap({\n    firstElementRef: firstFocusableRef,\n    lastElementRef: lastFocusableRef,\n    onKeyDown,\n  });\n\n  // The panel root carries NO aria-label: it is a roleless element (generic role does not support\n  // an accessible name, so any label here is dropped by assistive tech). The component's accessible\n  // name lives on the dialog \u2014 see AppPickerContent's role=\"dialog\" + aria-labelledby.\n  return (\n    <StyledWrapper\n      innerRef={handleWrapperRef}\n      data-testid={DSAppPickerDataTestIds.ROOT}\n      cols={wrapperGridLayout.cols}\n      rows={wrapperGridLayout.rows}\n      // when opening the dialog via mouse, the focus is programmatically assigned here via handleWrapperRef, -1 allows .focus() to work\n      tabIndex={-1}\n      {...ownerPropsConfig}\n      {...safeGlobalAttributes}\n      {...xstyledProps}\n      onKeyDown={handleOnKeyDown}\n    >\n      <AppSection />\n      {customApps.length > 0 && (\n        <>\n          <StyledListItemFullRow data-testid={DSAppPickerDataTestIds.ROW} {...ownerPropsConfig}>\n            <StyledSeparator data-testid={DSAppPickerDataTestIds.SEPARATOR} {...ownerPropsConfig} />\n          </StyledListItemFullRow>\n          <AppSection isCustomApps />\n        </>\n      )}\n    </StyledWrapper>\n  );\n};\n\nexport const AppPanel = memo(AppPanelBase);\nAppPanel.displayName = 'DSAppPicker.AppPanel';\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqKjB;AArKN,qBAAqB;AACrB,iCAA6B;AAC7B,uBAAuB;AACvB,mBAAgE;AAChE,uBAKO;AACP,4BAAmC;AACnC,wBAA2B;AAC3B,2BAAsC;AAEtC,MAAM,oBAAgB,yBAAO,qBAAM,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,KAAK,CAAC;AAAA,sBACnE,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBhE,MAAM,sBAAkB,yBAAO,MAAM,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,UAAU,CAAC;AAAA,0BACtE,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAMlE,MAAM,oBAAoB;AAAA,EACxB,MAAM,CAAC,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,EAKxB,MAAM,CAAC,MAAM;AACf;AAEA,MAAM,8BAA8B,CAAC,aAAyB;AAC5D,QAAM,iBAAiB,aAAAA,QAAM,OAAO,KAAK;AACzC,QAAM,yBAAyB,aAAAA,QAAM,OAAO,QAAQ;AACpD,yBAAuB,UAAU;AACjC,8BAAU,MAAM;AACd,QAAI,CAAC,eAAe,SAAS;AAC3B,6BAAuB,QAAQ;AAC/B,qBAAe,UAAU;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,CAAC;AACP;AAsBA,MAAM,gCAAgC,CAAC,EAAE,YAAY,gBAAgB,MAAwC;AAC3G,8BAA4B,MAAM;AAChC,QAAI,CAAC,WAAW,QAAS;AACzB,eAAW,UAAU;AACrB,oBAAgB;AAAA,EAClB,CAAC;AACH;AAEA,MAAM,eAAe,MAAM;AACzB,QAAM;AAAA,IACJ,kBAAkB,EAAE,YAAY,UAAU;AAAA,IAC1C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe,EAAE,aAAa,mBAAmB,kBAAkB,gBAAgB;AAAA,EACrF,QAAI,yBAAW,wCAAkB;AAiBjC,QAAM,EAAE,MAAM,SAAS,WAAW,iBAAiB,GAAG,qBAAqB,IAAI;AAQ/E,gCAA8B;AAAA,IAC5B,YAAY;AAAA,IACZ;AAAA,EACF,CAAC;AAOD,QAAM,mBAAmB,gBAAgB,2CAA0B;AAEnE,QAAM,uBAAmB;AAAA,IACvB,CAAC,SAA6B;AAC5B,UAAI,QAAQ,iBAAkB,MAAK,MAAM;AAAA,IAC3C;AAAA,IACA,CAAC,gBAAgB;AAAA,EACnB;AAKA,QAAM,sBAAkB,yCAAa;AAAA,IACnC,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB;AAAA,EACF,CAAC;AAKD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,eAAa,wCAAuB;AAAA,MACpC,MAAM,kBAAkB;AAAA,MACxB,MAAM,kBAAkB;AAAA,MAExB,UAAU;AAAA,MACT,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,WAAW;AAAA,MAEX;AAAA,oDAAC,gCAAW;AAAA,QACX,WAAW,SAAS,KACnB,4EACE;AAAA,sDAAC,8CAAsB,eAAa,wCAAuB,KAAM,GAAG,kBAClE,sDAAC,mBAAgB,eAAa,wCAAuB,WAAY,GAAG,kBAAkB,GACxF;AAAA,UACA,4CAAC,gCAAW,cAAY,MAAC;AAAA,WAC3B;AAAA;AAAA;AAAA,EAEJ;AAEJ;AAEO,MAAM,eAAW,mBAAK,YAAY;AACzC,SAAS,cAAc;",
+  "sourcesContent": ["import { Grid } from '@elliemae/ds-grid';\nimport { useFocusTrap } from '@elliemae/ds-hooks-focus-trap';\nimport { styled } from '@elliemae/ds-system';\nimport React, { memo, useCallback, useContext, useEffect } from 'react';\nimport {\n  APP_PICKER_REGION_FOCUSES,\n  DSAppPickerDataTestIds,\n  DSAppPickerName,\n  DSAppPickerSlots,\n} from '../constants/index.js';\nimport { DSAppPickerContext } from '../DSAppPickerCTX.js';\nimport { AppSection } from './AppSection.js';\nimport { StyledListItemFullRow } from './shared-styles.js';\n\nconst StyledWrapper = styled(Grid, { name: DSAppPickerName, slot: DSAppPickerSlots.ROOT })`\n  background-color: ${({ theme }) => theme.colors.neutral['000']};\n  border-radius: 4px;\n  min-width: 308px;\n  min-height: 110px;\n  max-height: 449px;\n  width: 308px;\n  overflow-y: auto;\n  overflow-x: hidden;\n  /* Baseline 2024: reserve scrollbar gutter so the layout doesn't shift between overflow/no-overflow.\n     Replaces a JS isOverflow detection effect that toggled right padding. */\n  scrollbar-gutter: stable;\n  margin: 0;\n  padding: 0 0 8px 16px;\n  &:focus {\n    outline: none;\n  }\n`;\n\nconst StyledSeparator = styled('hr', { name: DSAppPickerName, slot: DSAppPickerSlots.SEPARATOR })`\n  border-top: 1px solid ${({ theme }) => theme.colors.neutral[300]};\n  border-bottom: none;\n  width: 100%;\n  margin: 8px 0 0 0;\n`;\n\nconst wrapperGridLayout = {\n  cols: ['repeat(3, 92px)'],\n  // Row tracks are intentionally auto-sized:\n  // - title row picks up its own typography height\n  // - chip rows expand when `wrapText` causes a chip to wrap onto a second line (Reflow story)\n  // - separator row picks up its own 1px height + margin\n  rows: ['auto'],\n};\n\nconst useExecOnceAfterFirstRender = (callback: () => void) => {\n  const hasExecutedRef = React.useRef(false);\n  const executeInitialFocusRef = React.useRef(callback);\n  executeInitialFocusRef.current = callback;\n  useEffect(() => {\n    if (!hasExecutedRef.current) {\n      executeInitialFocusRef.current();\n      hasExecutedRef.current = true;\n    }\n  }, []);\n};\n\ntype MountedOpenAutofocusNuanceConfig = {\n  pendingRef: React.MutableRefObject<boolean>;\n  trackFocusPanel: () => void;\n};\n\n/**\n * NUANCE \u2014 the single case that initial-focus-on-open (useAppPickerFloatingContext's onOpen) cannot\n * cover: DSAppPicker rendered ALREADY open (declarative `isOpen` at mount, no user interaction).\n * That open is not a transition, so `onOpen` never fires for it. This mount-time hook seeds the panel\n * wrapper, which is what a pointer open seeds too: there was no gesture at all here, so the\n * keyboard-only \"land on the selected app\" rule does not apply, and the panel is the target that gets\n * the dialog announced. `pendingRef` is true only when the component started open and is flipped\n * false on first consume, so a later controlled reopen \u2014 a real transition handled by `onOpen` \u2014\n * does not double-seed. Every user-driven open (click/keyboard) is a transition handled by `onOpen`,\n * NOT here.\n *\n * REMOVABILITY: if the team decides declarative-open should not autofocus, delete this hook and its\n * call, and flip the \"rendered already-open \u2026 focuses the panel wrapper\" assertions in\n * DSAppPicker.keyboard.test.js. Nothing else depends on it.\n */\nconst useMountedOpenAutofocusNuance = ({ pendingRef, trackFocusPanel }: MountedOpenAutofocusNuanceConfig) => {\n  useExecOnceAfterFirstRender(() => {\n    if (!pendingRef.current) return;\n    pendingRef.current = false;\n    trackFocusPanel();\n  });\n};\n\nconst AppPanelBase = () => {\n  const {\n    propsWithDefault: { customApps, onKeyDown },\n    ownerPropsConfig,\n    globalAttributes,\n    xstyledProps,\n    mountedOpenAutofocusPendingRef,\n    focusTrackers: { focusRegion, firstFocusableRef, lastFocusableRef, trackFocusPanel },\n  } = useContext(DSAppPickerContext);\n\n  // Global attributes are spread here, on the panel root, which is this component's root for the purpose\n  // of the Dimsum convention that global attributes land on the styled root (see project_slots.md \u2014 it is\n  // gate 2 of `data-dimsum-parent-slot`, and a component spreading them on an inner control is treated as\n  // a defect, not a variant).\n  //\n  // There is no element containing both the trigger and the floating panel, so \"root\" has to be chosen\n  // rather than read off the tree. The panel is the right choice, and not merely the larger one: the\n  // floating context, the sections and the chips are what this component actually is, while the trigger is\n  // the replaceable part \u2014 `TriggerComponent` already lets a consumer supply their own, and the direction\n  // ds-menu-button points at (a behavioural layer wrapping arbitrary children, with the menu as its own\n  // part) would make it fully app-owned. The panel stays the root through that change; a trigger-rooted\n  // choice would not survive it.\n  //\n  // `wrap`, `onClick`, and `onKeyDown` are filtered out because they collide with the public component API\n  // (which uses these for different semantics).\n  const { wrap, onClick, onKeyDown: onKeyDownGlobal, ...safeGlobalAttributes } = globalAttributes;\n\n  // ---------------------------------------------------------------------------\n  // Initial focus on panel open.\n  // ---------------------------------------------------------------------------\n  // User-driven opens (click/keyboard) are open transitions, seeded by\n  // useAppPickerFloatingContext's onOpen. The one case that isn't a transition \u2014 being rendered\n  // already-open (declarative `isOpen` at mount) \u2014 is covered here, scoped to exactly that.\n  useMountedOpenAutofocusNuance({\n    pendingRef: mountedOpenAutofocusPendingRef,\n    trackFocusPanel,\n  });\n\n  // ---------------------------------------------------------------------------\n  // Panel wrapper \u2014 tracker-driven focus for the mouse-open announcement path.\n  // handleWrapperRef gets a new reference when isWrapperFocused changes \u2192 React\n  // re-invokes the callback with the DOM node \u2192 node.focus() fires.\n  // ---------------------------------------------------------------------------\n  const isWrapperFocused = focusRegion === APP_PICKER_REGION_FOCUSES.PANEL;\n\n  const handleWrapperRef = useCallback(\n    (node: HTMLElement | null) => {\n      if (node && isWrapperFocused) node.focus();\n    },\n    [isWrapperFocused],\n  );\n\n  // Default Escape-close/refocus is handled declaratively by useFloatingContext\n  // (see useAppPickerFloatingContext's closeOnEscape/onEscape wiring) whenever there is no consumer\n  // onKeyDown \u2014 a consumer-provided onKeyDown takes over keydown handling entirely.\n  const handleOnKeyDown = useFocusTrap({\n    firstElementRef: firstFocusableRef,\n    lastElementRef: lastFocusableRef,\n    onKeyDown,\n  });\n\n  // The panel root carries NO aria-label: it is a roleless element (generic role does not support\n  // an accessible name, so any label here is dropped by assistive tech). The component's accessible\n  // name lives on the dialog \u2014 see AppPickerContent's role=\"dialog\" + aria-labelledby.\n  return (\n    <StyledWrapper\n      innerRef={handleWrapperRef}\n      data-testid={DSAppPickerDataTestIds.ROOT}\n      cols={wrapperGridLayout.cols}\n      rows={wrapperGridLayout.rows}\n      // when opening the dialog via mouse, the focus is programmatically assigned here via handleWrapperRef, -1 allows .focus() to work\n      tabIndex={-1}\n      {...ownerPropsConfig}\n      {...safeGlobalAttributes}\n      {...xstyledProps}\n      onKeyDown={handleOnKeyDown}\n    >\n      <AppSection />\n      {customApps.length > 0 && (\n        <>\n          <StyledListItemFullRow data-testid={DSAppPickerDataTestIds.ROW} {...ownerPropsConfig}>\n            <StyledSeparator data-testid={DSAppPickerDataTestIds.SEPARATOR} {...ownerPropsConfig} />\n          </StyledListItemFullRow>\n          <AppSection isCustomApps />\n        </>\n      )}\n    </StyledWrapper>\n  );\n};\n\nexport const AppPanel = memo(AppPanelBase);\nAppPanel.displayName = 'DSAppPicker.AppPanel';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsKjB;AAtKN,qBAAqB;AACrB,iCAA6B;AAC7B,uBAAuB;AACvB,mBAAgE;AAChE,uBAKO;AACP,4BAAmC;AACnC,wBAA2B;AAC3B,2BAAsC;AAEtC,MAAM,oBAAgB,yBAAO,qBAAM,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,KAAK,CAAC;AAAA,sBACnE,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBhE,MAAM,sBAAkB,yBAAO,MAAM,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,UAAU,CAAC;AAAA,0BACtE,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAMlE,MAAM,oBAAoB;AAAA,EACxB,MAAM,CAAC,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,EAKxB,MAAM,CAAC,MAAM;AACf;AAEA,MAAM,8BAA8B,CAAC,aAAyB;AAC5D,QAAM,iBAAiB,aAAAA,QAAM,OAAO,KAAK;AACzC,QAAM,yBAAyB,aAAAA,QAAM,OAAO,QAAQ;AACpD,yBAAuB,UAAU;AACjC,8BAAU,MAAM;AACd,QAAI,CAAC,eAAe,SAAS;AAC3B,6BAAuB,QAAQ;AAC/B,qBAAe,UAAU;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,CAAC;AACP;AAsBA,MAAM,gCAAgC,CAAC,EAAE,YAAY,gBAAgB,MAAwC;AAC3G,8BAA4B,MAAM;AAChC,QAAI,CAAC,WAAW,QAAS;AACzB,eAAW,UAAU;AACrB,oBAAgB;AAAA,EAClB,CAAC;AACH;AAEA,MAAM,eAAe,MAAM;AACzB,QAAM;AAAA,IACJ,kBAAkB,EAAE,YAAY,UAAU;AAAA,IAC1C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe,EAAE,aAAa,mBAAmB,kBAAkB,gBAAgB;AAAA,EACrF,QAAI,yBAAW,wCAAkB;AAiBjC,QAAM,EAAE,MAAM,SAAS,WAAW,iBAAiB,GAAG,qBAAqB,IAAI;AAQ/E,gCAA8B;AAAA,IAC5B,YAAY;AAAA,IACZ;AAAA,EACF,CAAC;AAOD,QAAM,mBAAmB,gBAAgB,2CAA0B;AAEnE,QAAM,uBAAmB;AAAA,IACvB,CAAC,SAA6B;AAC5B,UAAI,QAAQ,iBAAkB,MAAK,MAAM;AAAA,IAC3C;AAAA,IACA,CAAC,gBAAgB;AAAA,EACnB;AAKA,QAAM,sBAAkB,yCAAa;AAAA,IACnC,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB;AAAA,EACF,CAAC;AAKD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,eAAa,wCAAuB;AAAA,MACpC,MAAM,kBAAkB;AAAA,MACxB,MAAM,kBAAkB;AAAA,MAExB,UAAU;AAAA,MACT,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,WAAW;AAAA,MAEX;AAAA,oDAAC,gCAAW;AAAA,QACX,WAAW,SAAS,KACnB,4EACE;AAAA,sDAAC,8CAAsB,eAAa,wCAAuB,KAAM,GAAG,kBAClE,sDAAC,mBAAgB,eAAa,wCAAuB,WAAY,GAAG,kBAAkB,GACxF;AAAA,UACA,4CAAC,gCAAW,cAAY,MAAC;AAAA,WAC3B;AAAA;AAAA;AAAA,EAEJ;AAEJ;AAEO,MAAM,eAAW,mBAAK,YAAY;AACzC,SAAS,cAAc;",
   "names": ["React"]
 }

package/dist/cjs/parts/AppPickerFloatingContext/AppPickerContent.js

@@ -46,6 +46,7 @@ const StyledAppPickerFloating = (0, import_ds_system.styled)(import_ds_floating_
   name: import_constants.DSAppPickerName,
   slot: import_constants.DSAppPickerSlots.FLOATING_WRAPPER
 })``;
+const floatingContentSlotProps = { style: { borderRadius: "4px" } };
 const AppPickerContent = () => {
   const {
     ownerPropsConfig,
@@ -93,6 +94,7 @@ const AppPickerContent = () => {
         getOwnerPropsArguments: ownerPropsConfig.getOwnerPropsArguments,
         role: "dialog",
         "aria-labelledby": dialogLabelId,
+        dsFloatingwrapperContent: floatingContentSlotProps,
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_AppPanel.AppPanel, {}),
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_floating_context.PopoverArrow, { ...arrowStyles })

package/dist/cjs/parts/AppPickerFloatingContext/AppPickerContent.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/AppPickerFloatingContext/AppPickerContent.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { FloatingWrapper, PopoverArrow } from '@elliemae/ds-floating-context';\nimport { styled } from '@elliemae/ds-system';\nimport React, { useContext } from 'react';\nimport { DSAppPickerName, DSAppPickerSlots } from '../../constants/index.js';\nimport { DSAppPickerContext } from '../../DSAppPickerCTX.js';\nimport type { DSAppPickerT } from '../../react-desc-prop-types.js';\nimport { getIdForAppPickerTrigger } from '../../util/instanceIds.js';\nimport { AppPanel } from '../AppPanel.js';\nimport { Trigger } from '../Trigger.js';\nimport { useAppPickerFloatingContext } from './useAppPickerFloatingContext.js';\n\nconst StyledAppPickerFloating = styled(FloatingWrapper, {\n  name: DSAppPickerName,\n  slot: DSAppPickerSlots.FLOATING_WRAPPER,\n})``;\n\nexport const AppPickerContent: React.ComponentType<DSAppPickerT.Props> = () => {\n  const {\n    ownerPropsConfig,\n    propsWithDefault,\n    focusTrackers,\n    openIntentRef,\n    resolvedIsOpen,\n    setInternalIsOpen,\n    instanceUid,\n  } = useContext(DSAppPickerContext);\n  const {\n    floatingStyles,\n    arrowStyles,\n    floatingContext,\n    floatingInnerRef,\n    handleTriggerRef,\n    handleTriggerClick,\n    handleTriggerKeyDown,\n  } = useAppPickerFloatingContext({\n    propsWithDefault,\n    focusTrackers,\n    openIntentRef,\n    resolvedIsOpen,\n    setInternalIsOpen,\n  });\n\n  // Suffix owned by util/instanceIds \u2014 never composed inline, so consumers and this call site cannot\n  // drift apart. `getIdForAppPickerTrigger` is the exported counterpart.\n  const dialogLabelId = getIdForAppPickerTrigger(instanceUid);\n\n  return (\n    <>\n      <Trigger\n        handleTriggerRef={handleTriggerRef}\n        handleTriggerClick={handleTriggerClick}\n        handleTriggerKeyDown={handleTriggerKeyDown}\n        dialogLabelId={dialogLabelId}\n      />\n      <StyledAppPickerFloating\n        innerRef={floatingInnerRef}\n        isOpen={resolvedIsOpen}\n        floatingStyles={floatingStyles}\n        context={floatingContext}\n        getOwnerProps={ownerPropsConfig.getOwnerProps}\n        getOwnerPropsArguments={ownerPropsConfig.getOwnerPropsArguments}\n        role=\"dialog\"\n        aria-labelledby={dialogLabelId}\n      >\n        <AppPanel />\n        <PopoverArrow {...arrowStyles} />\n      </StyledAppPickerFloating>\n    </>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD+CnB;AA/CJ,iCAA8C;AAC9C,uBAAuB;AACvB,mBAAkC;AAClC,uBAAkD;AAClD,4BAAmC;AAEnC,yBAAyC;AACzC,sBAAyB;AACzB,qBAAwB;AACxB,yCAA4C;AAE5C,MAAM,8BAA0B,yBAAO,4CAAiB;AAAA,EACtD,MAAM;AAAA,EACN,MAAM,kCAAiB;AACzB,CAAC;AAEM,MAAM,mBAA4D,MAAM;AAC7E,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,wCAAkB;AACjC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,gEAA4B;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAID,QAAM,oBAAgB,6CAAyB,WAAW;AAE1D,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,QAAQ;AAAA,QACR;AAAA,QACA,SAAS;AAAA,QACT,eAAe,iBAAiB;AAAA,QAChC,wBAAwB,iBAAiB;AAAA,QACzC,MAAK;AAAA,QACL,mBAAiB;AAAA,QAEjB;AAAA,sDAAC,4BAAS;AAAA,UACV,4CAAC,2CAAc,GAAG,aAAa;AAAA;AAAA;AAAA,IACjC;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import { FloatingWrapper, PopoverArrow } from '@elliemae/ds-floating-context';\nimport { styled } from '@elliemae/ds-system';\nimport React, { useContext } from 'react';\nimport { DSAppPickerName, DSAppPickerSlots } from '../../constants/index.js';\nimport { DSAppPickerContext } from '../../DSAppPickerCTX.js';\nimport type { DSAppPickerT } from '../../react-desc-prop-types.js';\nimport { getIdForAppPickerTrigger } from '../../util/instanceIds.js';\nimport { AppPanel } from '../AppPanel.js';\nimport { Trigger } from '../Trigger.js';\nimport { useAppPickerFloatingContext } from './useAppPickerFloatingContext.js';\n\nconst StyledAppPickerFloating = styled(FloatingWrapper, {\n  name: DSAppPickerName,\n  slot: DSAppPickerSlots.FLOATING_WRAPPER,\n})``;\n\n// FloatingWrapper has no prop to round the layer that paints the background and shadow, so it is set through its slot\nconst floatingContentSlotProps = { style: { borderRadius: '4px' } };\n\nexport const AppPickerContent: React.ComponentType<DSAppPickerT.Props> = () => {\n  const {\n    ownerPropsConfig,\n    propsWithDefault,\n    focusTrackers,\n    openIntentRef,\n    resolvedIsOpen,\n    setInternalIsOpen,\n    instanceUid,\n  } = useContext(DSAppPickerContext);\n  const {\n    floatingStyles,\n    arrowStyles,\n    floatingContext,\n    floatingInnerRef,\n    handleTriggerRef,\n    handleTriggerClick,\n    handleTriggerKeyDown,\n  } = useAppPickerFloatingContext({\n    propsWithDefault,\n    focusTrackers,\n    openIntentRef,\n    resolvedIsOpen,\n    setInternalIsOpen,\n  });\n\n  // Suffix owned by util/instanceIds \u2014 never composed inline, so consumers and this call site cannot\n  // drift apart. `getIdForAppPickerTrigger` is the exported counterpart.\n  const dialogLabelId = getIdForAppPickerTrigger(instanceUid);\n\n  return (\n    <>\n      <Trigger\n        handleTriggerRef={handleTriggerRef}\n        handleTriggerClick={handleTriggerClick}\n        handleTriggerKeyDown={handleTriggerKeyDown}\n        dialogLabelId={dialogLabelId}\n      />\n      <StyledAppPickerFloating\n        innerRef={floatingInnerRef}\n        isOpen={resolvedIsOpen}\n        floatingStyles={floatingStyles}\n        context={floatingContext}\n        getOwnerProps={ownerPropsConfig.getOwnerProps}\n        getOwnerPropsArguments={ownerPropsConfig.getOwnerPropsArguments}\n        role=\"dialog\"\n        aria-labelledby={dialogLabelId}\n        dsFloatingwrapperContent={floatingContentSlotProps}\n      >\n        <AppPanel />\n        <PopoverArrow {...arrowStyles} />\n      </StyledAppPickerFloating>\n    </>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkDnB;AAlDJ,iCAA8C;AAC9C,uBAAuB;AACvB,mBAAkC;AAClC,uBAAkD;AAClD,4BAAmC;AAEnC,yBAAyC;AACzC,sBAAyB;AACzB,qBAAwB;AACxB,yCAA4C;AAE5C,MAAM,8BAA0B,yBAAO,4CAAiB;AAAA,EACtD,MAAM;AAAA,EACN,MAAM,kCAAiB;AACzB,CAAC;AAGD,MAAM,2BAA2B,EAAE,OAAO,EAAE,cAAc,MAAM,EAAE;AAE3D,MAAM,mBAA4D,MAAM;AAC7E,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,wCAAkB;AACjC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,gEAA4B;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAID,QAAM,oBAAgB,6CAAyB,WAAW;AAE1D,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,QAAQ;AAAA,QACR;AAAA,QACA,SAAS;AAAA,QACT,eAAe,iBAAiB;AAAA,QAChC,wBAAwB,iBAAiB;AAAA,QACzC,MAAK;AAAA,QACL,mBAAiB;AAAA,QACjB,0BAA0B;AAAA,QAE1B;AAAA,sDAAC,4BAAS;AAAA,UACV,4CAAC,2CAAc,GAAG,aAAa;AAAA;AAAA;AAAA,IACjC;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/esm/config/useValidateProps.js

@@ -11,10 +11,10 @@ const useValidateProps = (props, propTypes) => {
   const suppliedAppIds = [...props.apps, ...props.customApps].map((app) => app.id).filter((id) => id !== void 0);
   const seen = /* @__PURE__ */ new Set();
   const duplicates = /* @__PURE__ */ new Set();
-  for (const id of suppliedAppIds) {
+  suppliedAppIds.forEach((id) => {
     if (seen.has(id)) duplicates.add(id);
     else seen.add(id);
-  }
+  });
   const duplicatedAppIds = [...duplicates];
   if (duplicatedAppIds.length) {
     throw new Error(

package/dist/esm/config/useValidateProps.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useValidateProps.ts"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { ValidationMap } from '@elliemae/ds-props-helpers';\nimport { type DSAppPickerT } from '../react-desc-prop-types.js';\nimport { DSAppPickerName } from '../constants/index.js';\n\nexport const useValidateProps = (props: DSAppPickerT.InternalProps, propTypes: ValidationMap<unknown>): void => {\n  useValidateTypescriptPropTypes(props, propTypes, DSAppPickerName);\n\n  if (!props.apps.length && !props.customApps.length) {\n    throw new Error(\n      `[${DSAppPickerName}] At least one of \"apps\" or \"customApps\" must contain items. ` +\n        `Providing both as empty arrays renders an empty picker.`,\n    );\n  }\n\n  /*\n   * An app's `id` is rendered verbatim as the chip's DOM id \u2014 it is the consumer's own value, deliberately\n   * left un-namespaced so they can address their chips by the identity they already know. `apps` and\n   * `customApps` are two independent arrays, so nothing about the shape of the API stops the same value\n   * appearing twice, and a duplicate DOM id is a broken document: `getElementById`, `document.querySelector`\n   * and every `aria-*` reference silently resolve to the first match only.\n   *\n   * We do not fix that by rewriting their ids \u2014 that would take away the surface the field exists to\n   * provide. We make it impossible to ship instead. Uniqueness stays the consumer's responsibility; this\n   * turns \"silently wrong in production\" into \"cannot render\", which is the only version of that\n   * responsibility that actually holds.\n   *\n   * Scoped to ids the consumer supplied: id-less apps are legal (AppSection falls back to a positional key\n   * and getChipId to a label-index identity), and no chip id is emitted for them at all.\n   */\n  const suppliedAppIds = [...props.apps, ...props.customApps]\n    .map((app) => app.id)\n    .filter((id): id is string => id !== undefined);\n\n  const seen = new Set<string>();\n  const duplicates = new Set<string>();\n  for (const id of suppliedAppIds) {\n    if (seen.has(id)) duplicates.add(id);\n    else seen.add(id);\n  }\n  const duplicatedAppIds = [...duplicates];\n  if (duplicatedAppIds.length) {\n    throw new Error(\n      `[${DSAppPickerName}] Every app \"id\" must be unique across \"apps\" and \"customApps\" \u2014 each one is ` +\n        `rendered as that chip's DOM id, and duplicates produce an invalid document. ` +\n        `Duplicated: ${duplicatedAppIds.map((id) => `\"${id}\"`).join(', ')}.`,\n    );\n  }\n\n  /*\n   * Same defect, one level up: the consumer's `id` lands unmodified on the ROOT (see util/instanceIds), so\n   * an app carrying that same value collides with it. Every id this component generates for itself is\n   * suffixed through that module and therefore cannot participate \u2014 this is the one remaining pair where\n   * two consumer-supplied values meet.\n   */\n  if (props.id !== undefined && suppliedAppIds.includes(props.id)) {\n    throw new Error(\n      `[${DSAppPickerName}] The app \"id\" \"${props.id}\" collides with the \"id\" given to the component, ` +\n        `which is rendered on the root element. Every other id is suffixed away from it \u2014 see ` +\n        `getIdForAppPickerTrigger / getIdForAppPickerSectionTitle / getIdForAppPickerCustomSectionTitle \u2014 but this one is not ours to move.`,\n    );\n  }\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,sCAAsC;AAG/C,SAAS,uBAAuB;AAEzB,MAAM,mBAAmB,CAAC,OAAmC,cAA4C;AAC9G,iCAA+B,OAAO,WAAW,eAAe;AAEhE,MAAI,CAAC,MAAM,KAAK,UAAU,CAAC,MAAM,WAAW,QAAQ;AAClD,UAAM,IAAI;AAAA,MACR,IAAI,eAAe;AAAA,IAErB;AAAA,EACF;AAiBA,QAAM,iBAAiB,CAAC,GAAG,MAAM,MAAM,GAAG,MAAM,UAAU,EACvD,IAAI,CAAC,QAAQ,IAAI,EAAE,EACnB,OAAO,CAAC,OAAqB,OAAO,MAAS;AAEhD,QAAM,OAAO,oBAAI,IAAY;AAC7B,QAAM,aAAa,oBAAI,IAAY;AACnC,aAAW,MAAM,gBAAgB;AAC/B,QAAI,KAAK,IAAI,EAAE,EAAG,YAAW,IAAI,EAAE;AAAA,QAC9B,MAAK,IAAI,EAAE;AAAA,EAClB;AACA,QAAM,mBAAmB,CAAC,GAAG,UAAU;AACvC,MAAI,iBAAiB,QAAQ;AAC3B,UAAM,IAAI;AAAA,MACR,IAAI,eAAe,6KAEF,iBAAiB,IAAI,CAAC,OAAO,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC;AAAA,IACrE;AAAA,EACF;AAQA,MAAI,MAAM,OAAO,UAAa,eAAe,SAAS,MAAM,EAAE,GAAG;AAC/D,UAAM,IAAI;AAAA,MACR,IAAI,eAAe,mBAAmB,MAAM,EAAE;AAAA,IAGhD;AAAA,EACF;AACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { ValidationMap } from '@elliemae/ds-props-helpers';\nimport { type DSAppPickerT } from '../react-desc-prop-types.js';\nimport { DSAppPickerName } from '../constants/index.js';\n\nexport const useValidateProps = (props: DSAppPickerT.InternalProps, propTypes: ValidationMap<unknown>): void => {\n  useValidateTypescriptPropTypes(props, propTypes, DSAppPickerName);\n\n  if (!props.apps.length && !props.customApps.length) {\n    throw new Error(\n      `[${DSAppPickerName}] At least one of \"apps\" or \"customApps\" must contain items. ` +\n        `Providing both as empty arrays renders an empty picker.`,\n    );\n  }\n\n  /*\n   * An app's `id` is rendered verbatim as the chip's DOM id \u2014 it is the consumer's own value, deliberately\n   * left un-namespaced so they can address their chips by the identity they already know. `apps` and\n   * `customApps` are two independent arrays, so nothing about the shape of the API stops the same value\n   * appearing twice, and a duplicate DOM id is a broken document: `getElementById`, `document.querySelector`\n   * and every `aria-*` reference silently resolve to the first match only.\n   *\n   * We do not fix that by rewriting their ids \u2014 that would take away the surface the field exists to\n   * provide. We make it impossible to ship instead. Uniqueness stays the consumer's responsibility; this\n   * turns \"silently wrong in production\" into \"cannot render\", which is the only version of that\n   * responsibility that actually holds.\n   *\n   * Scoped to ids the consumer supplied: id-less apps are legal (AppSection falls back to a positional key\n   * and getChipId to a label-index identity), and no chip id is emitted for them at all.\n   */\n  const suppliedAppIds = [...props.apps, ...props.customApps]\n    .map((app) => app.id)\n    .filter((id): id is string => id !== undefined);\n\n  const seen = new Set<string>();\n  const duplicates = new Set<string>();\n  suppliedAppIds.forEach((id) => {\n    if (seen.has(id)) duplicates.add(id);\n    else seen.add(id);\n  });\n  const duplicatedAppIds = [...duplicates];\n  if (duplicatedAppIds.length) {\n    throw new Error(\n      `[${DSAppPickerName}] Every app \"id\" must be unique across \"apps\" and \"customApps\" \u2014 each one is ` +\n        `rendered as that chip's DOM id, and duplicates produce an invalid document. ` +\n        `Duplicated: ${duplicatedAppIds.map((id) => `\"${id}\"`).join(', ')}.`,\n    );\n  }\n\n  /*\n   * Same defect, one level up: the consumer's `id` lands unmodified on the ROOT (see util/instanceIds), so\n   * an app carrying that same value collides with it. Every id this component generates for itself is\n   * suffixed through that module and therefore cannot participate \u2014 this is the one remaining pair where\n   * two consumer-supplied values meet.\n   */\n  if (props.id !== undefined && suppliedAppIds.includes(props.id)) {\n    throw new Error(\n      `[${DSAppPickerName}] The app \"id\" \"${props.id}\" collides with the \"id\" given to the component, ` +\n        `which is rendered on the root element. Every other id is suffixed away from it \u2014 see ` +\n        `getIdForAppPickerTrigger / getIdForAppPickerSectionTitle / getIdForAppPickerCustomSectionTitle \u2014 but this one is not ours to move.`,\n    );\n  }\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,sCAAsC;AAG/C,SAAS,uBAAuB;AAEzB,MAAM,mBAAmB,CAAC,OAAmC,cAA4C;AAC9G,iCAA+B,OAAO,WAAW,eAAe;AAEhE,MAAI,CAAC,MAAM,KAAK,UAAU,CAAC,MAAM,WAAW,QAAQ;AAClD,UAAM,IAAI;AAAA,MACR,IAAI,eAAe;AAAA,IAErB;AAAA,EACF;AAiBA,QAAM,iBAAiB,CAAC,GAAG,MAAM,MAAM,GAAG,MAAM,UAAU,EACvD,IAAI,CAAC,QAAQ,IAAI,EAAE,EACnB,OAAO,CAAC,OAAqB,OAAO,MAAS;AAEhD,QAAM,OAAO,oBAAI,IAAY;AAC7B,QAAM,aAAa,oBAAI,IAAY;AACnC,iBAAe,QAAQ,CAAC,OAAO;AAC7B,QAAI,KAAK,IAAI,EAAE,EAAG,YAAW,IAAI,EAAE;AAAA,QAC9B,MAAK,IAAI,EAAE;AAAA,EAClB,CAAC;AACD,QAAM,mBAAmB,CAAC,GAAG,UAAU;AACvC,MAAI,iBAAiB,QAAQ;AAC3B,UAAM,IAAI;AAAA,MACR,IAAI,eAAe,6KAEF,iBAAiB,IAAI,CAAC,OAAO,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC;AAAA,IACrE;AAAA,EACF;AAQA,MAAI,MAAM,OAAO,UAAa,eAAe,SAAS,MAAM,EAAE,GAAG;AAC/D,UAAM,IAAI;AAAA,MACR,IAAI,eAAe,mBAAmB,MAAM,EAAE;AAAA,IAGhD;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/esm/parts/AppPanel.js

@@ -15,6 +15,7 @@ import { AppSection } from "./AppSection.js";
 import { StyledListItemFullRow } from "./shared-styles.js";
 const StyledWrapper = styled(Grid, { name: DSAppPickerName, slot: DSAppPickerSlots.ROOT })`
   background-color: ${({ theme }) => theme.colors.neutral["000"]};
+  border-radius: 4px;
   min-width: 308px;
   min-height: 110px;
   max-height: 449px;

package/dist/esm/parts/AppPanel.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/AppPanel.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Grid } from '@elliemae/ds-grid';\nimport { useFocusTrap } from '@elliemae/ds-hooks-focus-trap';\nimport { styled } from '@elliemae/ds-system';\nimport React, { memo, useCallback, useContext, useEffect } from 'react';\nimport {\n  APP_PICKER_REGION_FOCUSES,\n  DSAppPickerDataTestIds,\n  DSAppPickerName,\n  DSAppPickerSlots,\n} from '../constants/index.js';\nimport { DSAppPickerContext } from '../DSAppPickerCTX.js';\nimport { AppSection } from './AppSection.js';\nimport { StyledListItemFullRow } from './shared-styles.js';\n\nconst StyledWrapper = styled(Grid, { name: DSAppPickerName, slot: DSAppPickerSlots.ROOT })`\n  background-color: ${({ theme }) => theme.colors.neutral['000']};\n  min-width: 308px;\n  min-height: 110px;\n  max-height: 449px;\n  width: 308px;\n  overflow-y: auto;\n  overflow-x: hidden;\n  /* Baseline 2024: reserve scrollbar gutter so the layout doesn't shift between overflow/no-overflow.\n     Replaces a JS isOverflow detection effect that toggled right padding. */\n  scrollbar-gutter: stable;\n  margin: 0;\n  padding: 0 0 8px 16px;\n  &:focus {\n    outline: none;\n  }\n`;\n\nconst StyledSeparator = styled('hr', { name: DSAppPickerName, slot: DSAppPickerSlots.SEPARATOR })`\n  border-top: 1px solid ${({ theme }) => theme.colors.neutral[300]};\n  border-bottom: none;\n  width: 100%;\n  margin: 8px 0 0 0;\n`;\n\nconst wrapperGridLayout = {\n  cols: ['repeat(3, 92px)'],\n  // Row tracks are intentionally auto-sized:\n  // - title row picks up its own typography height\n  // - chip rows expand when `wrapText` causes a chip to wrap onto a second line (Reflow story)\n  // - separator row picks up its own 1px height + margin\n  rows: ['auto'],\n};\n\nconst useExecOnceAfterFirstRender = (callback: () => void) => {\n  const hasExecutedRef = React.useRef(false);\n  const executeInitialFocusRef = React.useRef(callback);\n  executeInitialFocusRef.current = callback;\n  useEffect(() => {\n    if (!hasExecutedRef.current) {\n      executeInitialFocusRef.current();\n      hasExecutedRef.current = true;\n    }\n  }, []);\n};\n\ntype MountedOpenAutofocusNuanceConfig = {\n  pendingRef: React.MutableRefObject<boolean>;\n  trackFocusPanel: () => void;\n};\n\n/**\n * NUANCE \u2014 the single case that initial-focus-on-open (useAppPickerFloatingContext's onOpen) cannot\n * cover: DSAppPicker rendered ALREADY open (declarative `isOpen` at mount, no user interaction).\n * That open is not a transition, so `onOpen` never fires for it. This mount-time hook seeds the panel\n * wrapper, which is what a pointer open seeds too: there was no gesture at all here, so the\n * keyboard-only \"land on the selected app\" rule does not apply, and the panel is the target that gets\n * the dialog announced. `pendingRef` is true only when the component started open and is flipped\n * false on first consume, so a later controlled reopen \u2014 a real transition handled by `onOpen` \u2014\n * does not double-seed. Every user-driven open (click/keyboard) is a transition handled by `onOpen`,\n * NOT here.\n *\n * REMOVABILITY: if the team decides declarative-open should not autofocus, delete this hook and its\n * call, and flip the \"rendered already-open \u2026 focuses the panel wrapper\" assertions in\n * DSAppPicker.keyboard.test.js. Nothing else depends on it.\n */\nconst useMountedOpenAutofocusNuance = ({ pendingRef, trackFocusPanel }: MountedOpenAutofocusNuanceConfig) => {\n  useExecOnceAfterFirstRender(() => {\n    if (!pendingRef.current) return;\n    pendingRef.current = false;\n    trackFocusPanel();\n  });\n};\n\nconst AppPanelBase = () => {\n  const {\n    propsWithDefault: { customApps, onKeyDown },\n    ownerPropsConfig,\n    globalAttributes,\n    xstyledProps,\n    mountedOpenAutofocusPendingRef,\n    focusTrackers: { focusRegion, firstFocusableRef, lastFocusableRef, trackFocusPanel },\n  } = useContext(DSAppPickerContext);\n\n  // Global attributes are spread here, on the panel root, which is this component's root for the purpose\n  // of the Dimsum convention that global attributes land on the styled root (see project_slots.md \u2014 it is\n  // gate 2 of `data-dimsum-parent-slot`, and a component spreading them on an inner control is treated as\n  // a defect, not a variant).\n  //\n  // There is no element containing both the trigger and the floating panel, so \"root\" has to be chosen\n  // rather than read off the tree. The panel is the right choice, and not merely the larger one: the\n  // floating context, the sections and the chips are what this component actually is, while the trigger is\n  // the replaceable part \u2014 `TriggerComponent` already lets a consumer supply their own, and the direction\n  // ds-menu-button points at (a behavioural layer wrapping arbitrary children, with the menu as its own\n  // part) would make it fully app-owned. The panel stays the root through that change; a trigger-rooted\n  // choice would not survive it.\n  //\n  // `wrap`, `onClick`, and `onKeyDown` are filtered out because they collide with the public component API\n  // (which uses these for different semantics).\n  const { wrap, onClick, onKeyDown: onKeyDownGlobal, ...safeGlobalAttributes } = globalAttributes;\n\n  // ---------------------------------------------------------------------------\n  // Initial focus on panel open.\n  // ---------------------------------------------------------------------------\n  // User-driven opens (click/keyboard) are open transitions, seeded by\n  // useAppPickerFloatingContext's onOpen. The one case that isn't a transition \u2014 being rendered\n  // already-open (declarative `isOpen` at mount) \u2014 is covered here, scoped to exactly that.\n  useMountedOpenAutofocusNuance({\n    pendingRef: mountedOpenAutofocusPendingRef,\n    trackFocusPanel,\n  });\n\n  // ---------------------------------------------------------------------------\n  // Panel wrapper \u2014 tracker-driven focus for the mouse-open announcement path.\n  // handleWrapperRef gets a new reference when isWrapperFocused changes \u2192 React\n  // re-invokes the callback with the DOM node \u2192 node.focus() fires.\n  // ---------------------------------------------------------------------------\n  const isWrapperFocused = focusRegion === APP_PICKER_REGION_FOCUSES.PANEL;\n\n  const handleWrapperRef = useCallback(\n    (node: HTMLElement | null) => {\n      if (node && isWrapperFocused) node.focus();\n    },\n    [isWrapperFocused],\n  );\n\n  // Default Escape-close/refocus is handled declaratively by useFloatingContext\n  // (see useAppPickerFloatingContext's closeOnEscape/onEscape wiring) whenever there is no consumer\n  // onKeyDown \u2014 a consumer-provided onKeyDown takes over keydown handling entirely.\n  const handleOnKeyDown = useFocusTrap({\n    firstElementRef: firstFocusableRef,\n    lastElementRef: lastFocusableRef,\n    onKeyDown,\n  });\n\n  // The panel root carries NO aria-label: it is a roleless element (generic role does not support\n  // an accessible name, so any label here is dropped by assistive tech). The component's accessible\n  // name lives on the dialog \u2014 see AppPickerContent's role=\"dialog\" + aria-labelledby.\n  return (\n    <StyledWrapper\n      innerRef={handleWrapperRef}\n      data-testid={DSAppPickerDataTestIds.ROOT}\n      cols={wrapperGridLayout.cols}\n      rows={wrapperGridLayout.rows}\n      // when opening the dialog via mouse, the focus is programmatically assigned here via handleWrapperRef, -1 allows .focus() to work\n      tabIndex={-1}\n      {...ownerPropsConfig}\n      {...safeGlobalAttributes}\n      {...xstyledProps}\n      onKeyDown={handleOnKeyDown}\n    >\n      <AppSection />\n      {customApps.length > 0 && (\n        <>\n          <StyledListItemFullRow data-testid={DSAppPickerDataTestIds.ROW} {...ownerPropsConfig}>\n            <StyledSeparator data-testid={DSAppPickerDataTestIds.SEPARATOR} {...ownerPropsConfig} />\n          </StyledListItemFullRow>\n          <AppSection isCustomApps />\n        </>\n      )}\n    </StyledWrapper>\n  );\n};\n\nexport const AppPanel = memo(AppPanelBase);\nAppPanel.displayName = 'DSAppPicker.AppPanel';\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Grid } from '@elliemae/ds-grid';\nimport { useFocusTrap } from '@elliemae/ds-hooks-focus-trap';\nimport { styled } from '@elliemae/ds-system';\nimport React, { memo, useCallback, useContext, useEffect } from 'react';\nimport {\n  APP_PICKER_REGION_FOCUSES,\n  DSAppPickerDataTestIds,\n  DSAppPickerName,\n  DSAppPickerSlots,\n} from '../constants/index.js';\nimport { DSAppPickerContext } from '../DSAppPickerCTX.js';\nimport { AppSection } from './AppSection.js';\nimport { StyledListItemFullRow } from './shared-styles.js';\n\nconst StyledWrapper = styled(Grid, { name: DSAppPickerName, slot: DSAppPickerSlots.ROOT })`\n  background-color: ${({ theme }) => theme.colors.neutral['000']};\n  border-radius: 4px;\n  min-width: 308px;\n  min-height: 110px;\n  max-height: 449px;\n  width: 308px;\n  overflow-y: auto;\n  overflow-x: hidden;\n  /* Baseline 2024: reserve scrollbar gutter so the layout doesn't shift between overflow/no-overflow.\n     Replaces a JS isOverflow detection effect that toggled right padding. */\n  scrollbar-gutter: stable;\n  margin: 0;\n  padding: 0 0 8px 16px;\n  &:focus {\n    outline: none;\n  }\n`;\n\nconst StyledSeparator = styled('hr', { name: DSAppPickerName, slot: DSAppPickerSlots.SEPARATOR })`\n  border-top: 1px solid ${({ theme }) => theme.colors.neutral[300]};\n  border-bottom: none;\n  width: 100%;\n  margin: 8px 0 0 0;\n`;\n\nconst wrapperGridLayout = {\n  cols: ['repeat(3, 92px)'],\n  // Row tracks are intentionally auto-sized:\n  // - title row picks up its own typography height\n  // - chip rows expand when `wrapText` causes a chip to wrap onto a second line (Reflow story)\n  // - separator row picks up its own 1px height + margin\n  rows: ['auto'],\n};\n\nconst useExecOnceAfterFirstRender = (callback: () => void) => {\n  const hasExecutedRef = React.useRef(false);\n  const executeInitialFocusRef = React.useRef(callback);\n  executeInitialFocusRef.current = callback;\n  useEffect(() => {\n    if (!hasExecutedRef.current) {\n      executeInitialFocusRef.current();\n      hasExecutedRef.current = true;\n    }\n  }, []);\n};\n\ntype MountedOpenAutofocusNuanceConfig = {\n  pendingRef: React.MutableRefObject<boolean>;\n  trackFocusPanel: () => void;\n};\n\n/**\n * NUANCE \u2014 the single case that initial-focus-on-open (useAppPickerFloatingContext's onOpen) cannot\n * cover: DSAppPicker rendered ALREADY open (declarative `isOpen` at mount, no user interaction).\n * That open is not a transition, so `onOpen` never fires for it. This mount-time hook seeds the panel\n * wrapper, which is what a pointer open seeds too: there was no gesture at all here, so the\n * keyboard-only \"land on the selected app\" rule does not apply, and the panel is the target that gets\n * the dialog announced. `pendingRef` is true only when the component started open and is flipped\n * false on first consume, so a later controlled reopen \u2014 a real transition handled by `onOpen` \u2014\n * does not double-seed. Every user-driven open (click/keyboard) is a transition handled by `onOpen`,\n * NOT here.\n *\n * REMOVABILITY: if the team decides declarative-open should not autofocus, delete this hook and its\n * call, and flip the \"rendered already-open \u2026 focuses the panel wrapper\" assertions in\n * DSAppPicker.keyboard.test.js. Nothing else depends on it.\n */\nconst useMountedOpenAutofocusNuance = ({ pendingRef, trackFocusPanel }: MountedOpenAutofocusNuanceConfig) => {\n  useExecOnceAfterFirstRender(() => {\n    if (!pendingRef.current) return;\n    pendingRef.current = false;\n    trackFocusPanel();\n  });\n};\n\nconst AppPanelBase = () => {\n  const {\n    propsWithDefault: { customApps, onKeyDown },\n    ownerPropsConfig,\n    globalAttributes,\n    xstyledProps,\n    mountedOpenAutofocusPendingRef,\n    focusTrackers: { focusRegion, firstFocusableRef, lastFocusableRef, trackFocusPanel },\n  } = useContext(DSAppPickerContext);\n\n  // Global attributes are spread here, on the panel root, which is this component's root for the purpose\n  // of the Dimsum convention that global attributes land on the styled root (see project_slots.md \u2014 it is\n  // gate 2 of `data-dimsum-parent-slot`, and a component spreading them on an inner control is treated as\n  // a defect, not a variant).\n  //\n  // There is no element containing both the trigger and the floating panel, so \"root\" has to be chosen\n  // rather than read off the tree. The panel is the right choice, and not merely the larger one: the\n  // floating context, the sections and the chips are what this component actually is, while the trigger is\n  // the replaceable part \u2014 `TriggerComponent` already lets a consumer supply their own, and the direction\n  // ds-menu-button points at (a behavioural layer wrapping arbitrary children, with the menu as its own\n  // part) would make it fully app-owned. The panel stays the root through that change; a trigger-rooted\n  // choice would not survive it.\n  //\n  // `wrap`, `onClick`, and `onKeyDown` are filtered out because they collide with the public component API\n  // (which uses these for different semantics).\n  const { wrap, onClick, onKeyDown: onKeyDownGlobal, ...safeGlobalAttributes } = globalAttributes;\n\n  // ---------------------------------------------------------------------------\n  // Initial focus on panel open.\n  // ---------------------------------------------------------------------------\n  // User-driven opens (click/keyboard) are open transitions, seeded by\n  // useAppPickerFloatingContext's onOpen. The one case that isn't a transition \u2014 being rendered\n  // already-open (declarative `isOpen` at mount) \u2014 is covered here, scoped to exactly that.\n  useMountedOpenAutofocusNuance({\n    pendingRef: mountedOpenAutofocusPendingRef,\n    trackFocusPanel,\n  });\n\n  // ---------------------------------------------------------------------------\n  // Panel wrapper \u2014 tracker-driven focus for the mouse-open announcement path.\n  // handleWrapperRef gets a new reference when isWrapperFocused changes \u2192 React\n  // re-invokes the callback with the DOM node \u2192 node.focus() fires.\n  // ---------------------------------------------------------------------------\n  const isWrapperFocused = focusRegion === APP_PICKER_REGION_FOCUSES.PANEL;\n\n  const handleWrapperRef = useCallback(\n    (node: HTMLElement | null) => {\n      if (node && isWrapperFocused) node.focus();\n    },\n    [isWrapperFocused],\n  );\n\n  // Default Escape-close/refocus is handled declaratively by useFloatingContext\n  // (see useAppPickerFloatingContext's closeOnEscape/onEscape wiring) whenever there is no consumer\n  // onKeyDown \u2014 a consumer-provided onKeyDown takes over keydown handling entirely.\n  const handleOnKeyDown = useFocusTrap({\n    firstElementRef: firstFocusableRef,\n    lastElementRef: lastFocusableRef,\n    onKeyDown,\n  });\n\n  // The panel root carries NO aria-label: it is a roleless element (generic role does not support\n  // an accessible name, so any label here is dropped by assistive tech). The component's accessible\n  // name lives on the dialog \u2014 see AppPickerContent's role=\"dialog\" + aria-labelledby.\n  return (\n    <StyledWrapper\n      innerRef={handleWrapperRef}\n      data-testid={DSAppPickerDataTestIds.ROOT}\n      cols={wrapperGridLayout.cols}\n      rows={wrapperGridLayout.rows}\n      // when opening the dialog via mouse, the focus is programmatically assigned here via handleWrapperRef, -1 allows .focus() to work\n      tabIndex={-1}\n      {...ownerPropsConfig}\n      {...safeGlobalAttributes}\n      {...xstyledProps}\n      onKeyDown={handleOnKeyDown}\n    >\n      <AppSection />\n      {customApps.length > 0 && (\n        <>\n          <StyledListItemFullRow data-testid={DSAppPickerDataTestIds.ROW} {...ownerPropsConfig}>\n            <StyledSeparator data-testid={DSAppPickerDataTestIds.SEPARATOR} {...ownerPropsConfig} />\n          </StyledListItemFullRow>\n          <AppSection isCustomApps />\n        </>\n      )}\n    </StyledWrapper>\n  );\n};\n\nexport const AppPanel = memo(AppPanelBase);\nAppPanel.displayName = 'DSAppPicker.AppPanel';\n"],
+  "mappings": "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",
   "names": ["React"]
 }

package/dist/esm/parts/AppPickerFloatingContext/AppPickerContent.js

@@ -13,6 +13,7 @@ const StyledAppPickerFloating = styled(FloatingWrapper, {
   name: DSAppPickerName,
   slot: DSAppPickerSlots.FLOATING_WRAPPER
 })``;
+const floatingContentSlotProps = { style: { borderRadius: "4px" } };
 const AppPickerContent = () => {
   const {
     ownerPropsConfig,
@@ -60,6 +61,7 @@ const AppPickerContent = () => {
         getOwnerPropsArguments: ownerPropsConfig.getOwnerPropsArguments,
         role: "dialog",
         "aria-labelledby": dialogLabelId,
+        dsFloatingwrapperContent: floatingContentSlotProps,
         children: [
           /* @__PURE__ */ jsx(AppPanel, {}),
           /* @__PURE__ */ jsx(PopoverArrow, { ...arrowStyles })

package/dist/esm/parts/AppPickerFloatingContext/AppPickerContent.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/AppPickerFloatingContext/AppPickerContent.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { FloatingWrapper, PopoverArrow } from '@elliemae/ds-floating-context';\nimport { styled } from '@elliemae/ds-system';\nimport React, { useContext } from 'react';\nimport { DSAppPickerName, DSAppPickerSlots } from '../../constants/index.js';\nimport { DSAppPickerContext } from '../../DSAppPickerCTX.js';\nimport type { DSAppPickerT } from '../../react-desc-prop-types.js';\nimport { getIdForAppPickerTrigger } from '../../util/instanceIds.js';\nimport { AppPanel } from '../AppPanel.js';\nimport { Trigger } from '../Trigger.js';\nimport { useAppPickerFloatingContext } from './useAppPickerFloatingContext.js';\n\nconst StyledAppPickerFloating = styled(FloatingWrapper, {\n  name: DSAppPickerName,\n  slot: DSAppPickerSlots.FLOATING_WRAPPER,\n})``;\n\nexport const AppPickerContent: React.ComponentType<DSAppPickerT.Props> = () => {\n  const {\n    ownerPropsConfig,\n    propsWithDefault,\n    focusTrackers,\n    openIntentRef,\n    resolvedIsOpen,\n    setInternalIsOpen,\n    instanceUid,\n  } = useContext(DSAppPickerContext);\n  const {\n    floatingStyles,\n    arrowStyles,\n    floatingContext,\n    floatingInnerRef,\n    handleTriggerRef,\n    handleTriggerClick,\n    handleTriggerKeyDown,\n  } = useAppPickerFloatingContext({\n    propsWithDefault,\n    focusTrackers,\n    openIntentRef,\n    resolvedIsOpen,\n    setInternalIsOpen,\n  });\n\n  // Suffix owned by util/instanceIds \u2014 never composed inline, so consumers and this call site cannot\n  // drift apart. `getIdForAppPickerTrigger` is the exported counterpart.\n  const dialogLabelId = getIdForAppPickerTrigger(instanceUid);\n\n  return (\n    <>\n      <Trigger\n        handleTriggerRef={handleTriggerRef}\n        handleTriggerClick={handleTriggerClick}\n        handleTriggerKeyDown={handleTriggerKeyDown}\n        dialogLabelId={dialogLabelId}\n      />\n      <StyledAppPickerFloating\n        innerRef={floatingInnerRef}\n        isOpen={resolvedIsOpen}\n        floatingStyles={floatingStyles}\n        context={floatingContext}\n        getOwnerProps={ownerPropsConfig.getOwnerProps}\n        getOwnerPropsArguments={ownerPropsConfig.getOwnerPropsArguments}\n        role=\"dialog\"\n        aria-labelledby={dialogLabelId}\n      >\n        <AppPanel />\n        <PopoverArrow {...arrowStyles} />\n      </StyledAppPickerFloating>\n    </>\n  );\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;AC+CnB,mBACE,KAMA,YAPF;AA/CJ,SAAS,iBAAiB,oBAAoB;AAC9C,SAAS,cAAc;AACvB,SAAgB,kBAAkB;AAClC,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,0BAA0B;AAEnC,SAAS,gCAAgC;AACzC,SAAS,gBAAgB;AACzB,SAAS,eAAe;AACxB,SAAS,mCAAmC;AAE5C,MAAM,0BAA0B,OAAO,iBAAiB;AAAA,EACtD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAEM,MAAM,mBAA4D,MAAM;AAC7E,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,kBAAkB;AACjC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,4BAA4B;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAID,QAAM,gBAAgB,yBAAyB,WAAW;AAE1D,SACE,iCACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,QAAQ;AAAA,QACR;AAAA,QACA,SAAS;AAAA,QACT,eAAe,iBAAiB;AAAA,QAChC,wBAAwB,iBAAiB;AAAA,QACzC,MAAK;AAAA,QACL,mBAAiB;AAAA,QAEjB;AAAA,8BAAC,YAAS;AAAA,UACV,oBAAC,gBAAc,GAAG,aAAa;AAAA;AAAA;AAAA,IACjC;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { FloatingWrapper, PopoverArrow } from '@elliemae/ds-floating-context';\nimport { styled } from '@elliemae/ds-system';\nimport React, { useContext } from 'react';\nimport { DSAppPickerName, DSAppPickerSlots } from '../../constants/index.js';\nimport { DSAppPickerContext } from '../../DSAppPickerCTX.js';\nimport type { DSAppPickerT } from '../../react-desc-prop-types.js';\nimport { getIdForAppPickerTrigger } from '../../util/instanceIds.js';\nimport { AppPanel } from '../AppPanel.js';\nimport { Trigger } from '../Trigger.js';\nimport { useAppPickerFloatingContext } from './useAppPickerFloatingContext.js';\n\nconst StyledAppPickerFloating = styled(FloatingWrapper, {\n  name: DSAppPickerName,\n  slot: DSAppPickerSlots.FLOATING_WRAPPER,\n})``;\n\n// FloatingWrapper has no prop to round the layer that paints the background and shadow, so it is set through its slot\nconst floatingContentSlotProps = { style: { borderRadius: '4px' } };\n\nexport const AppPickerContent: React.ComponentType<DSAppPickerT.Props> = () => {\n  const {\n    ownerPropsConfig,\n    propsWithDefault,\n    focusTrackers,\n    openIntentRef,\n    resolvedIsOpen,\n    setInternalIsOpen,\n    instanceUid,\n  } = useContext(DSAppPickerContext);\n  const {\n    floatingStyles,\n    arrowStyles,\n    floatingContext,\n    floatingInnerRef,\n    handleTriggerRef,\n    handleTriggerClick,\n    handleTriggerKeyDown,\n  } = useAppPickerFloatingContext({\n    propsWithDefault,\n    focusTrackers,\n    openIntentRef,\n    resolvedIsOpen,\n    setInternalIsOpen,\n  });\n\n  // Suffix owned by util/instanceIds \u2014 never composed inline, so consumers and this call site cannot\n  // drift apart. `getIdForAppPickerTrigger` is the exported counterpart.\n  const dialogLabelId = getIdForAppPickerTrigger(instanceUid);\n\n  return (\n    <>\n      <Trigger\n        handleTriggerRef={handleTriggerRef}\n        handleTriggerClick={handleTriggerClick}\n        handleTriggerKeyDown={handleTriggerKeyDown}\n        dialogLabelId={dialogLabelId}\n      />\n      <StyledAppPickerFloating\n        innerRef={floatingInnerRef}\n        isOpen={resolvedIsOpen}\n        floatingStyles={floatingStyles}\n        context={floatingContext}\n        getOwnerProps={ownerPropsConfig.getOwnerProps}\n        getOwnerPropsArguments={ownerPropsConfig.getOwnerPropsArguments}\n        role=\"dialog\"\n        aria-labelledby={dialogLabelId}\n        dsFloatingwrapperContent={floatingContentSlotProps}\n      >\n        <AppPanel />\n        <PopoverArrow {...arrowStyles} />\n      </StyledAppPickerFloating>\n    </>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACkDnB,mBACE,KAMA,YAPF;AAlDJ,SAAS,iBAAiB,oBAAoB;AAC9C,SAAS,cAAc;AACvB,SAAgB,kBAAkB;AAClC,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,0BAA0B;AAEnC,SAAS,gCAAgC;AACzC,SAAS,gBAAgB;AACzB,SAAS,eAAe;AACxB,SAAS,mCAAmC;AAE5C,MAAM,0BAA0B,OAAO,iBAAiB;AAAA,EACtD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAGD,MAAM,2BAA2B,EAAE,OAAO,EAAE,cAAc,MAAM,EAAE;AAE3D,MAAM,mBAA4D,MAAM;AAC7E,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,kBAAkB;AACjC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,4BAA4B;AAAA,IAC9B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAID,QAAM,gBAAgB,yBAAyB,WAAW;AAE1D,SACE,iCACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,QAAQ;AAAA,QACR;AAAA,QACA,SAAS;AAAA,QACT,eAAe,iBAAiB;AAAA,QAChC,wBAAwB,iBAAiB;AAAA,QACzC,MAAK;AAAA,QACL,mBAAiB;AAAA,QACjB,0BAA0B;AAAA,QAE1B;AAAA,8BAAC,YAAS;AAAA,UACV,oBAAC,gBAAc,GAAG,aAAa;AAAA;AAAA;AAAA,IACjC;AAAA,KACF;AAEJ;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-app-picker",
-  "version": "3.80.0-next.51",
+  "version": "3.80.0-next.53",
   "license": "MIT",
   "description": "ICE MT - Dimsum - App Picker",
   "files": [
@@ -36,21 +36,21 @@
     "indent": 4
   },
   "dependencies": {
-    "@elliemae/ds-button-v2": "3.80.0-next.51",
-    "@elliemae/ds-chip": "3.80.0-next.51",
-    "@elliemae/ds-floating-context": "3.80.0-next.51",
-    "@elliemae/ds-grid": "3.80.0-next.51",
-    "@elliemae/ds-hooks-focus-trap": "3.80.0-next.51",
-    "@elliemae/ds-icons": "3.80.0-next.51",
-    "@elliemae/ds-props-helpers": "3.80.0-next.51",
-    "@elliemae/ds-system": "3.80.0-next.51",
-    "@elliemae/ds-typography": "3.80.0-next.51",
+    "@elliemae/ds-button-v2": "3.80.0-next.53",
+    "@elliemae/ds-chip": "3.80.0-next.53",
+    "@elliemae/ds-floating-context": "3.80.0-next.53",
+    "@elliemae/ds-grid": "3.80.0-next.53",
+    "@elliemae/ds-hooks-focus-trap": "3.80.0-next.53",
+    "@elliemae/ds-icons": "3.80.0-next.53",
+    "@elliemae/ds-props-helpers": "3.80.0-next.53",
+    "@elliemae/ds-system": "3.80.0-next.53",
+    "@elliemae/ds-typography": "3.80.0-next.53",
     "uid": "^2.0.2"
   },
   "devDependencies": {
-    "@elliemae/ds-monorepo-devops": "3.80.0-next.51",
-    "@elliemae/ds-test-utils": "3.80.0-next.51",
-    "@elliemae/ds-typescript-helpers": "3.80.0-next.51",
+    "@elliemae/ds-monorepo-devops": "3.80.0-next.53",
+    "@elliemae/ds-test-utils": "3.80.0-next.53",
+    "@elliemae/ds-typescript-helpers": "3.80.0-next.53",
     "@playwright/experimental-ct-react": "1.61.1",
     "jest": "^30.0.0",
     "jest-axe": "^11.0.0",