glints-aries 4.0.196 → 4.0.197
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/es/@next/Card/Card.d.ts +15 -0
- package/es/@next/Card/Card.js +46 -0
- package/es/@next/Card/Card.stories.d.ts +7 -0
- package/es/@next/Card/CardStyle.d.ts +7 -0
- package/es/@next/Card/CardStyle.js +33 -0
- package/es/@next/Card/Section.d.ts +4 -0
- package/es/@next/Card/Section.js +12 -0
- package/es/@next/Card/index.d.ts +1 -0
- package/es/@next/Card/index.js +1 -0
- package/es/@next/EmptyState/EmptyState.js +0 -1
- package/es/@next/Modal/Modal.d.ts +3 -6
- package/es/@next/index.d.ts +1 -0
- package/es/@next/index.js +1 -0
- package/es/types/componentAction.d.ts +4 -0
- package/es/types/componentAction.js +1 -0
- package/lib/@next/Card/Card.d.ts +15 -0
- package/lib/@next/Card/Card.js +52 -0
- package/lib/@next/Card/Card.stories.d.ts +7 -0
- package/lib/@next/Card/CardStyle.d.ts +7 -0
- package/lib/@next/Card/CardStyle.js +47 -0
- package/lib/@next/Card/Section.d.ts +4 -0
- package/lib/@next/Card/Section.js +18 -0
- package/lib/@next/Card/index.d.ts +1 -0
- package/lib/@next/Card/index.js +9 -0
- package/lib/@next/EmptyState/EmptyState.js +0 -1
- package/lib/@next/Modal/Modal.d.ts +3 -6
- package/lib/@next/index.d.ts +1 -0
- package/lib/@next/index.js +4 -1
- package/lib/types/componentAction.d.ts +4 -0
- package/lib/types/componentAction.js +1 -0
- package/package.json +1 -1
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ComponentAction } from '../../types/componentAction';
|
|
3
|
+
export declare type CardProps = {
|
|
4
|
+
heading?: string;
|
|
5
|
+
subheading?: string;
|
|
6
|
+
children?: React.ReactNode;
|
|
7
|
+
primaryAction?: ComponentAction;
|
|
8
|
+
secondaryAction?: ComponentAction;
|
|
9
|
+
actionsAlignment?: 'left' | 'right';
|
|
10
|
+
};
|
|
11
|
+
export declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>> & {
|
|
12
|
+
Section: ({ children }: {
|
|
13
|
+
children: React.ReactNode;
|
|
14
|
+
}) => JSX.Element;
|
|
15
|
+
};
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Button, PrimaryButton } from '../Button';
|
|
3
|
+
import { ButtonGroup } from '../ButtonGroup';
|
|
4
|
+
import { Typography } from '../Typography';
|
|
5
|
+
import { StyledCardActionWrapper, StyledCardContainer, StyledCardContentWrapper, StyledCardHeaderSection, StyledCardHeaderSectionHalf, StyledCardHeaderWrapper } from './CardStyle';
|
|
6
|
+
import { Section } from './Section';
|
|
7
|
+
var CardComponent = /*#__PURE__*/React.forwardRef(function Card(_ref, ref) {
|
|
8
|
+
var heading = _ref.heading,
|
|
9
|
+
subheading = _ref.subheading,
|
|
10
|
+
primaryAction = _ref.primaryAction,
|
|
11
|
+
secondaryAction = _ref.secondaryAction,
|
|
12
|
+
_ref$actionsAlignment = _ref.actionsAlignment,
|
|
13
|
+
actionsAlignment = _ref$actionsAlignment === void 0 ? 'right' : _ref$actionsAlignment,
|
|
14
|
+
children = _ref.children;
|
|
15
|
+
var headingMarkup = /*#__PURE__*/React.createElement(Typography, {
|
|
16
|
+
as: "div",
|
|
17
|
+
variant: "body2"
|
|
18
|
+
}, heading);
|
|
19
|
+
var subHeadingMarkup = /*#__PURE__*/React.createElement(Typography, {
|
|
20
|
+
as: "div",
|
|
21
|
+
variant: "subtitle2"
|
|
22
|
+
}, subheading);
|
|
23
|
+
var headerMarkup = function headerMarkup() {
|
|
24
|
+
if (!!heading && !!subheading) {
|
|
25
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledCardHeaderSectionHalf, null, headingMarkup), /*#__PURE__*/React.createElement(StyledCardHeaderSectionHalf, null, subHeadingMarkup));
|
|
26
|
+
}
|
|
27
|
+
if (heading) {
|
|
28
|
+
return /*#__PURE__*/React.createElement(StyledCardHeaderSection, null, headingMarkup);
|
|
29
|
+
}
|
|
30
|
+
return /*#__PURE__*/React.createElement(StyledCardHeaderSection, null, subHeadingMarkup);
|
|
31
|
+
};
|
|
32
|
+
var showHeader = !!heading || !!subheading;
|
|
33
|
+
var showActions = !!primaryAction || !!secondaryAction;
|
|
34
|
+
return /*#__PURE__*/React.createElement(StyledCardContainer, {
|
|
35
|
+
ref: ref
|
|
36
|
+
}, showHeader && /*#__PURE__*/React.createElement(StyledCardHeaderWrapper, null, headerMarkup(), " "), /*#__PURE__*/React.createElement(StyledCardContentWrapper, null, children), showActions && /*#__PURE__*/React.createElement(StyledCardActionWrapper, {
|
|
37
|
+
"data-align": actionsAlignment
|
|
38
|
+
}, /*#__PURE__*/React.createElement(ButtonGroup, null, secondaryAction && /*#__PURE__*/React.createElement(Button, {
|
|
39
|
+
onClick: secondaryAction.action
|
|
40
|
+
}, secondaryAction.label), primaryAction && /*#__PURE__*/React.createElement(PrimaryButton, {
|
|
41
|
+
onClick: primaryAction.action
|
|
42
|
+
}, primaryAction.label))));
|
|
43
|
+
});
|
|
44
|
+
export var Card = Object.assign(CardComponent, {
|
|
45
|
+
Section: Section
|
|
46
|
+
});
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Meta } from '@storybook/react';
|
|
2
|
+
declare const _default: Meta<import("@storybook/react").Args>;
|
|
3
|
+
export default _default;
|
|
4
|
+
export declare const Interactive: any;
|
|
5
|
+
export declare const NoAction: any;
|
|
6
|
+
export declare const PrimaryActionOnly: any;
|
|
7
|
+
export declare const SecondaryActionOnly: any;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const StyledCardContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
2
|
+
export declare const StyledCardHeaderWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
3
|
+
export declare const StyledCardHeaderSection: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
4
|
+
export declare const StyledCardHeaderSectionHalf: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
|
+
export declare const StyledCardContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
6
|
+
export declare const StyledCardSection: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
7
|
+
export declare const StyledCardActionWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import styled from 'styled-components';
|
|
2
|
+
import * as Breakpoints from '../utilities/breakpoints';
|
|
3
|
+
import { borderRadius8 } from '../utilities/borderRadius';
|
|
4
|
+
import { Neutral } from '../utilities/colors';
|
|
5
|
+
import { space12, space16, space24, space4 } from '../utilities/spacing';
|
|
6
|
+
export var StyledCardContainer = styled.div.withConfig({
|
|
7
|
+
displayName: "CardStyle__StyledCardContainer",
|
|
8
|
+
componentId: "sc-tpku8j-0"
|
|
9
|
+
})(["border-radius:", ";box-shadow:0px 0px 5px rgba(0,0,0,0.05),0px 1px 2px rgba(0,0,0,0.15);color:", ";"], borderRadius8, Neutral.B18);
|
|
10
|
+
export var StyledCardHeaderWrapper = styled.div.withConfig({
|
|
11
|
+
displayName: "CardStyle__StyledCardHeaderWrapper",
|
|
12
|
+
componentId: "sc-tpku8j-1"
|
|
13
|
+
})(["display:flex;padding:", " ", " 20px;flex-wrap:wrap;flex-direction:column;height:max-content;border-bottom:solid 1px ", ";@media (max-width:", "){padding:", " ", " 10px;}"], space24, space24, Neutral.B85, Breakpoints.large, space12, space16);
|
|
14
|
+
export var StyledCardHeaderSection = styled.div.withConfig({
|
|
15
|
+
displayName: "CardStyle__StyledCardHeaderSection",
|
|
16
|
+
componentId: "sc-tpku8j-2"
|
|
17
|
+
})(["flex:0 0 100%;"]);
|
|
18
|
+
export var StyledCardHeaderSectionHalf = styled.div.withConfig({
|
|
19
|
+
displayName: "CardStyle__StyledCardHeaderSectionHalf",
|
|
20
|
+
componentId: "sc-tpku8j-3"
|
|
21
|
+
})(["flex:0 0 50%;"]);
|
|
22
|
+
export var StyledCardContentWrapper = styled.div.withConfig({
|
|
23
|
+
displayName: "CardStyle__StyledCardContentWrapper",
|
|
24
|
+
componentId: "sc-tpku8j-4"
|
|
25
|
+
})(["padding-left:", ";"], space4);
|
|
26
|
+
export var StyledCardSection = styled.div.withConfig({
|
|
27
|
+
displayName: "CardStyle__StyledCardSection",
|
|
28
|
+
componentId: "sc-tpku8j-5"
|
|
29
|
+
})(["padding:", " 20px;.section + .section{border-top:solid 1px ", ";}@media (max-width:", "){padding:", " ", ";}"], space16, Neutral.B85, Breakpoints.large, space16, space12);
|
|
30
|
+
export var StyledCardActionWrapper = styled.div.withConfig({
|
|
31
|
+
displayName: "CardStyle__StyledCardActionWrapper",
|
|
32
|
+
componentId: "sc-tpku8j-6"
|
|
33
|
+
})(["display:flex;padding:20px ", " ", ";flex-direction:column-reverse;align-items:flex-end;border-top:solid 1px ", ";&[data-align='left']{flex-direction:column;align-items:flex-start;}@media (max-width:", "){padding:10px ", " ", ";}"], space24, space24, Neutral.B85, Breakpoints.large, space16, space12);
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Typography } from '../Typography';
|
|
3
|
+
import { StyledCardSection } from './CardStyle';
|
|
4
|
+
export var Section = function Section(_ref) {
|
|
5
|
+
var children = _ref.children;
|
|
6
|
+
return /*#__PURE__*/React.createElement(StyledCardSection, {
|
|
7
|
+
className: "section"
|
|
8
|
+
}, /*#__PURE__*/React.createElement(Typography, {
|
|
9
|
+
as: "div",
|
|
10
|
+
variant: "body1"
|
|
11
|
+
}, children));
|
|
12
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Card';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Card';
|
|
@@ -17,7 +17,6 @@ export var EmptyState = function EmptyState(_ref) {
|
|
|
17
17
|
if (imageName && !isValidImageName) {
|
|
18
18
|
console.warn("imageName \"" + imageName + "\" is not a valid Image Name.");
|
|
19
19
|
}
|
|
20
|
-
console.log('ImageName: ', imageName);
|
|
21
20
|
return /*#__PURE__*/React.createElement(EmptyStateContainer, null, imageName && /*#__PURE__*/React.createElement(StyledImage, {
|
|
22
21
|
src: imageMapping[imageName]
|
|
23
22
|
}), /*#__PURE__*/React.createElement(EmptyStateContentContainer, {
|
|
@@ -1,17 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
|
-
label: string;
|
|
4
|
-
action: (...args: any[]) => void;
|
|
5
|
-
};
|
|
2
|
+
import { ComponentAction } from '../../types/componentAction';
|
|
6
3
|
export declare type ModalProps = {
|
|
7
4
|
isOpen?: boolean;
|
|
8
5
|
header?: string;
|
|
9
6
|
headerDescription?: string;
|
|
10
7
|
children?: React.ReactNode;
|
|
11
8
|
/** This action will be tied to primary button on footer */
|
|
12
|
-
primaryAction?:
|
|
9
|
+
primaryAction?: ComponentAction;
|
|
13
10
|
/** This action will be tied to basic button on footer */
|
|
14
|
-
secondaryAction?:
|
|
11
|
+
secondaryAction?: ComponentAction;
|
|
15
12
|
/** Defining custom actions will not show primary and secondary actions */
|
|
16
13
|
customActions?: React.ReactNode;
|
|
17
14
|
showBackButton?: boolean;
|
package/es/@next/index.d.ts
CHANGED
|
@@ -10,6 +10,7 @@ export { Badge, BadgeProps } from './Badge';
|
|
|
10
10
|
export { Banner, BannerProps } from './Banner';
|
|
11
11
|
export { Button, ButtonProps, DestructiveButton, OutlineButton, OutlineMonochromeButton, PrimaryButton, } from './Button';
|
|
12
12
|
export { ButtonGroup, ButtonGroupProps } from './ButtonGroup';
|
|
13
|
+
export { Card, CardProps } from './Card';
|
|
13
14
|
export { Checkbox, CheckboxProps } from './Checkbox';
|
|
14
15
|
export { CurrencyInput, CurrencyInputProps } from './CurrencyInput';
|
|
15
16
|
export { Divider } from './Divider';
|
package/es/@next/index.js
CHANGED
|
@@ -11,6 +11,7 @@ export { Badge, BadgeProps } from './Badge';
|
|
|
11
11
|
export { Banner, BannerProps } from './Banner';
|
|
12
12
|
export { Button, ButtonProps, DestructiveButton, OutlineButton, OutlineMonochromeButton, PrimaryButton } from './Button';
|
|
13
13
|
export { ButtonGroup, ButtonGroupProps } from './ButtonGroup';
|
|
14
|
+
export { Card, CardProps } from './Card';
|
|
14
15
|
export { Checkbox, CheckboxProps } from './Checkbox';
|
|
15
16
|
export { CurrencyInput, CurrencyInputProps } from './CurrencyInput';
|
|
16
17
|
export { Divider } from './Divider';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ComponentAction } from '../../types/componentAction';
|
|
3
|
+
export declare type CardProps = {
|
|
4
|
+
heading?: string;
|
|
5
|
+
subheading?: string;
|
|
6
|
+
children?: React.ReactNode;
|
|
7
|
+
primaryAction?: ComponentAction;
|
|
8
|
+
secondaryAction?: ComponentAction;
|
|
9
|
+
actionsAlignment?: 'left' | 'right';
|
|
10
|
+
};
|
|
11
|
+
export declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>> & {
|
|
12
|
+
Section: ({ children }: {
|
|
13
|
+
children: React.ReactNode;
|
|
14
|
+
}) => JSX.Element;
|
|
15
|
+
};
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
exports.__esModule = true;
|
|
5
|
+
exports.Card = void 0;
|
|
6
|
+
var _react = _interopRequireDefault(require("react"));
|
|
7
|
+
var _Button = require("../Button");
|
|
8
|
+
var _ButtonGroup = require("../ButtonGroup");
|
|
9
|
+
var _Typography = require("../Typography");
|
|
10
|
+
var _CardStyle = require("./CardStyle");
|
|
11
|
+
var _Section = require("./Section");
|
|
12
|
+
var CardComponent = /*#__PURE__*/_react["default"].forwardRef(function Card(_ref, ref) {
|
|
13
|
+
var heading = _ref.heading,
|
|
14
|
+
subheading = _ref.subheading,
|
|
15
|
+
primaryAction = _ref.primaryAction,
|
|
16
|
+
secondaryAction = _ref.secondaryAction,
|
|
17
|
+
_ref$actionsAlignment = _ref.actionsAlignment,
|
|
18
|
+
actionsAlignment = _ref$actionsAlignment === void 0 ? 'right' : _ref$actionsAlignment,
|
|
19
|
+
children = _ref.children;
|
|
20
|
+
var headingMarkup = /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
|
|
21
|
+
as: "div",
|
|
22
|
+
variant: "body2"
|
|
23
|
+
}, heading);
|
|
24
|
+
var subHeadingMarkup = /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
|
|
25
|
+
as: "div",
|
|
26
|
+
variant: "subtitle2"
|
|
27
|
+
}, subheading);
|
|
28
|
+
var headerMarkup = function headerMarkup() {
|
|
29
|
+
if (!!heading && !!subheading) {
|
|
30
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_CardStyle.StyledCardHeaderSectionHalf, null, headingMarkup), /*#__PURE__*/_react["default"].createElement(_CardStyle.StyledCardHeaderSectionHalf, null, subHeadingMarkup));
|
|
31
|
+
}
|
|
32
|
+
if (heading) {
|
|
33
|
+
return /*#__PURE__*/_react["default"].createElement(_CardStyle.StyledCardHeaderSection, null, headingMarkup);
|
|
34
|
+
}
|
|
35
|
+
return /*#__PURE__*/_react["default"].createElement(_CardStyle.StyledCardHeaderSection, null, subHeadingMarkup);
|
|
36
|
+
};
|
|
37
|
+
var showHeader = !!heading || !!subheading;
|
|
38
|
+
var showActions = !!primaryAction || !!secondaryAction;
|
|
39
|
+
return /*#__PURE__*/_react["default"].createElement(_CardStyle.StyledCardContainer, {
|
|
40
|
+
ref: ref
|
|
41
|
+
}, showHeader && /*#__PURE__*/_react["default"].createElement(_CardStyle.StyledCardHeaderWrapper, null, headerMarkup(), " "), /*#__PURE__*/_react["default"].createElement(_CardStyle.StyledCardContentWrapper, null, children), showActions && /*#__PURE__*/_react["default"].createElement(_CardStyle.StyledCardActionWrapper, {
|
|
42
|
+
"data-align": actionsAlignment
|
|
43
|
+
}, /*#__PURE__*/_react["default"].createElement(_ButtonGroup.ButtonGroup, null, secondaryAction && /*#__PURE__*/_react["default"].createElement(_Button.Button, {
|
|
44
|
+
onClick: secondaryAction.action
|
|
45
|
+
}, secondaryAction.label), primaryAction && /*#__PURE__*/_react["default"].createElement(_Button.PrimaryButton, {
|
|
46
|
+
onClick: primaryAction.action
|
|
47
|
+
}, primaryAction.label))));
|
|
48
|
+
});
|
|
49
|
+
var Card = Object.assign(CardComponent, {
|
|
50
|
+
Section: _Section.Section
|
|
51
|
+
});
|
|
52
|
+
exports.Card = Card;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Meta } from '@storybook/react';
|
|
2
|
+
declare const _default: Meta<import("@storybook/react").Args>;
|
|
3
|
+
export default _default;
|
|
4
|
+
export declare const Interactive: any;
|
|
5
|
+
export declare const NoAction: any;
|
|
6
|
+
export declare const PrimaryActionOnly: any;
|
|
7
|
+
export declare const SecondaryActionOnly: any;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const StyledCardContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
2
|
+
export declare const StyledCardHeaderWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
3
|
+
export declare const StyledCardHeaderSection: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
4
|
+
export declare const StyledCardHeaderSectionHalf: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
|
+
export declare const StyledCardContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
6
|
+
export declare const StyledCardSection: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
7
|
+
export declare const StyledCardActionWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
exports.__esModule = true;
|
|
5
|
+
exports.StyledCardSection = exports.StyledCardHeaderWrapper = exports.StyledCardHeaderSectionHalf = exports.StyledCardHeaderSection = exports.StyledCardContentWrapper = exports.StyledCardContainer = exports.StyledCardActionWrapper = void 0;
|
|
6
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
7
|
+
var Breakpoints = _interopRequireWildcard(require("../utilities/breakpoints"));
|
|
8
|
+
var _borderRadius = require("../utilities/borderRadius");
|
|
9
|
+
var _colors = require("../utilities/colors");
|
|
10
|
+
var _spacing = require("../utilities/spacing");
|
|
11
|
+
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); }
|
|
12
|
+
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; }
|
|
13
|
+
var StyledCardContainer = _styledComponents["default"].div.withConfig({
|
|
14
|
+
displayName: "CardStyle__StyledCardContainer",
|
|
15
|
+
componentId: "sc-tpku8j-0"
|
|
16
|
+
})(["border-radius:", ";box-shadow:0px 0px 5px rgba(0,0,0,0.05),0px 1px 2px rgba(0,0,0,0.15);color:", ";"], _borderRadius.borderRadius8, _colors.Neutral.B18);
|
|
17
|
+
exports.StyledCardContainer = StyledCardContainer;
|
|
18
|
+
var StyledCardHeaderWrapper = _styledComponents["default"].div.withConfig({
|
|
19
|
+
displayName: "CardStyle__StyledCardHeaderWrapper",
|
|
20
|
+
componentId: "sc-tpku8j-1"
|
|
21
|
+
})(["display:flex;padding:", " ", " 20px;flex-wrap:wrap;flex-direction:column;height:max-content;border-bottom:solid 1px ", ";@media (max-width:", "){padding:", " ", " 10px;}"], _spacing.space24, _spacing.space24, _colors.Neutral.B85, Breakpoints.large, _spacing.space12, _spacing.space16);
|
|
22
|
+
exports.StyledCardHeaderWrapper = StyledCardHeaderWrapper;
|
|
23
|
+
var StyledCardHeaderSection = _styledComponents["default"].div.withConfig({
|
|
24
|
+
displayName: "CardStyle__StyledCardHeaderSection",
|
|
25
|
+
componentId: "sc-tpku8j-2"
|
|
26
|
+
})(["flex:0 0 100%;"]);
|
|
27
|
+
exports.StyledCardHeaderSection = StyledCardHeaderSection;
|
|
28
|
+
var StyledCardHeaderSectionHalf = _styledComponents["default"].div.withConfig({
|
|
29
|
+
displayName: "CardStyle__StyledCardHeaderSectionHalf",
|
|
30
|
+
componentId: "sc-tpku8j-3"
|
|
31
|
+
})(["flex:0 0 50%;"]);
|
|
32
|
+
exports.StyledCardHeaderSectionHalf = StyledCardHeaderSectionHalf;
|
|
33
|
+
var StyledCardContentWrapper = _styledComponents["default"].div.withConfig({
|
|
34
|
+
displayName: "CardStyle__StyledCardContentWrapper",
|
|
35
|
+
componentId: "sc-tpku8j-4"
|
|
36
|
+
})(["padding-left:", ";"], _spacing.space4);
|
|
37
|
+
exports.StyledCardContentWrapper = StyledCardContentWrapper;
|
|
38
|
+
var StyledCardSection = _styledComponents["default"].div.withConfig({
|
|
39
|
+
displayName: "CardStyle__StyledCardSection",
|
|
40
|
+
componentId: "sc-tpku8j-5"
|
|
41
|
+
})(["padding:", " 20px;.section + .section{border-top:solid 1px ", ";}@media (max-width:", "){padding:", " ", ";}"], _spacing.space16, _colors.Neutral.B85, Breakpoints.large, _spacing.space16, _spacing.space12);
|
|
42
|
+
exports.StyledCardSection = StyledCardSection;
|
|
43
|
+
var StyledCardActionWrapper = _styledComponents["default"].div.withConfig({
|
|
44
|
+
displayName: "CardStyle__StyledCardActionWrapper",
|
|
45
|
+
componentId: "sc-tpku8j-6"
|
|
46
|
+
})(["display:flex;padding:20px ", " ", ";flex-direction:column-reverse;align-items:flex-end;border-top:solid 1px ", ";&[data-align='left']{flex-direction:column;align-items:flex-start;}@media (max-width:", "){padding:10px ", " ", ";}"], _spacing.space24, _spacing.space24, _colors.Neutral.B85, Breakpoints.large, _spacing.space16, _spacing.space12);
|
|
47
|
+
exports.StyledCardActionWrapper = StyledCardActionWrapper;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
exports.__esModule = true;
|
|
5
|
+
exports.Section = void 0;
|
|
6
|
+
var _react = _interopRequireDefault(require("react"));
|
|
7
|
+
var _Typography = require("../Typography");
|
|
8
|
+
var _CardStyle = require("./CardStyle");
|
|
9
|
+
var Section = function Section(_ref) {
|
|
10
|
+
var children = _ref.children;
|
|
11
|
+
return /*#__PURE__*/_react["default"].createElement(_CardStyle.StyledCardSection, {
|
|
12
|
+
className: "section"
|
|
13
|
+
}, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
|
|
14
|
+
as: "div",
|
|
15
|
+
variant: "body1"
|
|
16
|
+
}, children));
|
|
17
|
+
};
|
|
18
|
+
exports.Section = Section;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Card';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
exports.__esModule = true;
|
|
4
|
+
var _Card = require("./Card");
|
|
5
|
+
Object.keys(_Card).forEach(function (key) {
|
|
6
|
+
if (key === "default" || key === "__esModule") return;
|
|
7
|
+
if (key in exports && exports[key] === _Card[key]) return;
|
|
8
|
+
exports[key] = _Card[key];
|
|
9
|
+
});
|
|
@@ -22,7 +22,6 @@ var EmptyState = function EmptyState(_ref) {
|
|
|
22
22
|
if (imageName && !isValidImageName) {
|
|
23
23
|
console.warn("imageName \"" + imageName + "\" is not a valid Image Name.");
|
|
24
24
|
}
|
|
25
|
-
console.log('ImageName: ', imageName);
|
|
26
25
|
return /*#__PURE__*/_react["default"].createElement(_EmptyStateStyle.EmptyStateContainer, null, imageName && /*#__PURE__*/_react["default"].createElement(_EmptyStateStyle.StyledImage, {
|
|
27
26
|
src: _assets.imageMapping[imageName]
|
|
28
27
|
}), /*#__PURE__*/_react["default"].createElement(_EmptyStateStyle.EmptyStateContentContainer, {
|
|
@@ -1,17 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
|
-
label: string;
|
|
4
|
-
action: (...args: any[]) => void;
|
|
5
|
-
};
|
|
2
|
+
import { ComponentAction } from '../../types/componentAction';
|
|
6
3
|
export declare type ModalProps = {
|
|
7
4
|
isOpen?: boolean;
|
|
8
5
|
header?: string;
|
|
9
6
|
headerDescription?: string;
|
|
10
7
|
children?: React.ReactNode;
|
|
11
8
|
/** This action will be tied to primary button on footer */
|
|
12
|
-
primaryAction?:
|
|
9
|
+
primaryAction?: ComponentAction;
|
|
13
10
|
/** This action will be tied to basic button on footer */
|
|
14
|
-
secondaryAction?:
|
|
11
|
+
secondaryAction?: ComponentAction;
|
|
15
12
|
/** Defining custom actions will not show primary and secondary actions */
|
|
16
13
|
customActions?: React.ReactNode;
|
|
17
14
|
showBackButton?: boolean;
|
package/lib/@next/index.d.ts
CHANGED
|
@@ -10,6 +10,7 @@ export { Badge, BadgeProps } from './Badge';
|
|
|
10
10
|
export { Banner, BannerProps } from './Banner';
|
|
11
11
|
export { Button, ButtonProps, DestructiveButton, OutlineButton, OutlineMonochromeButton, PrimaryButton, } from './Button';
|
|
12
12
|
export { ButtonGroup, ButtonGroupProps } from './ButtonGroup';
|
|
13
|
+
export { Card, CardProps } from './Card';
|
|
13
14
|
export { Checkbox, CheckboxProps } from './Checkbox';
|
|
14
15
|
export { CurrencyInput, CurrencyInputProps } from './CurrencyInput';
|
|
15
16
|
export { Divider } from './Divider';
|
package/lib/@next/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
exports.__esModule = true;
|
|
4
|
-
exports.useModal = exports.useIndexResourceState = exports.useAlert = exports.TypographyProps = exports.Typography = exports.TooltipProps = exports.TooltipPosition = exports.Tooltip = exports.TextInputProps = exports.TextInput = exports.TagProps = exports.Tag = exports.TabsProps = exports.Tabs = exports.TabProps = exports.TabModel = exports.Tab = exports.SpinnerProps = exports.Spinner = exports.Spacing = exports.SimplePagination = exports.RadioButtonProps = exports.RadioButton = exports.PrimaryButton = exports.PopoverProps = exports.Popover = exports.PaginationProps = exports.Pagination = exports.OutlineMonochromeButton = exports.OutlineButton = exports.NumberInputProps = exports.NumberInput = exports.ModalProvider = exports.ModalProps = exports.ModalContext = exports.Modal = exports.IndexTableProps = exports.IndexTable = exports.IconProps = exports.Icon = exports.Fonts = exports.EmptyState = exports.DropShadow = exports.Divider = exports.DestructiveButton = exports.CurrencyInputProps = exports.CurrencyInput = exports.Colors = exports.CheckboxProps = exports.Checkbox = exports.ButtonProps = exports.ButtonGroupProps = exports.ButtonGroup = exports.Button = exports.Breakpoints = exports.BorderRadius = exports.BannerProps = exports.Banner = exports.BadgeProps = exports.Badge = exports.AvatarProps = exports.Avatar = exports.AlertWithProvider = exports.AlertProvider = exports.AlertProps = exports.AlertContextProps = exports.AlertContext = exports.Alert = void 0;
|
|
4
|
+
exports.useModal = exports.useIndexResourceState = exports.useAlert = exports.TypographyProps = exports.Typography = exports.TooltipProps = exports.TooltipPosition = exports.Tooltip = exports.TextInputProps = exports.TextInput = exports.TagProps = exports.Tag = exports.TabsProps = exports.Tabs = exports.TabProps = exports.TabModel = exports.Tab = exports.SpinnerProps = exports.Spinner = exports.Spacing = exports.SimplePagination = exports.RadioButtonProps = exports.RadioButton = exports.PrimaryButton = exports.PopoverProps = exports.Popover = exports.PaginationProps = exports.Pagination = exports.OutlineMonochromeButton = exports.OutlineButton = exports.NumberInputProps = exports.NumberInput = exports.ModalProvider = exports.ModalProps = exports.ModalContext = exports.Modal = exports.IndexTableProps = exports.IndexTable = exports.IconProps = exports.Icon = exports.Fonts = exports.EmptyState = exports.DropShadow = exports.Divider = exports.DestructiveButton = exports.CurrencyInputProps = exports.CurrencyInput = exports.Colors = exports.CheckboxProps = exports.Checkbox = exports.CardProps = exports.Card = exports.ButtonProps = exports.ButtonGroupProps = exports.ButtonGroup = exports.Button = exports.Breakpoints = exports.BorderRadius = exports.BannerProps = exports.Banner = exports.BadgeProps = exports.Badge = exports.AvatarProps = exports.Avatar = exports.AlertWithProvider = exports.AlertProvider = exports.AlertProps = exports.AlertContextProps = exports.AlertContext = exports.Alert = void 0;
|
|
5
5
|
var BorderRadius = _interopRequireWildcard(require("./utilities/borderRadius"));
|
|
6
6
|
exports.BorderRadius = BorderRadius;
|
|
7
7
|
var Breakpoints = _interopRequireWildcard(require("./utilities/breakpoints"));
|
|
@@ -41,6 +41,9 @@ exports.PrimaryButton = _Button.PrimaryButton;
|
|
|
41
41
|
var _ButtonGroup = require("./ButtonGroup");
|
|
42
42
|
exports.ButtonGroup = _ButtonGroup.ButtonGroup;
|
|
43
43
|
exports.ButtonGroupProps = _ButtonGroup.ButtonGroupProps;
|
|
44
|
+
var _Card = require("./Card");
|
|
45
|
+
exports.Card = _Card.Card;
|
|
46
|
+
exports.CardProps = _Card.CardProps;
|
|
44
47
|
var _Checkbox = require("./Checkbox");
|
|
45
48
|
exports.Checkbox = _Checkbox.Checkbox;
|
|
46
49
|
exports.CheckboxProps = _Checkbox.CheckboxProps;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|