@carbon/ibm-cloud-cognitive-cdai
Version:
Carbon for Cloud & Cognitive CD&AI UI components
334 lines (332 loc) • 12.6 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.withOneSetToRender = exports.withNoTasksOrRenderFunc = exports.withCustomSetTabFunc = exports.withCustomSetSectionFunc = exports.withCollapsibleAbility = exports.withAllIdeCardTypes = exports.tasksValidImage = exports.tasksForEachIdeCardType = exports.secondaryGraphicCardSet = exports.recentTasksSetFunc = exports.gettingStartedSetFunc = exports.disabledCardSet = exports.customSecondTabNoRenderFunc = exports.customSecondTabFunc = exports.customSecondSectionFunc = exports.customInitialTabFunc = exports.customInitialSectionFunc = exports.customCardContentSetFunc = exports.coreConfigFunc = exports.cardWidthSetFunc = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _Artboard = _interopRequireDefault(require("./Artboard.svg"));
var _iconsReact = require("@carbon/icons-react");
var _react = _interopRequireDefault(require("react"));
var _IDHelper = require("../../../component_helpers/IDHelper");
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } //
// Copyright IBM Corp. 2020, 2020
//
// This source code is licensed under the Apache-2.0 license found in the
// LICENSE file in the root directory of this source tree.
//
var placeholderOnClick = function placeholderOnClick() {
return true;
};
var coreConfigFunc = exports.coreConfigFunc = function coreConfigFunc() {
var customProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
return _objectSpread({
headerOne: 'Welcome to IBM <Product Name Here>',
headerTwo: "Let's get you going..",
headerGraphic: {
imgSrc: _Artboard.default,
imgAlt: 'My image alt text',
imgClassName: 'ide--home-storybook-header'
}
}, customProps);
};
var gettingStartedSetFunc = exports.gettingStartedSetFunc = function gettingStartedSetFunc() {
var interactionFunction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : placeholderOnClick;
return {
id: 'getting_started',
setHeading: 'Getting Started',
tasks: [{
taskId: 'simulated',
cardSize: 'standard',
taskHeadingTitle: 'Create an instance of',
taskHeading: 'AppConnect',
taskHeadingDescription: 'Secure, control and accelerate delivery of APIs',
taskSubtext: 'Create a simulated topic here',
taskGraphic: _iconsReact.Add32,
onInteract: interactionFunction
}, {
taskId: 'topic_create',
cardSize: 'standard',
taskHeading: 'Create a topic',
taskSubtext: 'Create a topic here',
taskGraphic: _iconsReact.Add32,
onInteract: interactionFunction
}, {
taskId: 'schema',
cardSize: 'standard',
taskHeading: 'Create a schema',
taskSubtext: 'Create a schema here',
taskGraphic: _iconsReact.Add32,
onInteract: interactionFunction
}, {
taskId: 'sample_app',
cardSize: 'standard',
taskHeading: 'Create a sample application',
taskSubtext: 'Generate a sample app quickly and easily',
taskGraphic: _iconsReact.Application32,
onInteract: interactionFunction
}, {
// no size specified - should be defaulted to standard
taskId: 'basics',
taskHeading: 'Product Basics',
taskSubtext: 'Discover this offering',
taskGraphic: _iconsReact.Information32,
onInteract: interactionFunction
}]
};
};
var disabledCardSet = exports.disabledCardSet = function disabledCardSet() {
return {
id: 'custom_cards',
setHeading: 'Custom card example',
tasks: [{
taskId: 'custom_card_1',
cardSize: 'standard',
taskHeading: 'Create a topic',
taskGraphic: _iconsReact.Add32,
taskLinks: [{
text: 'Create instance',
href: '#'
}],
onInteract: function onInteract() {},
disabled: true,
tooltipText: "You don't have access to this content. Please contact admin for support. "
}]
};
};
var secondaryGraphicCardSet = exports.secondaryGraphicCardSet = function secondaryGraphicCardSet() {
return {
id: 'external_icon_type_cards',
setHeading: 'External icon type card example',
tasks: [{
taskId: 'external_icon_type_card_1',
cardSize: 'standard',
taskHeading: 'External icon type card',
taskGraphic: _iconsReact.Add32,
onInteract: placeholderOnClick,
secondaryGraphic: 'external'
}]
};
};
var recentTasksSetFunc = exports.recentTasksSetFunc = function recentTasksSetFunc() {
var interactionFunction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : placeholderOnClick;
return {
id: 'recent_tasks',
setHeading: 'Your recent tasks',
tasks: [{
taskId: 'recent_product_task',
cardSize: 'standard',
taskHeading: 'A recent user task tile',
taskSubtext: "Detect and provide a user's common activities",
onInteract: interactionFunction
}, {
taskId: 'withlinks',
cardSize: 'standard',
taskHeading: 'View all objects',
taskLinks: [{
text: '7 started',
href: '#started'
}, {
text: '6 stopped',
href: '#stopped'
}, {
text: '3 incomplete',
href: '#incomplete'
}],
taskGraphic: _iconsReact.Information32,
onInteract: interactionFunction
}]
};
};
var cardWidthSetFunc = exports.cardWidthSetFunc = function cardWidthSetFunc() {
var interactionFunction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : placeholderOnClick;
return {
id: 'my_set_id',
setHeading: 'Custom tasks',
tasks: [{
taskId: 'standard',
cardSize: 'standard',
taskHeading: 'Standard card',
taskSubtext: 'This is a standard card size',
taskGraphic: _iconsReact.Add32,
onInteract: interactionFunction
}, {
taskId: 'large',
cardSize: 'large',
taskHeading: 'Large card',
taskSubtext: 'This is a large card, which will be twice the width of a standard card',
taskGraphic: _iconsReact.Add32,
onInteract: interactionFunction
}, {
taskId: 'standard_2',
cardSize: 'standard',
taskHeading: 'Standard card',
taskSubtext: 'This is a standard card size',
taskGraphic: _iconsReact.Add32,
onInteract: interactionFunction
}]
};
};
var customCardContentSetFunc = exports.customCardContentSetFunc = function customCardContentSetFunc() {
var interactionFunction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : placeholderOnClick;
return {
id: 'custom_cards',
setHeading: 'Custom card example',
tasks: [{
taskId: 'custom_card_1',
cardSize: 'standard',
taskHeading: 'Create a topic',
renderFunc: function renderFunc() {
return /*#__PURE__*/_react.default.createElement("div", null, "My custom content. The content of this card is defined in my code using my own JSX!");
},
onInteract: interactionFunction
}]
};
};
var tasksValidImage = exports.tasksValidImage = function tasksValidImage() {
return {
id: 'custom_cards',
setHeading: 'Custom card example',
headerGraphic: /*#__PURE__*/_react.default.createElement("img", {
alt: ""
}),
tasks: [{
taskId: 'custom_card_1',
cardSize: 'standard',
taskHeading: 'Create a topic',
taskGraphic: _iconsReact.Add32,
taskLinks: [{
text: 'Create instance',
href: '#'
}],
onInteract: function onInteract() {}
}]
};
};
var customInitialTabFunc = exports.customInitialTabFunc = function customInitialTabFunc() {
return {
id: 'initial tab',
setHeading: 'Initial Tab',
renderFunc: function renderFunc() {
return /*#__PURE__*/_react.default.createElement("div", (0, _IDHelper.idAttribute)('tab1'), " Tab 1 Content");
}
};
};
var customSecondTabFunc = exports.customSecondTabFunc = function customSecondTabFunc() {
return {
id: 'second_tab',
setHeading: 'Second Tab',
renderFunc: function renderFunc() {
return /*#__PURE__*/_react.default.createElement("div", (0, _IDHelper.idAttribute)('tab2'), "Tab 2 Content");
}
};
};
var customInitialSectionFunc = exports.customInitialSectionFunc = function customInitialSectionFunc() {
return {
id: 'first_section',
setHeading: 'First Section',
renderFunc: function renderFunc() {
return /*#__PURE__*/_react.default.createElement("div", (0, _IDHelper.idAttribute)('section1'), " Section 1 Content");
}
};
};
var customSecondSectionFunc = exports.customSecondSectionFunc = function customSecondSectionFunc() {
return {
id: 'second_section',
setHeading: 'Second Section',
renderFunc: function renderFunc() {
return /*#__PURE__*/_react.default.createElement("div", (0, _IDHelper.idAttribute)('section2'), "Section 2 Content");
}
};
};
var customSecondTabNoRenderFunc = exports.customSecondTabNoRenderFunc = function customSecondTabNoRenderFunc() {
return {
id: 'second_tab',
setHeading: 'Second Tab'
};
};
var withCustomSetTabFunc = exports.withCustomSetTabFunc = function withCustomSetTabFunc() {
return {
sets: [customInitialTabFunc(), customSecondTabFunc()]
};
};
var withOneSetToRender = exports.withOneSetToRender = function withOneSetToRender() {
return {
sets: [customInitialTabFunc()]
};
};
var withNoTasksOrRenderFunc = exports.withNoTasksOrRenderFunc = function withNoTasksOrRenderFunc() {
return {
sets: [customInitialTabFunc(), customSecondTabNoRenderFunc()]
};
};
var withCustomSetSectionFunc = exports.withCustomSetSectionFunc = function withCustomSetSectionFunc() {
return {
sets: [customInitialSectionFunc(), customSecondSectionFunc()],
multipleSetType: 'section'
};
};
var tasksForEachIdeCardType = exports.tasksForEachIdeCardType = function tasksForEachIdeCardType() {
return {
id: 'idecard_types_example',
setHeading: 'Examples of how different task properties map to IDE Cards rendered',
tasks: [
// idecard type specified via `cardType`
{
taskId: 'ide_card',
taskHeading: 'IdeCard type (text) provided via `cardType`',
cardType: 'text',
// type specified
onInteract: function onInteract() {}
},
// custom card content
{
taskId: 'custom_card',
taskHeading: 'Custom Card',
renderFunc: function renderFunc() {
return /*#__PURE__*/_react.default.createElement("div", null, "Custom content IdeCard case, by providing `renderFunc`");
},
onInteract: function onInteract() {}
},
// link
{
taskId: 'link_card',
taskHeading: 'Ide Card link by providing `taskLinks`',
taskLinks: [{
text: 'Create instance',
href: '#'
}],
onInteract: function onInteract() {}
},
// external link
{
taskId: 'external_link_card',
cardHref: '#',
taskHeading: 'Ide Card external link by providing `cardHref` and `cardLinkType`',
cardLinkType: 'external',
onInteract: function onInteract() {}
},
// default/no metadata provided - text
{
taskId: 'no_type',
taskHeading: 'Default IdeCard type when none specified - defaults to text',
onInteract: function onInteract() {}
}]
};
};
var withAllIdeCardTypes = exports.withAllIdeCardTypes = function withAllIdeCardTypes() {
return {
sets: [tasksForEachIdeCardType()]
};
};
// Only used in tests, as the stories use knobs now
var withCollapsibleAbility = exports.withCollapsibleAbility = function withCollapsibleAbility() {
return {
id: 'second_tab',
setHeading: 'Second Tab',
headerCollapsible: true,
headerCollapsed: false,
headerHandleCollapseFunc: function headerHandleCollapseFunc() {}
};
};