@elliemae/ds-form-layout-blocks 3.60.0-next.6 → 3.60.0-next.60
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.
|
@@ -90,6 +90,7 @@ const StyledLabel = (0, import_ds_system.styled)("label", {
|
|
|
90
90
|
slot: import_DSFormLayoutBlockItemDefinitions.DSFormLayoutBlockItemSlots.LABEL
|
|
91
91
|
})`
|
|
92
92
|
display: flex;
|
|
93
|
+
color: ${({ theme }) => theme.colors.neutral[700]};
|
|
93
94
|
${({ theme, leftLabel }) => leftLabel ? `padding-right: ${theme.space.xxxs};` : void 0}
|
|
94
95
|
${({ hideLabel }) => hideLabel ? `position: absolute;
|
|
95
96
|
width: 1px;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/form-layout-block-item/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSFormLayoutBlockItemSlots, DSFormLayoutBlockItemName } from './DSFormLayoutBlockItemDefinitions.js';\ninterface DSFormLayoutBlockItemStyledMessageT {\n hasError?: boolean;\n leftLabel?: boolean;\n hideLabel?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledContainerT {\n leftLabel?: boolean;\n fitContent?: boolean;\n hideLabel?: boolean;\n withHighlight?: boolean;\n isGroup?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledLabelT {\n leftLabel?: boolean;\n hideLabel?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledMarkT {\n required?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledCharCounterT {\n hasError?: boolean;\n}\n\nexport const StyledContainer = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.CONTAINER,\n})<DSFormLayoutBlockItemStyledContainerT>`\n position: relative;\n padding: 0;\n margin: 0;\n display: grid;\n ${xStyledCommonProps}\n ${({ fitContent }) => (fitContent ? 'width: fit-content;' : undefined)}\n ${({ isGroup }) => (isGroup ? 'border: none' : '')};\n ${({ leftLabel, hideLabel }) => (leftLabel && !hideLabel ? 'grid-template-columns: auto 1fr;' : undefined)}\n align-items: center;\n ${({ theme, withHighlight }) =>\n withHighlight\n ? `\n &::after {\n position: absolute;\n content: '';\n left: -${theme.space.xxs};\n top: -${theme.space.xxxs};\n z-index: -1;\n width: calc(100% + ${theme.space.xs});\n height: calc(100% + ${theme.space.xxs});\n background-color: #FEFBEE;\n border : 1px solid #8F6326;\n border-radius : 4px;\n box-shadow: 0 1px 3px 0 rgba(0,0,0,0.35);\n }\n &:hover, \n &:focus-within {\n &::after {\n position: absolute;\n content: '';\n left: -${theme.space.xxs};\n top: -${theme.space.xxxs};\n z-index: -1;\n width: calc(100% + ${theme.space.xs});\n height: calc(100% + ${theme.space.xxs});\n background-color: #FFF9D3;\n border : 2px solid #8F6326;\n border-radius : 4px;\n box-shadow: 0 6px 10px 0 rgba(0,0,0,0.30);\n }\n }\n `\n : undefined}\n`;\n\nexport const StyledLabel = styled('label', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.LABEL,\n})<DSFormLayoutBlockItemStyledLabelT>`\n display: flex;\n ${({ theme, leftLabel }) => (leftLabel ? `padding-right: ${theme.space.xxxs};` : undefined)}\n ${({ hideLabel }) =>\n hideLabel\n ? `position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n `\n : undefined}\n`;\n\nconst messageCss = css<DSFormLayoutBlockItemStyledMessageT>`\n font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n text-align: right;\n line-height: 1.231rem;\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n line-height: 1rem;\n }\n min-height: 15px;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ${({ theme, hasError }) => (hasError ? theme.colors.danger[900] : theme.colors.neutral[500])};\n ${({ leftLabel, hideLabel }) => (leftLabel && !hideLabel ? 'grid-column: 1/3;' : undefined)}\n font-style: normal;\n`;\n\nexport const StyledMessage = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.MESSAGE,\n})<DSFormLayoutBlockItemStyledMessageT>`\n ${messageCss}\n`;\n\nexport const StyledErrorMessage = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.ERROR_MESSAGE,\n})<DSFormLayoutBlockItemStyledMessageT>`\n ${messageCss}\n`;\n\nexport const StyledMark = styled('span', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.MARK,\n})<DSFormLayoutBlockItemStyledMarkT>`\n margin-left: ${({ theme }) => theme.space.xxxs};\n ${({ theme, required }) =>\n required\n ? `\n display: flex;\n flex-direction: column;\n justify-content: center;\n line-height: 1rem;\n font-size: 1.5rem;\n :after {\n content: '*';\n color: ${theme.colors.danger[900]};\n }\n `\n : `\n width: 6px;\n height: 6px;\n border-radius: 50%;\n border: 1px solid ${theme.colors.brand[600]};\n `}\n`;\n\nexport const ScreenReaderOnly = styled.div`\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n`;\n\nexport const StyledCharCount = styled('span', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.COUNTER,\n})<DSFormLayoutBlockItemStyledCharCounterT>`\n justify-self: flex-end;\n margin-left: 16px;\n color: ${({ theme, hasError }) => (hasError ? theme.colors.danger[900] : theme.colors.neutral[500])};\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAgD;AAChD,8CAAsE;AA4B/D,MAAM,sBAAkB,yBAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,mEAA2B;AACnC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKG,mCAAkB;AAAA,IAClB,CAAC,EAAE,WAAW,MAAO,aAAa,wBAAwB,MAAU;AAAA,IACpE,CAAC,EAAE,QAAQ,MAAO,UAAU,iBAAiB,EAAG;AAAA,IAChD,CAAC,EAAE,WAAW,UAAU,MAAO,aAAa,CAAC,YAAY,qCAAqC,MAAU;AAAA;AAAA,IAExG,CAAC,EAAE,OAAO,cAAc,MACxB,gBACI;AAAA;AAAA;AAAA;AAAA,iBAIS,MAAM,MAAM,GAAG;AAAA,gBAChB,MAAM,MAAM,IAAI;AAAA;AAAA,6BAEH,MAAM,MAAM,EAAE;AAAA,+BACZ,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAWzB,MAAM,MAAM,GAAG;AAAA,oBAChB,MAAM,MAAM,IAAI;AAAA;AAAA,iCAEH,MAAM,MAAM,EAAE;AAAA,mCACZ,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQ1C,MAAS;AAAA;AAGV,MAAM,kBAAc,yBAAO,SAAS;AAAA,EACzC,MAAM;AAAA,EACN,MAAM,mEAA2B;AACnC,CAAC;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["import { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSFormLayoutBlockItemSlots, DSFormLayoutBlockItemName } from './DSFormLayoutBlockItemDefinitions.js';\ninterface DSFormLayoutBlockItemStyledMessageT {\n hasError?: boolean;\n leftLabel?: boolean;\n hideLabel?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledContainerT {\n leftLabel?: boolean;\n fitContent?: boolean;\n hideLabel?: boolean;\n withHighlight?: boolean;\n isGroup?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledLabelT {\n leftLabel?: boolean;\n hideLabel?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledMarkT {\n required?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledCharCounterT {\n hasError?: boolean;\n}\n\nexport const StyledContainer = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.CONTAINER,\n})<DSFormLayoutBlockItemStyledContainerT>`\n position: relative;\n padding: 0;\n margin: 0;\n display: grid;\n ${xStyledCommonProps}\n ${({ fitContent }) => (fitContent ? 'width: fit-content;' : undefined)}\n ${({ isGroup }) => (isGroup ? 'border: none' : '')};\n ${({ leftLabel, hideLabel }) => (leftLabel && !hideLabel ? 'grid-template-columns: auto 1fr;' : undefined)}\n align-items: center;\n ${({ theme, withHighlight }) =>\n withHighlight\n ? `\n &::after {\n position: absolute;\n content: '';\n left: -${theme.space.xxs};\n top: -${theme.space.xxxs};\n z-index: -1;\n width: calc(100% + ${theme.space.xs});\n height: calc(100% + ${theme.space.xxs});\n background-color: #FEFBEE;\n border : 1px solid #8F6326;\n border-radius : 4px;\n box-shadow: 0 1px 3px 0 rgba(0,0,0,0.35);\n }\n &:hover, \n &:focus-within {\n &::after {\n position: absolute;\n content: '';\n left: -${theme.space.xxs};\n top: -${theme.space.xxxs};\n z-index: -1;\n width: calc(100% + ${theme.space.xs});\n height: calc(100% + ${theme.space.xxs});\n background-color: #FFF9D3;\n border : 2px solid #8F6326;\n border-radius : 4px;\n box-shadow: 0 6px 10px 0 rgba(0,0,0,0.30);\n }\n }\n `\n : undefined}\n`;\n\nexport const StyledLabel = styled('label', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.LABEL,\n})<DSFormLayoutBlockItemStyledLabelT>`\n display: flex;\n color: ${({ theme }) => theme.colors.neutral[700]};\n ${({ theme, leftLabel }) => (leftLabel ? `padding-right: ${theme.space.xxxs};` : undefined)}\n ${({ hideLabel }) =>\n hideLabel\n ? `position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n `\n : undefined}\n`;\n\nconst messageCss = css<DSFormLayoutBlockItemStyledMessageT>`\n font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n text-align: right;\n line-height: 1.231rem;\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n line-height: 1rem;\n }\n min-height: 15px;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ${({ theme, hasError }) => (hasError ? theme.colors.danger[900] : theme.colors.neutral[500])};\n ${({ leftLabel, hideLabel }) => (leftLabel && !hideLabel ? 'grid-column: 1/3;' : undefined)}\n font-style: normal;\n`;\n\nexport const StyledMessage = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.MESSAGE,\n})<DSFormLayoutBlockItemStyledMessageT>`\n ${messageCss}\n`;\n\nexport const StyledErrorMessage = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.ERROR_MESSAGE,\n})<DSFormLayoutBlockItemStyledMessageT>`\n ${messageCss}\n`;\n\nexport const StyledMark = styled('span', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.MARK,\n})<DSFormLayoutBlockItemStyledMarkT>`\n margin-left: ${({ theme }) => theme.space.xxxs};\n ${({ theme, required }) =>\n required\n ? `\n display: flex;\n flex-direction: column;\n justify-content: center;\n line-height: 1rem;\n font-size: 1.5rem;\n :after {\n content: '*';\n color: ${theme.colors.danger[900]};\n }\n `\n : `\n width: 6px;\n height: 6px;\n border-radius: 50%;\n border: 1px solid ${theme.colors.brand[600]};\n `}\n`;\n\nexport const ScreenReaderOnly = styled.div`\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n`;\n\nexport const StyledCharCount = styled('span', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.COUNTER,\n})<DSFormLayoutBlockItemStyledCharCounterT>`\n justify-self: flex-end;\n margin-left: 16px;\n color: ${({ theme, hasError }) => (hasError ? theme.colors.danger[900] : theme.colors.neutral[500])};\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -51,6 +51,7 @@ const StyledLabel = styled("label", {
|
|
|
51
51
|
slot: DSFormLayoutBlockItemSlots.LABEL
|
|
52
52
|
})`
|
|
53
53
|
display: flex;
|
|
54
|
+
color: ${({ theme }) => theme.colors.neutral[700]};
|
|
54
55
|
${({ theme, leftLabel }) => leftLabel ? `padding-right: ${theme.space.xxxs};` : void 0}
|
|
55
56
|
${({ hideLabel }) => hideLabel ? `position: absolute;
|
|
56
57
|
width: 1px;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/form-layout-block-item/styles.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSFormLayoutBlockItemSlots, DSFormLayoutBlockItemName } from './DSFormLayoutBlockItemDefinitions.js';\ninterface DSFormLayoutBlockItemStyledMessageT {\n hasError?: boolean;\n leftLabel?: boolean;\n hideLabel?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledContainerT {\n leftLabel?: boolean;\n fitContent?: boolean;\n hideLabel?: boolean;\n withHighlight?: boolean;\n isGroup?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledLabelT {\n leftLabel?: boolean;\n hideLabel?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledMarkT {\n required?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledCharCounterT {\n hasError?: boolean;\n}\n\nexport const StyledContainer = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.CONTAINER,\n})<DSFormLayoutBlockItemStyledContainerT>`\n position: relative;\n padding: 0;\n margin: 0;\n display: grid;\n ${xStyledCommonProps}\n ${({ fitContent }) => (fitContent ? 'width: fit-content;' : undefined)}\n ${({ isGroup }) => (isGroup ? 'border: none' : '')};\n ${({ leftLabel, hideLabel }) => (leftLabel && !hideLabel ? 'grid-template-columns: auto 1fr;' : undefined)}\n align-items: center;\n ${({ theme, withHighlight }) =>\n withHighlight\n ? `\n &::after {\n position: absolute;\n content: '';\n left: -${theme.space.xxs};\n top: -${theme.space.xxxs};\n z-index: -1;\n width: calc(100% + ${theme.space.xs});\n height: calc(100% + ${theme.space.xxs});\n background-color: #FEFBEE;\n border : 1px solid #8F6326;\n border-radius : 4px;\n box-shadow: 0 1px 3px 0 rgba(0,0,0,0.35);\n }\n &:hover, \n &:focus-within {\n &::after {\n position: absolute;\n content: '';\n left: -${theme.space.xxs};\n top: -${theme.space.xxxs};\n z-index: -1;\n width: calc(100% + ${theme.space.xs});\n height: calc(100% + ${theme.space.xxs});\n background-color: #FFF9D3;\n border : 2px solid #8F6326;\n border-radius : 4px;\n box-shadow: 0 6px 10px 0 rgba(0,0,0,0.30);\n }\n }\n `\n : undefined}\n`;\n\nexport const StyledLabel = styled('label', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.LABEL,\n})<DSFormLayoutBlockItemStyledLabelT>`\n display: flex;\n ${({ theme, leftLabel }) => (leftLabel ? `padding-right: ${theme.space.xxxs};` : undefined)}\n ${({ hideLabel }) =>\n hideLabel\n ? `position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n `\n : undefined}\n`;\n\nconst messageCss = css<DSFormLayoutBlockItemStyledMessageT>`\n font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n text-align: right;\n line-height: 1.231rem;\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n line-height: 1rem;\n }\n min-height: 15px;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ${({ theme, hasError }) => (hasError ? theme.colors.danger[900] : theme.colors.neutral[500])};\n ${({ leftLabel, hideLabel }) => (leftLabel && !hideLabel ? 'grid-column: 1/3;' : undefined)}\n font-style: normal;\n`;\n\nexport const StyledMessage = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.MESSAGE,\n})<DSFormLayoutBlockItemStyledMessageT>`\n ${messageCss}\n`;\n\nexport const StyledErrorMessage = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.ERROR_MESSAGE,\n})<DSFormLayoutBlockItemStyledMessageT>`\n ${messageCss}\n`;\n\nexport const StyledMark = styled('span', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.MARK,\n})<DSFormLayoutBlockItemStyledMarkT>`\n margin-left: ${({ theme }) => theme.space.xxxs};\n ${({ theme, required }) =>\n required\n ? `\n display: flex;\n flex-direction: column;\n justify-content: center;\n line-height: 1rem;\n font-size: 1.5rem;\n :after {\n content: '*';\n color: ${theme.colors.danger[900]};\n }\n `\n : `\n width: 6px;\n height: 6px;\n border-radius: 50%;\n border: 1px solid ${theme.colors.brand[600]};\n `}\n`;\n\nexport const ScreenReaderOnly = styled.div`\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n`;\n\nexport const StyledCharCount = styled('span', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.COUNTER,\n})<DSFormLayoutBlockItemStyledCharCounterT>`\n justify-self: flex-end;\n margin-left: 16px;\n color: ${({ theme, hasError }) => (hasError ? theme.colors.danger[900] : theme.colors.neutral[500])};\n`;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,KAAK,0BAA0B;AAChD,SAAS,4BAA4B,iCAAiC;AA4B/D,MAAM,kBAAkB,OAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,2BAA2B;AACnC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,IAKG,kBAAkB;AAAA,IAClB,CAAC,EAAE,WAAW,MAAO,aAAa,wBAAwB,MAAU;AAAA,IACpE,CAAC,EAAE,QAAQ,MAAO,UAAU,iBAAiB,EAAG;AAAA,IAChD,CAAC,EAAE,WAAW,UAAU,MAAO,aAAa,CAAC,YAAY,qCAAqC,MAAU;AAAA;AAAA,IAExG,CAAC,EAAE,OAAO,cAAc,MACxB,gBACI;AAAA;AAAA;AAAA;AAAA,iBAIS,MAAM,MAAM,GAAG;AAAA,gBAChB,MAAM,MAAM,IAAI;AAAA;AAAA,6BAEH,MAAM,MAAM,EAAE;AAAA,+BACZ,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAWzB,MAAM,MAAM,GAAG;AAAA,oBAChB,MAAM,MAAM,IAAI;AAAA;AAAA,iCAEH,MAAM,MAAM,EAAE;AAAA,mCACZ,MAAM,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQ1C,MAAS;AAAA;AAGV,MAAM,cAAc,OAAO,SAAS;AAAA,EACzC,MAAM;AAAA,EACN,MAAM,2BAA2B;AACnC,CAAC;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSFormLayoutBlockItemSlots, DSFormLayoutBlockItemName } from './DSFormLayoutBlockItemDefinitions.js';\ninterface DSFormLayoutBlockItemStyledMessageT {\n hasError?: boolean;\n leftLabel?: boolean;\n hideLabel?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledContainerT {\n leftLabel?: boolean;\n fitContent?: boolean;\n hideLabel?: boolean;\n withHighlight?: boolean;\n isGroup?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledLabelT {\n leftLabel?: boolean;\n hideLabel?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledMarkT {\n required?: boolean;\n}\n\ninterface DSFormLayoutBlockItemStyledCharCounterT {\n hasError?: boolean;\n}\n\nexport const StyledContainer = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.CONTAINER,\n})<DSFormLayoutBlockItemStyledContainerT>`\n position: relative;\n padding: 0;\n margin: 0;\n display: grid;\n ${xStyledCommonProps}\n ${({ fitContent }) => (fitContent ? 'width: fit-content;' : undefined)}\n ${({ isGroup }) => (isGroup ? 'border: none' : '')};\n ${({ leftLabel, hideLabel }) => (leftLabel && !hideLabel ? 'grid-template-columns: auto 1fr;' : undefined)}\n align-items: center;\n ${({ theme, withHighlight }) =>\n withHighlight\n ? `\n &::after {\n position: absolute;\n content: '';\n left: -${theme.space.xxs};\n top: -${theme.space.xxxs};\n z-index: -1;\n width: calc(100% + ${theme.space.xs});\n height: calc(100% + ${theme.space.xxs});\n background-color: #FEFBEE;\n border : 1px solid #8F6326;\n border-radius : 4px;\n box-shadow: 0 1px 3px 0 rgba(0,0,0,0.35);\n }\n &:hover, \n &:focus-within {\n &::after {\n position: absolute;\n content: '';\n left: -${theme.space.xxs};\n top: -${theme.space.xxxs};\n z-index: -1;\n width: calc(100% + ${theme.space.xs});\n height: calc(100% + ${theme.space.xxs});\n background-color: #FFF9D3;\n border : 2px solid #8F6326;\n border-radius : 4px;\n box-shadow: 0 6px 10px 0 rgba(0,0,0,0.30);\n }\n }\n `\n : undefined}\n`;\n\nexport const StyledLabel = styled('label', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.LABEL,\n})<DSFormLayoutBlockItemStyledLabelT>`\n display: flex;\n color: ${({ theme }) => theme.colors.neutral[700]};\n ${({ theme, leftLabel }) => (leftLabel ? `padding-right: ${theme.space.xxxs};` : undefined)}\n ${({ hideLabel }) =>\n hideLabel\n ? `position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n `\n : undefined}\n`;\n\nconst messageCss = css<DSFormLayoutBlockItemStyledMessageT>`\n font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n text-align: right;\n line-height: 1.231rem;\n @media (max-width: ${({ theme }) => theme.breakpoints.small}) {\n line-height: 1rem;\n }\n min-height: 15px;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ${({ theme, hasError }) => (hasError ? theme.colors.danger[900] : theme.colors.neutral[500])};\n ${({ leftLabel, hideLabel }) => (leftLabel && !hideLabel ? 'grid-column: 1/3;' : undefined)}\n font-style: normal;\n`;\n\nexport const StyledMessage = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.MESSAGE,\n})<DSFormLayoutBlockItemStyledMessageT>`\n ${messageCss}\n`;\n\nexport const StyledErrorMessage = styled('div', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.ERROR_MESSAGE,\n})<DSFormLayoutBlockItemStyledMessageT>`\n ${messageCss}\n`;\n\nexport const StyledMark = styled('span', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.MARK,\n})<DSFormLayoutBlockItemStyledMarkT>`\n margin-left: ${({ theme }) => theme.space.xxxs};\n ${({ theme, required }) =>\n required\n ? `\n display: flex;\n flex-direction: column;\n justify-content: center;\n line-height: 1rem;\n font-size: 1.5rem;\n :after {\n content: '*';\n color: ${theme.colors.danger[900]};\n }\n `\n : `\n width: 6px;\n height: 6px;\n border-radius: 50%;\n border: 1px solid ${theme.colors.brand[600]};\n `}\n`;\n\nexport const ScreenReaderOnly = styled.div`\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n`;\n\nexport const StyledCharCount = styled('span', {\n name: DSFormLayoutBlockItemName,\n slot: DSFormLayoutBlockItemSlots.COUNTER,\n})<DSFormLayoutBlockItemStyledCharCounterT>`\n justify-self: flex-end;\n margin-left: 16px;\n color: ${({ theme, hasError }) => (hasError ? theme.colors.danger[900] : theme.colors.neutral[500])};\n`;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-form-layout-blocks",
|
|
3
|
-
"version": "3.60.0-next.
|
|
3
|
+
"version": "3.60.0-next.60",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Form Layout",
|
|
6
6
|
"files": [
|
|
@@ -35,42 +35,40 @@
|
|
|
35
35
|
"reportFile": "tests.xml",
|
|
36
36
|
"indent": 4
|
|
37
37
|
},
|
|
38
|
-
"scripts": {
|
|
39
|
-
"dev": "cross-env NODE_ENV=development node ../../../scripts/build/build.mjs --watch",
|
|
40
|
-
"test": "pui-cli test --passWithNoTests --coverage=\"false\"",
|
|
41
|
-
"lint": "node ../../../scripts/lint.mjs --fix",
|
|
42
|
-
"lint:strict": "node ../../../scripts/lint-strict.mjs",
|
|
43
|
-
"dts": "node ../../../scripts/dts.mjs",
|
|
44
|
-
"build": "cross-env NODE_ENV=production node ../../../scripts/build/build.mjs",
|
|
45
|
-
"checkDeps": "npm exec ../../util/ds-codemods -- check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
|
|
46
|
-
},
|
|
47
38
|
"dependencies": {
|
|
48
|
-
"
|
|
49
|
-
"@elliemae/ds-
|
|
50
|
-
"@elliemae/ds-props-helpers": "3.60.0-next.
|
|
51
|
-
"@elliemae/ds-
|
|
52
|
-
"@elliemae/ds-
|
|
53
|
-
"
|
|
39
|
+
"uid": "^2.0.2",
|
|
40
|
+
"@elliemae/ds-grid": "3.60.0-next.60",
|
|
41
|
+
"@elliemae/ds-props-helpers": "3.60.0-next.60",
|
|
42
|
+
"@elliemae/ds-typescript-helpers": "3.60.0-next.60",
|
|
43
|
+
"@elliemae/ds-icons": "3.60.0-next.60",
|
|
44
|
+
"@elliemae/ds-system": "3.60.0-next.60"
|
|
54
45
|
},
|
|
55
46
|
"devDependencies": {
|
|
56
|
-
"
|
|
57
|
-
"
|
|
58
|
-
"@elliemae/ds-form-
|
|
59
|
-
"@elliemae/ds-form-
|
|
60
|
-
"@elliemae/ds-
|
|
61
|
-
"@elliemae/ds-
|
|
62
|
-
"@elliemae/
|
|
63
|
-
"
|
|
64
|
-
"styled-components": "catalog:"
|
|
47
|
+
"jest": "^30.0.0",
|
|
48
|
+
"styled-components": "~5.3.9",
|
|
49
|
+
"@elliemae/ds-form-checkbox": "3.60.0-next.60",
|
|
50
|
+
"@elliemae/ds-form-input-text": "3.60.0-next.60",
|
|
51
|
+
"@elliemae/ds-form-input-textarea": "3.60.0-next.60",
|
|
52
|
+
"@elliemae/ds-form-radio": "3.60.0-next.60",
|
|
53
|
+
"@elliemae/ds-monorepo-devops": "3.60.0-next.60",
|
|
54
|
+
"@elliemae/ds-test-utils": "3.60.0-next.60"
|
|
65
55
|
},
|
|
66
56
|
"peerDependencies": {
|
|
67
|
-
"react": "
|
|
68
|
-
"react-dom": "
|
|
69
|
-
"styled-components": "
|
|
57
|
+
"react": "^18.3.1",
|
|
58
|
+
"react-dom": "^18.3.1",
|
|
59
|
+
"styled-components": "~5.3.9"
|
|
70
60
|
},
|
|
71
61
|
"publishConfig": {
|
|
72
62
|
"access": "public",
|
|
73
63
|
"typeSafety": true
|
|
74
64
|
},
|
|
75
|
-
"
|
|
76
|
-
|
|
65
|
+
"scripts": {
|
|
66
|
+
"dev": "cross-env NODE_ENV=development node ../../../scripts/build/build.mjs --watch",
|
|
67
|
+
"test": "ds-monorepo-devops test --passWithNoTests --coverage=\"false\"",
|
|
68
|
+
"lint": "node ../../../scripts/lint.mjs --fix",
|
|
69
|
+
"lint:strict": "node ../../../scripts/lint-strict.mjs",
|
|
70
|
+
"dts": "node ../../../scripts/dts.mjs",
|
|
71
|
+
"build": "cross-env NODE_ENV=production node ../../../scripts/build/build.mjs",
|
|
72
|
+
"checkDeps": "npx -yes ../../util/ds-codemods check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
|
|
73
|
+
}
|
|
74
|
+
}
|