@pingux/astro 1.13.0-alpha.6 → 1.13.0-alpha.7

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 (3) hide show
  1. package/lib/cjs/recipes/AttributeMappingReadOnlyField.stories.js +165 -0
  2. package/lib/recipes/AttributeMappingReadOnlyField.stories.js +145 -0
  3. package/package.json +1 -1
package/lib/cjs/recipes/AttributeMappingReadOnlyField.stories.js ADDED
@@ -0,0 +1,165 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
+
5
+ var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
6
+
7
+ _Object$defineProperty(exports, "__esModule", {
8
+ value: true
9
+ });
10
+
11
+ exports["default"] = exports.Default = void 0;
12
+
13
+ var _react = _interopRequireDefault(require("react"));
14
+
15
+ var _CreateIcon = _interopRequireDefault(require("mdi-react/CreateIcon"));
16
+
17
+ var _index = require("../index");
18
+
19
+ var _react2 = require("@emotion/react");
20
+
21
+ var _default = {
22
+ title: 'Recipes/AttributeMappingReadOnlyField'
23
+ };
24
+ exports["default"] = _default;
25
+
26
+ var Default = function Default() {
27
+ var Row = function Row(props) {
28
+ var withChip = props.withChip,
29
+ withTooltip = props.withTooltip,
30
+ leftValue = props.leftValue,
31
+ rightValue = props.rightValue;
32
+ return (0, _react2.jsx)(_index.Box, {
33
+ isRow: true,
34
+ alignItems: "center",
35
+ mt: "10px"
36
+ }, (0, _react2.jsx)(_index.TextField, {
37
+ isReadOnly: true,
38
+ value: leftValue,
39
+ labelProps: {
40
+ mb: 0
41
+ },
42
+ controlProps: {
43
+ variant: 'input.small',
44
+ 'aria-label': "input ".concat(leftValue),
45
+ sx: {
46
+ width: '165px'
47
+ }
48
+ }
49
+ }), (0, _react2.jsx)(_index.Separator, {
50
+ sx: {
51
+ width: '21px',
52
+ ml: '2px',
53
+ mr: '2px'
54
+ }
55
+ }), (0, _react2.jsx)(_index.TextField, {
56
+ isReadOnly: true,
57
+ value: rightValue,
58
+ labelProps: {
59
+ mb: 0
60
+ },
61
+ controlProps: {
62
+ variant: 'input.small',
63
+ 'aria-label': "input ".concat(rightValue),
64
+ sx: {
65
+ width: '165px'
66
+ }
67
+ }
68
+ }), withChip && (0, _react2.jsx)(_index.Chip, {
69
+ label: "Required",
70
+ sx: {
71
+ width: '65px',
72
+ height: '22px',
73
+ alignSelf: 'center',
74
+ minWidth: 'fit-content',
75
+ border: '1px solid',
76
+ borderColor: 'neutral.80',
77
+ backgroundColor: 'white !important',
78
+ ml: 8,
79
+ '& span': {
80
+ fontSize: 'sm',
81
+ lineHeight: 1,
82
+ color: '#253746'
83
+ }
84
+ }
85
+ }), withTooltip && (0, _react2.jsx)(_index.Box, {
86
+ ml: "5px",
87
+ height: "15px",
88
+ width: "15px"
89
+ }, (0, _react2.jsx)(_index.HelpHint, {
90
+ tooltipProps: {
91
+ direction: 'bottom'
92
+ }
93
+ }, "Population set to default")));
94
+ };
95
+
96
+ return (0, _react2.jsx)(_index.Box, null, (0, _react2.jsx)(_index.Box, {
97
+ isRow: true,
98
+ alignItems: "center",
99
+ mb: "15px"
100
+ }, (0, _react2.jsx)(_index.Text, {
101
+ sx: {
102
+ fontSize: 'lg',
103
+ lineHeight: '21px',
104
+ fontWeight: 3,
105
+ color: 'text.primary'
106
+ }
107
+ }, "Attribute Mapping"), (0, _react2.jsx)(_index.Box, null, (0, _react2.jsx)(_index.IconButton, {
108
+ ml: "5px",
109
+ variant: "inverted",
110
+ "aria-label": "edit header button"
111
+ }, (0, _react2.jsx)(_index.Icon, {
112
+ icon: _CreateIcon["default"],
113
+ size: 18
114
+ })))), (0, _react2.jsx)(_index.Box, {
115
+ backgroundColor: "accent.99",
116
+ width: "450px",
117
+ padding: "10px 10px 25px 10px"
118
+ }, (0, _react2.jsx)(_index.Box, {
119
+ isRow: true,
120
+ sx: {
121
+ width: '100%'
122
+ }
123
+ }, (0, _react2.jsx)(_index.Box, {
124
+ sx: {
125
+ width: 'calc(50% - 22px)'
126
+ }
127
+ }, (0, _react2.jsx)(_index.Text, {
128
+ sx: {
129
+ fontWeight: 3,
130
+ fontSize: 'md',
131
+ lineHeight: '18px',
132
+ mb: '5px'
133
+ }
134
+ }, "PingOne")), (0, _react2.jsx)(_index.Box, {
135
+ sx: {
136
+ width: 'calc(50% - 22px)'
137
+ }
138
+ }, (0, _react2.jsx)(_index.Text, {
139
+ sx: {
140
+ fontWeight: 3,
141
+ fontSize: 'md',
142
+ lineHeight: '18px',
143
+ mb: '5px'
144
+ }
145
+ }, "Google Suites"))), (0, _react2.jsx)(_index.Separator, null), (0, _react2.jsx)(Row, {
146
+ withChip: true,
147
+ leftValue: "UserId",
148
+ rightValue: "mdorey"
149
+ }), (0, _react2.jsx)(Row, {
150
+ leftValue: "givenName",
151
+ rightValue: "firstName"
152
+ }), (0, _react2.jsx)(Row, {
153
+ leftValue: "familyName",
154
+ rightValue: "lastName"
155
+ }), (0, _react2.jsx)(Row, {
156
+ withTooltip: true,
157
+ leftValue: "population",
158
+ rightValue: "population"
159
+ }), (0, _react2.jsx)(Row, {
160
+ leftValue: "password",
161
+ rightValue: "password"
162
+ })));
163
+ };
164
+
165
+ exports.Default = Default;
package/lib/recipes/AttributeMappingReadOnlyField.stories.js ADDED
@@ -0,0 +1,145 @@
1
+ import React from 'react';
2
+ import CreateIcon from 'mdi-react/CreateIcon';
3
+ import { Box, Chip, IconButton, Text, Icon, Separator, TextField, HelpHint } from '../index';
4
+ import { jsx as ___EmotionJSX } from "@emotion/react";
5
+ export default {
6
+ title: 'Recipes/AttributeMappingReadOnlyField'
7
+ };
8
+ export var Default = function Default() {
9
+ var Row = function Row(props) {
10
+ var withChip = props.withChip,
11
+ withTooltip = props.withTooltip,
12
+ leftValue = props.leftValue,
13
+ rightValue = props.rightValue;
14
+ return ___EmotionJSX(Box, {
15
+ isRow: true,
16
+ alignItems: "center",
17
+ mt: "10px"
18
+ }, ___EmotionJSX(TextField, {
19
+ isReadOnly: true,
20
+ value: leftValue,
21
+ labelProps: {
22
+ mb: 0
23
+ },
24
+ controlProps: {
25
+ variant: 'input.small',
26
+ 'aria-label': "input ".concat(leftValue),
27
+ sx: {
28
+ width: '165px'
29
+ }
30
+ }
31
+ }), ___EmotionJSX(Separator, {
32
+ sx: {
33
+ width: '21px',
34
+ ml: '2px',
35
+ mr: '2px'
36
+ }
37
+ }), ___EmotionJSX(TextField, {
38
+ isReadOnly: true,
39
+ value: rightValue,
40
+ labelProps: {
41
+ mb: 0
42
+ },
43
+ controlProps: {
44
+ variant: 'input.small',
45
+ 'aria-label': "input ".concat(rightValue),
46
+ sx: {
47
+ width: '165px'
48
+ }
49
+ }
50
+ }), withChip && ___EmotionJSX(Chip, {
51
+ label: "Required",
52
+ sx: {
53
+ width: '65px',
54
+ height: '22px',
55
+ alignSelf: 'center',
56
+ minWidth: 'fit-content',
57
+ border: '1px solid',
58
+ borderColor: 'neutral.80',
59
+ backgroundColor: 'white !important',
60
+ ml: 8,
61
+ '& span': {
62
+ fontSize: 'sm',
63
+ lineHeight: 1,
64
+ color: '#253746'
65
+ }
66
+ }
67
+ }), withTooltip && ___EmotionJSX(Box, {
68
+ ml: "5px",
69
+ height: "15px",
70
+ width: "15px"
71
+ }, ___EmotionJSX(HelpHint, {
72
+ tooltipProps: {
73
+ direction: 'bottom'
74
+ }
75
+ }, "Population set to default")));
76
+ };
77
+
78
+ return ___EmotionJSX(Box, null, ___EmotionJSX(Box, {
79
+ isRow: true,
80
+ alignItems: "center",
81
+ mb: "15px"
82
+ }, ___EmotionJSX(Text, {
83
+ sx: {
84
+ fontSize: 'lg',
85
+ lineHeight: '21px',
86
+ fontWeight: 3,
87
+ color: 'text.primary'
88
+ }
89
+ }, "Attribute Mapping"), ___EmotionJSX(Box, null, ___EmotionJSX(IconButton, {
90
+ ml: "5px",
91
+ variant: "inverted",
92
+ "aria-label": "edit header button"
93
+ }, ___EmotionJSX(Icon, {
94
+ icon: CreateIcon,
95
+ size: 18
96
+ })))), ___EmotionJSX(Box, {
97
+ backgroundColor: "accent.99",
98
+ width: "450px",
99
+ padding: "10px 10px 25px 10px"
100
+ }, ___EmotionJSX(Box, {
101
+ isRow: true,
102
+ sx: {
103
+ width: '100%'
104
+ }
105
+ }, ___EmotionJSX(Box, {
106
+ sx: {
107
+ width: 'calc(50% - 22px)'
108
+ }
109
+ }, ___EmotionJSX(Text, {
110
+ sx: {
111
+ fontWeight: 3,
112
+ fontSize: 'md',
113
+ lineHeight: '18px',
114
+ mb: '5px'
115
+ }
116
+ }, "PingOne")), ___EmotionJSX(Box, {
117
+ sx: {
118
+ width: 'calc(50% - 22px)'
119
+ }
120
+ }, ___EmotionJSX(Text, {
121
+ sx: {
122
+ fontWeight: 3,
123
+ fontSize: 'md',
124
+ lineHeight: '18px',
125
+ mb: '5px'
126
+ }
127
+ }, "Google Suites"))), ___EmotionJSX(Separator, null), ___EmotionJSX(Row, {
128
+ withChip: true,
129
+ leftValue: "UserId",
130
+ rightValue: "mdorey"
131
+ }), ___EmotionJSX(Row, {
132
+ leftValue: "givenName",
133
+ rightValue: "firstName"
134
+ }), ___EmotionJSX(Row, {
135
+ leftValue: "familyName",
136
+ rightValue: "lastName"
137
+ }), ___EmotionJSX(Row, {
138
+ withTooltip: true,
139
+ leftValue: "population",
140
+ rightValue: "population"
141
+ }), ___EmotionJSX(Row, {
142
+ leftValue: "password",
143
+ rightValue: "password"
144
+ })));
145
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pingux/astro",
3
- "version": "1.13.0-alpha.6",
3
+ "version": "1.13.0-alpha.7",
4
4
  "description": "PingUX themeable React component library",
5
5
  "author": "ux-development@pingidentity.com",
6
6
  "license": "Apache-2.0",