@pingux/astro 2.33.0-alpha.7 → 2.33.0-alpha.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.
Files changed (9) hide show
  1. package/lib/cjs/components/ButtonBar/ButtonBar.stories.js +61 -5
  2. package/lib/cjs/components/Tabs/Tabs.stories.js +2 -2
  3. package/lib/cjs/components/Tabs/Tabs.style.js +0 -1
  4. package/lib/cjs/utils/designUtils/figmaLinks.js +4 -2
  5. package/lib/components/ButtonBar/ButtonBar.stories.js +57 -3
  6. package/lib/components/Tabs/Tabs.stories.js +3 -3
  7. package/lib/components/Tabs/Tabs.style.js +0 -1
  8. package/lib/utils/designUtils/figmaLinks.js +4 -2
  9. package/package.json +1 -1
package/lib/cjs/components/ButtonBar/ButtonBar.stories.js CHANGED
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequ
5
5
  _Object$defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports["default"] = exports.RightAligned = exports.Default = void 0;
8
+ exports["default"] = exports.SecondaryRightAligned = exports.Secondary = exports.RightAligned = exports.Default = void 0;
9
9
  var _react = _interopRequireDefault(require("react"));
10
10
  var _storybookDocsLayout = _interopRequireDefault(require("../../../.storybook/storybookDocsLayout"));
11
11
  var _index = require("../../index");
@@ -60,12 +60,39 @@ var RightAligned = function RightAligned() {
60
60
  return (0, _react2.jsx)(_index.ButtonBar, {
61
61
  align: "right"
62
62
  }, (0, _react2.jsx)(_index.Button, {
63
+ variant: "link",
64
+ "data-id": "cancel-button",
65
+ onPress: function onPress() {
66
+ return alert('Cancel button pressed');
67
+ }
68
+ }, "Cancel"), (0, _react2.jsx)(_index.Button, {
63
69
  variant: "primary",
64
70
  "data-id": "next-button",
65
71
  onPress: function onPress() {
66
72
  return alert('Next button pressed');
67
73
  }
68
- }, "Next"), (0, _react2.jsx)(_index.Button, {
74
+ }, "Next"));
75
+ };
76
+ exports.RightAligned = RightAligned;
77
+ RightAligned.parameters = {
78
+ design: {
79
+ type: 'figma',
80
+ url: _figmaLinks.FIGMA_LINKS.buttonBar.rightAligned
81
+ }
82
+ };
83
+ var Secondary = function Secondary() {
84
+ return (0, _react2.jsx)(_index.ButtonBar, null, (0, _react2.jsx)(_index.Button, {
85
+ variant: "primary",
86
+ "data-id": "save-button",
87
+ onPress: function onPress() {
88
+ return alert('Save button pressed');
89
+ }
90
+ }, "Save"), (0, _react2.jsx)(_index.Button, {
91
+ "data-id": "close-button",
92
+ onPress: function onPress() {
93
+ return alert('Close button pressed');
94
+ }
95
+ }, "Close"), (0, _react2.jsx)(_index.Button, {
69
96
  variant: "link",
70
97
  "data-id": "cancel-button",
71
98
  onPress: function onPress() {
@@ -73,10 +100,39 @@ var RightAligned = function RightAligned() {
73
100
  }
74
101
  }, "Cancel"));
75
102
  };
76
- exports.RightAligned = RightAligned;
77
- RightAligned.parameters = {
103
+ exports.Secondary = Secondary;
104
+ Secondary.parameters = {
78
105
  design: {
79
106
  type: 'figma',
80
- url: _figmaLinks.FIGMA_LINKS.buttonBar.rightAligned
107
+ url: _figmaLinks.FIGMA_LINKS.buttonBar.secondary
108
+ }
109
+ };
110
+ var SecondaryRightAligned = function SecondaryRightAligned() {
111
+ return (0, _react2.jsx)(_index.ButtonBar, {
112
+ align: "right"
113
+ }, (0, _react2.jsx)(_index.Button, {
114
+ variant: "link",
115
+ "data-id": "cancel-button",
116
+ onPress: function onPress() {
117
+ return alert('Cancel button pressed');
118
+ }
119
+ }, "Cancel"), (0, _react2.jsx)(_index.Button, {
120
+ "data-id": "close-button",
121
+ onPress: function onPress() {
122
+ return alert('Close button pressed');
123
+ }
124
+ }, "Close"), (0, _react2.jsx)(_index.Button, {
125
+ variant: "primary",
126
+ "data-id": "next-button",
127
+ onPress: function onPress() {
128
+ return alert('Next button pressed');
129
+ }
130
+ }, "Next"));
131
+ };
132
+ exports.SecondaryRightAligned = SecondaryRightAligned;
133
+ SecondaryRightAligned.parameters = {
134
+ design: {
135
+ type: 'figma',
136
+ url: _figmaLinks.FIGMA_LINKS.buttonBar.secondaryRightAligned
81
137
  }
82
138
  };
package/lib/cjs/components/Tabs/Tabs.stories.js CHANGED
@@ -196,11 +196,11 @@ var ContentSlots = function ContentSlots() {
196
196
  marginLeft: 6,
197
197
  marginTop: 10
198
198
  };
199
- var afterTabNode = (0, _react2.jsx)(_index.Badge, {
199
+ var afterTabNode = (0, _react2.jsx)(_index.Box, null, (0, _react2.jsx)(_index.Badge, {
200
200
  variant: "countNeutral",
201
201
  sx: nodeSx,
202
202
  label: "14"
203
- });
203
+ }));
204
204
  return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_index.Tabs, {
205
205
  items: tabs,
206
206
  mb: 50
package/lib/cjs/components/Tabs/Tabs.style.js CHANGED
@@ -24,7 +24,6 @@ var tab = {
24
24
  display: 'inline-flex',
25
25
  outline: 'none',
26
26
  transform: 'translateY(1px)',
27
- width: '100%',
28
27
  '&.is-focused': {
29
28
  '& > span': _objectSpread({}, _Buttons.focusWithCroppedOutline)
30
29
  },
package/lib/cjs/utils/designUtils/figmaLinks.js CHANGED
@@ -36,8 +36,10 @@ var FIGMA_LINKS = {
36
36
  "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=0-1&t=8Wwd3tIBh3GEjCJB-0'
37
37
  },
38
38
  buttonBar: {
39
- "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=3660%3A20551&mode=dev',
40
- rightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=3660%3A20657&mode=dev'
39
+ "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A753&mode=dev',
40
+ rightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A770&mode=dev',
41
+ secondary: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A778&mode=dev',
42
+ secondaryRightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A788&mode=dev'
41
43
  },
42
44
  calendar: {
43
45
  "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=6373%3A25490&t=BoHXzVpQq9Lf7MaU-1'
package/lib/components/ButtonBar/ButtonBar.stories.js CHANGED
@@ -50,12 +50,38 @@ export var RightAligned = function RightAligned() {
50
50
  return ___EmotionJSX(ButtonBar, {
51
51
  align: "right"
52
52
  }, ___EmotionJSX(Button, {
53
+ variant: "link",
54
+ "data-id": "cancel-button",
55
+ onPress: function onPress() {
56
+ return alert('Cancel button pressed');
57
+ }
58
+ }, "Cancel"), ___EmotionJSX(Button, {
53
59
  variant: "primary",
54
60
  "data-id": "next-button",
55
61
  onPress: function onPress() {
56
62
  return alert('Next button pressed');
57
63
  }
58
- }, "Next"), ___EmotionJSX(Button, {
64
+ }, "Next"));
65
+ };
66
+ RightAligned.parameters = {
67
+ design: {
68
+ type: 'figma',
69
+ url: FIGMA_LINKS.buttonBar.rightAligned
70
+ }
71
+ };
72
+ export var Secondary = function Secondary() {
73
+ return ___EmotionJSX(ButtonBar, null, ___EmotionJSX(Button, {
74
+ variant: "primary",
75
+ "data-id": "save-button",
76
+ onPress: function onPress() {
77
+ return alert('Save button pressed');
78
+ }
79
+ }, "Save"), ___EmotionJSX(Button, {
80
+ "data-id": "close-button",
81
+ onPress: function onPress() {
82
+ return alert('Close button pressed');
83
+ }
84
+ }, "Close"), ___EmotionJSX(Button, {
59
85
  variant: "link",
60
86
  "data-id": "cancel-button",
61
87
  onPress: function onPress() {
@@ -63,9 +89,37 @@ export var RightAligned = function RightAligned() {
63
89
  }
64
90
  }, "Cancel"));
65
91
  };
66
- RightAligned.parameters = {
92
+ Secondary.parameters = {
67
93
  design: {
68
94
  type: 'figma',
69
- url: FIGMA_LINKS.buttonBar.rightAligned
95
+ url: FIGMA_LINKS.buttonBar.secondary
96
+ }
97
+ };
98
+ export var SecondaryRightAligned = function SecondaryRightAligned() {
99
+ return ___EmotionJSX(ButtonBar, {
100
+ align: "right"
101
+ }, ___EmotionJSX(Button, {
102
+ variant: "link",
103
+ "data-id": "cancel-button",
104
+ onPress: function onPress() {
105
+ return alert('Cancel button pressed');
106
+ }
107
+ }, "Cancel"), ___EmotionJSX(Button, {
108
+ "data-id": "close-button",
109
+ onPress: function onPress() {
110
+ return alert('Close button pressed');
111
+ }
112
+ }, "Close"), ___EmotionJSX(Button, {
113
+ variant: "primary",
114
+ "data-id": "next-button",
115
+ onPress: function onPress() {
116
+ return alert('Next button pressed');
117
+ }
118
+ }, "Next"));
119
+ };
120
+ SecondaryRightAligned.parameters = {
121
+ design: {
122
+ type: 'figma',
123
+ url: FIGMA_LINKS.buttonBar.secondaryRightAligned
70
124
  }
71
125
  };
package/lib/components/Tabs/Tabs.stories.js CHANGED
@@ -4,7 +4,7 @@ import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/insta
4
4
  import React, { useState } from 'react';
5
5
  import LockIcon from '@pingux/mdi-react/LockIcon';
6
6
  import DocsLayout from '../../../.storybook/storybookDocsLayout';
7
- import { Badge, Icon, Tab, Tabs, Text } from '../../index';
7
+ import { Badge, Box, Icon, Tab, Tabs, Text } from '../../index';
8
8
  import TabsReadme from './Tabs.mdx';
9
9
  import { jsx as ___EmotionJSX } from "@emotion/react";
10
10
  export default {
@@ -174,11 +174,11 @@ export var ContentSlots = function ContentSlots() {
174
174
  marginLeft: 6,
175
175
  marginTop: 10
176
176
  };
177
- var afterTabNode = ___EmotionJSX(Badge, {
177
+ var afterTabNode = ___EmotionJSX(Box, null, ___EmotionJSX(Badge, {
178
178
  variant: "countNeutral",
179
179
  sx: nodeSx,
180
180
  label: "14"
181
- });
181
+ }));
182
182
  return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(Tabs, {
183
183
  items: tabs,
184
184
  mb: 50
package/lib/components/Tabs/Tabs.style.js CHANGED
@@ -17,7 +17,6 @@ export var tab = {
17
17
  display: 'inline-flex',
18
18
  outline: 'none',
19
19
  transform: 'translateY(1px)',
20
- width: '100%',
21
20
  '&.is-focused': {
22
21
  '& > span': _objectSpread({}, focusWithCroppedOutline)
23
22
  },
package/lib/utils/designUtils/figmaLinks.js CHANGED
@@ -29,8 +29,10 @@ export var FIGMA_LINKS = {
29
29
  "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=0-1&t=8Wwd3tIBh3GEjCJB-0'
30
30
  },
31
31
  buttonBar: {
32
- "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=3660%3A20551&mode=dev',
33
- rightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=3660%3A20657&mode=dev'
32
+ "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A753&mode=dev',
33
+ rightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A770&mode=dev',
34
+ secondary: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A778&mode=dev',
35
+ secondaryRightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A788&mode=dev'
34
36
  },
35
37
  calendar: {
36
38
  "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=6373%3A25490&t=BoHXzVpQq9Lf7MaU-1'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pingux/astro",
3
- "version": "2.33.0-alpha.7",
3
+ "version": "2.33.0-alpha.9",
4
4
  "description": "React component library for Ping Identity's design system",
5
5
  "repository": {
6
6
  "type": "git",