@laerdal/life-react-components 1.9.8-dev.9.full → 1.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.
- package/dist/Card/{VerticalCard/Card.cjs → Card.cjs} +9 -32
- package/dist/Card/Card.cjs.map +1 -0
- package/dist/Card/{VerticalCard/Card.d.ts → Card.d.ts} +1 -2
- package/dist/Card/{VerticalCard/Card.js → Card.js} +8 -29
- package/dist/Card/Card.js.map +1 -0
- package/dist/Card/{VerticalCard/CardBottomSection.cjs → CardBottomSection.cjs} +25 -40
- package/dist/Card/CardBottomSection.cjs.map +1 -0
- package/dist/Card/{VerticalCard/CardBottomSection.d.ts → CardBottomSection.d.ts} +4 -4
- package/dist/Card/{VerticalCard/CardBottomSection.js → CardBottomSection.js} +11 -25
- package/dist/Card/CardBottomSection.js.map +1 -0
- package/dist/Card/{VerticalCard/CardMiddleSection.cjs → CardMiddleSection.cjs} +13 -13
- package/dist/Card/CardMiddleSection.cjs.map +1 -0
- package/dist/Card/{VerticalCard/CardMiddleSection.d.ts → CardMiddleSection.d.ts} +2 -2
- package/dist/Card/{VerticalCard/CardMiddleSection.js → CardMiddleSection.js} +2 -2
- package/dist/Card/CardMiddleSection.js.map +1 -0
- package/dist/Card/{VerticalCard/CardTopSection.cjs → CardTopSection.cjs} +12 -11
- package/dist/Card/CardTopSection.cjs.map +1 -0
- package/dist/Card/{VerticalCard/CardTopSection.d.ts → CardTopSection.d.ts} +5 -5
- package/dist/Card/{VerticalCard/CardTopSection.js → CardTopSection.js} +10 -9
- package/dist/Card/CardTopSection.js.map +1 -0
- package/dist/Card/index.cjs +64 -8
- package/dist/Card/index.cjs.map +1 -1
- package/dist/Card/index.d.ts +7 -2
- package/dist/Card/index.js +7 -2
- package/dist/Card/index.js.map +1 -1
- package/dist/Dropdown/DropdownButton.cjs +3 -3
- package/dist/Dropdown/DropdownButton.cjs.map +1 -1
- package/dist/Dropdown/DropdownButton.d.ts +1 -5
- package/dist/Dropdown/DropdownButton.js +4 -3
- package/dist/Dropdown/DropdownButton.js.map +1 -1
- package/dist/InputFields/NumberField.cjs +63 -139
- package/dist/InputFields/NumberField.cjs.map +1 -1
- package/dist/InputFields/NumberField.d.ts +1 -4
- package/dist/InputFields/NumberField.js +63 -138
- package/dist/InputFields/NumberField.js.map +1 -1
- package/dist/List/ListRow.cjs +3 -24
- package/dist/List/ListRow.cjs.map +1 -1
- package/dist/List/ListRow.d.ts +0 -3
- package/dist/List/ListRow.js +3 -22
- package/dist/List/ListRow.js.map +1 -1
- package/dist/Toggles/ToggleButton.cjs +2 -3
- package/dist/Toggles/ToggleButton.cjs.map +1 -1
- package/dist/Toggles/ToggleButton.d.ts +1 -1
- package/dist/Toggles/ToggleButton.js +2 -3
- package/dist/Toggles/ToggleButton.js.map +1 -1
- package/dist/common/ActionWithin.cjs.map +1 -1
- package/dist/common/ActionWithin.js.map +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/dist/Card/HorizontalCard/HorizontalCard.cjs +0 -97
- package/dist/Card/HorizontalCard/HorizontalCard.cjs.map +0 -1
- package/dist/Card/HorizontalCard/HorizontalCard.d.ts +0 -4
- package/dist/Card/HorizontalCard/HorizontalCard.js +0 -74
- package/dist/Card/HorizontalCard/HorizontalCard.js.map +0 -1
- package/dist/Card/HorizontalCard/HorizontalCardActions.cjs +0 -124
- package/dist/Card/HorizontalCard/HorizontalCardActions.cjs.map +0 -1
- package/dist/Card/HorizontalCard/HorizontalCardActions.d.ts +0 -5
- package/dist/Card/HorizontalCard/HorizontalCardActions.js +0 -98
- package/dist/Card/HorizontalCard/HorizontalCardActions.js.map +0 -1
- package/dist/Card/HorizontalCard/HorizontalCardBody.cjs +0 -60
- package/dist/Card/HorizontalCard/HorizontalCardBody.cjs.map +0 -1
- package/dist/Card/HorizontalCard/HorizontalCardBody.d.ts +0 -5
- package/dist/Card/HorizontalCard/HorizontalCardBody.js +0 -40
- package/dist/Card/HorizontalCard/HorizontalCardBody.js.map +0 -1
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs +0 -49
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs.map +0 -1
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.d.ts +0 -5
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js +0 -33
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js.map +0 -1
- package/dist/Card/HorizontalCard/index.cjs +0 -33
- package/dist/Card/HorizontalCard/index.cjs.map +0 -1
- package/dist/Card/HorizontalCard/index.d.ts +0 -2
- package/dist/Card/HorizontalCard/index.js +0 -3
- package/dist/Card/HorizontalCard/index.js.map +0 -1
- package/dist/Card/HorizontalCard/types.cjs +0 -6
- package/dist/Card/HorizontalCard/types.cjs.map +0 -1
- package/dist/Card/HorizontalCard/types.d.ts +0 -40
- package/dist/Card/HorizontalCard/types.js +0 -2
- package/dist/Card/HorizontalCard/types.js.map +0 -1
- package/dist/Card/VerticalCard/Card.cjs.map +0 -1
- package/dist/Card/VerticalCard/Card.js.map +0 -1
- package/dist/Card/VerticalCard/CardBottomSection.cjs.map +0 -1
- package/dist/Card/VerticalCard/CardBottomSection.js.map +0 -1
- package/dist/Card/VerticalCard/CardMiddleSection.cjs.map +0 -1
- package/dist/Card/VerticalCard/CardMiddleSection.js.map +0 -1
- package/dist/Card/VerticalCard/CardTopSection.cjs.map +0 -1
- package/dist/Card/VerticalCard/CardTopSection.js.map +0 -1
- package/dist/Card/VerticalCard/index.cjs +0 -88
- package/dist/Card/VerticalCard/index.cjs.map +0 -1
- package/dist/Card/VerticalCard/index.d.ts +0 -7
- package/dist/Card/VerticalCard/index.js +0 -8
- package/dist/Card/VerticalCard/index.js.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Card/VerticalCard/Card.tsx"],"names":["React","styled","CardTopSection","CardMiddleSection","CardBottomSection","BOXSHADOWS","COLORS","defaultOnMouseDownHandler","focusStyles","useActionWithin","CardTopLevelContainer","div","white","BOXSHADOW_L1","neutral_200","Wrapper","primary_20","primary_100","BOXSHADOW_L3","BOXSHADOW_L2","Card","onCardClicked","topSectionProps","middleSectionProps","bottomSectionProps","disabled","variant","useState","actionsRefs","setActionsRefs","checkBoxRef","useRef","containerRef","cls","a","key","e","instance"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport CardTopSection, {CardTopSectionProps} from './CardTopSection';\nimport CardMiddleSection, {CardMiddleSectionProps} from './CardMiddleSection';\nimport CardBottomSection, {CardBottomSectionProps} from './CardBottomSection';\nimport {BOXSHADOWS, COLORS, defaultOnMouseDownHandler, focusStyles, useActionWithin} from '../../index';\n\nexport const CardTopLevelContainer = styled.div`\n background-color: ${COLORS.white};\n\n border-radius: 8px;\n\n background-clip: padding-box;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n\n .elevated & {\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L1};\n }\n\n .outline & {\n border: 1px solid ${COLORS.neutral_200};\n }\n`;\n\n\nexport const Wrapper = styled.div`\n height: max-content;\n width: max-content;\n\n &.interactive:focus {\n ${focusStyles}\n }\n\n &.interactive:not(.disabled) {\n cursor: pointer;\n\n &.outline:not(.action-within) {\n ${CardTopLevelContainer} {\n &:hover {\n background-color: ${COLORS.primary_20};\n }\n\n &:active, &.active-state {\n background-color: ${COLORS.primary_100};\n }\n }\n }\n\n &.elevated:not(.action-within) {\n ${CardTopLevelContainer} {\n &:hover {\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L3};\n }\n\n &:active, &.active-state {\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\n }\n }\n }\n }\n\n &.disabled {\n cursor: not-allowed;\n }\n`;\n\n\nexport interface CardProps {\n onCardClicked?: () => {};\n disabled?: boolean;\n topSectionProps?: CardTopSectionProps;\n middleSectionProps?: CardMiddleSectionProps;\n bottomSectionProps?: CardBottomSectionProps;\n variant?: 'outline' | 'elevated';\n}\n\nconst Card: React.FunctionComponent<CardProps> = ({\n onCardClicked,\n topSectionProps,\n middleSectionProps,\n bottomSectionProps,\n disabled,\n variant = 'outline'\n }: CardProps) => {\n\n\n const [actionsRefs, setActionsRefs] = React.useState<React.RefObject<HTMLElement>[]>([]);\n const checkBoxRef = React.useRef<HTMLDivElement>(null);\n const containerRef = React.useRef<HTMLDivElement>(null);\n\n useActionWithin(containerRef, [...actionsRefs, checkBoxRef]);\n\n const cls = `${!!onCardClicked ? 'interactive' : ''} ${disabled ? 'disabled' : ''} ${variant}`;\n\n return (\n\n <Wrapper ref={containerRef}\n className={cls}\n tabIndex={!!onCardClicked && !disabled ? 0 : -1}\n onMouseDown={defaultOnMouseDownHandler}\n onKeyDown={a => a.key === 'Enter' && !disabled && onCardClicked && onCardClicked()}\n onClick={e => !disabled && onCardClicked && onCardClicked()}>\n <CardTopLevelContainer>\n {\n topSectionProps &&\n <CardTopSection ref={checkBoxRef}\n {...topSectionProps} disabled={disabled}/>\n }\n {\n middleSectionProps &&\n <CardMiddleSection {...middleSectionProps} disabled={disabled}/>\n }\n {\n bottomSectionProps &&\n <CardBottomSection ref={instance => setActionsRefs(instance ?? [])}\n {...bottomSectionProps} disabled={disabled}/>\n }\n </CardTopLevelContainer>\n </Wrapper>\n\n );\n};\n\nexport default Card;\n"],"file":"Card.js"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Card/VerticalCard/CardBottomSection.tsx"],"names":["CardProgressContainer","styled","div","CardNotesContainer","COLORS","neutral_500","CardAuthorContainer","props","disabled","neutral_300","CardBottomDivider","neutral_100","CardNoteLeft","CardNoteRight","CardButtonRowContainer","neutral_600","CardBottomSectionContainer","CardBottomSection","React","forwardRef","ref","progressLevel","progressMax","progressType","LinearProgressType","Line","noteLeft","noteLeftIcon","noteRight","noteRightIcon","authorName","logo","actions","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","useImperativeHandle","haveAtLeastSomething","undefined","Size","Small","LinearProgressVariant","Normal","ComponentTextStyle","Bold","x","index","e","onClick","icon"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {\n COLORS,\n ComponentTextStyle,\n ComponentXXS,\n LinearProgress,\n LinearProgressType,\n LinearProgressVariant,\n Size\n} from '../../index';\nimport {IconButton} from '../../Button';\n\nexport interface ActionItem {\n icon: React.ReactNode;\n onClick: () => void;\n}\n\nexport interface CardBottomSectionProps {\n progressLevel?: number;\n progressMax?: number;\n progressType?: LinearProgressType;\n\n noteLeft?: string;\n noteLeftIcon?: React.ReactNode;\n noteRight?: string;\n noteRightIcon?: React.ReactNode;\n\n authorName?: string;\n actions?: ActionItem[];\n logo?: React.ReactNode;\n disabled?: boolean;\n}\n\nexport const CardProgressContainer = styled.div`\n padding: 8px 0;\n`;\n\nexport const CardNotesContainer = styled.div`\n height: 48px;\n position: relative;\n color: ${COLORS.neutral_500};\n display: flex;\n flex-direction: row;\n align-items: center;\n`;\n\nexport const CardAuthorContainer = styled.div<{ disabled?: boolean }>`\n display: flex;\n flex-direction: row;\n align-items: center;\n height: 48px;\n\n div:first-child {\n flex-grow: 2;\n }\n\n svg, img {\n width: 80px;\n flex-grow: 0;\n flex-shrink: 0;\n }\n\n ${props => props.disabled ? `\n color: ${COLORS.neutral_300};\n svg, img {\n filter: grayscale(100%);\n }\n \n ` : ''}\n`;\n\nexport const CardBottomDivider = styled.div`\n border-top: 1px;\n border-top-color: ${COLORS.neutral_100};\n border-top-style: solid;\n width: 100%;\n`;\n\nexport const CardNoteLeft = styled.div`\n position: absolute;\n left: 0px;\n display: flex;\n flex-direction: row;\n align-items: center;\n\n svg {\n margin-right: 4px;\n flex-grow: 0;\n flex-shrink: 0;\n }\n`;\n\nexport const CardNoteRight = styled.div`\n position: absolute;\n right: 0px;\n display: flex;\n flex-direction: row;\n align-items: center;\n\n svg {\n margin-right: 4px;\n flex-grow: 0;\n flex-shrink: 0;\n }\n`;\n\nexport const CardButtonRowContainer = styled.div`\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-items: center;\n border-top: 1px;\n border-top-color: ${COLORS.neutral_100};\n border-top-style: solid;\n\n button:last-child {\n margin: 8px 0px 0px 0px;\n }\n\n button:not(:last-child) {\n margin: 8px 0px 0px 0px;\n }\n\n svg {\n color: ${COLORS.neutral_600};\n }\n`;\n\nexport const CardBottomSectionContainer = styled.div`\n padding: 0px 16px 8px 16px;\n width: calc(100% - 32px);\n`;\n\nconst CardBottomSection = React.forwardRef(({\n progressLevel,\n progressMax,\n progressType = LinearProgressType.Line,\n noteLeft,\n noteLeftIcon,\n noteRight,\n noteRightIcon,\n authorName,\n logo,\n actions,\n disabled\n }: CardBottomSectionProps,\n ref: React.Ref<React.RefObject<HTMLButtonElement>[]>) => {\n\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\n\n const length = actions?.length || 0;\n\n React.useEffect(() => {\n setElRefs(Array(length || 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\n }, [length]);\n\n React.useImperativeHandle(ref, () => elRefs, [elRefs]);\n\n const haveAtLeastSomething = progressLevel != undefined || noteLeft || noteLeftIcon || noteRight || noteRightIcon || authorName;\n\n return (\n <CardBottomSectionContainer>\n {haveAtLeastSomething && <CardBottomDivider/>}\n {progressLevel != undefined && <CardProgressContainer>\n <LinearProgress size={Size.Small}\n type={progressType}\n variant={LinearProgressVariant.Normal}\n value={progressLevel}\n max={progressMax ?? progressLevel}/>\n </CardProgressContainer>}\n\n {(noteLeft || noteLeftIcon || noteRight || noteRightIcon) && <CardNotesContainer>\n {(noteLeft || noteLeftIcon) && (\n <CardNoteLeft>\n {noteLeftIcon}\n <ComponentXXS color={COLORS.neutral_500} textStyle={ComponentTextStyle.Bold}>{noteLeft}</ComponentXXS>\n </CardNoteLeft>\n )}\n {(noteRight || noteRightIcon) && (\n <CardNoteRight>\n {noteRightIcon}\n <ComponentXXS color={COLORS.neutral_500} textStyle={ComponentTextStyle.Bold}>{noteRight}</ComponentXXS>\n </CardNoteRight>\n )}\n </CardNotesContainer>}\n\n {(authorName || logo) && <CardAuthorContainer disabled={disabled}>\n <ComponentXXS>{authorName}</ComponentXXS>\n {logo}\n </CardAuthorContainer>}\n\n {actions && <CardButtonRowContainer>\n {actions.map((x, index) => (\n <IconButton ref={elRefs[index]}\n key={index}\n disabled={disabled}\n variant=\"secondary\"\n shape=\"circular\"\n action={(e) => {\n x.onClick();\n }}>\n {x.icon}\n </IconButton>\n ))}\n </CardButtonRowContainer>}\n </CardBottomSectionContainer>\n );\n});\n\nexport default CardBottomSection;\n"],"file":"CardBottomSection.cjs"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Card/VerticalCard/CardBottomSection.tsx"],"names":["React","styled","COLORS","ComponentTextStyle","ComponentXXS","LinearProgress","LinearProgressType","LinearProgressVariant","Size","IconButton","CardProgressContainer","div","CardNotesContainer","neutral_500","CardAuthorContainer","props","disabled","neutral_300","CardBottomDivider","neutral_100","CardNoteLeft","CardNoteRight","CardButtonRowContainer","neutral_600","CardBottomSectionContainer","CardBottomSection","forwardRef","ref","progressLevel","progressMax","progressType","Line","noteLeft","noteLeftIcon","noteRight","noteRightIcon","authorName","logo","actions","useState","elRefs","setElRefs","length","useEffect","Array","fill","map","createRef","useImperativeHandle","haveAtLeastSomething","undefined","Small","Normal","Bold","x","index","e","onClick","icon"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {\n COLORS,\n ComponentTextStyle,\n ComponentXXS,\n LinearProgress,\n LinearProgressType,\n LinearProgressVariant,\n Size\n} from '../../index';\nimport {IconButton} from '../../Button';\n\nexport interface ActionItem {\n icon: React.ReactNode;\n onClick: () => void;\n}\n\nexport interface CardBottomSectionProps {\n progressLevel?: number;\n progressMax?: number;\n progressType?: LinearProgressType;\n\n noteLeft?: string;\n noteLeftIcon?: React.ReactNode;\n noteRight?: string;\n noteRightIcon?: React.ReactNode;\n\n authorName?: string;\n actions?: ActionItem[];\n logo?: React.ReactNode;\n disabled?: boolean;\n}\n\nexport const CardProgressContainer = styled.div`\n padding: 8px 0;\n`;\n\nexport const CardNotesContainer = styled.div`\n height: 48px;\n position: relative;\n color: ${COLORS.neutral_500};\n display: flex;\n flex-direction: row;\n align-items: center;\n`;\n\nexport const CardAuthorContainer = styled.div<{ disabled?: boolean }>`\n display: flex;\n flex-direction: row;\n align-items: center;\n height: 48px;\n\n div:first-child {\n flex-grow: 2;\n }\n\n svg, img {\n width: 80px;\n flex-grow: 0;\n flex-shrink: 0;\n }\n\n ${props => props.disabled ? `\n color: ${COLORS.neutral_300};\n svg, img {\n filter: grayscale(100%);\n }\n \n ` : ''}\n`;\n\nexport const CardBottomDivider = styled.div`\n border-top: 1px;\n border-top-color: ${COLORS.neutral_100};\n border-top-style: solid;\n width: 100%;\n`;\n\nexport const CardNoteLeft = styled.div`\n position: absolute;\n left: 0px;\n display: flex;\n flex-direction: row;\n align-items: center;\n\n svg {\n margin-right: 4px;\n flex-grow: 0;\n flex-shrink: 0;\n }\n`;\n\nexport const CardNoteRight = styled.div`\n position: absolute;\n right: 0px;\n display: flex;\n flex-direction: row;\n align-items: center;\n\n svg {\n margin-right: 4px;\n flex-grow: 0;\n flex-shrink: 0;\n }\n`;\n\nexport const CardButtonRowContainer = styled.div`\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n align-items: center;\n border-top: 1px;\n border-top-color: ${COLORS.neutral_100};\n border-top-style: solid;\n\n button:last-child {\n margin: 8px 0px 0px 0px;\n }\n\n button:not(:last-child) {\n margin: 8px 0px 0px 0px;\n }\n\n svg {\n color: ${COLORS.neutral_600};\n }\n`;\n\nexport const CardBottomSectionContainer = styled.div`\n padding: 0px 16px 8px 16px;\n width: calc(100% - 32px);\n`;\n\nconst CardBottomSection = React.forwardRef(({\n progressLevel,\n progressMax,\n progressType = LinearProgressType.Line,\n noteLeft,\n noteLeftIcon,\n noteRight,\n noteRightIcon,\n authorName,\n logo,\n actions,\n disabled\n }: CardBottomSectionProps,\n ref: React.Ref<React.RefObject<HTMLButtonElement>[]>) => {\n\n const [elRefs, setElRefs] = React.useState<React.RefObject<HTMLButtonElement>[]>([]);\n\n const length = actions?.length || 0;\n\n React.useEffect(() => {\n setElRefs(Array(length || 0).fill(null).map(() => React.createRef<HTMLButtonElement>()));\n }, [length]);\n\n React.useImperativeHandle(ref, () => elRefs, [elRefs]);\n\n const haveAtLeastSomething = progressLevel != undefined || noteLeft || noteLeftIcon || noteRight || noteRightIcon || authorName;\n\n return (\n <CardBottomSectionContainer>\n {haveAtLeastSomething && <CardBottomDivider/>}\n {progressLevel != undefined && <CardProgressContainer>\n <LinearProgress size={Size.Small}\n type={progressType}\n variant={LinearProgressVariant.Normal}\n value={progressLevel}\n max={progressMax ?? progressLevel}/>\n </CardProgressContainer>}\n\n {(noteLeft || noteLeftIcon || noteRight || noteRightIcon) && <CardNotesContainer>\n {(noteLeft || noteLeftIcon) && (\n <CardNoteLeft>\n {noteLeftIcon}\n <ComponentXXS color={COLORS.neutral_500} textStyle={ComponentTextStyle.Bold}>{noteLeft}</ComponentXXS>\n </CardNoteLeft>\n )}\n {(noteRight || noteRightIcon) && (\n <CardNoteRight>\n {noteRightIcon}\n <ComponentXXS color={COLORS.neutral_500} textStyle={ComponentTextStyle.Bold}>{noteRight}</ComponentXXS>\n </CardNoteRight>\n )}\n </CardNotesContainer>}\n\n {(authorName || logo) && <CardAuthorContainer disabled={disabled}>\n <ComponentXXS>{authorName}</ComponentXXS>\n {logo}\n </CardAuthorContainer>}\n\n {actions && <CardButtonRowContainer>\n {actions.map((x, index) => (\n <IconButton ref={elRefs[index]}\n key={index}\n disabled={disabled}\n variant=\"secondary\"\n shape=\"circular\"\n action={(e) => {\n x.onClick();\n }}>\n {x.icon}\n </IconButton>\n ))}\n </CardButtonRowContainer>}\n </CardBottomSectionContainer>\n );\n});\n\nexport default CardBottomSection;\n"],"file":"CardBottomSection.js"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Card/VerticalCard/CardMiddleSection.tsx"],"names":["CardMiddleSectionContainer","styled","div","CardColorBand","props","$color","CardTagsContainer","CardCategoryContainer","COLORS","neutral_500","CardMiddleSection","colorBandColor","categoryIcon","categoryLabel","title","description","tags","row2Tags","disabled","Boolean","ComponentTextStyle","Bold","black","neutral_600","map","x","index","label","variant"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;;;;;;;;;AAkBO,IAAMA,0BAA0B,GAAGC,0BAAOC,GAAV,sUAAhC;;;;AAkBA,IAAMC,aAAa,GAAGF,0BAAOC,GAAV,qMAMJ,UAACE,KAAD;AAAA,SAAWA,KAAK,CAACC,MAAjB;AAAA,CANI,CAAnB;;;;AASA,IAAMC,iBAAiB,GAAGL,0BAAOC,GAAV,qLAAvB;;;;AAQA,IAAMK,qBAAqB,GAAGN,0BAAOC,GAAV,mQAQrBM,cAAOC,WARc,CAA3B;;;;AAcP,IAAMC,iBAAkE,GAAG,SAArEA,iBAAqE,OAS7C;AAAA,MAR5BC,cAQ4B,QAR5BA,cAQ4B;AAAA,MAP5BC,YAO4B,QAP5BA,YAO4B;AAAA,MAN5BC,aAM4B,QAN5BA,aAM4B;AAAA,MAL5BC,KAK4B,QAL5BA,KAK4B;AAAA,MAJ5BC,WAI4B,QAJ5BA,WAI4B;AAAA,MAH5BC,IAG4B,QAH5BA,IAG4B;AAAA,MAF5BC,QAE4B,QAF5BA,QAE4B;AAAA,MAD5BC,QAC4B,QAD5BA,QAC4B;AAC5B,sBACE,sBAAC,0BAAD;AAAA,eACGP,cAAc,iBAAI,qBAAC,aAAD;AAAe,MAAA,MAAM,EAAEA;AAAvB,MADrB,eAEE,sBAAC,qBAAD;AAAuB,MAAA,cAAc,EAAEQ,OAAO,CAACR,cAAD,CAA9C;AAAgE,MAAA,YAAY,EAAEQ,OAAO,CAACP,YAAY,IAAIC,aAAjB,CAArF;AAAA,iBACGD,YADH,eAEE,qBAAC,iBAAD;AAAY,QAAA,SAAS,EAAEQ,0BAAmBC,IAA1C;AAAgD,QAAA,KAAK,EAAEb,cAAOC,WAA9D;AAAA,kBACGI;AADH,QAFF;AAAA,MAFF,eAQE,qBAAC,kBAAD;AAAa,MAAA,SAAS,EAAC,YAAvB;AAAoC,MAAA,SAAS,EAAEO,0BAAmBC,IAAlE;AAAwE,MAAA,KAAK,EAAEH,QAAQ,GAAGV,cAAOC,WAAV,GAAwBD,cAAOc,KAAtH;AAAA,gBACGR;AADH,MARF,EAWGC,WAAW,iBACV,qBAAC,iBAAD;AAAY,MAAA,SAAS,EAAC,kBAAtB;AAAyC,MAAA,KAAK,EAAEP,cAAOe,WAAvD;AAAA,gBACGR;AADH,MAZJ,EAgBGC,IAAI,iBACH,qBAAC,iBAAD;AAAA,gBACGA,IAAI,CAACQ,GAAL,CAAS,UAACC,CAAD,EAAIC,KAAJ;AAAA;;AAAA,4BACR,qBAAC,UAAD;AAAiC,UAAA,KAAK,EAAED,CAAC,CAACE,KAA1C;AAAiD,UAAA,OAAO,gBAAEF,CAAC,CAACG,OAAJ,mDAAe;AAAvE,qBAAaH,CAAC,CAACE,KAAf,cAAwBD,KAAxB,EADQ;AAAA,OAAT;AADH,MAjBJ,EAuBGT,QAAQ,iBACP,qBAAC,iBAAD;AAAA,gBACGA,QAAQ,CAACO,GAAT,CAAa,UAACC,CAAD,EAAIC,KAAJ;AAAA;;AAAA,4BACZ,qBAAC,UAAD;AAAiC,UAAA,KAAK,EAAED,CAAC,CAACE,KAA1C;AAAiD,UAAA,OAAO,iBAAEF,CAAC,CAACG,OAAJ,qDAAe;AAAvE,qBAAaH,CAAC,CAACE,KAAf,cAAwBD,KAAxB,EADY;AAAA,OAAb;AADH,MAxBJ;AAAA,IADF;AAiCD,CA3CD;;;AAhEEf,EAAAA,c;AACAC,EAAAA,Y;AACAC,EAAAA,a;AACAC,EAAAA,K;AACAC,EAAAA,W;AACAC,EAAAA,I;AAMAW,IAAAA,K;;AALAV,EAAAA,Q;AAKAU,IAAAA,K;;AAJAT,EAAAA,Q;;eAsGaR,iB","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { COLORS, ComponentS, ComponentTextStyle, ComponentXL, Tag, TagVariants } from '../../index';\n\nexport interface CardMiddleSectionProps {\n colorBandColor?: string;\n categoryIcon?: React.ReactNode;\n categoryLabel?: string;\n title: string;\n description?: string;\n tags?: CardTag[];\n row2Tags?: CardTag[];\n disabled?: boolean;\n}\n\nexport interface CardTag {\n label: string;\n variant?: TagVariants;\n}\n\nexport const CardMiddleSectionContainer = styled.div`\n display: flex;\n flex-grow: 1;\n width: calc(100% - 32px);\n position: relative;\n flex-direction: column;\n padding: 16px;\n gap: 8px;\n\n .descriptionBlock {\n padding: 2px 0;\n }\n\n .titleBlock {\n padding: 2px 0;\n }\n`;\n\nexport const CardColorBand = styled.div<{ $color: string }>`\n position: absolute;\n width: 100%;\n top: 0px;\n left: 0px;\n height: 8px;\n background-color: ${(props) => props.$color};\n`;\n\nexport const CardTagsContainer = styled.div`\n display: flex;\n flex-direction: row;\n padding: 4px 0;\n gap: 4px;\n flex-wrap: wrap;\n`;\n\nexport const CardCategoryContainer = styled.div<{ extraTopMargin: boolean; bottomMargin: boolean }>`\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: none;\n gap: 6px;\n\n svg {\n color: ${COLORS.neutral_500};\n flex-grow: 0;\n flex-shrink: 0;\n }\n`;\n\nconst CardMiddleSection: React.FunctionComponent<CardMiddleSectionProps> = ({\n colorBandColor,\n categoryIcon,\n categoryLabel,\n title,\n description,\n tags,\n row2Tags,\n disabled,\n}: CardMiddleSectionProps) => {\n return (\n <CardMiddleSectionContainer>\n {colorBandColor && <CardColorBand $color={colorBandColor} />}\n <CardCategoryContainer extraTopMargin={Boolean(colorBandColor)} bottomMargin={Boolean(categoryIcon || categoryLabel)}>\n {categoryIcon}\n <ComponentS textStyle={ComponentTextStyle.Bold} color={COLORS.neutral_500}>\n {categoryLabel}\n </ComponentS>\n </CardCategoryContainer>\n <ComponentXL className=\"titleBlock\" textStyle={ComponentTextStyle.Bold} color={disabled ? COLORS.neutral_500 : COLORS.black}>\n {title}\n </ComponentXL>\n {description && (\n <ComponentS className=\"descriptionBlock\" color={COLORS.neutral_600}>\n {description}\n </ComponentS>\n )}\n {tags && (\n <CardTagsContainer>\n {tags.map((x, index) => (\n <Tag key={`${x.label}_${index}`} label={x.label} variant={x.variant ?? 'neutral'} />\n ))}\n </CardTagsContainer>\n )}\n {row2Tags && (\n <CardTagsContainer>\n {row2Tags.map((x, index) => (\n <Tag key={`${x.label}_${index}`} label={x.label} variant={x.variant ?? 'neutral'} />\n ))}\n </CardTagsContainer>\n )}\n </CardMiddleSectionContainer>\n );\n};\n\nexport default CardMiddleSection;\n"],"file":"CardMiddleSection.cjs"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Card/VerticalCard/CardMiddleSection.tsx"],"names":["React","styled","COLORS","ComponentS","ComponentTextStyle","ComponentXL","Tag","CardMiddleSectionContainer","div","CardColorBand","props","$color","CardTagsContainer","CardCategoryContainer","neutral_500","CardMiddleSection","colorBandColor","categoryIcon","categoryLabel","title","description","tags","row2Tags","disabled","Boolean","Bold","black","neutral_600","map","x","index","label","variant"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport { COLORS, ComponentS, ComponentTextStyle, ComponentXL, Tag, TagVariants } from '../../index';\n\nexport interface CardMiddleSectionProps {\n colorBandColor?: string;\n categoryIcon?: React.ReactNode;\n categoryLabel?: string;\n title: string;\n description?: string;\n tags?: CardTag[];\n row2Tags?: CardTag[];\n disabled?: boolean;\n}\n\nexport interface CardTag {\n label: string;\n variant?: TagVariants;\n}\n\nexport const CardMiddleSectionContainer = styled.div`\n display: flex;\n flex-grow: 1;\n width: calc(100% - 32px);\n position: relative;\n flex-direction: column;\n padding: 16px;\n gap: 8px;\n\n .descriptionBlock {\n padding: 2px 0;\n }\n\n .titleBlock {\n padding: 2px 0;\n }\n`;\n\nexport const CardColorBand = styled.div<{ $color: string }>`\n position: absolute;\n width: 100%;\n top: 0px;\n left: 0px;\n height: 8px;\n background-color: ${(props) => props.$color};\n`;\n\nexport const CardTagsContainer = styled.div`\n display: flex;\n flex-direction: row;\n padding: 4px 0;\n gap: 4px;\n flex-wrap: wrap;\n`;\n\nexport const CardCategoryContainer = styled.div<{ extraTopMargin: boolean; bottomMargin: boolean }>`\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: none;\n gap: 6px;\n\n svg {\n color: ${COLORS.neutral_500};\n flex-grow: 0;\n flex-shrink: 0;\n }\n`;\n\nconst CardMiddleSection: React.FunctionComponent<CardMiddleSectionProps> = ({\n colorBandColor,\n categoryIcon,\n categoryLabel,\n title,\n description,\n tags,\n row2Tags,\n disabled,\n}: CardMiddleSectionProps) => {\n return (\n <CardMiddleSectionContainer>\n {colorBandColor && <CardColorBand $color={colorBandColor} />}\n <CardCategoryContainer extraTopMargin={Boolean(colorBandColor)} bottomMargin={Boolean(categoryIcon || categoryLabel)}>\n {categoryIcon}\n <ComponentS textStyle={ComponentTextStyle.Bold} color={COLORS.neutral_500}>\n {categoryLabel}\n </ComponentS>\n </CardCategoryContainer>\n <ComponentXL className=\"titleBlock\" textStyle={ComponentTextStyle.Bold} color={disabled ? COLORS.neutral_500 : COLORS.black}>\n {title}\n </ComponentXL>\n {description && (\n <ComponentS className=\"descriptionBlock\" color={COLORS.neutral_600}>\n {description}\n </ComponentS>\n )}\n {tags && (\n <CardTagsContainer>\n {tags.map((x, index) => (\n <Tag key={`${x.label}_${index}`} label={x.label} variant={x.variant ?? 'neutral'} />\n ))}\n </CardTagsContainer>\n )}\n {row2Tags && (\n <CardTagsContainer>\n {row2Tags.map((x, index) => (\n <Tag key={`${x.label}_${index}`} label={x.label} variant={x.variant ?? 'neutral'} />\n ))}\n </CardTagsContainer>\n )}\n </CardMiddleSectionContainer>\n );\n};\n\nexport default CardMiddleSection;\n"],"file":"CardMiddleSection.js"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Card/VerticalCard/CardTopSection.tsx"],"names":["CardImg","styled","img","CardTopTagContainer","div","CardTopSectionContainer","props","disabled","CardRibbonContainer","$backgroundColor","$color","CardCheckboxContainer","COLORS","white","CardTopSection","React","forwardRef","ref","selected","setSelected","image","tagLabel","tagIcon","tagVariant","highlightRibbonIcon","highlightRibbonText","highlightRibbonContentColor","highlightRibbonBgColor","neutral_300","ComponentTextStyle","Regular"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {ComponentS, ComponentTextStyle} from '../../styles/typography';\nimport Checkbox from '../../InputFields/Checkbox';\nimport {Tag, TagVariants} from '../../Tag';\n\nimport {COLORS} from '../../index';\n\nexport interface CardTopSectionProps {\n selected?: boolean;\n setSelected?: (arg0: boolean) => void;\n tagLabel?: string;\n tagIcon?: React.ReactNode;\n tagVariant?: TagVariants;\n highlightRibbonText?: string;\n highlightRibbonIcon?: React.ReactNode;\n highlightRibbonContentColor?: string;\n highlightRibbonBgColor?: string;\n image?: string;\n disabled?: boolean;\n}\n\nexport const CardImg = styled.img`\n object-fit: cover;\n width: 100%;\n height: 100%;\n border-top-right-radius: 8px;\n border-top-left-radius: 8px;\n`;\n\nexport const CardTopTagContainer = styled.div`\n position: absolute;\n\n top: 16px;\n left: 16px;\n width: calc(100% - 32px);\n`;\n\nexport const CardTopSectionContainer = styled.div<{ disabled?: boolean }>`\n position: relative;\n width: 100%;\n height: 200px;\n overflow: visible;\n\n ${props => props.disabled ? `\n img, svg {\n filter: grayscale(100%);\n }` : ''}\n`;\n\nexport const CardRibbonContainer = styled.div<{ $color: string; $backgroundColor: string }>`\n min-height: calc(40px - 16px);\n background-color: ${props => props.$backgroundColor};\n width: calc(100% - 32px);\n position: absolute;\n bottom: 0px;\n left: 0px;\n padding: 8px 16px 8px 16px;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n\n svg {\n color: ${props => props.$color};\n width: 24px;\n height: 24px;\n flex-grow: 0;\n flex-shrink: 0;\n }\n`;\n\nexport const CardCheckboxContainer = styled.div`\n position: absolute;\n top: 0;\n right: 0;\n z-index: 1;\n\n .checkbox-icon {\n background-color: ${COLORS.white};\n }\n`;\n\nconst CardTopSection = React.forwardRef(({\n selected,\n setSelected,\n image,\n tagLabel,\n tagIcon,\n tagVariant = 'positive',\n highlightRibbonIcon,\n highlightRibbonText,\n highlightRibbonContentColor,\n highlightRibbonBgColor,\n disabled\n }: CardTopSectionProps, ref: React.Ref<HTMLDivElement>) => {\n\n return (\n <CardTopSectionContainer disabled={disabled}>\n <CardImg src={image}/>\n {(!!selected || !!setSelected) && (\n <CardCheckboxContainer>\n <Checkbox ref={ref}\n disabled={disabled}\n select={(selected: boolean) => setSelected && setSelected(selected)}\n selected={selected || false}/>\n </CardCheckboxContainer>\n )}\n {(tagLabel || tagIcon) && (\n <CardTopTagContainer>\n <Tag label={tagLabel} variant={tagVariant} icon={tagIcon}/>\n </CardTopTagContainer>\n )}\n {(highlightRibbonIcon || highlightRibbonText) && (\n <CardRibbonContainer $color={highlightRibbonContentColor ?? ''}\n $backgroundColor={disabled ? COLORS.neutral_300 : highlightRibbonBgColor ?? ''}>\n {highlightRibbonIcon}\n {highlightRibbonText && (\n <ComponentS color={highlightRibbonContentColor ?? ''} textStyle={ComponentTextStyle.Regular}>\n {highlightRibbonText}\n </ComponentS>\n )}\n </CardRibbonContainer>\n )}\n </CardTopSectionContainer>\n );\n});\n\nexport default CardTopSection;\n"],"file":"CardTopSection.cjs"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Card/VerticalCard/CardTopSection.tsx"],"names":["React","styled","ComponentS","ComponentTextStyle","Checkbox","Tag","COLORS","CardImg","img","CardTopTagContainer","div","CardTopSectionContainer","props","disabled","CardRibbonContainer","$backgroundColor","$color","CardCheckboxContainer","white","CardTopSection","forwardRef","ref","selected","setSelected","image","tagLabel","tagIcon","tagVariant","highlightRibbonIcon","highlightRibbonText","highlightRibbonContentColor","highlightRibbonBgColor","neutral_300","Regular"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {ComponentS, ComponentTextStyle} from '../../styles/typography';\nimport Checkbox from '../../InputFields/Checkbox';\nimport {Tag, TagVariants} from '../../Tag';\n\nimport {COLORS} from '../../index';\n\nexport interface CardTopSectionProps {\n selected?: boolean;\n setSelected?: (arg0: boolean) => void;\n tagLabel?: string;\n tagIcon?: React.ReactNode;\n tagVariant?: TagVariants;\n highlightRibbonText?: string;\n highlightRibbonIcon?: React.ReactNode;\n highlightRibbonContentColor?: string;\n highlightRibbonBgColor?: string;\n image?: string;\n disabled?: boolean;\n}\n\nexport const CardImg = styled.img`\n object-fit: cover;\n width: 100%;\n height: 100%;\n border-top-right-radius: 8px;\n border-top-left-radius: 8px;\n`;\n\nexport const CardTopTagContainer = styled.div`\n position: absolute;\n\n top: 16px;\n left: 16px;\n width: calc(100% - 32px);\n`;\n\nexport const CardTopSectionContainer = styled.div<{ disabled?: boolean }>`\n position: relative;\n width: 100%;\n height: 200px;\n overflow: visible;\n\n ${props => props.disabled ? `\n img, svg {\n filter: grayscale(100%);\n }` : ''}\n`;\n\nexport const CardRibbonContainer = styled.div<{ $color: string; $backgroundColor: string }>`\n min-height: calc(40px - 16px);\n background-color: ${props => props.$backgroundColor};\n width: calc(100% - 32px);\n position: absolute;\n bottom: 0px;\n left: 0px;\n padding: 8px 16px 8px 16px;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n\n svg {\n color: ${props => props.$color};\n width: 24px;\n height: 24px;\n flex-grow: 0;\n flex-shrink: 0;\n }\n`;\n\nexport const CardCheckboxContainer = styled.div`\n position: absolute;\n top: 0;\n right: 0;\n z-index: 1;\n\n .checkbox-icon {\n background-color: ${COLORS.white};\n }\n`;\n\nconst CardTopSection = React.forwardRef(({\n selected,\n setSelected,\n image,\n tagLabel,\n tagIcon,\n tagVariant = 'positive',\n highlightRibbonIcon,\n highlightRibbonText,\n highlightRibbonContentColor,\n highlightRibbonBgColor,\n disabled\n }: CardTopSectionProps, ref: React.Ref<HTMLDivElement>) => {\n\n return (\n <CardTopSectionContainer disabled={disabled}>\n <CardImg src={image}/>\n {(!!selected || !!setSelected) && (\n <CardCheckboxContainer>\n <Checkbox ref={ref}\n disabled={disabled}\n select={(selected: boolean) => setSelected && setSelected(selected)}\n selected={selected || false}/>\n </CardCheckboxContainer>\n )}\n {(tagLabel || tagIcon) && (\n <CardTopTagContainer>\n <Tag label={tagLabel} variant={tagVariant} icon={tagIcon}/>\n </CardTopTagContainer>\n )}\n {(highlightRibbonIcon || highlightRibbonText) && (\n <CardRibbonContainer $color={highlightRibbonContentColor ?? ''}\n $backgroundColor={disabled ? COLORS.neutral_300 : highlightRibbonBgColor ?? ''}>\n {highlightRibbonIcon}\n {highlightRibbonText && (\n <ComponentS color={highlightRibbonContentColor ?? ''} textStyle={ComponentTextStyle.Regular}>\n {highlightRibbonText}\n </ComponentS>\n )}\n </CardRibbonContainer>\n )}\n </CardTopSectionContainer>\n );\n});\n\nexport default CardTopSection;\n"],"file":"CardTopSection.js"}
|
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
|
-
Object.defineProperty(exports, "__esModule", {
|
|
8
|
-
value: true
|
|
9
|
-
});
|
|
10
|
-
var _exportNames = {
|
|
11
|
-
Card: true,
|
|
12
|
-
CardBottomSection: true,
|
|
13
|
-
CardMiddleSection: true,
|
|
14
|
-
CardTopSection: true
|
|
15
|
-
};
|
|
16
|
-
Object.defineProperty(exports, "Card", {
|
|
17
|
-
enumerable: true,
|
|
18
|
-
get: function get() {
|
|
19
|
-
return _Card.default;
|
|
20
|
-
}
|
|
21
|
-
});
|
|
22
|
-
Object.defineProperty(exports, "CardBottomSection", {
|
|
23
|
-
enumerable: true,
|
|
24
|
-
get: function get() {
|
|
25
|
-
return _CardBottomSection.default;
|
|
26
|
-
}
|
|
27
|
-
});
|
|
28
|
-
Object.defineProperty(exports, "CardMiddleSection", {
|
|
29
|
-
enumerable: true,
|
|
30
|
-
get: function get() {
|
|
31
|
-
return _CardMiddleSection.default;
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
Object.defineProperty(exports, "CardTopSection", {
|
|
35
|
-
enumerable: true,
|
|
36
|
-
get: function get() {
|
|
37
|
-
return _CardTopSection.default;
|
|
38
|
-
}
|
|
39
|
-
});
|
|
40
|
-
|
|
41
|
-
var _Card = _interopRequireDefault(require("./Card"));
|
|
42
|
-
|
|
43
|
-
var _CardBottomSection = _interopRequireWildcard(require("./CardBottomSection"));
|
|
44
|
-
|
|
45
|
-
Object.keys(_CardBottomSection).forEach(function (key) {
|
|
46
|
-
if (key === "default" || key === "__esModule") return;
|
|
47
|
-
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
48
|
-
if (key in exports && exports[key] === _CardBottomSection[key]) return;
|
|
49
|
-
Object.defineProperty(exports, key, {
|
|
50
|
-
enumerable: true,
|
|
51
|
-
get: function get() {
|
|
52
|
-
return _CardBottomSection[key];
|
|
53
|
-
}
|
|
54
|
-
});
|
|
55
|
-
});
|
|
56
|
-
|
|
57
|
-
var _CardMiddleSection = _interopRequireWildcard(require("./CardMiddleSection"));
|
|
58
|
-
|
|
59
|
-
Object.keys(_CardMiddleSection).forEach(function (key) {
|
|
60
|
-
if (key === "default" || key === "__esModule") return;
|
|
61
|
-
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
62
|
-
if (key in exports && exports[key] === _CardMiddleSection[key]) return;
|
|
63
|
-
Object.defineProperty(exports, key, {
|
|
64
|
-
enumerable: true,
|
|
65
|
-
get: function get() {
|
|
66
|
-
return _CardMiddleSection[key];
|
|
67
|
-
}
|
|
68
|
-
});
|
|
69
|
-
});
|
|
70
|
-
|
|
71
|
-
var _CardTopSection = _interopRequireWildcard(require("./CardTopSection"));
|
|
72
|
-
|
|
73
|
-
Object.keys(_CardTopSection).forEach(function (key) {
|
|
74
|
-
if (key === "default" || key === "__esModule") return;
|
|
75
|
-
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
76
|
-
if (key in exports && exports[key] === _CardTopSection[key]) return;
|
|
77
|
-
Object.defineProperty(exports, key, {
|
|
78
|
-
enumerable: true,
|
|
79
|
-
get: function get() {
|
|
80
|
-
return _CardTopSection[key];
|
|
81
|
-
}
|
|
82
|
-
});
|
|
83
|
-
});
|
|
84
|
-
|
|
85
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
86
|
-
|
|
87
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
88
|
-
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Card/VerticalCard/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export {default as Card} from './Card';\n\nexport {default as CardBottomSection} from './CardBottomSection';\nexport * from './CardBottomSection';\nexport {default as CardMiddleSection} from './CardMiddleSection';\nexport * from './CardMiddleSection';\nexport {default as CardTopSection} from './CardTopSection';\nexport * from './CardTopSection';\n"],"file":"index.cjs"}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
export { default as Card } from './Card';
|
|
2
|
-
export { default as CardBottomSection } from './CardBottomSection';
|
|
3
|
-
export * from './CardBottomSection';
|
|
4
|
-
export { default as CardMiddleSection } from './CardMiddleSection';
|
|
5
|
-
export * from './CardMiddleSection';
|
|
6
|
-
export { default as CardTopSection } from './CardTopSection';
|
|
7
|
-
export * from './CardTopSection';
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
export { default as Card } from './Card';
|
|
2
|
-
export { default as CardBottomSection } from './CardBottomSection';
|
|
3
|
-
export * from './CardBottomSection';
|
|
4
|
-
export { default as CardMiddleSection } from './CardMiddleSection';
|
|
5
|
-
export * from './CardMiddleSection';
|
|
6
|
-
export { default as CardTopSection } from './CardTopSection';
|
|
7
|
-
export * from './CardTopSection';
|
|
8
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Card/VerticalCard/index.tsx"],"names":["default","Card","CardBottomSection","CardMiddleSection","CardTopSection"],"mappings":"AAAA,SAAQA,OAAO,IAAIC,IAAnB,QAA8B,QAA9B;AAEA,SAAQD,OAAO,IAAIE,iBAAnB,QAA2C,qBAA3C;AACA,cAAc,qBAAd;AACA,SAAQF,OAAO,IAAIG,iBAAnB,QAA2C,qBAA3C;AACA,cAAc,qBAAd;AACA,SAAQH,OAAO,IAAII,cAAnB,QAAwC,kBAAxC;AACA,cAAc,kBAAd","sourcesContent":["export {default as Card} from './Card';\n\nexport {default as CardBottomSection} from './CardBottomSection';\nexport * from './CardBottomSection';\nexport {default as CardMiddleSection} from './CardMiddleSection';\nexport * from './CardMiddleSection';\nexport {default as CardTopSection} from './CardTopSection';\nexport * from './CardTopSection';\n"],"file":"index.js"}
|