@ansible/ansible-ui-framework 0.0.600 → 0.0.602

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/cjs/PageHeader.js CHANGED
@@ -1,4 +1,8 @@
1
1
  "use strict";
2
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
+ return cooked;
5
+ };
2
6
  var __assign = (this && this.__assign) || function () {
3
7
  __assign = Object.assign || function(t) {
4
8
  for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -10,6 +14,9 @@ var __assign = (this && this.__assign) || function () {
10
14
  };
11
15
  return __assign.apply(this, arguments);
12
16
  };
17
+ var __importDefault = (this && this.__importDefault) || function (mod) {
18
+ return (mod && mod.__esModule) ? mod : { "default": mod };
19
+ };
13
20
  Object.defineProperty(exports, "__esModule", { value: true });
14
21
  exports.PageHeader = void 0;
15
22
  var react_1 = require("react");
@@ -21,6 +28,8 @@ var useBreakPoint_1 = require("./components/useBreakPoint");
21
28
  var usePageNavigate_1 = require("./components/usePageNavigate");
22
29
  var PageAlerts_1 = require("./PageAlerts");
23
30
  require("./PageFramework.css");
31
+ var styled_components_1 = __importDefault(require("styled-components"));
32
+ var PageAlertsDiv = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-bottom: thin solid rgba(0, 0, 0, 0.12);\n"], ["\n border-bottom: thin solid rgba(0, 0, 0, 0.12);\n"])));
24
33
  function Breadcrumbs(props) {
25
34
  var navigate = (0, usePageNavigate_1.usePageNavigate)();
26
35
  if (!props.breadcrumbs)
@@ -76,10 +85,11 @@ function PageHeader(props) {
76
85
  } }, { children: (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedQuestionCircleIcon, {}) }))] })) }))) : ((0, jsx_runtime_1.jsx)(react_core_1.Title, __assign({ headingLevel: "h1" }, { children: title })))) : ((0, jsx_runtime_1.jsx)(react_core_1.Title, __assign({ headingLevel: "h1" }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Skeleton, { width: "160px" }) }))), isMdOrLarger && description && ((0, jsx_runtime_1.jsx)(react_core_1.Text, __assign({ component: "p", style: { paddingTop: xl ? 4 : 2, opacity: 0.8 } }, { children: typeof description === 'string' ? ((0, jsx_runtime_1.jsx)(react_core_1.Truncate, { content: description })) : ((0, jsx_runtime_1.jsx)(react_core_1.Stack, { children: description.map(function (d) { return ((0, jsx_runtime_1.jsx)(react_core_1.StackItem, { children: d }, d)); }) })) })))] })), title && (headerActions || controls) && ((0, jsx_runtime_1.jsxs)(react_core_1.Flex, __assign({ direction: { default: 'column' }, spaceItems: { default: 'spaceItemsSm', xl: 'spaceItemsMd' }, justifyContent: { default: 'justifyContentCenter' } }, { children: [controls && (0, jsx_runtime_1.jsx)(react_core_1.FlexItem, __assign({ grow: { default: 'grow' } }, { children: controls })), headerActions && (0, jsx_runtime_1.jsx)(react_core_1.FlexItem, { children: headerActions })] })))] })), footer] })) })), (0, jsx_runtime_1.jsx)(PageAlerts_1.PageAlertsContext.Consumer, { children: function (pageAlerts) { return ((0, jsx_runtime_1.jsx)(PageAlerts_1.PageAlertsArrayContext.Consumer, { children: function (pageAlertsArray) {
77
86
  if (pageAlertsArray.length === 0)
78
87
  return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
79
- return ((0, jsx_runtime_1.jsx)("div", __assign({ style: { borderBottom: 'thin solid rgba(0, 0, 0, 0.12)' } }, { children: pageAlertsArray.map(function (alertProps, index) {
88
+ return ((0, jsx_runtime_1.jsx)(PageAlertsDiv, { children: pageAlertsArray.map(function (alertProps, index) {
80
89
  var _a, _b;
81
90
  return ((0, react_1.createElement)(react_core_1.Alert, __assign({}, alertProps, { key: (_b = (_a = alertProps.key) !== null && _a !== void 0 ? _a : alertProps.id) !== null && _b !== void 0 ? _b : index, actionClose: (0, jsx_runtime_1.jsx)(react_core_1.AlertActionCloseButton, { onClose: function () { return pageAlerts.removeAlert(alertProps); } }), isInline: true, isExpandable: !!alertProps.children })));
82
- }) })));
91
+ }) }));
83
92
  } })); } })] }));
84
93
  }
85
94
  exports.PageHeader = PageHeader;
95
+ var templateObject_1;
@@ -1,4 +1,8 @@
1
1
  "use strict";
2
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
+ return cooked;
5
+ };
2
6
  var __assign = (this && this.__assign) || function () {
3
7
  __assign = Object.assign || function(t) {
4
8
  for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -37,6 +41,9 @@ var __read = (this && this.__read) || function (o, n) {
37
41
  }
38
42
  return ar;
39
43
  };
44
+ var __importDefault = (this && this.__importDefault) || function (mod) {
45
+ return (mod && mod.__esModule) ? mod : { "default": mod };
46
+ };
40
47
  Object.defineProperty(exports, "__esModule", { value: true });
41
48
  exports.PageTableToolbar = exports.toolbarActionsHaveBulkActions = void 0;
42
49
  var jsx_runtime_1 = require("react/jsx-runtime");
@@ -50,7 +57,10 @@ var PageActionType_1 = require("../PageActions/PageActionType");
50
57
  var FormGroupSelect_1 = require("../PageForm/Inputs/FormGroupSelect");
51
58
  var useFrameworkTranslations_1 = require("../useFrameworkTranslations");
52
59
  var PageTableViewType_1 = require("./PageTableViewType");
60
+ var styled_components_1 = __importDefault(require("styled-components"));
53
61
  require("./PageToolbar.css");
62
+ var ToolbarGroupsDiv = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n flex-grow: 1;\n"], ["\n flex-grow: 1;\n"])));
63
+ var SelectionSpan = styled_components_1.default.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n opacity: 0.7;\n"], ["\n opacity: 0.7;\n"])));
54
64
  function toolbarActionsHaveBulkActions(actions) {
55
65
  var e_1, _a;
56
66
  if (!actions)
@@ -155,7 +165,7 @@ function PageTableToolbar(props) {
155
165
  return newState;
156
166
  });
157
167
  }, showToolbarItem: false }, { children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {}) }), filter.label));
158
- })] })) }))), (0, jsx_runtime_1.jsx)(react_core_1.ToolbarGroup, __assign({ variant: "button-group", style: { zIndex: 302 } }, { children: (0, jsx_runtime_1.jsx)(PageActions_1.PageActions, { actions: toolbarActions, selectedItems: selectedItems, wrapper: react_core_1.ToolbarItem }) })), (0, jsx_runtime_1.jsx)("div", { style: { flexGrow: 1 } }), (0, jsx_runtime_1.jsxs)(react_core_1.ToolbarGroup, __assign({ variant: "button-group", style: { zIndex: 302 } }, { children: [!props.disableColumnManagement && openColumnModal && viewType === 'table' && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: (0, jsx_runtime_1.jsx)(react_core_1.Tooltip, __assign({ content: 'Manage columns' }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Button, { variant: "plain", icon: (0, jsx_runtime_1.jsx)(react_icons_1.ColumnsIcon, {}), onClick: openColumnModal }) })) })), viewTypeCount > 1 && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: (0, jsx_runtime_1.jsx)(react_core_1.ToggleGroup, __assign({ "aria-label": "table view toggle" }, { children: [
168
+ })] })) }))), (0, jsx_runtime_1.jsx)(react_core_1.ToolbarGroup, __assign({ variant: "button-group", style: { zIndex: 302 } }, { children: (0, jsx_runtime_1.jsx)(PageActions_1.PageActions, { actions: toolbarActions, selectedItems: selectedItems, wrapper: react_core_1.ToolbarItem }) })), (0, jsx_runtime_1.jsx)(ToolbarGroupsDiv, {}), (0, jsx_runtime_1.jsxs)(react_core_1.ToolbarGroup, __assign({ variant: "button-group", style: { zIndex: 302 } }, { children: [!props.disableColumnManagement && openColumnModal && viewType === 'table' && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: (0, jsx_runtime_1.jsx)(react_core_1.Tooltip, __assign({ content: 'Manage columns' }, { children: (0, jsx_runtime_1.jsx)(react_core_1.Button, { variant: "plain", icon: (0, jsx_runtime_1.jsx)(react_icons_1.ColumnsIcon, {}), onClick: openColumnModal }) })) })), viewTypeCount > 1 && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: (0, jsx_runtime_1.jsx)(react_core_1.ToggleGroup, __assign({ "aria-label": "table view toggle" }, { children: [
159
169
  !props.disableTableView && PageTableViewType_1.PageTableViewTypeE.Table,
160
170
  !props.disableListView && PageTableViewType_1.PageTableViewTypeE.List,
161
171
  !props.disableCardView && PageTableViewType_1.PageTableViewTypeE.Cards,
@@ -218,5 +228,6 @@ function ToolbarSelectFilter(props) {
218
228
  }
219
229
  }, [addFilter, removeFilter, values]);
220
230
  var selections = values;
221
- return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(react_core_1.Select, __assign({ variant: react_core_1.SelectVariant.checkbox, isOpen: open, onToggle: setOpen, selections: selections, onSelect: onSelect, placeholderText: values.length ? (translations.selectedText) : ((0, jsx_runtime_1.jsx)("span", __assign({ style: { opacity: 0.7 } }, { children: props.placeholder }))) }, { children: options.map(function (option) { return ((0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ id: option.value, value: option.value }, { children: option.label }), option.value)); }) })) }));
231
+ return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(react_core_1.Select, __assign({ variant: react_core_1.SelectVariant.checkbox, isOpen: open, onToggle: setOpen, selections: selections, onSelect: onSelect, placeholderText: values.length ? (translations.selectedText) : ((0, jsx_runtime_1.jsx)(SelectionSpan, { children: props.placeholder })) }, { children: options.map(function (option) { return ((0, jsx_runtime_1.jsx)(react_core_1.SelectOption, __assign({ id: option.value, value: option.value }, { children: option.label }), option.value)); }) })) }));
222
232
  }
233
+ var templateObject_1, templateObject_2;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ansible/ansible-ui-framework",
3
3
  "description": "A framework for building applications using PatternFly.",
4
- "version": "0.0.600",
4
+ "version": "0.0.602",
5
5
  "license": "Apache-2.0",
6
6
  "repository": {
7
7
  "type": "git",