@elliemae/ds-form-combobox 3.70.0-next.33 → 3.70.0-next.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -45,14 +45,12 @@ var import_constants2 = require("../constants/index.js");
45
45
  var import_styled = require("./menu-list/styled.js");
46
46
  const StyledSectionWrapper = (0, import_ds_system.styled)("section", { name: import_constants2.DSFormComboboxName, slot: import_constants2.FORM_COMBOBOX_SLOTS.SECTION_WRAPPER })`
47
47
  list-style: none;
48
- min-height: 24px;
49
48
  display: grid;
50
49
  align-items: center;
51
50
  `;
52
51
  const StyledSectionLabel = (0, import_ds_system.styled)(import_ds_typography.DSTypography, { name: import_constants2.DSFormComboboxName, slot: import_constants2.FORM_COMBOBOX_SLOTS.SECTION_LABEL })`
53
52
  display: flex;
54
53
  align-items: center;
55
- min-height: 32px;
56
54
  padding: 8px 16px;
57
55
  `;
58
56
  const Section = import_react2.default.memo((props) => {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/parts/Section.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { Separator } from '@elliemae/ds-menu-items';\n\nimport { MENU_OPTION_TYPES } from '../constants.js';\n\nimport { ComboboxDataTestid } from '../ComboboxDataTestids.js';\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { isSelected } from '../utils/listHelper.js';\nimport { DSFormComboboxName, FORM_COMBOBOX_SLOTS } from '../constants/index.js';\nimport { StyledSingleMenuItem, StyledMultiMenuItem } from './menu-list/styled.js';\n\ninterface SectionProps {\n label: string;\n wrapperStyles?: React.CSSProperties;\n innerRef?: (instance: HTMLDivElement | null) => void;\n options: DSComboboxT.OptionTypes[];\n handleClick: (option: DSComboboxT.OptionTypes, e: React.MouseEvent<HTMLInputElement>) => void;\n handleOnMouseDown: (e: React.MouseEvent<HTMLLIElement>) => void;\n focusOptionIdx: string;\n selectedValues: DSComboboxT.SelectedOptionsT;\n getOwnerProps: () => object;\n getOwnerPropsArguments?: () => { index: number };\n}\n\nconst StyledSectionWrapper = styled('section', { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_WRAPPER })`\n list-style: none;\n min-height: 24px;\n display: grid;\n align-items: center;\n`;\n\nconst StyledSectionLabel = styled(DSTypography, { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_LABEL })`\n display: flex;\n align-items: center;\n min-height: 32px;\n padding: 8px 16px;\n`;\n\nexport const Section = React.memo((props: SectionProps) => {\n const {\n label,\n wrapperStyles,\n focusOptionIdx,\n selectedValues,\n innerRef,\n handleOnMouseDown,\n options,\n handleClick,\n getOwnerProps,\n getOwnerPropsArguments,\n } = props;\n const id = `${label.replace(/ /g, '')}-section`;\n const CBItem: React.ComponentType<React.ComponentProps<typeof StyledSingleMenuItem>> = Array.isArray(selectedValues)\n ? StyledMultiMenuItem\n : StyledSingleMenuItem;\n\n return (\n <StyledSectionWrapper\n role=\"group\"\n aria-labelledby={id}\n style={wrapperStyles}\n innerRef={innerRef}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <StyledSectionLabel\n component=\"header\"\n variant=\"b3-strong\"\n id={id}\n role=\"presentation\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {label}\n </StyledSectionLabel>\n {options?.map((option) => {\n const {\n dsId,\n type,\n value,\n label: optionLabel,\n readOnly,\n disabled,\n applyAriaDisabled,\n render,\n ...rest\n } = option;\n\n if (type === MENU_OPTION_TYPES.SEPARATOR) {\n return <Separator key={dsId} />;\n }\n\n return (\n <CBItem\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n value={value}\n label={optionLabel}\n dataTestid={ComboboxDataTestid.OPTION}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled || readOnly}\n onClick={(e: React.MouseEvent<HTMLInputElement>) => {\n if (applyAriaDisabled) return;\n handleClick(option, e);\n }}\n onMouseDown={handleOnMouseDown}\n isActive={dsId === focusOptionIdx}\n isSelected={option.type === MENU_OPTION_TYPES.OPTION && isSelected(selectedValues, option)}\n tabIndex={-1}\n {...rest}\n key={option.dsId}\n dsId={option.dsId}\n />\n );\n })}\n </StyledSectionWrapper>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2DnB;AAoCM;AA/FV,IAAAA,gBAAkB;AAClB,uBAAuB;AACvB,2BAA6B;AAC7B,2BAA0B;AAE1B,uBAAkC;AAElC,iCAAmC;AAEnC,wBAA2B;AAC3B,IAAAC,oBAAwD;AACxD,oBAA0D;AAe1D,MAAM,2BAAuB,yBAAO,WAAW,EAAE,MAAM,sCAAoB,MAAM,sCAAoB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOtH,MAAM,yBAAqB,yBAAO,mCAAc,EAAE,MAAM,sCAAoB,MAAM,sCAAoB,cAAc,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAO9G,MAAM,UAAU,cAAAC,QAAM,KAAK,CAAC,UAAwB;AACzD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,KAAK,GAAG,MAAM,QAAQ,MAAM,EAAE,CAAC;AACrC,QAAM,SAAiF,MAAM,QAAQ,cAAc,IAC/G,oCACA;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,mBAAiB;AAAA,MACjB,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAQ;AAAA,YACR;AAAA,YACA,MAAK;AAAA,YACL;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,QACH;AAAA,QACC,SAAS,IAAI,CAAC,WAAW;AACxB,gBAAM;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,GAAG;AAAA,UACL,IAAI;AAEJ,cAAI,SAAS,mCAAkB,WAAW;AACxC,mBAAO,4CAAC,oCAAe,IAAM;AAAA,UAC/B;AAEA,iBACE;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA,OAAO;AAAA,cACP,YAAY,8CAAmB;AAAA,cAC/B;AAAA,cACA,mBAAmB,qBAAqB;AAAA,cACxC,SAAS,CAAC,MAA0C;AAClD,oBAAI,kBAAmB;AACvB,4BAAY,QAAQ,CAAC;AAAA,cACvB;AAAA,cACA,aAAa;AAAA,cACb,UAAU,SAAS;AAAA,cACnB,YAAY,OAAO,SAAS,mCAAkB,cAAU,8BAAW,gBAAgB,MAAM;AAAA,cACzF,UAAU;AAAA,cACT,GAAG;AAAA,cACJ,KAAK,OAAO;AAAA,cACZ,MAAM,OAAO;AAAA;AAAA,UACf;AAAA,QAEJ,CAAC;AAAA;AAAA;AAAA,EACH;AAEJ,CAAC;",
4
+ "sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { Separator } from '@elliemae/ds-menu-items';\n\nimport { MENU_OPTION_TYPES } from '../constants.js';\n\nimport { ComboboxDataTestid } from '../ComboboxDataTestids.js';\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { isSelected } from '../utils/listHelper.js';\nimport { DSFormComboboxName, FORM_COMBOBOX_SLOTS } from '../constants/index.js';\nimport { StyledSingleMenuItem, StyledMultiMenuItem } from './menu-list/styled.js';\n\ninterface SectionProps {\n label: string;\n wrapperStyles?: React.CSSProperties;\n innerRef?: (instance: HTMLDivElement | null) => void;\n options: DSComboboxT.OptionTypes[];\n handleClick: (option: DSComboboxT.OptionTypes, e: React.MouseEvent<HTMLInputElement>) => void;\n handleOnMouseDown: (e: React.MouseEvent<HTMLLIElement>) => void;\n focusOptionIdx: string;\n selectedValues: DSComboboxT.SelectedOptionsT;\n getOwnerProps: () => object;\n getOwnerPropsArguments?: () => { index: number };\n}\n\nconst StyledSectionWrapper = styled('section', { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_WRAPPER })`\n list-style: none;\n display: grid;\n align-items: center;\n`;\n\n/**\n * The 32px group-label row height comes from this label alone: 8px top + 8px bottom padding +\n * the b3-strong line-height (~16px) = 32px. No min-height needed here.\n *\n * This is one of four independent reimplementations of the section/group-label row \u2014 the menu-items\n * path (ds-menu-items-commons StyledSectionWrapper) and ds-menu-button reach the same 32px via a\n * wrapper min-height instead. Keep all four aligned (PUI-18609); see KNOWN_INTENTIONAL_DEVIATIONS.md.\n */\nconst StyledSectionLabel = styled(DSTypography, { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_LABEL })`\n display: flex;\n align-items: center;\n padding: 8px 16px;\n`;\n\nexport const Section = React.memo((props: SectionProps) => {\n const {\n label,\n wrapperStyles,\n focusOptionIdx,\n selectedValues,\n innerRef,\n handleOnMouseDown,\n options,\n handleClick,\n getOwnerProps,\n getOwnerPropsArguments,\n } = props;\n const id = `${label.replace(/ /g, '')}-section`;\n const CBItem: React.ComponentType<React.ComponentProps<typeof StyledSingleMenuItem>> = Array.isArray(selectedValues)\n ? StyledMultiMenuItem\n : StyledSingleMenuItem;\n\n return (\n <StyledSectionWrapper\n role=\"group\"\n aria-labelledby={id}\n style={wrapperStyles}\n innerRef={innerRef}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <StyledSectionLabel\n component=\"header\"\n variant=\"b3-strong\"\n id={id}\n role=\"presentation\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {label}\n </StyledSectionLabel>\n {options?.map((option) => {\n const {\n dsId,\n type,\n value,\n label: optionLabel,\n readOnly,\n disabled,\n applyAriaDisabled,\n render,\n ...rest\n } = option;\n\n if (type === MENU_OPTION_TYPES.SEPARATOR) {\n return <Separator key={dsId} />;\n }\n\n return (\n <CBItem\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n value={value}\n label={optionLabel}\n dataTestid={ComboboxDataTestid.OPTION}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled || readOnly}\n onClick={(e: React.MouseEvent<HTMLInputElement>) => {\n if (applyAriaDisabled) return;\n handleClick(option, e);\n }}\n onMouseDown={handleOnMouseDown}\n isActive={dsId === focusOptionIdx}\n isSelected={option.type === MENU_OPTION_TYPES.OPTION && isSelected(selectedValues, option)}\n tabIndex={-1}\n {...rest}\n key={option.dsId}\n dsId={option.dsId}\n />\n );\n })}\n </StyledSectionWrapper>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiEnB;AAoCM;AArGV,IAAAA,gBAAkB;AAClB,uBAAuB;AACvB,2BAA6B;AAC7B,2BAA0B;AAE1B,uBAAkC;AAElC,iCAAmC;AAEnC,wBAA2B;AAC3B,IAAAC,oBAAwD;AACxD,oBAA0D;AAe1D,MAAM,2BAAuB,yBAAO,WAAW,EAAE,MAAM,sCAAoB,MAAM,sCAAoB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AActH,MAAM,yBAAqB,yBAAO,mCAAc,EAAE,MAAM,sCAAoB,MAAM,sCAAoB,cAAc,CAAC;AAAA;AAAA;AAAA;AAAA;AAM9G,MAAM,UAAU,cAAAC,QAAM,KAAK,CAAC,UAAwB;AACzD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,KAAK,GAAG,MAAM,QAAQ,MAAM,EAAE,CAAC;AACrC,QAAM,SAAiF,MAAM,QAAQ,cAAc,IAC/G,oCACA;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,mBAAiB;AAAA,MACjB,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAQ;AAAA,YACR;AAAA,YACA,MAAK;AAAA,YACL;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,QACH;AAAA,QACC,SAAS,IAAI,CAAC,WAAW;AACxB,gBAAM;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,GAAG;AAAA,UACL,IAAI;AAEJ,cAAI,SAAS,mCAAkB,WAAW;AACxC,mBAAO,4CAAC,oCAAe,IAAM;AAAA,UAC/B;AAEA,iBACE;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA,OAAO;AAAA,cACP,YAAY,8CAAmB;AAAA,cAC/B;AAAA,cACA,mBAAmB,qBAAqB;AAAA,cACxC,SAAS,CAAC,MAA0C;AAClD,oBAAI,kBAAmB;AACvB,4BAAY,QAAQ,CAAC;AAAA,cACvB;AAAA,cACA,aAAa;AAAA,cACb,UAAU,SAAS;AAAA,cACnB,YAAY,OAAO,SAAS,mCAAkB,cAAU,8BAAW,gBAAgB,MAAM;AAAA,cACzF,UAAU;AAAA,cACT,GAAG;AAAA,cACJ,KAAK,OAAO;AAAA,cACZ,MAAM,OAAO;AAAA;AAAA,UACf;AAAA,QAEJ,CAAC;AAAA;AAAA;AAAA,EACH;AAEJ,CAAC;",
6
6
  "names": ["import_react", "import_constants", "React"]
7
7
  }
@@ -12,14 +12,12 @@ import { DSFormComboboxName, FORM_COMBOBOX_SLOTS } from "../constants/index.js";
12
12
  import { StyledSingleMenuItem, StyledMultiMenuItem } from "./menu-list/styled.js";
13
13
  const StyledSectionWrapper = styled("section", { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_WRAPPER })`
14
14
  list-style: none;
15
- min-height: 24px;
16
15
  display: grid;
17
16
  align-items: center;
18
17
  `;
19
18
  const StyledSectionLabel = styled(DSTypography, { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_LABEL })`
20
19
  display: flex;
21
20
  align-items: center;
22
- min-height: 32px;
23
21
  padding: 8px 16px;
24
22
  `;
25
23
  const Section = React2.memo((props) => {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/Section.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { Separator } from '@elliemae/ds-menu-items';\n\nimport { MENU_OPTION_TYPES } from '../constants.js';\n\nimport { ComboboxDataTestid } from '../ComboboxDataTestids.js';\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { isSelected } from '../utils/listHelper.js';\nimport { DSFormComboboxName, FORM_COMBOBOX_SLOTS } from '../constants/index.js';\nimport { StyledSingleMenuItem, StyledMultiMenuItem } from './menu-list/styled.js';\n\ninterface SectionProps {\n label: string;\n wrapperStyles?: React.CSSProperties;\n innerRef?: (instance: HTMLDivElement | null) => void;\n options: DSComboboxT.OptionTypes[];\n handleClick: (option: DSComboboxT.OptionTypes, e: React.MouseEvent<HTMLInputElement>) => void;\n handleOnMouseDown: (e: React.MouseEvent<HTMLLIElement>) => void;\n focusOptionIdx: string;\n selectedValues: DSComboboxT.SelectedOptionsT;\n getOwnerProps: () => object;\n getOwnerPropsArguments?: () => { index: number };\n}\n\nconst StyledSectionWrapper = styled('section', { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_WRAPPER })`\n list-style: none;\n min-height: 24px;\n display: grid;\n align-items: center;\n`;\n\nconst StyledSectionLabel = styled(DSTypography, { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_LABEL })`\n display: flex;\n align-items: center;\n min-height: 32px;\n padding: 8px 16px;\n`;\n\nexport const Section = React.memo((props: SectionProps) => {\n const {\n label,\n wrapperStyles,\n focusOptionIdx,\n selectedValues,\n innerRef,\n handleOnMouseDown,\n options,\n handleClick,\n getOwnerProps,\n getOwnerPropsArguments,\n } = props;\n const id = `${label.replace(/ /g, '')}-section`;\n const CBItem: React.ComponentType<React.ComponentProps<typeof StyledSingleMenuItem>> = Array.isArray(selectedValues)\n ? StyledMultiMenuItem\n : StyledSingleMenuItem;\n\n return (\n <StyledSectionWrapper\n role=\"group\"\n aria-labelledby={id}\n style={wrapperStyles}\n innerRef={innerRef}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <StyledSectionLabel\n component=\"header\"\n variant=\"b3-strong\"\n id={id}\n role=\"presentation\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {label}\n </StyledSectionLabel>\n {options?.map((option) => {\n const {\n dsId,\n type,\n value,\n label: optionLabel,\n readOnly,\n disabled,\n applyAriaDisabled,\n render,\n ...rest\n } = option;\n\n if (type === MENU_OPTION_TYPES.SEPARATOR) {\n return <Separator key={dsId} />;\n }\n\n return (\n <CBItem\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n value={value}\n label={optionLabel}\n dataTestid={ComboboxDataTestid.OPTION}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled || readOnly}\n onClick={(e: React.MouseEvent<HTMLInputElement>) => {\n if (applyAriaDisabled) return;\n handleClick(option, e);\n }}\n onMouseDown={handleOnMouseDown}\n isActive={dsId === focusOptionIdx}\n isSelected={option.type === MENU_OPTION_TYPES.OPTION && isSelected(selectedValues, option)}\n tabIndex={-1}\n {...rest}\n key={option.dsId}\n dsId={option.dsId}\n />\n );\n })}\n </StyledSectionWrapper>\n );\n});\n"],
5
- "mappings": "AAAA,YAAY,WAAW;AC2DnB,SAQE,KARF;AAoCM;AA/FV,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAE1B,SAAS,yBAAyB;AAElC,SAAS,0BAA0B;AAEnC,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB,2BAA2B;AACxD,SAAS,sBAAsB,2BAA2B;AAe1D,MAAM,uBAAuB,OAAO,WAAW,EAAE,MAAM,oBAAoB,MAAM,oBAAoB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOtH,MAAM,qBAAqB,OAAO,cAAc,EAAE,MAAM,oBAAoB,MAAM,oBAAoB,cAAc,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAO9G,MAAM,UAAUA,OAAM,KAAK,CAAC,UAAwB;AACzD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,KAAK,GAAG,MAAM,QAAQ,MAAM,EAAE,CAAC;AACrC,QAAM,SAAiF,MAAM,QAAQ,cAAc,IAC/G,sBACA;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,mBAAiB;AAAA,MACjB,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAQ;AAAA,YACR;AAAA,YACA,MAAK;AAAA,YACL;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,QACH;AAAA,QACC,SAAS,IAAI,CAAC,WAAW;AACxB,gBAAM;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,GAAG;AAAA,UACL,IAAI;AAEJ,cAAI,SAAS,kBAAkB,WAAW;AACxC,mBAAO,oBAAC,eAAe,IAAM;AAAA,UAC/B;AAEA,iBACE;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA,OAAO;AAAA,cACP,YAAY,mBAAmB;AAAA,cAC/B;AAAA,cACA,mBAAmB,qBAAqB;AAAA,cACxC,SAAS,CAAC,MAA0C;AAClD,oBAAI,kBAAmB;AACvB,4BAAY,QAAQ,CAAC;AAAA,cACvB;AAAA,cACA,aAAa;AAAA,cACb,UAAU,SAAS;AAAA,cACnB,YAAY,OAAO,SAAS,kBAAkB,UAAU,WAAW,gBAAgB,MAAM;AAAA,cACzF,UAAU;AAAA,cACT,GAAG;AAAA,cACJ,KAAK,OAAO;AAAA,cACZ,MAAM,OAAO;AAAA;AAAA,UACf;AAAA,QAEJ,CAAC;AAAA;AAAA;AAAA,EACH;AAEJ,CAAC;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { Separator } from '@elliemae/ds-menu-items';\n\nimport { MENU_OPTION_TYPES } from '../constants.js';\n\nimport { ComboboxDataTestid } from '../ComboboxDataTestids.js';\nimport type { DSComboboxT } from '../react-desc-prop-types.js';\nimport { isSelected } from '../utils/listHelper.js';\nimport { DSFormComboboxName, FORM_COMBOBOX_SLOTS } from '../constants/index.js';\nimport { StyledSingleMenuItem, StyledMultiMenuItem } from './menu-list/styled.js';\n\ninterface SectionProps {\n label: string;\n wrapperStyles?: React.CSSProperties;\n innerRef?: (instance: HTMLDivElement | null) => void;\n options: DSComboboxT.OptionTypes[];\n handleClick: (option: DSComboboxT.OptionTypes, e: React.MouseEvent<HTMLInputElement>) => void;\n handleOnMouseDown: (e: React.MouseEvent<HTMLLIElement>) => void;\n focusOptionIdx: string;\n selectedValues: DSComboboxT.SelectedOptionsT;\n getOwnerProps: () => object;\n getOwnerPropsArguments?: () => { index: number };\n}\n\nconst StyledSectionWrapper = styled('section', { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_WRAPPER })`\n list-style: none;\n display: grid;\n align-items: center;\n`;\n\n/**\n * The 32px group-label row height comes from this label alone: 8px top + 8px bottom padding +\n * the b3-strong line-height (~16px) = 32px. No min-height needed here.\n *\n * This is one of four independent reimplementations of the section/group-label row \u2014 the menu-items\n * path (ds-menu-items-commons StyledSectionWrapper) and ds-menu-button reach the same 32px via a\n * wrapper min-height instead. Keep all four aligned (PUI-18609); see KNOWN_INTENTIONAL_DEVIATIONS.md.\n */\nconst StyledSectionLabel = styled(DSTypography, { name: DSFormComboboxName, slot: FORM_COMBOBOX_SLOTS.SECTION_LABEL })`\n display: flex;\n align-items: center;\n padding: 8px 16px;\n`;\n\nexport const Section = React.memo((props: SectionProps) => {\n const {\n label,\n wrapperStyles,\n focusOptionIdx,\n selectedValues,\n innerRef,\n handleOnMouseDown,\n options,\n handleClick,\n getOwnerProps,\n getOwnerPropsArguments,\n } = props;\n const id = `${label.replace(/ /g, '')}-section`;\n const CBItem: React.ComponentType<React.ComponentProps<typeof StyledSingleMenuItem>> = Array.isArray(selectedValues)\n ? StyledMultiMenuItem\n : StyledSingleMenuItem;\n\n return (\n <StyledSectionWrapper\n role=\"group\"\n aria-labelledby={id}\n style={wrapperStyles}\n innerRef={innerRef}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <StyledSectionLabel\n component=\"header\"\n variant=\"b3-strong\"\n id={id}\n role=\"presentation\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {label}\n </StyledSectionLabel>\n {options?.map((option) => {\n const {\n dsId,\n type,\n value,\n label: optionLabel,\n readOnly,\n disabled,\n applyAriaDisabled,\n render,\n ...rest\n } = option;\n\n if (type === MENU_OPTION_TYPES.SEPARATOR) {\n return <Separator key={dsId} />;\n }\n\n return (\n <CBItem\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n value={value}\n label={optionLabel}\n dataTestid={ComboboxDataTestid.OPTION}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled || readOnly}\n onClick={(e: React.MouseEvent<HTMLInputElement>) => {\n if (applyAriaDisabled) return;\n handleClick(option, e);\n }}\n onMouseDown={handleOnMouseDown}\n isActive={dsId === focusOptionIdx}\n isSelected={option.type === MENU_OPTION_TYPES.OPTION && isSelected(selectedValues, option)}\n tabIndex={-1}\n {...rest}\n key={option.dsId}\n dsId={option.dsId}\n />\n );\n })}\n </StyledSectionWrapper>\n );\n});\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACiEnB,SAQE,KARF;AAoCM;AArGV,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAE1B,SAAS,yBAAyB;AAElC,SAAS,0BAA0B;AAEnC,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB,2BAA2B;AACxD,SAAS,sBAAsB,2BAA2B;AAe1D,MAAM,uBAAuB,OAAO,WAAW,EAAE,MAAM,oBAAoB,MAAM,oBAAoB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AActH,MAAM,qBAAqB,OAAO,cAAc,EAAE,MAAM,oBAAoB,MAAM,oBAAoB,cAAc,CAAC;AAAA;AAAA;AAAA;AAAA;AAM9G,MAAM,UAAUA,OAAM,KAAK,CAAC,UAAwB;AACzD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,KAAK,GAAG,MAAM,QAAQ,MAAM,EAAE,CAAC;AACrC,QAAM,SAAiF,MAAM,QAAQ,cAAc,IAC/G,sBACA;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,mBAAiB;AAAA,MACjB,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,SAAQ;AAAA,YACR;AAAA,YACA,MAAK;AAAA,YACL;AAAA,YACA;AAAA,YAEC;AAAA;AAAA,QACH;AAAA,QACC,SAAS,IAAI,CAAC,WAAW;AACxB,gBAAM;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,GAAG;AAAA,UACL,IAAI;AAEJ,cAAI,SAAS,kBAAkB,WAAW;AACxC,mBAAO,oBAAC,eAAe,IAAM;AAAA,UAC/B;AAEA,iBACE;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA,OAAO;AAAA,cACP,YAAY,mBAAmB;AAAA,cAC/B;AAAA,cACA,mBAAmB,qBAAqB;AAAA,cACxC,SAAS,CAAC,MAA0C;AAClD,oBAAI,kBAAmB;AACvB,4BAAY,QAAQ,CAAC;AAAA,cACvB;AAAA,cACA,aAAa;AAAA,cACb,UAAU,SAAS;AAAA,cACnB,YAAY,OAAO,SAAS,kBAAkB,UAAU,WAAW,gBAAgB,MAAM;AAAA,cACzF,UAAU;AAAA,cACT,GAAG;AAAA,cACJ,KAAK,OAAO;AAAA,cACZ,MAAM,OAAO;AAAA;AAAA,UACf;AAAA,QAEJ,CAAC;AAAA;AAAA;AAAA,EACH;AAEJ,CAAC;",
6
6
  "names": ["React"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-form-combobox",
3
- "version": "3.70.0-next.33",
3
+ "version": "3.70.0-next.35",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Controlled Form Combobox",
6
6
  "files": [
@@ -37,26 +37,26 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "uid": "^2.0.2",
40
- "@elliemae/ds-button-v2": "3.70.0-next.33",
41
- "@elliemae/ds-fast-list": "3.70.0-next.33",
42
- "@elliemae/ds-grid": "3.70.0-next.33",
43
- "@elliemae/ds-floating-context": "3.70.0-next.33",
44
- "@elliemae/ds-circular-progress-indicator": "3.70.0-next.33",
45
- "@elliemae/ds-icons": "3.70.0-next.33",
46
- "@elliemae/ds-props-helpers": "3.70.0-next.33",
47
- "@elliemae/ds-pills-v2": "3.70.0-next.33",
48
- "@elliemae/ds-system": "3.70.0-next.33",
49
- "@elliemae/ds-menu-items": "3.70.0-next.33",
50
- "@elliemae/ds-typography": "3.70.0-next.33"
40
+ "@elliemae/ds-button-v2": "3.70.0-next.35",
41
+ "@elliemae/ds-circular-progress-indicator": "3.70.0-next.35",
42
+ "@elliemae/ds-fast-list": "3.70.0-next.35",
43
+ "@elliemae/ds-floating-context": "3.70.0-next.35",
44
+ "@elliemae/ds-grid": "3.70.0-next.35",
45
+ "@elliemae/ds-menu-items": "3.70.0-next.35",
46
+ "@elliemae/ds-pills-v2": "3.70.0-next.35",
47
+ "@elliemae/ds-icons": "3.70.0-next.35",
48
+ "@elliemae/ds-props-helpers": "3.70.0-next.35",
49
+ "@elliemae/ds-system": "3.70.0-next.35",
50
+ "@elliemae/ds-typography": "3.70.0-next.35"
51
51
  },
52
52
  "devDependencies": {
53
53
  "@elliemae/pui-theme": "~2.13.0",
54
54
  "jest": "^30.0.0",
55
55
  "styled-components": "~5.3.9",
56
56
  "styled-system": "^5.1.5",
57
- "@elliemae/ds-form-helpers-mask-hooks": "3.70.0-next.33",
58
- "@elliemae/ds-test-utils": "3.70.0-next.33",
59
- "@elliemae/ds-monorepo-devops": "3.70.0-next.33"
57
+ "@elliemae/ds-form-helpers-mask-hooks": "3.70.0-next.35",
58
+ "@elliemae/ds-monorepo-devops": "3.70.0-next.35",
59
+ "@elliemae/ds-test-utils": "3.70.0-next.35"
60
60
  },
61
61
  "peerDependencies": {
62
62
  "@elliemae/pui-theme": "~2.13.0",