@pingux/astro 1.26.1-alpha.4 → 1.26.1-alpha.5

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 (5) hide show
  1. package/lib/cjs/recipes/AttributesAndPingOneMapping.stories.js +37 -31
  2. package/lib/cjs/recipes/DatePicker.stories.js +10 -7
  3. package/lib/recipes/AttributesAndPingOneMapping.stories.js +37 -31
  4. package/lib/recipes/DatePicker.stories.js +10 -7
  5. package/package.json +1 -1
package/lib/cjs/recipes/AttributesAndPingOneMapping.stories.js CHANGED
@@ -56,6 +56,36 @@ var _default = {
56
56
  title: 'Recipes/AttributesP1Mappings'
57
57
  };
58
58
  exports["default"] = _default;
59
+ var sx = {
60
+ rowBox: {
61
+ mb: '24.95px'
62
+ },
63
+ textField: {
64
+ height: '40px !important'
65
+ },
66
+ comboBoxField: {
67
+ height: '40px !important',
68
+ pt: '5px !important'
69
+ },
70
+ headingText: {
71
+ fontSize: 'sm',
72
+ fontWeight: 400,
73
+ color: 'neutral.40'
74
+ },
75
+ firstRowTitle: {
76
+ fontWeight: 3,
77
+ fontSize: 'md',
78
+ maxWidth: '310px',
79
+ width: 'calc(50% - 26px)',
80
+ minWidth: '153px'
81
+ },
82
+ secondRowTitle: {
83
+ fontWeight: 3,
84
+ fontSize: 'md',
85
+ ml: '10px',
86
+ flexGrow: 1
87
+ }
88
+ };
59
89
  var Row = /*#__PURE__*/(0, _react.memo)(function (props) {
60
90
  var isDisabled = props.isDisabled,
61
91
  isNewRow = props.isNewRow,
@@ -93,9 +123,7 @@ var Row = /*#__PURE__*/(0, _react.memo)(function (props) {
93
123
  ref: rowRef
94
124
  }, (0, _react2.jsx)(_index.Box, {
95
125
  width: "310px",
96
- sx: !areRowsValid && isSubmitted && inputValue === '' && textValue !== '' ? {
97
- mb: '24.95px'
98
- } : {}
126
+ sx: !areRowsValid && isSubmitted && inputValue === '' && textValue !== '' ? sx.rowBox : {}
99
127
  }, (0, _react2.jsx)(_index.TextField, {
100
128
  name: "custom-name",
101
129
  "aria-label": "text field",
@@ -104,9 +132,7 @@ var Row = /*#__PURE__*/(0, _react.memo)(function (props) {
104
132
  mb: 0
105
133
  },
106
134
  controlProps: {
107
- sx: {
108
- height: '40px !important'
109
- }
135
+ sx: sx.textField
110
136
  },
111
137
  id: "textField ".concat(index),
112
138
  key: "textField ".concat(index),
@@ -123,9 +149,7 @@ var Row = /*#__PURE__*/(0, _react.memo)(function (props) {
123
149
  ml: "12px",
124
150
  isRow: true,
125
151
  width: "378px",
126
- sx: !areRowsValid && isSubmitted && textValue === '' && inputValue !== '' ? {
127
- mb: '24.95px'
128
- } : {}
152
+ sx: !areRowsValid && isSubmitted && textValue === '' && inputValue !== '' ? sx.rowBox : {}
129
153
  }, (0, _react2.jsx)(_index.Box, {
130
154
  flexGrow: "1",
131
155
  maxWidth: "310px"
@@ -143,10 +167,7 @@ var Row = /*#__PURE__*/(0, _react.memo)(function (props) {
143
167
  "aria-label": "selection field",
144
168
  controlProps: {
145
169
  'aria-label': 'selection field',
146
- sx: {
147
- height: '40px !important',
148
- pt: '5px !important'
149
- }
170
+ sx: sx.comboBoxField
150
171
  },
151
172
  containerProps: {
152
173
  'aria-label': 'selection field',
@@ -259,11 +280,7 @@ var Default = function Default() {
259
280
  mb: "md",
260
281
  ml: "xs"
261
282
  }, (0, _react2.jsx)(_index.Text, {
262
- sx: {
263
- fontSize: 'sm',
264
- fontWeight: 400,
265
- color: 'neutral.40'
266
- }
283
+ sx: sx.headingText
267
284
  }, "Create new attributes and map predefined attributes with their PingOne Mappings."), (0, _react2.jsx)(_index.Button, {
268
285
  variant: "inline",
269
286
  ml: "auto",
@@ -287,20 +304,9 @@ var Default = function Default() {
287
304
  }, (0, _react2.jsx)(_index.Box, {
288
305
  isRow: true
289
306
  }, (0, _react2.jsx)(_index.Text, {
290
- sx: {
291
- fontWeight: 3,
292
- fontSize: 'md',
293
- maxWidth: '310px',
294
- width: 'calc(50% - 26px)',
295
- minWidth: '153px'
296
- }
307
+ sx: sx.firstRowTitle
297
308
  }, "Attributes"), (0, _react2.jsx)(_index.Text, {
298
- sx: {
299
- fontWeight: 3,
300
- fontSize: 'md',
301
- ml: '10px',
302
- flexGrow: 1
303
- }
309
+ sx: sx.secondRowTitle
304
310
  }, "PingOne Mappings")), (0, _react2.jsx)(_index.Separator, null), (0, _react2.jsx)(_index.ScrollBox, {
305
311
  mt: "md",
306
312
  maxHeight: "700px"
package/lib/cjs/recipes/DatePicker.stories.js CHANGED
@@ -46,6 +46,15 @@ var _default = {
46
46
  title: 'Recipes/DatePicker'
47
47
  };
48
48
  exports["default"] = _default;
49
+ var sx = {
50
+ calendarIcon: {
51
+ position: 'absolute',
52
+ right: 5,
53
+ top: 8,
54
+ width: 28,
55
+ height: 28
56
+ }
57
+ };
49
58
 
50
59
  var Default = function Default() {
51
60
  var dateFormat = 'YYYY-MM-DD';
@@ -120,13 +129,7 @@ var Default = function Default() {
120
129
  slots: {
121
130
  inContainer: (0, _react2.jsx)(_index.IconButton, (0, _extends2["default"])({
122
131
  "aria-label": "calendar-button",
123
- sx: {
124
- position: 'absolute',
125
- right: 5,
126
- top: 8,
127
- width: 28,
128
- height: 28
129
- },
132
+ sx: sx.calendarIcon,
130
133
  onPress: handleCalendarIconPress,
131
134
  ref: triggerRef
132
135
  }, triggerProps), (0, _react2.jsx)(_index.Icon, {
package/lib/recipes/AttributesAndPingOneMapping.stories.js CHANGED
@@ -22,6 +22,36 @@ var items = [{
22
22
  export default {
23
23
  title: 'Recipes/AttributesP1Mappings'
24
24
  };
25
+ var sx = {
26
+ rowBox: {
27
+ mb: '24.95px'
28
+ },
29
+ textField: {
30
+ height: '40px !important'
31
+ },
32
+ comboBoxField: {
33
+ height: '40px !important',
34
+ pt: '5px !important'
35
+ },
36
+ headingText: {
37
+ fontSize: 'sm',
38
+ fontWeight: 400,
39
+ color: 'neutral.40'
40
+ },
41
+ firstRowTitle: {
42
+ fontWeight: 3,
43
+ fontSize: 'md',
44
+ maxWidth: '310px',
45
+ width: 'calc(50% - 26px)',
46
+ minWidth: '153px'
47
+ },
48
+ secondRowTitle: {
49
+ fontWeight: 3,
50
+ fontSize: 'md',
51
+ ml: '10px',
52
+ flexGrow: 1
53
+ }
54
+ };
25
55
  var Row = /*#__PURE__*/memo(function (props) {
26
56
  var isDisabled = props.isDisabled,
27
57
  isNewRow = props.isNewRow,
@@ -59,9 +89,7 @@ var Row = /*#__PURE__*/memo(function (props) {
59
89
  ref: rowRef
60
90
  }, ___EmotionJSX(Box, {
61
91
  width: "310px",
62
- sx: !areRowsValid && isSubmitted && inputValue === '' && textValue !== '' ? {
63
- mb: '24.95px'
64
- } : {}
92
+ sx: !areRowsValid && isSubmitted && inputValue === '' && textValue !== '' ? sx.rowBox : {}
65
93
  }, ___EmotionJSX(TextField, {
66
94
  name: "custom-name",
67
95
  "aria-label": "text field",
@@ -70,9 +98,7 @@ var Row = /*#__PURE__*/memo(function (props) {
70
98
  mb: 0
71
99
  },
72
100
  controlProps: {
73
- sx: {
74
- height: '40px !important'
75
- }
101
+ sx: sx.textField
76
102
  },
77
103
  id: "textField ".concat(index),
78
104
  key: "textField ".concat(index),
@@ -89,9 +115,7 @@ var Row = /*#__PURE__*/memo(function (props) {
89
115
  ml: "12px",
90
116
  isRow: true,
91
117
  width: "378px",
92
- sx: !areRowsValid && isSubmitted && textValue === '' && inputValue !== '' ? {
93
- mb: '24.95px'
94
- } : {}
118
+ sx: !areRowsValid && isSubmitted && textValue === '' && inputValue !== '' ? sx.rowBox : {}
95
119
  }, ___EmotionJSX(Box, {
96
120
  flexGrow: "1",
97
121
  maxWidth: "310px"
@@ -109,10 +133,7 @@ var Row = /*#__PURE__*/memo(function (props) {
109
133
  "aria-label": "selection field",
110
134
  controlProps: {
111
135
  'aria-label': 'selection field',
112
- sx: {
113
- height: '40px !important',
114
- pt: '5px !important'
115
- }
136
+ sx: sx.comboBoxField
116
137
  },
117
138
  containerProps: {
118
139
  'aria-label': 'selection field',
@@ -226,11 +247,7 @@ export var Default = function Default() {
226
247
  mb: "md",
227
248
  ml: "xs"
228
249
  }, ___EmotionJSX(Text, {
229
- sx: {
230
- fontSize: 'sm',
231
- fontWeight: 400,
232
- color: 'neutral.40'
233
- }
250
+ sx: sx.headingText
234
251
  }, "Create new attributes and map predefined attributes with their PingOne Mappings."), ___EmotionJSX(Button, {
235
252
  variant: "inline",
236
253
  ml: "auto",
@@ -254,20 +271,9 @@ export var Default = function Default() {
254
271
  }, ___EmotionJSX(Box, {
255
272
  isRow: true
256
273
  }, ___EmotionJSX(Text, {
257
- sx: {
258
- fontWeight: 3,
259
- fontSize: 'md',
260
- maxWidth: '310px',
261
- width: 'calc(50% - 26px)',
262
- minWidth: '153px'
263
- }
274
+ sx: sx.firstRowTitle
264
275
  }, "Attributes"), ___EmotionJSX(Text, {
265
- sx: {
266
- fontWeight: 3,
267
- fontSize: 'md',
268
- ml: '10px',
269
- flexGrow: 1
270
- }
276
+ sx: sx.secondRowTitle
271
277
  }, "PingOne Mappings")), ___EmotionJSX(Separator, null), ___EmotionJSX(ScrollBox, {
272
278
  mt: "md",
273
279
  maxHeight: "700px"
package/lib/recipes/DatePicker.stories.js CHANGED
@@ -12,6 +12,15 @@ import { jsx as ___EmotionJSX } from "@emotion/react";
12
12
  export default {
13
13
  title: 'Recipes/DatePicker'
14
14
  };
15
+ var sx = {
16
+ calendarIcon: {
17
+ position: 'absolute',
18
+ right: 5,
19
+ top: 8,
20
+ width: 28,
21
+ height: 28
22
+ }
23
+ };
15
24
  export var Default = function Default() {
16
25
  var dateFormat = 'YYYY-MM-DD';
17
26
 
@@ -83,13 +92,7 @@ export var Default = function Default() {
83
92
  slots: {
84
93
  inContainer: ___EmotionJSX(IconButton, _extends({
85
94
  "aria-label": "calendar-button",
86
- sx: {
87
- position: 'absolute',
88
- right: 5,
89
- top: 8,
90
- width: 28,
91
- height: 28
92
- },
95
+ sx: sx.calendarIcon,
93
96
  onPress: handleCalendarIconPress,
94
97
  ref: triggerRef
95
98
  }, triggerProps), ___EmotionJSX(Icon, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pingux/astro",
3
- "version": "1.26.1-alpha.4",
3
+ "version": "1.26.1-alpha.5",
4
4
  "description": "PingUX themeable React component library",
5
5
  "author": "ux-development@pingidentity.com",
6
6
  "license": "Apache-2.0",