@elliemae/ds-app-picker 3.70.0-next.2 → 3.70.0-next.21

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/AppSection.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { StyledListItemFullRow, StyledTitle } from './style.js';\nimport { DSAppPickerDataTestIds } from '../constants/index.js';\nimport type { DSAppPickerT } from '../react-desc-prop-types.js';\nimport { AppPickerItem } from './AppPickerItem.js';\n\ninterface AppSectionProps {\n  items: DSAppPickerT.AppItem[];\n  title: string;\n  positionOffset: number;\n  totalCount: number;\n  ownerProps: { getOwnerProps: () => object };\n  onItemClick: (e: React.MouseEvent, app: DSAppPickerT.AppItem) => void;\n  keyPrefix?: string;\n  firstFocusableIdx: number;\n  lastFocusableIdx: number;\n}\n\nexport const AppSection: React.FC<AppSectionProps> = ({\n  items,\n  title,\n  positionOffset,\n  totalCount,\n  ownerProps,\n  onItemClick,\n  keyPrefix = '',\n  firstFocusableIdx,\n  lastFocusableIdx,\n}) => (\n  <>\n    <StyledListItemFullRow data-testid={DSAppPickerDataTestIds.ROW} aria-hidden role=\"group\" {...ownerProps}>\n      <StyledTitle data-testid={DSAppPickerDataTestIds.TITLE} role=\"presentation\" variant=\"h3-strong\" {...ownerProps}>\n        {title}\n      </StyledTitle>\n    </StyledListItemFullRow>\n    {items.map((app, index) => {\n      const flatIndex = positionOffset + index;\n      return (\n        <AppPickerItem\n          key={app.id ?? `${app.label}-${keyPrefix}${index}`}\n          app={app}\n          positionLabel={`${title} (${flatIndex + 1} of ${totalCount})`}\n          ownerProps={ownerProps}\n          onClick={onItemClick}\n          isFirstFocusable={flatIndex === firstFocusableIdx}\n          isLastFocusable={flatIndex === lastFocusableIdx}\n        />\n      );\n    })}\n  </>\n);\n\nAppSection.displayName = 'DSAppPicker.AppSection';\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC6BrB,mBAEI,KAFJ;AA5BF,SAAS,uBAAuB,mBAAmB;AACnD,SAAS,8BAA8B;AAEvC,SAAS,qBAAqB;AAcvB,MAAM,aAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AACF,MACE,iCACE;AAAA,sBAAC,yBAAsB,eAAa,uBAAuB,KAAK,eAAW,MAAC,MAAK,SAAS,GAAG,YAC3F,8BAAC,eAAY,eAAa,uBAAuB,OAAO,MAAK,gBAAe,SAAQ,aAAa,GAAG,YACjG,iBACH,GACF;AAAA,EACC,MAAM,IAAI,CAAC,KAAK,UAAU;AACzB,UAAM,YAAY,iBAAiB;AACnC,WACE;AAAA,MAAC;AAAA;AAAA,QAEC;AAAA,QACA,eAAe,GAAG,KAAK,KAAK,YAAY,CAAC,OAAO,UAAU;AAAA,QAC1D;AAAA,QACA,SAAS;AAAA,QACT,kBAAkB,cAAc;AAAA,QAChC,iBAAiB,cAAc;AAAA;AAAA,MAN1B,IAAI,MAAM,GAAG,IAAI,KAAK,IAAI,SAAS,GAAG,KAAK;AAAA,IAOlD;AAAA,EAEJ,CAAC;AAAA,GACH;AAGF,WAAW,cAAc;",
+  "names": []
+}

package/dist/esm/parts/Trigger.js

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { DSButtonV3 } from "@elliemae/ds-button-v2";
+import { styled } from "@elliemae/ds-system";
+import { DSAppPickerName, DSAppPickerSlots, DSAppPickerDataTestIds } from "../constants/index.js";
+const StyledButton = styled(DSButtonV3, { name: DSAppPickerName, slot: DSAppPickerSlots.BUTTON })``;
+const Trigger = ({ Icon, isOpen, setRef, ownerProps, onClick, renderTrigger }) => {
+  if (renderTrigger) {
+    return renderTrigger({ ref: setRef });
+  }
+  return /* @__PURE__ */ jsx(
+    StyledButton,
+    {
+      "data-testid": DSAppPickerDataTestIds.BUTTON,
+      id: "app-picker__button",
+      buttonType: "icon",
+      "aria-haspopup": "true",
+      "aria-expanded": isOpen,
+      "aria-label": "Application picker",
+      innerRef: setRef,
+      onClick,
+      getOwnerProps: ownerProps.getOwnerProps,
+      getOwnerPropsArguments: ownerProps.getOwnerPropsArguments,
+      children: /* @__PURE__ */ jsx(Icon, {})
+    }
+  );
+};
+Trigger.displayName = "DSAppPicker.Trigger";
+export {
+  Trigger
+};
+//# sourceMappingURL=Trigger.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/Trigger.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { styled } from '@elliemae/ds-system';\nimport type { DSAppPickerT } from '../react-desc-prop-types.js';\nimport { DSAppPickerName, DSAppPickerSlots, DSAppPickerDataTestIds } from '../constants/index.js';\n\nconst StyledButton = styled(DSButtonV3, { name: DSAppPickerName, slot: DSAppPickerSlots.BUTTON })``;\n\ninterface TriggerProps {\n  Icon: DSAppPickerT.InternalProps['icon'];\n  isOpen: boolean;\n  setRef: React.RefCallback<HTMLButtonElement>;\n  ownerProps: { getOwnerProps: () => object; getOwnerPropsArguments: () => object };\n  onClick: (e: React.MouseEvent | React.KeyboardEvent) => void;\n  renderTrigger?: DSAppPickerT.OptionalProps['renderTrigger'];\n}\n\nexport const Trigger: React.FC<TriggerProps> = ({ Icon, isOpen, setRef, ownerProps, onClick, renderTrigger }) => {\n  if (renderTrigger) {\n    // Plain function call (not React element) preserves the legacy DSPopover render-prop contract:\n    // consumers receive `ref` as a regular prop, no forwardRef required.\n    return renderTrigger({ ref: setRef });\n  }\n  return (\n    <StyledButton\n      data-testid={DSAppPickerDataTestIds.BUTTON}\n      id=\"app-picker__button\"\n      buttonType=\"icon\"\n      aria-haspopup=\"true\"\n      aria-expanded={isOpen}\n      aria-label=\"Application picker\"\n      innerRef={setRef}\n      onClick={onClick}\n      getOwnerProps={ownerProps.getOwnerProps}\n      getOwnerPropsArguments={ownerProps.getOwnerPropsArguments}\n    >\n      <Icon />\n    </StyledButton>\n  );\n};\n\nTrigger.displayName = 'DSAppPicker.Trigger';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACoCjB;AAnCN,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AAEvB,SAAS,iBAAiB,kBAAkB,8BAA8B;AAE1E,MAAM,eAAe,OAAO,YAAY,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,OAAO,CAAC;AAWzF,MAAM,UAAkC,CAAC,EAAE,MAAM,QAAQ,QAAQ,YAAY,SAAS,cAAc,MAAM;AAC/G,MAAI,eAAe;AAGjB,WAAO,cAAc,EAAE,KAAK,OAAO,CAAC;AAAA,EACtC;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,uBAAuB;AAAA,MACpC,IAAG;AAAA,MACH,YAAW;AAAA,MACX,iBAAc;AAAA,MACd,iBAAe;AAAA,MACf,cAAW;AAAA,MACX,UAAU;AAAA,MACV;AAAA,MACA,eAAe,WAAW;AAAA,MAC1B,wBAAwB,WAAW;AAAA,MAEnC,8BAAC,QAAK;AAAA;AAAA,EACR;AAEJ;AAEA,QAAQ,cAAc;",
+  "names": []
+}

package/dist/esm/{styles.js → parts/style.js}

@@ -1,16 +1,26 @@
 import * as React from "react";
 import { styled } from "@elliemae/ds-system";
 import { Grid } from "@elliemae/ds-grid";
-import { DSAppPickerName, DSAppPickerSlots } from "./constants/index.js";
+import { DSTypography } from "@elliemae/ds-typography";
+import { FloatingWrapper } from "@elliemae/ds-floating-context";
+import { DSAppPickerName, DSAppPickerSlots } from "../constants/index.js";
+const StyledAppPickerFloating = styled(FloatingWrapper, {
+  name: DSAppPickerName,
+  slot: DSAppPickerSlots.FLOATING_WRAPPER
+})``;
 const StyledWrapper = styled(Grid, { name: DSAppPickerName, slot: DSAppPickerSlots.ROOT })`
+  background-color: ${({ theme }) => theme.colors.neutral["000"]};
   min-width: 308px;
   min-height: 110px;
   max-height: 449px;
   width: 308px;
   overflow-y: auto;
   overflow-x: hidden;
+  /* Baseline 2024: reserve scrollbar gutter so the layout doesn't shift between overflow/no-overflow.
+     Replaces a JS isOverflow detection effect that toggled right padding. */
+  scrollbar-gutter: stable;
   margin: 0;
-  padding: ${({ isOverflow }) => isOverflow ? "0 0 8px 16px" : "0 16px 8px 16px"};
+  padding: 0 0 8px 16px;
   &:focus {
     outline: none;
   }
@@ -22,25 +32,27 @@ const StyledListItemFullRow = styled("li", { name: DSAppPickerName, slot: DSAppP
   list-style: none;
   grid-column: 1/4;
 `;
-const StyledTitle = styled("h3", { name: DSAppPickerName, slot: DSAppPickerSlots.TITLE })`
+const StyledTitle = styled(DSTypography, { name: DSAppPickerName, slot: DSAppPickerSlots.TITLE })`
   color: ${({ theme }) => theme.colors.neutral[700]};
   font-size: ${({ theme }) => theme.fontSizes.value[400]};
   font-weight: ${({ theme }) => theme.fontWeights.semibold};
   margin: 12px 0 8px 0;
   line-height: 1.385;
   text-transform: uppercase;
+  text-align: center;
 `;
 const StyledSeparator = styled("hr", { name: DSAppPickerName, slot: DSAppPickerSlots.SEPARATOR })`
-  border-top: 1px solid ${({ theme }) => theme.colors.neutral[100]};
+  border-top: 1px solid ${({ theme }) => theme.colors.neutral[300]};
   border-bottom: none;
-  width: 99%;
+  width: 100%;
   margin: 8px 0 0 0;
 `;
 export {
+  StyledAppPickerFloating,
   StyledListItem,
   StyledListItemFullRow,
   StyledSeparator,
   StyledTitle,
   StyledWrapper
 };
-//# sourceMappingURL=styles.js.map
+//# sourceMappingURL=style.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/style.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { FloatingWrapper } from '@elliemae/ds-floating-context';\nimport { DSAppPickerName, DSAppPickerSlots } from '../constants/index.js';\n\nexport const StyledAppPickerFloating = styled(FloatingWrapper, {\n  name: DSAppPickerName,\n  slot: DSAppPickerSlots.FLOATING_WRAPPER,\n})``;\n\nexport const 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\nexport const StyledListItem = styled('li', { name: DSAppPickerName, slot: DSAppPickerSlots.ITEM })`\n  list-style: none;\n`;\n\nexport const StyledListItemFullRow = styled('li', { name: DSAppPickerName, slot: DSAppPickerSlots.ROW })`\n  list-style: none;\n  grid-column: 1/4;\n`;\n\nexport const StyledTitle = styled(DSTypography, { name: DSAppPickerName, slot: DSAppPickerSlots.TITLE })`\n  color: ${({ theme }) => theme.colors.neutral[700]};\n  font-size: ${({ theme }) => theme.fontSizes.value[400]};\n  font-weight: ${({ theme }) => theme.fontWeights.semibold};\n  margin: 12px 0 8px 0;\n  line-height: 1.385;\n  text-transform: uppercase;\n  text-align: center;\n`;\n\nexport const 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"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,SAAS,iBAAiB,wBAAwB;AAE3C,MAAM,0BAA0B,OAAO,iBAAiB;AAAA,EAC7D,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAEM,MAAM,gBAAgB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,KAAK,CAAC;AAAA,sBAC1E,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBzD,MAAM,iBAAiB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,KAAK,CAAC;AAAA;AAAA;AAI1F,MAAM,wBAAwB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,IAAI,CAAC;AAAA;AAAA;AAAA;AAKhG,MAAM,cAAc,OAAO,cAAc,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,MAAM,CAAC;AAAA,WAC5F,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA,eACpC,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,MAAM,GAAG,CAAC;AAAA,iBACvC,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAOnD,MAAM,kBAAkB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,UAAU,CAAC;AAAA,0BAC7E,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;",
+  "names": []
+}

package/dist/esm/react-desc-prop-types.js

@@ -1,10 +1,14 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 import { MenuPicker } from "@elliemae/ds-icons";
-import { PropTypes, getPropsPerSlotPropTypes } from "@elliemae/ds-props-helpers";
+import {
+  PropTypes,
+  getPropsPerSlotPropTypes,
+  globalAttributesPropTypes,
+  xstyledPropTypes
+} from "@elliemae/ds-props-helpers";
 import { DSAppPickerName, DSAppPickerSlots } from "./constants/index.js";
 const defaultProps = {
-  // export const defaultProps: DSAppPickerT.DefaultProps = {
   apps: [],
   customApps: [],
   sectionTitle: "APPLICATIONS",
@@ -13,12 +17,10 @@ const defaultProps = {
 };
 const DSAppPickerPropTypes = {
   ...getPropsPerSlotPropTypes(DSAppPickerName, DSAppPickerSlots),
-  apps: PropTypes.array.description(
-    "Main items. Format: [{ label:string, icon:component, onClick:func, disabled:bool, selected:bool }]"
-  ).isRequired,
-  customApps: PropTypes.array.description(
-    "Custom items. Format: [{ label:string, icon:component, onClick:func, disabled:bool, selected:bool }]"
-  ),
+  ...globalAttributesPropTypes,
+  ...xstyledPropTypes,
+  apps: PropTypes.array.description("Main items. Format: [{ label:string, icon:component, onClick:func, disabled:bool, selected:bool }]").defaultValue([]),
+  customApps: PropTypes.array.description("Custom items. Format: [{ label:string, icon:component, onClick:func, disabled:bool, selected:bool }]").defaultValue([]),
   sectionTitle: PropTypes.string.description("main section title").defaultValue("APPLICATIONS"),
   customSectionTitle: PropTypes.string.description("custom section title").defaultValue("CUSTOM APPLICATIONS"),
   icon: PropTypes.func.description("trigger button s icon").defaultValue(MenuPicker),
@@ -35,8 +37,10 @@ const DSAppPickerPropTypes = {
     "Ref to the trigger button."
   )
 };
+const DSAppPickerPropTypesSchema = DSAppPickerPropTypes;
 export {
   DSAppPickerPropTypes,
+  DSAppPickerPropTypesSchema,
   defaultProps
 };
 //# sourceMappingURL=react-desc-prop-types.js.map

package/dist/esm/react-desc-prop-types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { MenuPicker } from '@elliemae/ds-icons';\nimport type { SvgIconT } from '@elliemae/ds-icons';\nimport type { GlobalAttributesT, XstyledProps, ValidationMap } from '@elliemae/ds-props-helpers';\nimport { PropTypes, getPropsPerSlotPropTypes } from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { DSAppPickerName, DSAppPickerSlots } from './constants/index.js';\n\nexport declare namespace DSAppPickerT {\n  export interface AppItem {\n    label: string;\n    icon: React.ComponentType<{ className: string; size: string }>;\n    onClick?: (e: React.MouseEvent, item: AppItem) => void | null;\n    disabled?: boolean;\n    applyAriaDisabled?: boolean;\n    id?: string;\n    selected?: boolean;\n    wrapText?: boolean;\n  }\n\n  export type ActionRef = React.MutableRefObject<{\n    focusToIndex?: (index: number) => void;\n    focusSelectedOrFirstAvailable?: () => void;\n    focusWrapper: () => void;\n  }>;\n\n  export interface DefaultProps {\n    apps: AppItem[];\n    customApps: AppItem[];\n    sectionTitle: string;\n    customSectionTitle: string;\n    icon: React.ComponentType<SvgIconT.Props>;\n  }\n\n  interface RenderTriggerProp {\n    ref: React.MutableRefObject<HTMLButtonElement>;\n    [key: string]: unknown;\n  }\n  export interface OptionalProps\n    extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSAppPickerName, typeof DSAppPickerSlots> {\n    onClose?: () => void;\n    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n    onClickOutside?: (e: React.MouseEvent) => void;\n    onKeyDown?: (e: React.KeyboardEvent) => void;\n    actionRef?: ActionRef;\n    renderTrigger?: React.ComponentType<RenderTriggerProp>;\n    isOpen?: boolean;\n    triggerRef?: React.RefObject<HTMLButtonElement>;\n  }\n\n  export interface Props\n    extends Partial<DefaultProps>,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLDivElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>,\n      XstyledProps {}\n\n  export interface InternalProps\n    extends DefaultProps,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLDivElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>,\n      XstyledProps {}\n}\n\nexport const defaultProps: Omit<DSAppPickerT.DefaultProps, `dsAppPicker${Capitalize<string>}`> = {\n  // export const defaultProps: DSAppPickerT.DefaultProps = {\n  apps: [],\n  customApps: [],\n  sectionTitle: 'APPLICATIONS',\n  customSectionTitle: 'CUSTOM APPLICATIONS',\n  icon: () => <MenuPicker color={['brand-primary', '700']} size=\"m\" />,\n};\n\n// =============================================================================\n// PropTypes\n// =============================================================================\n\nexport const DSAppPickerPropTypes = {\n  ...getPropsPerSlotPropTypes(DSAppPickerName, DSAppPickerSlots),\n  apps: PropTypes.array.description(\n    'Main items. Format: [{ label:string, icon:component, onClick:func, disabled:bool, selected:bool }]',\n  ).isRequired,\n  customApps: PropTypes.array.description(\n    'Custom items. Format: [{ label:string, icon:component, onClick:func, disabled:bool, selected:bool }]',\n  ),\n  sectionTitle: PropTypes.string.description('main section title').defaultValue('APPLICATIONS'),\n  customSectionTitle: PropTypes.string.description('custom section title').defaultValue('CUSTOM APPLICATIONS'),\n  icon: PropTypes.func.description('trigger button s icon').defaultValue(MenuPicker),\n  renderTrigger: PropTypes.func.description('Custom trigger component.'),\n  actionRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]).description(\n    'Ref containing a focusToIndex method. This method allows you to focus any App inside the AppPicker.',\n  ),\n  isOpen: PropTypes.bool.description('Wether the AppPicker should be open or not.'),\n  onClose: PropTypes.func.description('Callback function when the AppPicker closes'),\n  onKeyDown: PropTypes.func.description('OnKeyDown handler callback.'),\n  onClick: PropTypes.func.description('Custom onClick for Trigger component.'),\n  onClickOutside: PropTypes.func.description('Callback event when the user clicks outside the App Picker.'),\n  triggerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]).description(\n    'Ref to the trigger button.',\n  ),\n} as ValidationMap<unknown>;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACqET;AApEd,SAAS,kBAAkB;AAG3B,SAAS,WAAW,gCAAgC;AAEpD,SAAS,iBAAiB,wBAAwB;AAyD3C,MAAM,eAAoF;AAAA;AAAA,EAE/F,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM,oBAAC,cAAW,OAAO,CAAC,iBAAiB,KAAK,GAAG,MAAK,KAAI;AACpE;AAMO,MAAM,uBAAuB;AAAA,EAClC,GAAG,yBAAyB,iBAAiB,gBAAgB;AAAA,EAC7D,MAAM,UAAU,MAAM;AAAA,IACpB;AAAA,EACF,EAAE;AAAA,EACF,YAAY,UAAU,MAAM;AAAA,IAC1B;AAAA,EACF;AAAA,EACA,cAAc,UAAU,OAAO,YAAY,oBAAoB,EAAE,aAAa,cAAc;AAAA,EAC5F,oBAAoB,UAAU,OAAO,YAAY,sBAAsB,EAAE,aAAa,qBAAqB;AAAA,EAC3G,MAAM,UAAU,KAAK,YAAY,uBAAuB,EAAE,aAAa,UAAU;AAAA,EACjF,eAAe,UAAU,KAAK,YAAY,2BAA2B;AAAA,EACrE,WAAW,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,CAAC,CAAC,EAAE;AAAA,IAC5F;AAAA,EACF;AAAA,EACA,QAAQ,UAAU,KAAK,YAAY,6CAA6C;AAAA,EAChF,SAAS,UAAU,KAAK,YAAY,6CAA6C;AAAA,EACjF,WAAW,UAAU,KAAK,YAAY,6BAA6B;AAAA,EACnE,SAAS,UAAU,KAAK,YAAY,uCAAuC;AAAA,EAC3E,gBAAgB,UAAU,KAAK,YAAY,6DAA6D;AAAA,EACxG,YAAY,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,CAAC,CAAC,EAAE;AAAA,IAC7F;AAAA,EACF;AACF;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\nimport React from 'react';\nimport { MenuPicker } from '@elliemae/ds-icons';\nimport type { SvgIconT } from '@elliemae/ds-icons';\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport {\n  PropTypes,\n  getPropsPerSlotPropTypes,\n  globalAttributesPropTypes,\n  xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { DSAppPickerName, DSAppPickerSlots } from './constants/index.js';\n\nexport declare namespace DSAppPickerT {\n  export interface AppItem {\n    label: string;\n    icon: React.ComponentType<{ className: string; size: string }>;\n    onClick?: (e: React.MouseEvent, item: AppItem) => void | null;\n    disabled?: boolean;\n    applyAriaDisabled?: boolean;\n    id?: string;\n    selected?: boolean;\n    wrapText?: boolean;\n  }\n\n  export type ActionRef = React.MutableRefObject<{\n    focusToIndex?: (index: number) => void;\n    focusSelectedOrFirstAvailable?: () => void;\n    focusWrapper: () => void;\n  }>;\n\n  export interface RequiredProps {}\n\n  export type SlotFunctionArguments = {\n    dsApppickerRoot: () => object;\n    dsApppickerItem: () => object;\n    dsApppickerTitle: () => object;\n    dsApppickerSeparator: () => object;\n    dsApppickerRow: () => object;\n    dsApppickerChip: () => object;\n    dsApppickerButton: () => object;\n    dsApppickerFloatingWrapper: () => object;\n  };\n\n  export interface DefaultProps {\n    apps: AppItem[];\n    customApps: AppItem[];\n    sectionTitle: string;\n    customSectionTitle: string;\n    icon: React.ComponentType<SvgIconT.Props>;\n  }\n\n  interface RenderTriggerProp {\n    ref: React.RefCallback<HTMLButtonElement>;\n    [key: string]: unknown;\n  }\n\n  export interface OptionalProps\n    extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSAppPickerName, typeof DSAppPickerSlots> {\n    onClose?: () => void;\n    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n    onClickOutside?: (e: MouseEvent | React.MouseEvent) => void;\n    onKeyDown?: (e: React.KeyboardEvent) => void;\n    actionRef?: ActionRef;\n    renderTrigger?: (props: RenderTriggerProp) => React.ReactElement | null;\n    isOpen?: boolean;\n    triggerRef?: React.RefObject<HTMLButtonElement>;\n  }\n\n  export interface Props\n    extends Partial<DefaultProps>,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLDivElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>,\n      XstyledProps,\n      RequiredProps {}\n\n  export interface InternalProps\n    extends DefaultProps,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLDivElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>,\n      XstyledProps,\n      RequiredProps {}\n}\n\nexport const defaultProps: DSAppPickerT.DefaultProps = {\n  apps: [],\n  customApps: [],\n  sectionTitle: 'APPLICATIONS',\n  customSectionTitle: 'CUSTOM APPLICATIONS',\n  icon: () => <MenuPicker color={['brand-primary', '700']} size=\"m\" />,\n};\n\n// =============================================================================\n// PropTypes\n// =============================================================================\n\nexport const DSAppPickerPropTypes: DSPropTypesSchema<DSAppPickerT.Props> = {\n  ...getPropsPerSlotPropTypes(DSAppPickerName, DSAppPickerSlots),\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  apps: PropTypes.array\n    .description('Main items. Format: [{ label:string, icon:component, onClick:func, disabled:bool, selected:bool }]')\n    .defaultValue([]),\n  customApps: PropTypes.array\n    .description('Custom items. Format: [{ label:string, icon:component, onClick:func, disabled:bool, selected:bool }]')\n    .defaultValue([]),\n  sectionTitle: PropTypes.string.description('main section title').defaultValue('APPLICATIONS'),\n  customSectionTitle: PropTypes.string.description('custom section title').defaultValue('CUSTOM APPLICATIONS'),\n  icon: PropTypes.func.description('trigger button s icon').defaultValue(MenuPicker),\n  renderTrigger: PropTypes.func.description('Custom trigger component.'),\n  actionRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]).description(\n    'Ref containing a focusToIndex method. This method allows you to focus any App inside the AppPicker.',\n  ),\n  isOpen: PropTypes.bool.description('Wether the AppPicker should be open or not.'),\n  onClose: PropTypes.func.description('Callback function when the AppPicker closes'),\n  onKeyDown: PropTypes.func.description('OnKeyDown handler callback.'),\n  onClick: PropTypes.func.description('Custom onClick for Trigger component.'),\n  onClickOutside: PropTypes.func.description('Callback event when the user clicks outside the App Picker.'),\n  triggerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]).description(\n    'Ref to the trigger button.',\n  ),\n};\n\nexport const DSAppPickerPropTypesSchema = DSAppPickerPropTypes as unknown as ValidationMap<DSAppPickerT.Props>;\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC0FT;AAxFd,SAAS,kBAAkB;AAG3B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,iBAAiB,wBAAwB;AAyE3C,MAAM,eAA0C;AAAA,EACrD,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM,oBAAC,cAAW,OAAO,CAAC,iBAAiB,KAAK,GAAG,MAAK,KAAI;AACpE;AAMO,MAAM,uBAA8D;AAAA,EACzE,GAAG,yBAAyB,iBAAiB,gBAAgB;AAAA,EAC7D,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM,UAAU,MACb,YAAY,oGAAoG,EAChH,aAAa,CAAC,CAAC;AAAA,EAClB,YAAY,UAAU,MACnB,YAAY,sGAAsG,EAClH,aAAa,CAAC,CAAC;AAAA,EAClB,cAAc,UAAU,OAAO,YAAY,oBAAoB,EAAE,aAAa,cAAc;AAAA,EAC5F,oBAAoB,UAAU,OAAO,YAAY,sBAAsB,EAAE,aAAa,qBAAqB;AAAA,EAC3G,MAAM,UAAU,KAAK,YAAY,uBAAuB,EAAE,aAAa,UAAU;AAAA,EACjF,eAAe,UAAU,KAAK,YAAY,2BAA2B;AAAA,EACrE,WAAW,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,CAAC,CAAC,EAAE;AAAA,IAC5F;AAAA,EACF;AAAA,EACA,QAAQ,UAAU,KAAK,YAAY,6CAA6C;AAAA,EAChF,SAAS,UAAU,KAAK,YAAY,6CAA6C;AAAA,EACjF,WAAW,UAAU,KAAK,YAAY,6BAA6B;AAAA,EACnE,SAAS,UAAU,KAAK,YAAY,uCAAuC;AAAA,EAC3E,gBAAgB,UAAU,KAAK,YAAY,6DAA6D;AAAA,EACxG,YAAY,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,CAAC,CAAC,EAAE;AAAA,IAC7F;AAAA,EACF;AACF;AAEO,MAAM,6BAA6B;",
   "names": []
 }

package/dist/esm/typescript-testing/typescript-app-picker-valid.js

@@ -2,6 +2,7 @@ import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { DSAppPicker } from "../index.js";
 const testOptionalProps = {};
+const testRequiredProps = {};
 const testPartialDefaults = {
   apps: [],
   customApps: [],
@@ -11,10 +12,12 @@ const testPartialDefaults = {
 };
 const testProps = {
   ...testOptionalProps,
+  ...testRequiredProps,
   ...testPartialDefaults
 };
 const testPropsAsSyntax = {
   ...testOptionalProps,
+  ...testRequiredProps,
   ...testPartialDefaults
 };
 const testCompleteDefaults = {
@@ -26,10 +29,12 @@ const testCompleteDefaults = {
 };
 const testInternalProps = {
   ...testOptionalProps,
+  ...testRequiredProps,
   ...testCompleteDefaults
 };
 const testInternalPropsAsSyntax = {
   ...testOptionalProps,
+  ...testRequiredProps,
   ...testCompleteDefaults
 };
 const testExplicitDefinition = {

package/dist/esm/typescript-testing/typescript-app-picker-valid.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-app-picker-valid.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { DSAppPicker } from '../index.js';\nimport type { DSAppPickerT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSAppPickerT.Props;\ntype ComponentPropsInternals = DSAppPickerT.InternalProps;\ntype ComponentPropsDefaultProps = DSAppPickerT.DefaultProps;\ntype ComponentPropsOptionalProps = DSAppPickerT.OptionalProps;\n\nconst testOptionalProps: ComponentPropsOptionalProps = {};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n//  Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n  apps: [],\n  customApps: [],\n  sectionTitle: '',\n  customSectionTitle: '',\n  icon: () => null,\n};\n\nconst testProps: ComponentPropsForApp = {\n  ...testOptionalProps,\n  ...testPartialDefaults,\n};\nconst testPropsAsSyntax = {\n  ...testOptionalProps,\n  ...testPartialDefaults,\n} as ComponentPropsForApp;\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n  apps: [],\n  customApps: [],\n  sectionTitle: '',\n  customSectionTitle: '',\n  icon: () => null,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n  ...testOptionalProps,\n  ...testCompleteDefaults,\n};\nconst testInternalPropsAsSyntax = {\n  ...testOptionalProps,\n  ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n  apps: [],\n  customApps: [],\n  sectionTitle: '',\n  customSectionTitle: '',\n  icon: () => null,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n  apps: [],\n  customApps: [],\n  sectionTitle: '',\n  customSectionTitle: '',\n  icon: () => null,\n} as ComponentPropsForApp;\n\nconst ExampleUsageComponent = () => (\n  <>\n    {/* works with explicitly casted props, all syntaxes */}\n    <DSAppPicker {...testExplicitDefinition} />\n    <DSAppPicker {...testInferedTypeCompatibility} />\n    {/* works with inline values */}\n    <DSAppPicker apps={[]} customApps={[]} sectionTitle=\"\" customSectionTitle=\"\" icon={() => null} />\n    {/* multiple auto inference works */}\n    <DSAppPicker apps={[]} customApps={[]} sectionTitle=\"\" customSectionTitle=\"\" icon={() => null} />\n    {/* works with partial defaults */}\n  </>\n);\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACmErB,mBAEE,KAFF;AAlEF,SAAS,mBAAmB;AAS5B,MAAM,oBAAiD,CAAC;AAIxD,MAAM,sBAA2D;AAAA,EAC/D,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM;AACd;AAEA,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,uBAA6D;AAAA,EACjE,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM;AACd;AAEA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM;AACd;AAGA,MAAM,+BAA+B;AAAA,EACnC,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM;AACd;AAEA,MAAM,wBAAwB,MAC5B,iCAEE;AAAA,sBAAC,eAAa,GAAG,wBAAwB;AAAA,EACzC,oBAAC,eAAa,GAAG,8BAA8B;AAAA,EAE/C,oBAAC,eAAY,MAAM,CAAC,GAAG,YAAY,CAAC,GAAG,cAAa,IAAG,oBAAmB,IAAG,MAAM,MAAM,MAAM;AAAA,EAE/F,oBAAC,eAAY,MAAM,CAAC,GAAG,YAAY,CAAC,GAAG,cAAa,IAAG,oBAAmB,IAAG,MAAM,MAAM,MAAM;AAAA,GAEjG;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { DSAppPicker } from '../index.js';\nimport type { DSAppPickerT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSAppPickerT.Props;\ntype ComponentPropsInternals = DSAppPickerT.InternalProps;\ntype ComponentPropsDefaultProps = DSAppPickerT.DefaultProps;\ntype ComponentPropsOptionalProps = DSAppPickerT.OptionalProps;\ntype ComponentPropsRequiredProps = DSAppPickerT.RequiredProps;\n\nconst testOptionalProps: ComponentPropsOptionalProps = {};\nconst testRequiredProps: ComponentPropsRequiredProps = {};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n//  Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n  apps: [],\n  customApps: [],\n  sectionTitle: '',\n  customSectionTitle: '',\n  icon: () => null,\n};\n\nconst testProps: ComponentPropsForApp = {\n  ...testOptionalProps,\n  ...testRequiredProps,\n  ...testPartialDefaults,\n};\nconst testPropsAsSyntax = {\n  ...testOptionalProps,\n  ...testRequiredProps,\n  ...testPartialDefaults,\n} as ComponentPropsForApp;\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n  apps: [],\n  customApps: [],\n  sectionTitle: '',\n  customSectionTitle: '',\n  icon: () => null,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n  ...testOptionalProps,\n  ...testRequiredProps,\n  ...testCompleteDefaults,\n};\nconst testInternalPropsAsSyntax = {\n  ...testOptionalProps,\n  ...testRequiredProps,\n  ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n  apps: [],\n  customApps: [],\n  sectionTitle: '',\n  customSectionTitle: '',\n  icon: () => null,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n  apps: [],\n  customApps: [],\n  sectionTitle: '',\n  customSectionTitle: '',\n  icon: () => null,\n} as ComponentPropsForApp;\n\nconst ExampleUsageComponent = () => (\n  <>\n    {/* works with explicitly casted props, all syntaxes */}\n    <DSAppPicker {...testExplicitDefinition} />\n    <DSAppPicker {...testInferedTypeCompatibility} />\n    {/* works with inline values */}\n    <DSAppPicker apps={[]} customApps={[]} sectionTitle=\"\" customSectionTitle=\"\" icon={() => null} />\n    {/* multiple auto inference works */}\n    <DSAppPicker apps={[]} customApps={[]} sectionTitle=\"\" customSectionTitle=\"\" icon={() => null} />\n    {/* works with partial defaults */}\n  </>\n);\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACyErB,mBAEE,KAFF;AAxEF,SAAS,mBAAmB;AAU5B,MAAM,oBAAiD,CAAC;AACxD,MAAM,oBAAiD,CAAC;AAIxD,MAAM,sBAA2D;AAAA,EAC/D,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM;AACd;AAEA,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,uBAA6D;AAAA,EACjE,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM;AACd;AAEA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AACA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM;AACd;AAGA,MAAM,+BAA+B;AAAA,EACnC,MAAM,CAAC;AAAA,EACP,YAAY,CAAC;AAAA,EACb,cAAc;AAAA,EACd,oBAAoB;AAAA,EACpB,MAAM,MAAM;AACd;AAEA,MAAM,wBAAwB,MAC5B,iCAEE;AAAA,sBAAC,eAAa,GAAG,wBAAwB;AAAA,EACzC,oBAAC,eAAa,GAAG,8BAA8B;AAAA,EAE/C,oBAAC,eAAY,MAAM,CAAC,GAAG,YAAY,CAAC,GAAG,cAAa,IAAG,oBAAmB,IAAG,MAAM,MAAM,MAAM;AAAA,EAE/F,oBAAC,eAAY,MAAM,CAAC,GAAG,YAAY,CAAC,GAAG,cAAa,IAAG,oBAAmB,IAAG,MAAM,MAAM,MAAM;AAAA,GAEjG;",
   "names": []
 }

package/dist/types/DSAppPicker.d.ts

@@ -3,4 +3,3 @@ import type { DSAppPickerT } from './react-desc-prop-types.js';
 declare const DSAppPicker: React.ComponentType<DSAppPickerT.Props>;
 declare const AppPickerWithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").DocumentedReactComponent<DSAppPickerT.Props>;
 export { DSAppPicker, AppPickerWithSchema };
-export default DSAppPicker;

package/dist/types/DSAppPickerCTX.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import type { useFocusTracker } from './config/useFocusTracker.js';
+export type AppPickerFocusCTX = ReturnType<typeof useFocusTracker>;
+/** Focus tracker context for chip-level focus management inside DSAppPicker. */
+export declare const DSAppPickerContext: React.Context<{
+    focusRegion: string;
+    firstFocusableRef: React.MutableRefObject<HTMLElement | null>;
+    lastFocusableRef: React.MutableRefObject<HTMLElement | null>;
+    registerChip: (app: import("./react-desc-prop-types.js").DSAppPickerT.AppItem, chipId: string) => void;
+    trackFocusChip: (chipId: string) => void;
+    trackFocusRegionReset: () => void;
+    trackFocusTrigger: () => void;
+    trackFocusPanel: () => void;
+    trackFocusSelectedItem: (apps: import("./react-desc-prop-types.js").DSAppPickerT.AppItem[], customApps: import("./react-desc-prop-types.js").DSAppPickerT.AppItem[]) => void;
+    trackFocusFirstItem: (apps: import("./react-desc-prop-types.js").DSAppPickerT.AppItem[], customApps: import("./react-desc-prop-types.js").DSAppPickerT.AppItem[]) => void;
+    trackFocusItemAtIndex: (apps: import("./react-desc-prop-types.js").DSAppPickerT.AppItem[], customApps: import("./react-desc-prop-types.js").DSAppPickerT.AppItem[], index: number) => void;
+}>;

package/dist/types/config/useAppPicker.d.ts

@@ -6,7 +6,8 @@ export declare const useAppPicker: (props: DSAppPickerT.Props) => {
         getOwnerProps: () => DSAppPickerT.InternalProps;
         getOwnerPropsArguments: () => {};
     };
-    globalAttributes: Partial<Pick<object, "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "type" | "name" | "suppressHydrationWarning" | "className" | "color" | "height" | "id" | "lang" | "max" | "media" | "method" | "min" | "target" | "width" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "classID" | "useMap" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "nonce" | "spellCheck" | "translate" | "radioGroup" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "download" | "hrefLang" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "src" | "dateTime" | "open" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "sizes" | "srcSet" | "accept" | "capture" | "checked" | "list" | "maxLength" | "minLength" | "multiple" | "placeholder" | "readOnly" | "required" | "size" | "step" | "htmlFor" | "integrity" | "charSet" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "start" | "selected" | "async" | "defer" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "wrap" | "default" | "kind" | "srcLang" | "poster" | "challenge" | "keyType" | "keyParams"> & Omit<{
+    globalAttributes: Partial<Pick<object, "title" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "pattern" | "type" | "name" | "suppressHydrationWarning" | "className" | "color" | "height" | "id" | "lang" | "max" | "media" | "method" | "min" | "target" | "width" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "classID" | "useMap" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "nonce" | "spellCheck" | "translate" | "radioGroup" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "download" | "hrefLang" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "src" | "dateTime" | "open" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "sizes" | "srcSet" | "accept" | "capture" | "checked" | "list" | "maxLength" | "minLength" | "multiple" | "placeholder" | "readOnly" | "required" | "size" | "step" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "integrity" | "charSet" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "start" | "selected" | "async" | "defer" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "wrap" | "default" | "kind" | "srcLang" | "poster"> & Omit<{
+        title?: string | undefined | undefined;
         cite?: string | undefined | undefined;
         data?: string | undefined | undefined;
         form?: string | undefined | undefined;
@@ -15,7 +16,6 @@ export declare const useAppPicker: (props: DSAppPickerT.Props) => {
         span?: number | undefined | undefined;
         style?: React.CSSProperties | undefined;
         summary?: string | undefined | undefined;
-        title?: string | undefined | undefined;
         pattern?: string | undefined | undefined;
         type?: string | undefined | undefined;
         name?: string | undefined | undefined;
@@ -342,6 +342,9 @@ export declare const useAppPicker: (props: DSAppPickerT.Props) => {
         required?: boolean | undefined | undefined;
         size?: number | undefined | undefined;
         step?: number | string | undefined | undefined;
+        challenge?: string | undefined | undefined;
+        keyType?: string | undefined | undefined;
+        keyParams?: string | undefined | undefined;
         htmlFor?: string | undefined | undefined;
         integrity?: string | undefined | undefined;
         charSet?: string | undefined | undefined;
@@ -368,9 +371,6 @@ export declare const useAppPicker: (props: DSAppPickerT.Props) => {
         kind?: string | undefined | undefined;
         srcLang?: string | undefined | undefined;
         poster?: string | undefined | undefined;
-        challenge?: string | undefined | undefined;
-        keyType?: string | undefined | undefined;
-        keyParams?: string | undefined | undefined;
     }, never>>;
     xstyledProps: import("@elliemae/ds-props-helpers").XstyledProps;
 };

package/dist/types/config/useAppPickerBehavior.d.ts

@@ -0,0 +1,39 @@
+import type React from 'react';
+import type { useAppPicker } from './useAppPicker.js';
+export declare const useAppPickerBehavior: (appPickerConfig: ReturnType<typeof useAppPicker>) => {
+    Icon: React.ComponentType<import("@elliemae/ds-icons").SvgIconT.Props>;
+    renderTrigger: ((props: import("../react-desc-prop-types.js").DSAppPickerT.RenderTriggerProp) => React.ReactElement | null) | undefined;
+    resolvedIsOpen: boolean;
+    floatingStyles: React.CSSProperties;
+    arrowStyles: import("@elliemae/ds-floating-context/dist/types/parts/PopoverArrow.js").PopoverArrowT;
+    floatingContext: {
+        withoutPortal: boolean;
+        withoutAnimation: boolean;
+        portalDOMContainer: HTMLElement | undefined;
+        animationDuration: number;
+    };
+    ownerPropsConfig: {
+        getOwnerProps: () => import("../react-desc-prop-types.js").DSAppPickerT.InternalProps;
+        getOwnerPropsArguments: () => {};
+    };
+    defaultTriggerRef: React.RefObject<HTMLButtonElement>;
+    triggerRef: React.RefObject<HTMLButtonElement> | undefined;
+    wasOpenedByKeyboardRef: React.MutableRefObject<boolean>;
+    handleClose: () => void;
+    handleTriggerRef: (instance: HTMLButtonElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES];
+    handleTriggerClick: (e: React.MouseEvent | React.KeyboardEvent) => void;
+    floatingInnerRef: (instance: HTMLDivElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES];
+    focusTracker: {
+        focusRegion: string;
+        firstFocusableRef: React.MutableRefObject<HTMLElement | null>;
+        lastFocusableRef: React.MutableRefObject<HTMLElement | null>;
+        registerChip: (app: import("../react-desc-prop-types.js").DSAppPickerT.AppItem, chipId: string) => void;
+        trackFocusChip: (chipId: string) => void;
+        trackFocusRegionReset: () => void;
+        trackFocusTrigger: () => void;
+        trackFocusPanel: () => void;
+        trackFocusSelectedItem: (apps: import("../react-desc-prop-types.js").DSAppPickerT.AppItem[], customApps: import("../react-desc-prop-types.js").DSAppPickerT.AppItem[]) => void;
+        trackFocusFirstItem: (apps: import("../react-desc-prop-types.js").DSAppPickerT.AppItem[], customApps: import("../react-desc-prop-types.js").DSAppPickerT.AppItem[]) => void;
+        trackFocusItemAtIndex: (apps: import("../react-desc-prop-types.js").DSAppPickerT.AppItem[], customApps: import("../react-desc-prop-types.js").DSAppPickerT.AppItem[], index: number) => void;
+    };
+};

package/dist/types/config/useFocusTracker.d.ts

@@ -0,0 +1,15 @@
+import type { DSAppPickerT } from '../react-desc-prop-types.js';
+export declare const getChipRegionId: (chipId: string) => string;
+export declare const useFocusTracker: () => {
+    focusRegion: string;
+    firstFocusableRef: import("react").MutableRefObject<HTMLElement | null>;
+    lastFocusableRef: import("react").MutableRefObject<HTMLElement | null>;
+    registerChip: (app: DSAppPickerT.AppItem, chipId: string) => void;
+    trackFocusChip: (chipId: string) => void;
+    trackFocusRegionReset: () => void;
+    trackFocusTrigger: () => void;
+    trackFocusPanel: () => void;
+    trackFocusSelectedItem: (apps: DSAppPickerT.AppItem[], customApps: DSAppPickerT.AppItem[]) => void;
+    trackFocusFirstItem: (apps: DSAppPickerT.AppItem[], customApps: DSAppPickerT.AppItem[]) => void;
+    trackFocusItemAtIndex: (apps: DSAppPickerT.AppItem[], customApps: DSAppPickerT.AppItem[], index: number) => void;
+};

package/dist/types/config/useValidateProps.d.ts

@@ -0,0 +1,3 @@
+import type { ValidationMap } from '@elliemae/ds-props-helpers';
+import { type DSAppPickerT } from '../react-desc-prop-types.js';
+export declare const useValidateProps: (props: DSAppPickerT.InternalProps, propTypes: ValidationMap<unknown>) => void;

package/dist/types/constants/index.d.ts

@@ -1,12 +1,18 @@
 export declare const DSAppPickerName = "DSApppicker";
+export declare const APP_PICKER_REGION_FOCUSES: {
+    readonly RESET: "";
+    readonly TRIGGER: "trigger";
+    readonly PANEL: "panel";
+};
 export declare const DSAppPickerSlots: {
-    ROOT: string;
-    ITEM: string;
-    TITLE: string;
-    SEPARATOR: string;
-    ROW: string;
-    CHIP: string;
-    BUTTON: string;
+    readonly ROOT: "root";
+    readonly ITEM: "item";
+    readonly TITLE: "title";
+    readonly SEPARATOR: "separator";
+    readonly ROW: "row";
+    readonly CHIP: "chip";
+    readonly BUTTON: "button";
+    readonly FLOATING_WRAPPER: "floating-wrapper";
 };
 export declare const DSAppPickerDataTestIds: {
     CHIP: string;
@@ -16,4 +22,5 @@ export declare const DSAppPickerDataTestIds: {
     TITLE: string;
     SEPARATOR: string;
     ROW: string;
+    FLOATING_WRAPPER: string;
 };

package/dist/types/parts/AppPanel.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { DSAppPickerT } from '../react-desc-prop-types.js';
+import type { useAppPicker } from '../config/useAppPicker.js';
+export declare const AppPanel: React.MemoExoticComponent<(props: DSAppPickerT.InternalProps & Pick<ReturnType<typeof useAppPicker>, "ownerPropsConfig" | "globalAttributes" | "xstyledProps"> & {
+    close: () => void;
+    wasOpenedByKeyboardRef: React.MutableRefObject<boolean>;
+    triggerIsInternal: boolean;
+    triggerRef: React.RefObject<HTMLButtonElement>;
+}) => import("react/jsx-runtime.js").JSX.Element>;

package/dist/types/parts/AppPickerItem.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { DSAppPickerT } from '../react-desc-prop-types.js';
+interface AppPickerItemProps {
+    app: DSAppPickerT.AppItem;
+    positionLabel: string;
+    ownerProps: {
+        getOwnerProps: () => object;
+    };
+    onClick: (e: React.MouseEvent, app: DSAppPickerT.AppItem) => void;
+    isFirstFocusable: boolean;
+    isLastFocusable: boolean;
+}
+export declare const AppPickerItem: React.FC<AppPickerItemProps>;
+export {};

package/dist/types/parts/AppSection.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import type { DSAppPickerT } from '../react-desc-prop-types.js';
+interface AppSectionProps {
+    items: DSAppPickerT.AppItem[];
+    title: string;
+    positionOffset: number;
+    totalCount: number;
+    ownerProps: {
+        getOwnerProps: () => object;
+    };
+    onItemClick: (e: React.MouseEvent, app: DSAppPickerT.AppItem) => void;
+    keyPrefix?: string;
+    firstFocusableIdx: number;
+    lastFocusableIdx: number;
+}
+export declare const AppSection: React.FC<AppSectionProps>;
+export {};

package/dist/types/parts/Trigger.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { DSAppPickerT } from '../react-desc-prop-types.js';
+interface TriggerProps {
+    Icon: DSAppPickerT.InternalProps['icon'];
+    isOpen: boolean;
+    setRef: React.RefCallback<HTMLButtonElement>;
+    ownerProps: {
+        getOwnerProps: () => object;
+        getOwnerPropsArguments: () => object;
+    };
+    onClick: (e: React.MouseEvent | React.KeyboardEvent) => void;
+    renderTrigger?: DSAppPickerT.OptionalProps['renderTrigger'];
+}
+export declare const Trigger: React.FC<TriggerProps>;
+export {};

package/dist/types/{styles.d.ts → parts/style.d.ts}

@@ -1,7 +1,6 @@
-export declare const StyledWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, {
-    isOverflow: boolean;
-} & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
+export declare const StyledAppPickerFloating: import("styled-components").StyledComponent<import("react").ComponentType<import("@elliemae/ds-floating-context").DSFloatingWrapperT.Props>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ComponentType<import("@elliemae/ds-floating-context").DSFloatingWrapperT.Props>>, never>;
+export declare const StyledWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
 export declare const StyledListItem: import("styled-components").StyledComponent<"li", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"li">, never>;
 export declare const StyledListItemFullRow: import("styled-components").StyledComponent<"li", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"li">, never>;
-export declare const StyledTitle: import("styled-components").StyledComponent<"h3", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"h3">, never>;
+export declare const StyledTitle: import("styled-components").StyledComponent<import("react").FC<import("@elliemae/ds-typography").DSTypographyT.Props>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").FC<import("@elliemae/ds-typography").DSTypographyT.Props>>, never>;
 export declare const StyledSeparator: import("styled-components").StyledComponent<"hr", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"hr">, never>;

package/dist/types/react-desc-prop-types.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { SvgIconT } from '@elliemae/ds-icons';
-import type { GlobalAttributesT, XstyledProps, ValidationMap } from '@elliemae/ds-props-helpers';
+import type { GlobalAttributesT, XstyledProps, DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';
 import type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';
 import { DSAppPickerName, DSAppPickerSlots } from './constants/index.js';
 export declare namespace DSAppPickerT {
@@ -22,6 +22,18 @@ export declare namespace DSAppPickerT {
         focusSelectedOrFirstAvailable?: () => void;
         focusWrapper: () => void;
     }>;
+    interface RequiredProps {
+    }
+    type SlotFunctionArguments = {
+        dsApppickerRoot: () => object;
+        dsApppickerItem: () => object;
+        dsApppickerTitle: () => object;
+        dsApppickerSeparator: () => object;
+        dsApppickerRow: () => object;
+        dsApppickerChip: () => object;
+        dsApppickerButton: () => object;
+        dsApppickerFloatingWrapper: () => object;
+    };
     interface DefaultProps {
         apps: AppItem[];
         customApps: AppItem[];
@@ -30,23 +42,24 @@ export declare namespace DSAppPickerT {
         icon: React.ComponentType<SvgIconT.Props>;
     }
     interface RenderTriggerProp {
-        ref: React.MutableRefObject<HTMLButtonElement>;
+        ref: React.RefCallback<HTMLButtonElement>;
         [key: string]: unknown;
     }
     interface OptionalProps extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSAppPickerName, typeof DSAppPickerSlots> {
         onClose?: () => void;
         onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;
-        onClickOutside?: (e: React.MouseEvent) => void;
+        onClickOutside?: (e: MouseEvent | React.MouseEvent) => void;
         onKeyDown?: (e: React.KeyboardEvent) => void;
         actionRef?: ActionRef;
-        renderTrigger?: React.ComponentType<RenderTriggerProp>;
+        renderTrigger?: (props: RenderTriggerProp) => React.ReactElement | null;
         isOpen?: boolean;
         triggerRef?: React.RefObject<HTMLButtonElement>;
     }
-    interface Props extends Partial<DefaultProps>, OptionalProps, Omit<GlobalAttributesT<HTMLDivElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>, XstyledProps {
+    interface Props extends Partial<DefaultProps>, OptionalProps, Omit<GlobalAttributesT<HTMLDivElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>, XstyledProps, RequiredProps {
     }
-    interface InternalProps extends DefaultProps, OptionalProps, Omit<GlobalAttributesT<HTMLDivElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>, XstyledProps {
+    interface InternalProps extends DefaultProps, OptionalProps, Omit<GlobalAttributesT<HTMLDivElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>, XstyledProps, RequiredProps {
     }
 }
-export declare const defaultProps: Omit<DSAppPickerT.DefaultProps, `dsAppPicker${Capitalize<string>}`>;
-export declare const DSAppPickerPropTypes: ValidationMap<unknown>;
+export declare const defaultProps: DSAppPickerT.DefaultProps;
+export declare const DSAppPickerPropTypes: DSPropTypesSchema<DSAppPickerT.Props>;
+export declare const DSAppPickerPropTypesSchema: ValidationMap<DSAppPickerT.Props>;