@pega/cosmos-react-dnd 9.0.0-build.9.8 → 9.0.0-build.9.9

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.
@@ -1 +1 @@
1
- {"version":3,"file":"StandardDragDropList.styles.d.ts","sourceRoot":"","sources":["../../../src/components/StandardDragDropList/StandardDragDropList.styles.ts"],"names":[],"mappings":"AAAA,OAAe,EAAO,KAAK,YAAY,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAQzF,eAAO,MAAM,0BAA0B,4JAerC,CAAC;AAIH,eAAO,MAAM,gBAAgB,iDAU3B,CAAC;AAIH,eAAO,MAAM,iBAAiB,iDAe5B,CAAC;AAIH,eAAO,MAAM,iBAAiB,iDAAe,CAAC;AAE9C,eAAO,MAAM,4BAA4B;qBAAiC,MAAM;SAa/E,CAAC;AAEF,eAAO,MAAM,aAAa,0JAGzB,CAAC;AAEF,eAAO,MAAM,eAAe,0JAG3B,CAAC;AAEF,eAAO,MAAM,mBAAmB;kBAChB,OAAO;iBACR,OAAO;gBACR,OAAO;mBACJ,OAAO;SAiCtB,CAAC;AAIH,eAAO,MAAM,8BAA8B;iBAC5B,OAAO;YACZ,OAAO;SAiEf,CAAC;AAIH,eAAO,MAAM,0BAA0B,EAAE,eAAe,CAAC,KAAK,EAAE,YAAY,EAAE,MAAM,EAAE,KAAK,CAyFvF,CAAC"}
1
+ {"version":3,"file":"StandardDragDropList.styles.d.ts","sourceRoot":"","sources":["../../../src/components/StandardDragDropList/StandardDragDropList.styles.ts"],"names":[],"mappings":"AAAA,OAAe,EAAO,KAAK,YAAY,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAQzF,eAAO,MAAM,0BAA0B,4JAerC,CAAC;AAIH,eAAO,MAAM,gBAAgB,iDAU3B,CAAC;AAIH,eAAO,MAAM,iBAAiB,iDAe5B,CAAC;AAIH,eAAO,MAAM,iBAAiB,iDAAe,CAAC;AAE9C,eAAO,MAAM,4BAA4B;qBAAiC,MAAM;SAa/E,CAAC;AAEF,eAAO,MAAM,aAAa,0JAGzB,CAAC;AAEF,eAAO,MAAM,eAAe,0JAG3B,CAAC;AAEF,eAAO,MAAM,mBAAmB;kBAChB,OAAO;iBACR,OAAO;gBACR,OAAO;mBACJ,OAAO;SAiCtB,CAAC;AAIH,eAAO,MAAM,8BAA8B;iBAC5B,OAAO;YACZ,OAAO;SAiEf,CAAC;AAIH,eAAO,MAAM,0BAA0B,EAAE,eAAe,CAAC,KAAK,EAAE,YAAY,EAAE,MAAM,EAAE,KAAK,CA8EvF,CAAC"}
@@ -208,6 +208,7 @@ export const StyledStandardDragDropList = styled.div(({ theme }) => {
208
208
 
209
209
  ul {
210
210
  border: none;
211
+ padding-inline: calc(3.5 * ${theme.base.spacing}) 0;
211
212
 
212
213
  > ${StyledStandardDragDropListItem} {
213
214
  &:first-child {
@@ -225,21 +226,9 @@ export const StyledStandardDragDropList = styled.div(({ theme }) => {
225
226
  &:last-child::after {
226
227
  display: block;
227
228
  }
228
- }
229
- }
230
- }
231
-
232
- & & {
233
- padding-inline: calc(3.5 * ${theme.base.spacing}) 0;
234
229
 
235
- ${StyledStandardDragDropListItem} {
236
- ${StyledListItemInner} {
237
- padding-inline-start: calc(${theme.base.spacing} * 1);
238
- }
239
-
240
- &:last-child {
241
- &::after {
242
- display: none;
230
+ ${StyledListItemInner} {
231
+ padding-inline-start: calc(${theme.base.spacing} * 1);
243
232
  }
244
233
  }
245
234
  }
@@ -1 +1 @@
1
- {"version":3,"file":"StandardDragDropList.styles.js","sourceRoot":"","sources":["../../../src/components/StandardDragDropList/StandardDragDropList.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css, type DefaultTheme, type StyledComponent } from 'styled-components';\n\nimport { Button, defaultThemeProp, StyledIcon, Text, useDirection } from '@pega/cosmos-react-core';\nimport { ellipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';\nimport { StyledPseudoRadioCheck } from '@pega/cosmos-react-core/lib/components/RadioCheck/RadioCheck';\n\nimport { StyledDragHandle } from '../DragHandle';\n\nexport const StyledExpandCollapseToggle = styled(Button)(({ theme }) => {\n const { ltr } = useDirection();\n return css`\n & > div {\n vertical-align: middle;\n }\n\n & ${StyledIcon} {\n transition: transform ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n }\n\n &[aria-expanded='false'] ${StyledIcon}:first-of-type {\n transform: rotateZ(${ltr ? '-' : ''}90deg);\n }\n `;\n});\n\nStyledExpandCollapseToggle.defaultProps = defaultThemeProp;\n\nexport const StyledItemStatus = styled.div(({ theme }) => {\n return css`\n ${StyledIcon} {\n outline: none;\n\n &:focus {\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n }\n `;\n});\n\nStyledItemStatus.defaultProps = defaultThemeProp;\n\nexport const StyledItemContent = styled.div(({ theme }) => {\n return css`\n &,\n & > :nth-child(2) {\n ${ellipsisOverflow}\n }\n\n & > ${StyledIcon} {\n margin-inline: ${theme.base.spacing};\n }\n\n & ${StyledPseudoRadioCheck} {\n margin-inline-end: 0;\n }\n `;\n});\n\nStyledItemContent.defaultProps = defaultThemeProp;\n\nexport const StyledItemActions = styled.div``;\n\nexport const StyledItemSecondaryContainer = styled.div<{ numberOfActions: number }>(\n ({ theme, numberOfActions }) => {\n const minContainerWidth = `calc(${numberOfActions} * ${theme.base['hit-area']['mouse-min']} + ${numberOfActions - 1} * ${theme.base.spacing} / 2)`;\n const minCoarseContainerWidth = `calc(${numberOfActions} * ${theme.base['hit-area']['finger-min']} + ${numberOfActions - 1} * ${theme.base.spacing} / 2)`;\n\n return css`\n min-width: ${minContainerWidth};\n\n @media (pointer: coarse) {\n min-width: ${minCoarseContainerWidth};\n }\n `;\n }\n);\n\nexport const StyledPrimary = styled(Text)`\n display: inline;\n ${ellipsisOverflow};\n`;\n\nexport const StyledSecondary = styled(Text)`\n max-width: 14ch;\n ${ellipsisOverflow}\n`;\n\nexport const StyledListItemInner = styled.div<{\n isDraggable?: boolean;\n hasActions?: boolean;\n hasVisual?: boolean;\n isSelectable?: boolean;\n}>(({ theme, isDraggable, hasActions, hasVisual, isSelectable }) => {\n return css`\n white-space: nowrap;\n padding-inline-start: calc(${theme.base.spacing} / 2);\n padding-inline-end: ${hasActions\n ? `calc(${theme.base.spacing} / 2)`\n : `calc(${theme.base.spacing} * 1.5)`};\n\n ${!isDraggable &&\n (!hasVisual || isSelectable) &&\n css`\n padding-inline-start: ${theme.base.spacing};\n `}\n ${hasVisual &&\n !isDraggable &&\n !isSelectable &&\n css`\n padding-inline-start: 0;\n `}\n\n &:has(${StyledExpandCollapseToggle}) {\n padding-inline-start: calc(${theme.base.spacing} * 0.5);\n\n &:not(:has(${StyledDragHandle})) {\n padding-inline-start: 0;\n }\n\n & > ${StyledDragHandle} {\n padding-inline-end: 0;\n }\n }\n `;\n});\n\nStyledListItemInner.defaultProps = defaultThemeProp;\n\nexport const StyledStandardDragDropListItem = styled.li<{\n isDragging?: boolean;\n empty?: boolean;\n}>(({ theme, isDragging, empty }) => {\n const bdrColor = theme.base.palette['border-line'];\n const bdr = `0.0625rem dashed ${isDragging || empty ? bdrColor : 'transparent'}`;\n\n if (empty) {\n return css`\n text-align: center;\n padding: ${theme.base.spacing};\n border: ${bdr};\n font-style: italic;\n `;\n }\n\n return css`\n position: relative;\n background: ${theme.base.palette['primary-background']};\n\n ${isDragging &&\n css`\n z-index: 1;\n\n & > div,\n span {\n opacity: 0.5;\n }\n `}\n\n &::before,\n &::after {\n content: '';\n display: block;\n position: absolute;\n height: 0.0625rem;\n left: 0;\n right: 0;\n background: ${isDragging ? theme.base.palette['primary-background'] : bdrColor};\n }\n\n &::before {\n top: 0;\n border-top: ${bdr};\n ${isDragging &&\n css`\n box-shadow: 0 0.0625rem 0 ${theme.base.palette.interactive};\n `}\n }\n\n &::after {\n bottom: -0.0625rem;\n border-bottom: ${bdr};\n ${isDragging &&\n css`\n box-shadow: 0 -0.0625rem 0 ${theme.base.palette.interactive};\n `}\n }\n\n & > ${StyledListItemInner} {\n min-height: calc(${theme.base['hit-area'].mouse} + ${theme.base.spacing});\n\n @media (pointer: coarse) {\n min-height: calc(${theme.base['hit-area']['finger-min']} + ${theme.base.spacing});\n }\n }\n `;\n});\n\nStyledStandardDragDropListItem.defaultProps = defaultThemeProp;\n\nexport const StyledStandardDragDropList: StyledComponent<'div', DefaultTheme, object, never> =\n styled.div(({ theme }) => {\n const {\n base: {\n palette: { 'border-line': borderColor },\n 'border-radius': baseBorderRadius\n },\n components: {\n 'form-control': { 'border-radius': borderRadiusMultiplier, 'border-width': borderWidth }\n }\n } = theme;\n\n const matchBottomBorderRadius = css`\n border-end-start-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n border-end-end-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n `;\n\n return css`\n flex-grow: 1;\n background-color: ${theme.base.palette['primary-background']};\n\n ul {\n list-style: none;\n border: ${borderWidth} solid ${borderColor};\n border-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n\n > ${StyledStandardDragDropListItem} {\n &:first-child {\n border-start-start-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n border-start-end-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n\n &::before {\n display: none;\n }\n }\n\n &:last-child,\n &:last-child ${StyledStandardDragDropListItem}:last-child {\n ${matchBottomBorderRadius}\n\n &::after {\n display: none;\n }\n }\n\n &:last-child ${StyledStandardDragDropList} {\n ${matchBottomBorderRadius}\n }\n }\n\n ul {\n border: none;\n\n > ${StyledStandardDragDropListItem} {\n &:first-child {\n border-radius: 0;\n }\n\n &:first-child::before {\n display: block;\n }\n\n &:last-child {\n border-radius: 0;\n }\n\n &:last-child::after {\n display: block;\n }\n }\n }\n }\n\n & & {\n padding-inline: calc(3.5 * ${theme.base.spacing}) 0;\n\n ${StyledStandardDragDropListItem} {\n ${StyledListItemInner} {\n padding-inline-start: calc(${theme.base.spacing} * 1);\n }\n\n &:last-child {\n &::after {\n display: none;\n }\n }\n }\n }\n `;\n });\n\nStyledStandardDragDropList.defaultProps = defaultThemeProp;\n"]}
1
+ {"version":3,"file":"StandardDragDropList.styles.js","sourceRoot":"","sources":["../../../src/components/StandardDragDropList/StandardDragDropList.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css, type DefaultTheme, type StyledComponent } from 'styled-components';\n\nimport { Button, defaultThemeProp, StyledIcon, Text, useDirection } from '@pega/cosmos-react-core';\nimport { ellipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';\nimport { StyledPseudoRadioCheck } from '@pega/cosmos-react-core/lib/components/RadioCheck/RadioCheck';\n\nimport { StyledDragHandle } from '../DragHandle';\n\nexport const StyledExpandCollapseToggle = styled(Button)(({ theme }) => {\n const { ltr } = useDirection();\n return css`\n & > div {\n vertical-align: middle;\n }\n\n & ${StyledIcon} {\n transition: transform ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n }\n\n &[aria-expanded='false'] ${StyledIcon}:first-of-type {\n transform: rotateZ(${ltr ? '-' : ''}90deg);\n }\n `;\n});\n\nStyledExpandCollapseToggle.defaultProps = defaultThemeProp;\n\nexport const StyledItemStatus = styled.div(({ theme }) => {\n return css`\n ${StyledIcon} {\n outline: none;\n\n &:focus {\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n }\n `;\n});\n\nStyledItemStatus.defaultProps = defaultThemeProp;\n\nexport const StyledItemContent = styled.div(({ theme }) => {\n return css`\n &,\n & > :nth-child(2) {\n ${ellipsisOverflow}\n }\n\n & > ${StyledIcon} {\n margin-inline: ${theme.base.spacing};\n }\n\n & ${StyledPseudoRadioCheck} {\n margin-inline-end: 0;\n }\n `;\n});\n\nStyledItemContent.defaultProps = defaultThemeProp;\n\nexport const StyledItemActions = styled.div``;\n\nexport const StyledItemSecondaryContainer = styled.div<{ numberOfActions: number }>(\n ({ theme, numberOfActions }) => {\n const minContainerWidth = `calc(${numberOfActions} * ${theme.base['hit-area']['mouse-min']} + ${numberOfActions - 1} * ${theme.base.spacing} / 2)`;\n const minCoarseContainerWidth = `calc(${numberOfActions} * ${theme.base['hit-area']['finger-min']} + ${numberOfActions - 1} * ${theme.base.spacing} / 2)`;\n\n return css`\n min-width: ${minContainerWidth};\n\n @media (pointer: coarse) {\n min-width: ${minCoarseContainerWidth};\n }\n `;\n }\n);\n\nexport const StyledPrimary = styled(Text)`\n display: inline;\n ${ellipsisOverflow};\n`;\n\nexport const StyledSecondary = styled(Text)`\n max-width: 14ch;\n ${ellipsisOverflow}\n`;\n\nexport const StyledListItemInner = styled.div<{\n isDraggable?: boolean;\n hasActions?: boolean;\n hasVisual?: boolean;\n isSelectable?: boolean;\n}>(({ theme, isDraggable, hasActions, hasVisual, isSelectable }) => {\n return css`\n white-space: nowrap;\n padding-inline-start: calc(${theme.base.spacing} / 2);\n padding-inline-end: ${hasActions\n ? `calc(${theme.base.spacing} / 2)`\n : `calc(${theme.base.spacing} * 1.5)`};\n\n ${!isDraggable &&\n (!hasVisual || isSelectable) &&\n css`\n padding-inline-start: ${theme.base.spacing};\n `}\n ${hasVisual &&\n !isDraggable &&\n !isSelectable &&\n css`\n padding-inline-start: 0;\n `}\n\n &:has(${StyledExpandCollapseToggle}) {\n padding-inline-start: calc(${theme.base.spacing} * 0.5);\n\n &:not(:has(${StyledDragHandle})) {\n padding-inline-start: 0;\n }\n\n & > ${StyledDragHandle} {\n padding-inline-end: 0;\n }\n }\n `;\n});\n\nStyledListItemInner.defaultProps = defaultThemeProp;\n\nexport const StyledStandardDragDropListItem = styled.li<{\n isDragging?: boolean;\n empty?: boolean;\n}>(({ theme, isDragging, empty }) => {\n const bdrColor = theme.base.palette['border-line'];\n const bdr = `0.0625rem dashed ${isDragging || empty ? bdrColor : 'transparent'}`;\n\n if (empty) {\n return css`\n text-align: center;\n padding: ${theme.base.spacing};\n border: ${bdr};\n font-style: italic;\n `;\n }\n\n return css`\n position: relative;\n background: ${theme.base.palette['primary-background']};\n\n ${isDragging &&\n css`\n z-index: 1;\n\n & > div,\n span {\n opacity: 0.5;\n }\n `}\n\n &::before,\n &::after {\n content: '';\n display: block;\n position: absolute;\n height: 0.0625rem;\n left: 0;\n right: 0;\n background: ${isDragging ? theme.base.palette['primary-background'] : bdrColor};\n }\n\n &::before {\n top: 0;\n border-top: ${bdr};\n ${isDragging &&\n css`\n box-shadow: 0 0.0625rem 0 ${theme.base.palette.interactive};\n `}\n }\n\n &::after {\n bottom: -0.0625rem;\n border-bottom: ${bdr};\n ${isDragging &&\n css`\n box-shadow: 0 -0.0625rem 0 ${theme.base.palette.interactive};\n `}\n }\n\n & > ${StyledListItemInner} {\n min-height: calc(${theme.base['hit-area'].mouse} + ${theme.base.spacing});\n\n @media (pointer: coarse) {\n min-height: calc(${theme.base['hit-area']['finger-min']} + ${theme.base.spacing});\n }\n }\n `;\n});\n\nStyledStandardDragDropListItem.defaultProps = defaultThemeProp;\n\nexport const StyledStandardDragDropList: StyledComponent<'div', DefaultTheme, object, never> =\n styled.div(({ theme }) => {\n const {\n base: {\n palette: { 'border-line': borderColor },\n 'border-radius': baseBorderRadius\n },\n components: {\n 'form-control': { 'border-radius': borderRadiusMultiplier, 'border-width': borderWidth }\n }\n } = theme;\n\n const matchBottomBorderRadius = css`\n border-end-start-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n border-end-end-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n `;\n\n return css`\n flex-grow: 1;\n background-color: ${theme.base.palette['primary-background']};\n\n ul {\n list-style: none;\n border: ${borderWidth} solid ${borderColor};\n border-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n\n > ${StyledStandardDragDropListItem} {\n &:first-child {\n border-start-start-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n border-start-end-radius: calc(${baseBorderRadius} * ${borderRadiusMultiplier});\n\n &::before {\n display: none;\n }\n }\n\n &:last-child,\n &:last-child ${StyledStandardDragDropListItem}:last-child {\n ${matchBottomBorderRadius}\n\n &::after {\n display: none;\n }\n }\n\n &:last-child ${StyledStandardDragDropList} {\n ${matchBottomBorderRadius}\n }\n }\n\n ul {\n border: none;\n padding-inline: calc(3.5 * ${theme.base.spacing}) 0;\n\n > ${StyledStandardDragDropListItem} {\n &:first-child {\n border-radius: 0;\n }\n\n &:first-child::before {\n display: block;\n }\n\n &:last-child {\n border-radius: 0;\n }\n\n &:last-child::after {\n display: block;\n }\n\n ${StyledListItemInner} {\n padding-inline-start: calc(${theme.base.spacing} * 1);\n }\n }\n }\n }\n `;\n });\n\nStyledStandardDragDropList.defaultProps = defaultThemeProp;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-dnd",
3
- "version": "9.0.0-build.9.8",
3
+ "version": "9.0.0-build.9.9",
4
4
  "license": "SEE LICENSE IN LICENSE",
5
5
  "author": "Pegasystems",
6
6
  "sideEffects": false,
@@ -14,7 +14,7 @@
14
14
  "build": "tsc -b tsconfig.build.json"
15
15
  },
16
16
  "dependencies": {
17
- "@pega/cosmos-react-core": "9.0.0-build.9.8",
17
+ "@pega/cosmos-react-core": "9.0.0-build.9.9",
18
18
  "@types/react": "^17.0.62 || ^18.3.3",
19
19
  "@types/react-dom": "^17.0.20 || ^18.3.0",
20
20
  "@types/styled-components": "^5.1.26",