@pega/cosmos-react-core 9.10.1 → 9.12.0
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.
- package/lib/components/Menu/Menu.styles.js +1 -1
- package/lib/components/Menu/Menu.styles.js.map +1 -1
- package/lib/components/Menu/MenuItem.d.ts.map +1 -1
- package/lib/components/Menu/MenuItem.js +3 -1
- package/lib/components/Menu/MenuItem.js.map +1 -1
- package/lib/components/MultiStepForm/FormProgress.styles.d.ts +25 -1
- package/lib/components/MultiStepForm/FormProgress.styles.d.ts.map +1 -1
- package/lib/components/MultiStepForm/FormProgress.styles.js +168 -5
- package/lib/components/MultiStepForm/FormProgress.styles.js.map +1 -1
- package/lib/components/MultiStepForm/HorizontalFormProgress.d.ts +2 -2
- package/lib/components/MultiStepForm/HorizontalFormProgress.d.ts.map +1 -1
- package/lib/components/MultiStepForm/HorizontalFormProgress.js +47 -21
- package/lib/components/MultiStepForm/HorizontalFormProgress.js.map +1 -1
- package/lib/components/MultiStepForm/MultiStepForm.d.ts.map +1 -1
- package/lib/components/MultiStepForm/MultiStepForm.js +2 -2
- package/lib/components/MultiStepForm/MultiStepForm.js.map +1 -1
- package/lib/components/MultiStepForm/MultiStepForm.types.d.ts +5 -0
- package/lib/components/MultiStepForm/MultiStepForm.types.d.ts.map +1 -1
- package/lib/components/MultiStepForm/MultiStepForm.types.js.map +1 -1
- package/lib/components/MultiStepForm/VerticalFormProgress.d.ts +2 -2
- package/lib/components/MultiStepForm/VerticalFormProgress.d.ts.map +1 -1
- package/lib/components/MultiStepForm/VerticalFormProgress.js +45 -20
- package/lib/components/MultiStepForm/VerticalFormProgress.js.map +1 -1
- package/lib/components/MultiStepForm/useFormProgressOverflow.d.ts +1 -1
- package/lib/components/MultiStepForm/useFormProgressOverflow.d.ts.map +1 -1
- package/lib/components/MultiStepForm/useFormProgressOverflow.js +17 -9
- package/lib/components/MultiStepForm/useFormProgressOverflow.js.map +1 -1
- package/lib/components/Preview/Preview.types.d.ts +1 -0
- package/lib/components/Preview/Preview.types.d.ts.map +1 -1
- package/lib/components/Preview/Preview.types.js.map +1 -1
- package/lib/components/SummaryList/SummaryList.d.ts.map +1 -1
- package/lib/components/SummaryList/SummaryList.js +8 -4
- package/lib/components/SummaryList/SummaryList.js.map +1 -1
- package/lib/theme/theme.d.ts +36 -0
- package/lib/theme/theme.d.ts.map +1 -1
- package/lib/theme/themeDefinition.json +18 -0
- package/lib/theme/themeOverrides.schema.json +28 -0
- package/lib/theme/themes/aurigaDarkTheme.json +6 -0
- package/lib/theme/themes/aurigaTheme.json +6 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFormProgressOverflow.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/useFormProgressOverflow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE9C,OAAO,EAAE,yBAAyB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,OAAO,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"useFormProgressOverflow.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/useFormProgressOverflow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE9C,OAAO,EAAE,yBAAyB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAE9F,MAAM,CAAC,MAAM,uBAAuB,GAAG,CACrC,aAAqB,EACrB,UAAoB,EACpB,OAAiB,EACjB,EAAE;IACF,MAAM,GAAG,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC3C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAsB,SAAS,CAAC,CAAC;IAEnE,MAAM,sBAAsB,GAAG,yBAAyB,EAAE,CAAC;IAC3D,MAAM,SAAS,GAAG,UAAU;QAC1B,CAAC,CAAC,sBAAsB,GAAG,gBAAgB;QAC3C,CAAC,CAAC,sBAAsB,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC;IAE9E,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,MAAM,WAAW,GAAG,MAAM,CACxB,SAAS,CACP,QAAQ,CACN,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,EACjC,GAAG,EAAE,CAAC,MAAM,CACb,CACF,CACF,CAAC;IAEF,eAAe,CAAC,GAAG,EAAE;QACnB,MAAM,EAAE,GAAG,GAAG,CAAC,OAAO,CAAC;QACvB,IAAI,CAAC,EAAE;YAAE,OAAO;QAEhB,MAAM,EAAE,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;YACjC,MAAM,OAAO,GAAG,EAAE,CAAC,WAAW,IAAI,CAAC,CAAC;YACpC,IAAI,eAAuB,CAAC;YAE5B,IAAI,OAAO,EAAE,CAAC;gBACZ,oEAAoE;gBACpE,+CAA+C;gBAC/C,uDAAuD;gBAEvD,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,GAAG,WAAW,CAAC,GAAG,CAAC,SAAS,GAAG,WAAW,CAAC,CAAC,CAAC;YACpF,CAAC;iBAAM,CAAC;gBACN,kGAAkG;gBAClG,kFAAkF;gBAClF,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,CAAC,SAAS,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC;YACxE,CAAC;YAED,QAAQ,CAAC,aAAa,GAAG,eAAe,CAAC,CAAC;QAC5C,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAEf,OAAO,GAAG,EAAE;YACV,EAAE,CAAC,UAAU,EAAE,CAAC;QAClB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,aAAa,EAAE,OAAO,CAAC,CAAC,CAAC;IAErD,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC;AACxB,CAAC,CAAC;AAEF,eAAe,uBAAuB,CAAC","sourcesContent":["import { useLayoutEffect, useRef, useState } from 'react';\nimport { remToPx, stripUnit } from 'polished';\n\nimport { useChToPxConversionFactor, useTheme } from '../../hooks';\nimport { tryCatch } from '../../utils';\n\nimport { stepBarMinWidth, stepItemMinWidth, stepMarkerMinWidth } from './FormProgress.styles';\n\nexport const useFormProgressOverflow = (\n numberOfSteps: number,\n withLabels?: boolean,\n barMode?: boolean\n) => {\n const ref = useRef<HTMLOListElement>(null);\n const [state, setState] = useState<boolean | undefined>(undefined);\n\n const chToPxConversionFactor = useChToPxConversionFactor();\n const itemWidth = withLabels\n ? chToPxConversionFactor * stepItemMinWidth\n : chToPxConversionFactor * (barMode ? stepBarMinWidth : stepMarkerMinWidth);\n\n const theme = useTheme();\n\n const itemSpacing = Number(\n stripUnit(\n tryCatch(\n () => remToPx(theme.base.spacing),\n () => '16px'\n )\n )\n );\n\n useLayoutEffect(() => {\n const ol = ref.current;\n if (!ol) return;\n\n const ro = new ResizeObserver(() => {\n const olWidth = ol.offsetWidth ?? 0;\n let maxVisibleItems: number;\n\n if (barMode) {\n // All bar segments are equal size; gap is the spacing between them.\n // Min total width = N * minWidth + (N-1) * gap\n // Overflow when N > (olWidth + gap) / (minWidth + gap)\n\n maxVisibleItems = Math.floor((olWidth + itemSpacing) / (itemWidth + itemSpacing));\n } else {\n // Adding 1 to maxVisibleItems to account for the fact that the first and last item are half size,\n // so their overall width is equal to itemWidth, but need to be counted as 2 items\n maxVisibleItems = Math.floor(olWidth / (itemWidth + itemSpacing) + 1);\n }\n\n setState(numberOfSteps > maxVisibleItems);\n });\n\n ro.observe(ol);\n\n return () => {\n ro.disconnect();\n };\n }, [itemWidth, itemSpacing, numberOfSteps, barMode]);\n\n return { ref, state };\n};\n\nexport default useFormProgressOverflow;\n"]}
|
|
@@ -12,6 +12,7 @@ export interface PreviewPanelProps extends PreviewProps {
|
|
|
12
12
|
open: DrawerProps['open'];
|
|
13
13
|
}
|
|
14
14
|
export interface PreviewOptions {
|
|
15
|
+
/** Leaving this as a stub as we may want to add more options in the future */
|
|
15
16
|
previewProps: PreviewProps;
|
|
16
17
|
}
|
|
17
18
|
export interface PreviewManagerProps {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Preview.types.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/Preview.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,OAAO,EACP,QAAQ,EACR,gBAAgB,EAChB,SAAS,EACT,cAAc,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,cAAc,CACvC,KAAK,EACL;IACE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wFAAwF;IACxF,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CACF,GACC,IAAI,CAAC,WAAW,EAAE,cAAc,GAAG,aAAa,GAAG,eAAe,GAAG,cAAc,CAAC,GACpF,MAAM,GACN,UAAU,GACV,SAAS,CAAC;AAEZ,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,cAAc;
|
|
1
|
+
{"version":3,"file":"Preview.types.d.ts","sourceRoot":"","sources":["../../../src/components/Preview/Preview.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,OAAO,EACP,QAAQ,EACR,gBAAgB,EAChB,SAAS,EACT,cAAc,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,cAAc,CACvC,KAAK,EACL;IACE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wFAAwF;IACxF,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CACF,GACC,IAAI,CAAC,WAAW,EAAE,cAAc,GAAG,aAAa,GAAG,eAAe,GAAG,cAAc,CAAC,GACpF,MAAM,GACN,UAAU,GACV,SAAS,CAAC;AAEZ,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,cAAc;IAC7B,8EAA8E;IAC9E,YAAY,EAAE,YAAY,CAAC;CAC5B;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IACvD,aAAa,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC9E,cAAc,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,MAAM,WAAW,mBAAoB,SAAQ,OAAO,CAAC,cAAc,CAAC;IAClE,WAAW,EAAE,OAAO,CAAC;IACrB,iBAAiB,EAAE,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CACzD;AAED,MAAM,WAAW,0BAA0B;IACzC;;;OAGG;IACH,aAAa,EAAE,CAAC,CAAC,SAAS,MAAM,EAC9B,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,EAC3B,KAAK,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EACrB,OAAO,CAAC,EAAE,cAAc,KACrB,cAAc,CAAC,CAAC,CAAC,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAC7C,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,EAAE,OAAO,CAAC;IACvB,gBAAgB,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;CACrD;AAED,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IACtD,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,CAAC,CAAC;IACT,OAAO,EAAE,cAAc,CAAC;IACxB,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,cAAc,CAAC;CAC1B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Preview.types.js","sourceRoot":"","sources":["../../../src/components/Preview/Preview.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n ComponentType,\n Context,\n Dispatch,\n MutableRefObject,\n ReactNode,\n SetStateAction\n} from 'react';\n\nimport type { AsProp, BaseProps, DeferInfer, TestIdProp, WithAttributes } from '../../types';\nimport type { DrawerProps } from '../Drawer';\n\nexport type PreviewProps = WithAttributes<\n 'div',\n {\n children?: ReactNode;\n /** If true, the Preview Panel will render in a progress state. */\n progress?: boolean;\n /** Accessible label for the preview container. Will be constructed as 'Preview of X' */\n previewLabel?: string;\n }\n> &\n Pick<DrawerProps, 'onBeforeOpen' | 'onAfterOpen' | 'onBeforeClose' | 'onAfterClose'> &\n AsProp &\n TestIdProp &\n BaseProps;\n\nexport interface PreviewPanelProps extends PreviewProps {\n open: DrawerProps['open'];\n}\n\nexport interface PreviewOptions {\n
|
|
1
|
+
{"version":3,"file":"Preview.types.js","sourceRoot":"","sources":["../../../src/components/Preview/Preview.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n ComponentType,\n Context,\n Dispatch,\n MutableRefObject,\n ReactNode,\n SetStateAction\n} from 'react';\n\nimport type { AsProp, BaseProps, DeferInfer, TestIdProp, WithAttributes } from '../../types';\nimport type { DrawerProps } from '../Drawer';\n\nexport type PreviewProps = WithAttributes<\n 'div',\n {\n children?: ReactNode;\n /** If true, the Preview Panel will render in a progress state. */\n progress?: boolean;\n /** Accessible label for the preview container. Will be constructed as 'Preview of X' */\n previewLabel?: string;\n }\n> &\n Pick<DrawerProps, 'onBeforeOpen' | 'onAfterOpen' | 'onBeforeClose' | 'onAfterClose'> &\n AsProp &\n TestIdProp &\n BaseProps;\n\nexport interface PreviewPanelProps extends PreviewProps {\n open: DrawerProps['open'];\n}\n\nexport interface PreviewOptions {\n /** Leaving this as a stub as we may want to add more options in the future */\n previewProps: PreviewProps;\n}\n\nexport interface PreviewManagerProps {\n children: ReactNode;\n}\n\nexport interface PreviewMethods<P extends object = object> {\n updatePreview: (props: Partial<P>, options?: Partial<PreviewOptions>) => void;\n unmountPreview: () => void;\n}\n\nexport interface PreviewContextValue extends Partial<PreviewMethods> {\n initialized: boolean;\n previewTriggerRef: MutableRefObject<HTMLElement | null>;\n}\n\nexport interface PreviewManagerContextValue {\n /**\n * The function that will create the Preview. This function accepts the component to render\n * within Preview, props for that component, and options for the preview instance.\n */\n createPreview: <P extends object>(\n component: ComponentType<P>,\n props?: DeferInfer<P>,\n options?: PreviewOptions\n ) => PreviewMethods<P>;\n PreviewContext: Context<PreviewContextValue>;\n initialized: boolean;\n previewActive: boolean;\n setPreviewActive: Dispatch<SetStateAction<boolean>>;\n}\n\nexport interface PreviewObject<P extends object = object> {\n id: string;\n props: P;\n methods: PreviewMethods;\n Component: ComponentType<P>;\n options?: PreviewOptions;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/SummaryList/SummaryList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI7D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAI/C,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AAG/C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,KAAK,EACV,YAAY,EACZ,+BAA+B,EAC/B,cAAc,EACd,UAAU,EACV,MAAM,EACN,UAAU,EACX,MAAM,aAAa,CAAC;AAKrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAIvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAGrD,MAAM,WAAW,gBAAiB,SAAQ,cAAc;IACtD,uGAAuG;IACvG,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iDAAiD;IACjD,IAAI,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACrC,gFAAgF;IAChF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wHAAwH;IACxH,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,qDAAqD;IACrD,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,qKAAqK;IACrK,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,4KAA4K;IAC5K,SAAS,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC;IACzC,2DAA2D;IAC3D,WAAW,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IACzC;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IAClC,gGAAgG;IAChG,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,+FAA+F;IAC/F,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,yGAAyG;IACzG,gBAAgB,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACjD,8CAA8C;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,MAAM,WAAW,eACf,SAAQ,UAAU,CAAC,gBAAgB,EAAE,SAAS,CAAC,EAC7C,IAAI,CAAC,YAAY,EAAE,iBAAiB,CAAC,EACrC,YAAY;IACd,yCAAyC;IACzC,EAAE,EAAE,MAAM,CAAC;IACX,oIAAoI;IACpI,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,8CAA8C;IAC9C,UAAU,CAAC,EAAE,YAAY,CAAC,KAAK,CAAC,CAAC;CAClC;AAED,eAAO,MAAM,uBAAuB;;6IAMnC,CAAC;AAIF,eAAO,MAAM,wBAAwB;cACzB,OAAO,GAAG,MAAM;wJAoB3B,CAAC;AAIF,eAAO,MAAM,qBAAqB;;;;
|
|
1
|
+
{"version":3,"file":"SummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/SummaryList/SummaryList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI7D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAI/C,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AAG/C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,KAAK,EACV,YAAY,EACZ,+BAA+B,EAC/B,cAAc,EACd,UAAU,EACV,MAAM,EACN,UAAU,EACX,MAAM,aAAa,CAAC;AAKrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAIvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAGrD,MAAM,WAAW,gBAAiB,SAAQ,cAAc;IACtD,uGAAuG;IACvG,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iDAAiD;IACjD,IAAI,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACrC,gFAAgF;IAChF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wHAAwH;IACxH,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,qDAAqD;IACrD,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,qKAAqK;IACrK,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,4KAA4K;IAC5K,SAAS,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC;IACzC,2DAA2D;IAC3D,WAAW,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IACzC;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC;IAClC,gGAAgG;IAChG,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,+FAA+F;IAC/F,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,yGAAyG;IACzG,gBAAgB,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACjD,8CAA8C;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,MAAM,WAAW,eACf,SAAQ,UAAU,CAAC,gBAAgB,EAAE,SAAS,CAAC,EAC7C,IAAI,CAAC,YAAY,EAAE,iBAAiB,CAAC,EACrC,YAAY;IACd,yCAAyC;IACzC,EAAE,EAAE,MAAM,CAAC;IACX,oIAAoI;IACpI,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,8CAA8C;IAC9C,UAAU,CAAC,EAAE,YAAY,CAAC,KAAK,CAAC,CAAC;CAClC;AAED,eAAO,MAAM,uBAAuB;;6IAMnC,CAAC;AAIF,eAAO,MAAM,wBAAwB;cACzB,OAAO,GAAG,MAAM;wJAoB3B,CAAC;AAIF,eAAO,MAAM,qBAAqB;;;;iDAmBjC,CAAC;AAIF,eAAO,MAAM,gBAAgB,GAAI,iBAAiB,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,MAAM,CAAC,4CAqCzF,CAAC;AAEF,QAAA,MAAM,WAAW,EAAE,+BAA+B,CAAC,gBAAgB,CAsHlE,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -11,7 +11,7 @@ import EmptyState from '../EmptyState';
|
|
|
11
11
|
import { omitProps } from '../../styles';
|
|
12
12
|
import { useI18n, usePrevious, useRefMap } from '../../hooks';
|
|
13
13
|
import { defaultThemeProp } from '../../theme';
|
|
14
|
-
import SummaryItem from '../SummaryItem';
|
|
14
|
+
import SummaryItem, { StyledSecondary } from '../SummaryItem';
|
|
15
15
|
import Progress from '../Progress';
|
|
16
16
|
import Button from '../Button';
|
|
17
17
|
import ErrorState from '../ErrorState';
|
|
@@ -41,11 +41,15 @@ export const StyledSummaryListContent = styled(CardContent).withConfig(omitProps
|
|
|
41
41
|
}
|
|
42
42
|
`);
|
|
43
43
|
StyledSummaryListContent.defaultProps = defaultThemeProp;
|
|
44
|
-
export const StyledSummaryListItem = styled(SummaryItem)(({ theme }) => css `
|
|
45
|
-
padding-block: ${
|
|
44
|
+
export const StyledSummaryListItem = styled(SummaryItem)(({ theme: { base: { spacing, palette }, components: { 'summary-item': { 'vertical-gap': verticalGap } } } }) => css `
|
|
45
|
+
padding-block: ${spacing};
|
|
46
|
+
|
|
47
|
+
${StyledSecondary} {
|
|
48
|
+
margin-block-start: ${verticalGap};
|
|
49
|
+
}
|
|
46
50
|
|
|
47
51
|
&:not(:last-child) {
|
|
48
|
-
border-block-end: 0.0625rem solid ${
|
|
52
|
+
border-block-end: 0.0625rem solid ${palette['border-line']};
|
|
49
53
|
}
|
|
50
54
|
`);
|
|
51
55
|
StyledSummaryListItem.defaultProps = defaultThemeProp;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SummaryList.js","sourceRoot":"","sources":["../../../src/components/SummaryList/SummaryList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useMemo, useRef } from 'react';\nimport type { PropsWithoutRef, Ref, RefObject } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Actions from '../Actions';\nimport type { ActionsProps } from '../Actions';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport Count from '../Badges/Count';\nimport Icon, { type IconProps } from '../Icon';\nimport Card, { CardHeader, CardContent, CardFooter, StyledCard } from '../Card';\nimport EmptyState from '../EmptyState';\nimport type { EmptyStateProps } from '../EmptyState';\nimport type {\n ForwardProps,\n ForwardRefForwardPropsComponent,\n NoChildrenProp,\n OmitStrict,\n Action,\n HeadingTag\n} from '../../types';\nimport { omitProps } from '../../styles';\nimport { useI18n, usePrevious, useRefMap } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport SummaryItem from '../SummaryItem';\nimport type { SummaryItemProps } from '../SummaryItem';\nimport Progress from '../Progress';\nimport Button from '../Button';\nimport ErrorState from '../ErrorState';\nimport type { ErrorStateProps } from '../ErrorState';\nimport { StyledCardFooter } from '../Card/CardFooter';\n\nexport interface SummaryListProps extends NoChildrenProp {\n /** Name of the utility to be used as its heading along with associated actions and aria attributes. */\n name?: string;\n /**\n * The heading tag to render the provided name as with.\n * @default 'h2'\n */\n headingTag?: HeadingTag;\n /**\n * Hides the header while still allowing 'name' prop to supply aria attributes\n * @default false\n */\n hideHeader?: boolean;\n /** Identifier for the icon within Pega icons. */\n icon?: IconProps['name'] | IconProps;\n /** Integer representing the total count of items for a list utility dataset. */\n count?: number;\n /** Top level actions for the utility. If more than one action is passed a consolidated ActionMenu will be generated. */\n actions?: Action[];\n /** If the utility is in a state of fetching data. */\n loading?: boolean | string;\n /** An array of SummaryListItem objects to render. Pass an appropriately limited length array with a desired sort order based on design system defaults or config. */\n items: SummaryListItem[];\n /** User click initiated callback for when to show view all modal. List lengths less than the count prop will display a \"View all\" button with this function is bound to. */\n onViewAll?: (callback: Function) => void;\n /** A simple message to display when there are no items. */\n noItemsText?: EmptyStateProps['message'];\n /**\n * Indicate an error occurred while acquiring data for the list.\n * The default error state may be overridden with custom props.\n */\n error?: boolean | ErrorStateProps;\n /** ID of the item that was just deleted. Setting this triggers post-delete focus management. */\n deletedItemId?: string;\n /** Called after focus has been managed post-delete so the consumer can clear deletedItemId. */\n onDeleteFocusComplete?: () => void;\n /** Ref to the fallback element (e.g. Add button) to focus when the list becomes empty after deletion. */\n fallbackFocusRef?: RefObject<HTMLElement | null>;\n /** Ref for the SummaryList's root element. */\n ref?: Ref<HTMLElement>;\n}\n\nexport interface SummaryListItem\n extends OmitStrict<SummaryItemProps, 'actions'>,\n Pick<ActionsProps, 'contextualLabel'>,\n ForwardProps {\n /** A unique id to represent the item. */\n id: string;\n /** A set of Actions to render alongside the item. If more than one action is passed a consolidated ActionMenu will be generated. */\n actions?: Action[];\n /** Ref for the action menu button element. */\n actionsRef?: ActionsProps['ref'];\n}\n\nexport const StyledSummaryListHeader = styled(CardHeader)(\n ({ theme }) => css`\n &:not(${StyledCard} ${StyledCard} > &) {\n padding-block-end: calc(${theme.base.spacing} / 2);\n }\n `\n);\n\nStyledSummaryListHeader.defaultProps = defaultThemeProp;\n\nexport const StyledSummaryListContent = styled(CardContent).withConfig(omitProps('loading'))<{\n loading?: boolean | string;\n}>(\n ({ theme, loading }) => css`\n ${loading &&\n css`\n min-height: 4rem;\n `}\n\n &:not(:last-child) > ul > li:last-child {\n border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n\n &:not(${StyledCard} ${StyledCard} > &) {\n padding-block-end: calc(${theme.base.spacing} / 2);\n\n & + ${StyledCardFooter} {\n padding-block-start: ${theme.base.spacing};\n }\n }\n `\n);\n\nStyledSummaryListContent.defaultProps = defaultThemeProp;\n\nexport const StyledSummaryListItem = styled(SummaryItem)(\n ({ theme }) => css`\n padding-block: ${theme.base.spacing};\n\n &:not(:last-child) {\n border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n `\n);\n\nStyledSummaryListItem.defaultProps = defaultThemeProp;\n\nexport const SummaryListItems = ({ name, items }: Pick<SummaryListProps, 'items' | 'name'>) => {\n const t = useI18n();\n return (\n <ul>\n {items.map(\n ({\n id,\n actions: itemActions,\n actionsRef,\n contextualLabel,\n iconColor,\n ...restItemProps\n }) => {\n return (\n <StyledSummaryListItem\n key={id}\n {...restItemProps}\n forwardedAs='li'\n actions={\n itemActions && (\n <Actions\n ref={actionsRef}\n items={itemActions}\n contextualLabel={\n name && contextualLabel\n ? t('action_from_summarylist_heading', [contextualLabel, name])\n : contextualLabel\n }\n />\n )\n }\n />\n );\n }\n )}\n </ul>\n );\n};\n\nconst SummaryList: ForwardRefForwardPropsComponent<SummaryListProps> = forwardRef(\n function SummaryList(\n {\n icon,\n name,\n headingTag = 'h2',\n hideHeader,\n count,\n actions,\n items,\n onViewAll,\n loading,\n noItemsText,\n error,\n deletedItemId,\n onDeleteFocusComplete,\n fallbackFocusRef,\n ...restProps\n }: PropsWithoutRef<SummaryListProps>,\n ref: SummaryListProps['ref']\n ) {\n const t = useI18n();\n\n // Delete focus management\n const [actionRefMap, getActionRefCb] = useRefMap<HTMLButtonElement>();\n const prevItems = usePrevious(items);\n const hasProcessedDeleteRef = useRef(false);\n const headerActionsRef = useRef<HTMLButtonElement>(null);\n\n const processedItems = useMemo(() => {\n return items.map(item => {\n const refCb = getActionRefCb(item.id);\n return {\n ...item,\n actionsRef(el: HTMLButtonElement | null) {\n refCb(el);\n if (typeof item.actionsRef === 'function') item.actionsRef(el);\n }\n };\n });\n }, [items]);\n\n useEffect(() => {\n if (!deletedItemId) {\n hasProcessedDeleteRef.current = false;\n return;\n }\n if (hasProcessedDeleteRef.current) return;\n\n const stillPresent = items.some(item => item.id === deletedItemId);\n if (stillPresent) return;\n\n hasProcessedDeleteRef.current = true;\n\n if (items.length === 0) {\n const fallbackEl = fallbackFocusRef?.current ?? headerActionsRef.current;\n fallbackEl?.focus();\n } else {\n const prevIndex = prevItems?.findIndex(item => item.id === deletedItemId) ?? -1;\n let targetIndex = Math.min(prevIndex, items.length - 1);\n if (targetIndex < 0) targetIndex = 0;\n\n const targetId = items[targetIndex]?.id;\n if (targetId) {\n actionRefMap.get(targetId)?.focus();\n }\n }\n\n onDeleteFocusComplete?.();\n }, [deletedItemId, items]);\n\n const content = useMemo(() => {\n if (loading) {\n return (\n <Progress placement='local' message={typeof loading === 'string' ? loading : undefined} />\n );\n }\n\n if (error) {\n return <ErrorState {...(error === true ? {} : error)} />;\n }\n\n return items.length > 0 ? (\n <SummaryListItems name={name} items={processedItems} />\n ) : (\n <EmptyState message={noItemsText} />\n );\n }, [loading, items, processedItems, noItemsText, error]);\n\n return (\n <Card ref={ref} {...restProps}>\n {!hideHeader && (icon || name || typeof count === 'number' || actions) && (\n <StyledSummaryListHeader>\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n {icon && (typeof icon === 'string' ? <Icon name={icon} /> : <Icon {...icon} />)}\n {name && <Text variant={headingTag}>{name}</Text>}\n {typeof count === 'number' && <Count>{count}</Count>}\n </Flex>\n {actions && <Actions ref={headerActionsRef} items={actions} contextualLabel={name} />}\n </StyledSummaryListHeader>\n )}\n\n <StyledSummaryListContent loading={loading}>{content}</StyledSummaryListContent>\n\n {!error && typeof count === 'number' && count > items.length && onViewAll && (\n <CardFooter justify='center'>\n <Button\n variant='link'\n aria-label={name ? t('view_all_noun', [name.toLowerCase()]) : t('view_all')}\n onClick={onViewAll}\n >\n {t('view_all')}\n </Button>\n </CardFooter>\n )}\n </Card>\n );\n }\n);\n\nexport default SummaryList;\n"]}
|
|
1
|
+
{"version":3,"file":"SummaryList.js","sourceRoot":"","sources":["../../../src/components/SummaryList/SummaryList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,OAAO,MAAM,YAAY,CAAC;AAEjC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,KAAK,MAAM,iBAAiB,CAAC;AACpC,OAAO,IAAI,EAAE,EAAkB,MAAM,SAAS,CAAC;AAC/C,OAAO,IAAI,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAChF,OAAO,UAAU,MAAM,eAAe,CAAC;AAUvC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,WAAW,EAAE,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAE9D,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,UAAU,MAAM,eAAe,CAAC;AAEvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAwDtD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,UAAU,CAAC,CACvD,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;YACR,UAAU,IAAI,UAAU;gCACJ,KAAK,CAAC,IAAI,CAAC,OAAO;;GAE/C,CACF,CAAC;AAEF,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,wBAAwB,GAAG,MAAM,CAAC,WAAW,CAAC,CAAC,UAAU,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAG1F,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;MACvB,OAAO;IACT,GAAG,CAAA;;KAEF;;;0CAGqC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;;;YAG/D,UAAU,IAAI,UAAU;gCACJ,KAAK,CAAC,IAAI,CAAC,OAAO;;YAEtC,gBAAgB;+BACG,KAAK,CAAC,IAAI,CAAC,OAAO;;;GAG9C,CACF,CAAC;AAEF,wBAAwB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEzD,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,WAAW,CAAC,CACtD,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,EAC1B,UAAU,EAAE,EACV,cAAc,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,EAChD,EACF,EACF,EAAE,EAAE,CAAC,GAAG,CAAA;qBACU,OAAO;;MAEtB,eAAe;4BACO,WAAW;;;;0CAIG,OAAO,CAAC,aAAa,CAAC;;GAE7D,CACF,CAAC;AAEF,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAA4C,EAAE,EAAE;IAC5F,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,uBACG,KAAK,CAAC,GAAG,CACR,CAAC,EACC,EAAE,EACF,OAAO,EAAE,WAAW,EACpB,UAAU,EACV,eAAe,EACf,SAAS,EACT,GAAG,aAAa,EACjB,EAAE,EAAE;YACH,OAAO,CACL,KAAC,qBAAqB,OAEhB,aAAa,EACjB,WAAW,EAAC,IAAI,EAChB,OAAO,EACL,WAAW,IAAI,CACb,KAAC,OAAO,IACN,GAAG,EAAE,UAAU,EACf,KAAK,EAAE,WAAW,EAClB,eAAe,EACb,IAAI,IAAI,eAAe;wBACrB,CAAC,CAAC,CAAC,CAAC,iCAAiC,EAAE,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC;wBAC/D,CAAC,CAAC,eAAe,GAErB,CACH,IAdE,EAAE,CAgBP,CACH,CAAC;QACJ,CAAC,CACF,GACE,CACN,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,WAAW,GAAsD,UAAU,CAC/E,SAAS,WAAW,CAClB,EACE,IAAI,EACJ,IAAI,EACJ,UAAU,GAAG,IAAI,EACjB,UAAU,EACV,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAS,EACT,OAAO,EACP,WAAW,EACX,KAAK,EACL,aAAa,EACb,qBAAqB,EACrB,gBAAgB,EAChB,GAAG,SAAS,EACsB,EACpC,GAA4B;IAE5B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,0BAA0B;IAC1B,MAAM,CAAC,YAAY,EAAE,cAAc,CAAC,GAAG,SAAS,EAAqB,CAAC;IACtE,MAAM,SAAS,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IACrC,MAAM,qBAAqB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,gBAAgB,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEzD,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YACtB,MAAM,KAAK,GAAG,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YACtC,OAAO;gBACL,GAAG,IAAI;gBACP,UAAU,CAAC,EAA4B;oBACrC,KAAK,CAAC,EAAE,CAAC,CAAC;oBACV,IAAI,OAAO,IAAI,CAAC,UAAU,KAAK,UAAU;wBAAE,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;gBACjE,CAAC;aACF,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,aAAa,EAAE,CAAC;YACnB,qBAAqB,CAAC,OAAO,GAAG,KAAK,CAAC;YACtC,OAAO;QACT,CAAC;QACD,IAAI,qBAAqB,CAAC,OAAO;YAAE,OAAO;QAE1C,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,aAAa,CAAC,CAAC;QACnE,IAAI,YAAY;YAAE,OAAO;QAEzB,qBAAqB,CAAC,OAAO,GAAG,IAAI,CAAC;QAErC,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YACvB,MAAM,UAAU,GAAG,gBAAgB,EAAE,OAAO,IAAI,gBAAgB,CAAC,OAAO,CAAC;YACzE,UAAU,EAAE,KAAK,EAAE,CAAC;QACtB,CAAC;aAAM,CAAC;YACN,MAAM,SAAS,GAAG,SAAS,EAAE,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC;YAChF,IAAI,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;YACxD,IAAI,WAAW,GAAG,CAAC;gBAAE,WAAW,GAAG,CAAC,CAAC;YAErC,MAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,EAAE,EAAE,CAAC;YACxC,IAAI,QAAQ,EAAE,CAAC;gBACb,YAAY,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;YACtC,CAAC;QACH,CAAC;QAED,qBAAqB,EAAE,EAAE,CAAC;IAC5B,CAAC,EAAE,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC,CAAC;IAE3B,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CACL,KAAC,QAAQ,IAAC,SAAS,EAAC,OAAO,EAAC,OAAO,EAAE,OAAO,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,GAAI,CAC3F,CAAC;QACJ,CAAC;QAED,IAAI,KAAK,EAAE,CAAC;YACV,OAAO,KAAC,UAAU,OAAK,CAAC,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,GAAI,CAAC;QAC3D,CAAC;QAED,OAAO,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACxB,KAAC,gBAAgB,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,cAAc,GAAI,CACxD,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IAAC,OAAO,EAAE,WAAW,GAAI,CACrC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,EAAE,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC;IAEzD,OAAO,CACL,MAAC,IAAI,IAAC,GAAG,EAAE,GAAG,KAAM,SAAS,aAC1B,CAAC,UAAU,IAAI,CAAC,IAAI,IAAI,IAAI,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,OAAO,CAAC,IAAI,CACxE,MAAC,uBAAuB,eACtB,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC9C,IAAI,IAAI,CAAC,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,GAAI,CAAC,CAAC,CAAC,KAAC,IAAI,OAAK,IAAI,GAAI,CAAC,EAC9E,IAAI,IAAI,KAAC,IAAI,IAAC,OAAO,EAAE,UAAU,YAAG,IAAI,GAAQ,EAChD,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAC,KAAK,cAAE,KAAK,GAAS,IAC/C,EACN,OAAO,IAAI,KAAC,OAAO,IAAC,GAAG,EAAE,gBAAgB,EAAE,KAAK,EAAE,OAAO,EAAE,eAAe,EAAE,IAAI,GAAI,IAC7D,CAC3B,EAED,KAAC,wBAAwB,IAAC,OAAO,EAAE,OAAO,YAAG,OAAO,GAA4B,EAE/E,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,IAAI,SAAS,IAAI,CAC3E,KAAC,UAAU,IAAC,OAAO,EAAC,QAAQ,YAC1B,KAAC,MAAM,IACL,OAAO,EAAC,MAAM,gBACF,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,eAAe,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,EAC3E,OAAO,EAAE,SAAS,YAEjB,CAAC,CAAC,UAAU,CAAC,GACP,GACE,CACd,IACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { forwardRef, useEffect, useMemo, useRef } from 'react';\nimport type { PropsWithoutRef, Ref, RefObject } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Actions from '../Actions';\nimport type { ActionsProps } from '../Actions';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport Count from '../Badges/Count';\nimport Icon, { type IconProps } from '../Icon';\nimport Card, { CardHeader, CardContent, CardFooter, StyledCard } from '../Card';\nimport EmptyState from '../EmptyState';\nimport type { EmptyStateProps } from '../EmptyState';\nimport type {\n ForwardProps,\n ForwardRefForwardPropsComponent,\n NoChildrenProp,\n OmitStrict,\n Action,\n HeadingTag\n} from '../../types';\nimport { omitProps } from '../../styles';\nimport { useI18n, usePrevious, useRefMap } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport SummaryItem, { StyledSecondary } from '../SummaryItem';\nimport type { SummaryItemProps } from '../SummaryItem';\nimport Progress from '../Progress';\nimport Button from '../Button';\nimport ErrorState from '../ErrorState';\nimport type { ErrorStateProps } from '../ErrorState';\nimport { StyledCardFooter } from '../Card/CardFooter';\n\nexport interface SummaryListProps extends NoChildrenProp {\n /** Name of the utility to be used as its heading along with associated actions and aria attributes. */\n name?: string;\n /**\n * The heading tag to render the provided name as with.\n * @default 'h2'\n */\n headingTag?: HeadingTag;\n /**\n * Hides the header while still allowing 'name' prop to supply aria attributes\n * @default false\n */\n hideHeader?: boolean;\n /** Identifier for the icon within Pega icons. */\n icon?: IconProps['name'] | IconProps;\n /** Integer representing the total count of items for a list utility dataset. */\n count?: number;\n /** Top level actions for the utility. If more than one action is passed a consolidated ActionMenu will be generated. */\n actions?: Action[];\n /** If the utility is in a state of fetching data. */\n loading?: boolean | string;\n /** An array of SummaryListItem objects to render. Pass an appropriately limited length array with a desired sort order based on design system defaults or config. */\n items: SummaryListItem[];\n /** User click initiated callback for when to show view all modal. List lengths less than the count prop will display a \"View all\" button with this function is bound to. */\n onViewAll?: (callback: Function) => void;\n /** A simple message to display when there are no items. */\n noItemsText?: EmptyStateProps['message'];\n /**\n * Indicate an error occurred while acquiring data for the list.\n * The default error state may be overridden with custom props.\n */\n error?: boolean | ErrorStateProps;\n /** ID of the item that was just deleted. Setting this triggers post-delete focus management. */\n deletedItemId?: string;\n /** Called after focus has been managed post-delete so the consumer can clear deletedItemId. */\n onDeleteFocusComplete?: () => void;\n /** Ref to the fallback element (e.g. Add button) to focus when the list becomes empty after deletion. */\n fallbackFocusRef?: RefObject<HTMLElement | null>;\n /** Ref for the SummaryList's root element. */\n ref?: Ref<HTMLElement>;\n}\n\nexport interface SummaryListItem\n extends OmitStrict<SummaryItemProps, 'actions'>,\n Pick<ActionsProps, 'contextualLabel'>,\n ForwardProps {\n /** A unique id to represent the item. */\n id: string;\n /** A set of Actions to render alongside the item. If more than one action is passed a consolidated ActionMenu will be generated. */\n actions?: Action[];\n /** Ref for the action menu button element. */\n actionsRef?: ActionsProps['ref'];\n}\n\nexport const StyledSummaryListHeader = styled(CardHeader)(\n ({ theme }) => css`\n &:not(${StyledCard} ${StyledCard} > &) {\n padding-block-end: calc(${theme.base.spacing} / 2);\n }\n `\n);\n\nStyledSummaryListHeader.defaultProps = defaultThemeProp;\n\nexport const StyledSummaryListContent = styled(CardContent).withConfig(omitProps('loading'))<{\n loading?: boolean | string;\n}>(\n ({ theme, loading }) => css`\n ${loading &&\n css`\n min-height: 4rem;\n `}\n\n &:not(:last-child) > ul > li:last-child {\n border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n\n &:not(${StyledCard} ${StyledCard} > &) {\n padding-block-end: calc(${theme.base.spacing} / 2);\n\n & + ${StyledCardFooter} {\n padding-block-start: ${theme.base.spacing};\n }\n }\n `\n);\n\nStyledSummaryListContent.defaultProps = defaultThemeProp;\n\nexport const StyledSummaryListItem = styled(SummaryItem)(\n ({\n theme: {\n base: { spacing, palette },\n components: {\n 'summary-item': { 'vertical-gap': verticalGap }\n }\n }\n }) => css`\n padding-block: ${spacing};\n\n ${StyledSecondary} {\n margin-block-start: ${verticalGap};\n }\n\n &:not(:last-child) {\n border-block-end: 0.0625rem solid ${palette['border-line']};\n }\n `\n);\n\nStyledSummaryListItem.defaultProps = defaultThemeProp;\n\nexport const SummaryListItems = ({ name, items }: Pick<SummaryListProps, 'items' | 'name'>) => {\n const t = useI18n();\n return (\n <ul>\n {items.map(\n ({\n id,\n actions: itemActions,\n actionsRef,\n contextualLabel,\n iconColor,\n ...restItemProps\n }) => {\n return (\n <StyledSummaryListItem\n key={id}\n {...restItemProps}\n forwardedAs='li'\n actions={\n itemActions && (\n <Actions\n ref={actionsRef}\n items={itemActions}\n contextualLabel={\n name && contextualLabel\n ? t('action_from_summarylist_heading', [contextualLabel, name])\n : contextualLabel\n }\n />\n )\n }\n />\n );\n }\n )}\n </ul>\n );\n};\n\nconst SummaryList: ForwardRefForwardPropsComponent<SummaryListProps> = forwardRef(\n function SummaryList(\n {\n icon,\n name,\n headingTag = 'h2',\n hideHeader,\n count,\n actions,\n items,\n onViewAll,\n loading,\n noItemsText,\n error,\n deletedItemId,\n onDeleteFocusComplete,\n fallbackFocusRef,\n ...restProps\n }: PropsWithoutRef<SummaryListProps>,\n ref: SummaryListProps['ref']\n ) {\n const t = useI18n();\n\n // Delete focus management\n const [actionRefMap, getActionRefCb] = useRefMap<HTMLButtonElement>();\n const prevItems = usePrevious(items);\n const hasProcessedDeleteRef = useRef(false);\n const headerActionsRef = useRef<HTMLButtonElement>(null);\n\n const processedItems = useMemo(() => {\n return items.map(item => {\n const refCb = getActionRefCb(item.id);\n return {\n ...item,\n actionsRef(el: HTMLButtonElement | null) {\n refCb(el);\n if (typeof item.actionsRef === 'function') item.actionsRef(el);\n }\n };\n });\n }, [items]);\n\n useEffect(() => {\n if (!deletedItemId) {\n hasProcessedDeleteRef.current = false;\n return;\n }\n if (hasProcessedDeleteRef.current) return;\n\n const stillPresent = items.some(item => item.id === deletedItemId);\n if (stillPresent) return;\n\n hasProcessedDeleteRef.current = true;\n\n if (items.length === 0) {\n const fallbackEl = fallbackFocusRef?.current ?? headerActionsRef.current;\n fallbackEl?.focus();\n } else {\n const prevIndex = prevItems?.findIndex(item => item.id === deletedItemId) ?? -1;\n let targetIndex = Math.min(prevIndex, items.length - 1);\n if (targetIndex < 0) targetIndex = 0;\n\n const targetId = items[targetIndex]?.id;\n if (targetId) {\n actionRefMap.get(targetId)?.focus();\n }\n }\n\n onDeleteFocusComplete?.();\n }, [deletedItemId, items]);\n\n const content = useMemo(() => {\n if (loading) {\n return (\n <Progress placement='local' message={typeof loading === 'string' ? loading : undefined} />\n );\n }\n\n if (error) {\n return <ErrorState {...(error === true ? {} : error)} />;\n }\n\n return items.length > 0 ? (\n <SummaryListItems name={name} items={processedItems} />\n ) : (\n <EmptyState message={noItemsText} />\n );\n }, [loading, items, processedItems, noItemsText, error]);\n\n return (\n <Card ref={ref} {...restProps}>\n {!hideHeader && (icon || name || typeof count === 'number' || actions) && (\n <StyledSummaryListHeader>\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n {icon && (typeof icon === 'string' ? <Icon name={icon} /> : <Icon {...icon} />)}\n {name && <Text variant={headingTag}>{name}</Text>}\n {typeof count === 'number' && <Count>{count}</Count>}\n </Flex>\n {actions && <Actions ref={headerActionsRef} items={actions} contextualLabel={name} />}\n </StyledSummaryListHeader>\n )}\n\n <StyledSummaryListContent loading={loading}>{content}</StyledSummaryListContent>\n\n {!error && typeof count === 'number' && count > items.length && onViewAll && (\n <CardFooter justify='center'>\n <Button\n variant='link'\n aria-label={name ? t('view_all_noun', [name.toLowerCase()]) : t('view_all')}\n onClick={onViewAll}\n >\n {t('view_all')}\n </Button>\n </CardFooter>\n )}\n </Card>\n );\n }\n);\n\nexport default SummaryList;\n"]}
|
package/lib/theme/theme.d.ts
CHANGED
|
@@ -1438,6 +1438,12 @@ export declare const BaseThemeMachine: ThemeMachine<{
|
|
|
1438
1438
|
$value: string;
|
|
1439
1439
|
};
|
|
1440
1440
|
};
|
|
1441
|
+
"multi-step-form": {
|
|
1442
|
+
"bar-indicator-border-radius": {
|
|
1443
|
+
$type: string;
|
|
1444
|
+
$value: string;
|
|
1445
|
+
};
|
|
1446
|
+
};
|
|
1441
1447
|
progress: {
|
|
1442
1448
|
"progress-color": {
|
|
1443
1449
|
$type: string;
|
|
@@ -1562,6 +1568,12 @@ export declare const BaseThemeMachine: ThemeMachine<{
|
|
|
1562
1568
|
};
|
|
1563
1569
|
};
|
|
1564
1570
|
};
|
|
1571
|
+
"summary-item": {
|
|
1572
|
+
"vertical-gap": {
|
|
1573
|
+
$type: string;
|
|
1574
|
+
$value: string;
|
|
1575
|
+
};
|
|
1576
|
+
};
|
|
1565
1577
|
switch: {
|
|
1566
1578
|
height: {
|
|
1567
1579
|
$type: string;
|
|
@@ -1798,6 +1810,12 @@ export declare const BaseThemeMachine: ThemeMachine<{
|
|
|
1798
1810
|
};
|
|
1799
1811
|
};
|
|
1800
1812
|
};
|
|
1813
|
+
tasks: {
|
|
1814
|
+
"button-style": {
|
|
1815
|
+
$type: string;
|
|
1816
|
+
$value: string;
|
|
1817
|
+
};
|
|
1818
|
+
};
|
|
1801
1819
|
text: {
|
|
1802
1820
|
primary: {
|
|
1803
1821
|
"font-size": {
|
|
@@ -2545,6 +2563,9 @@ export declare const WorkTheme: {
|
|
|
2545
2563
|
readonly "background-color": string;
|
|
2546
2564
|
readonly "font-weight": string;
|
|
2547
2565
|
};
|
|
2566
|
+
readonly "multi-step-form": {
|
|
2567
|
+
readonly "bar-indicator-border-radius": string;
|
|
2568
|
+
};
|
|
2548
2569
|
readonly progress: {
|
|
2549
2570
|
readonly "progress-color": string;
|
|
2550
2571
|
};
|
|
@@ -2597,6 +2618,9 @@ export declare const WorkTheme: {
|
|
|
2597
2618
|
readonly foreground: string;
|
|
2598
2619
|
};
|
|
2599
2620
|
};
|
|
2621
|
+
readonly "summary-item": {
|
|
2622
|
+
readonly "vertical-gap": string;
|
|
2623
|
+
};
|
|
2600
2624
|
readonly switch: {
|
|
2601
2625
|
readonly height: string;
|
|
2602
2626
|
readonly width: string;
|
|
@@ -2686,6 +2710,9 @@ export declare const WorkTheme: {
|
|
|
2686
2710
|
};
|
|
2687
2711
|
};
|
|
2688
2712
|
};
|
|
2713
|
+
readonly tasks: {
|
|
2714
|
+
readonly "button-style": string;
|
|
2715
|
+
};
|
|
2689
2716
|
readonly text: {
|
|
2690
2717
|
readonly primary: {
|
|
2691
2718
|
readonly "font-size": string;
|
|
@@ -3288,6 +3315,9 @@ export declare const defaultThemeProp: Readonly<{
|
|
|
3288
3315
|
readonly "background-color": string;
|
|
3289
3316
|
readonly "font-weight": string;
|
|
3290
3317
|
};
|
|
3318
|
+
readonly "multi-step-form": {
|
|
3319
|
+
readonly "bar-indicator-border-radius": string;
|
|
3320
|
+
};
|
|
3291
3321
|
readonly progress: {
|
|
3292
3322
|
readonly "progress-color": string;
|
|
3293
3323
|
};
|
|
@@ -3340,6 +3370,9 @@ export declare const defaultThemeProp: Readonly<{
|
|
|
3340
3370
|
readonly foreground: string;
|
|
3341
3371
|
};
|
|
3342
3372
|
};
|
|
3373
|
+
readonly "summary-item": {
|
|
3374
|
+
readonly "vertical-gap": string;
|
|
3375
|
+
};
|
|
3343
3376
|
readonly switch: {
|
|
3344
3377
|
readonly height: string;
|
|
3345
3378
|
readonly width: string;
|
|
@@ -3429,6 +3462,9 @@ export declare const defaultThemeProp: Readonly<{
|
|
|
3429
3462
|
};
|
|
3430
3463
|
};
|
|
3431
3464
|
};
|
|
3465
|
+
readonly tasks: {
|
|
3466
|
+
readonly "button-style": string;
|
|
3467
|
+
};
|
|
3432
3468
|
readonly text: {
|
|
3433
3469
|
readonly primary: {
|
|
3434
3470
|
readonly "font-size": string;
|
package/lib/theme/theme.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/theme/theme.ts"],"names":[],"mappings":"AAAA,OAAO,YAAgC,MAAM,gBAAgB,CAAC;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,sBAAsB,MAAM,wBAAwB,CAAC;AAE5D,MAAM,MAAM,sBAAsB,GAAG,OAAO,sBAAsB,CAAC;AAEnE,OAAO,EAAE,sBAAsB,IAAI,eAAe,EAAE,CAAC;AAErD,eAAO,MAAM,gBAAgB
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/theme/theme.ts"],"names":[],"mappings":"AAAA,OAAO,YAAgC,MAAM,gBAAgB,CAAC;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,sBAAsB,MAAM,wBAAwB,CAAC;AAE5D,MAAM,MAAM,sBAAsB,GAAG,OAAO,sBAAsB,CAAC;AAEnE,OAAO,EAAE,sBAAsB,IAAI,eAAe,EAAE,CAAC;AAErD,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA2D,CAAC;AAEzF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAyB,CAAC;AAYhD,eAAO,MAAM,UAAU,EAAE,oBAAgD,CAAC;AAE1E,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAAsC,CAAC;AAEpE,MAAM,MAAM,oBAAoB,GAAG,aAAa,CAAC,OAAO,sBAAsB,CAAC,CAAC;AAGhF,OAAO,QAAQ,mBAAmB,CAAC;IACjC,UAAiB,YAAa,SAAQ,YAAY,CAAC,OAAO,sBAAsB,CAAC;KAAG;CACrF"}
|
|
@@ -1433,6 +1433,12 @@
|
|
|
1433
1433
|
"$value": "base.font-weight.bold"
|
|
1434
1434
|
}
|
|
1435
1435
|
},
|
|
1436
|
+
"multi-step-form": {
|
|
1437
|
+
"bar-indicator-border-radius": {
|
|
1438
|
+
"$type": "inherited",
|
|
1439
|
+
"$value": "base.border-radius"
|
|
1440
|
+
}
|
|
1441
|
+
},
|
|
1436
1442
|
"progress": {
|
|
1437
1443
|
"progress-color": {
|
|
1438
1444
|
"$type": "inherited",
|
|
@@ -1557,6 +1563,12 @@
|
|
|
1557
1563
|
}
|
|
1558
1564
|
}
|
|
1559
1565
|
},
|
|
1566
|
+
"summary-item": {
|
|
1567
|
+
"vertical-gap": {
|
|
1568
|
+
"$type": "literal",
|
|
1569
|
+
"$value": "0rem"
|
|
1570
|
+
}
|
|
1571
|
+
},
|
|
1560
1572
|
"switch": {
|
|
1561
1573
|
"height": {
|
|
1562
1574
|
"$type": "literal",
|
|
@@ -1793,6 +1805,12 @@
|
|
|
1793
1805
|
}
|
|
1794
1806
|
}
|
|
1795
1807
|
},
|
|
1808
|
+
"tasks": {
|
|
1809
|
+
"button-style": {
|
|
1810
|
+
"$type": "literal",
|
|
1811
|
+
"$value": "text"
|
|
1812
|
+
}
|
|
1813
|
+
},
|
|
1796
1814
|
"text": {
|
|
1797
1815
|
"primary": {
|
|
1798
1816
|
"font-size": {
|
|
@@ -1869,6 +1869,15 @@
|
|
|
1869
1869
|
},
|
|
1870
1870
|
"additionalProperties": false
|
|
1871
1871
|
},
|
|
1872
|
+
"multi-step-form": {
|
|
1873
|
+
"type": "object",
|
|
1874
|
+
"properties": {
|
|
1875
|
+
"bar-indicator-border-radius": {
|
|
1876
|
+
"type": "string"
|
|
1877
|
+
}
|
|
1878
|
+
},
|
|
1879
|
+
"additionalProperties": false
|
|
1880
|
+
},
|
|
1872
1881
|
"popover": {
|
|
1873
1882
|
"type": "object",
|
|
1874
1883
|
"properties": {
|
|
@@ -2187,6 +2196,16 @@
|
|
|
2187
2196
|
},
|
|
2188
2197
|
"additionalProperties": false
|
|
2189
2198
|
},
|
|
2199
|
+
"tasks": {
|
|
2200
|
+
"type": "object",
|
|
2201
|
+
"properties": {
|
|
2202
|
+
"button-style": {
|
|
2203
|
+
"type": "string",
|
|
2204
|
+
"enum": ["text", "icon"]
|
|
2205
|
+
}
|
|
2206
|
+
},
|
|
2207
|
+
"additionalProperties": false
|
|
2208
|
+
},
|
|
2190
2209
|
"mark": {
|
|
2191
2210
|
"type": "object",
|
|
2192
2211
|
"properties": {
|
|
@@ -2231,6 +2250,15 @@
|
|
|
2231
2250
|
}
|
|
2232
2251
|
},
|
|
2233
2252
|
"additionalProperties": false
|
|
2253
|
+
},
|
|
2254
|
+
"summary-item": {
|
|
2255
|
+
"type": "object",
|
|
2256
|
+
"properties": {
|
|
2257
|
+
"vertical-gap": {
|
|
2258
|
+
"type": "string"
|
|
2259
|
+
}
|
|
2260
|
+
},
|
|
2261
|
+
"additionalProperties": false
|
|
2234
2262
|
}
|
|
2235
2263
|
},
|
|
2236
2264
|
"additionalProperties": false
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-core",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.12.0",
|
|
4
4
|
"description": "Cosmos is a visual design system and UI component collection. Its goal is to empower application developers in their pursuit to create engaging and rewarding user experiences.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"author": "Pegasystems",
|