playbook_ui 11.1.1 → 11.1.2.pre.alpha1
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.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_radio/_radio.tsx +86 -0
- data/dist/reset.css +60 -1
- data/lib/playbook/version.rb +2 -2
- metadata +5 -5
- data/app/pb_kits/playbook/pb_radio/_radio.jsx +0 -78
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 3bf77233d115312bcc2eae399928aeb2254a98e420d62d4937ef16451995b495
|
|
4
|
+
data.tar.gz: 2c6391bcbe1115869d6481d728f093299eb42b27c7a2f666a2fdfa5ae3d26ae1
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 152cdfaa993d767dfe08d6d36bcecd723de291c8cad79536a3b7edc8b01fcc800a58826b4734e187386fc0977625422df48aee407dc9e528270e013d2fb70124
|
|
7
|
+
data.tar.gz: 3972f304f43411d5a2948961f2797efdb58ea23e51a6eb3f089e9a345533fcd1bb7159ddbe14ad04c109878b53bde2dc0feb89b5fd7c5e8896f500bf53633716
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
/*eslint-disable react/no-multi-comp, flowtype/space-before-type-colon */
|
|
2
|
+
|
|
3
|
+
import React, { forwardRef } from 'react'
|
|
4
|
+
import Body from '../pb_body/_body'
|
|
5
|
+
import classnames from 'classnames'
|
|
6
|
+
import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
|
|
7
|
+
import { globalProps, GlobalProps } from '../utilities/globalProps'
|
|
8
|
+
|
|
9
|
+
type RadioProps = {
|
|
10
|
+
aria?: {[key: string]: string},
|
|
11
|
+
alignment?: string,
|
|
12
|
+
checked?: boolean,
|
|
13
|
+
children?: Node,
|
|
14
|
+
className?: string,
|
|
15
|
+
dark?: boolean,
|
|
16
|
+
data?: {[key: string]: string},
|
|
17
|
+
error?: boolean,
|
|
18
|
+
id?: string,
|
|
19
|
+
label: string,
|
|
20
|
+
name: string,
|
|
21
|
+
value: string,
|
|
22
|
+
text: string,
|
|
23
|
+
onChange: (event: React.FormEvent<HTMLInputElement> | null)=>void,
|
|
24
|
+
} & GlobalProps
|
|
25
|
+
|
|
26
|
+
const Radio = ({
|
|
27
|
+
aria = {},
|
|
28
|
+
alignment,
|
|
29
|
+
children,
|
|
30
|
+
className,
|
|
31
|
+
dark = false,
|
|
32
|
+
data = {},
|
|
33
|
+
error = false,
|
|
34
|
+
id,
|
|
35
|
+
label,
|
|
36
|
+
name = 'radio_name',
|
|
37
|
+
text = 'Radio Text',
|
|
38
|
+
value = 'radio_text',
|
|
39
|
+
onChange = () => { void 0 },
|
|
40
|
+
...props
|
|
41
|
+
}: RadioProps, ref: any) => {
|
|
42
|
+
const ariaProps = buildAriaProps(aria)
|
|
43
|
+
const dataProps = buildDataProps(data)
|
|
44
|
+
const classes = classnames(
|
|
45
|
+
buildCss('pb_radio_kit', alignment ),
|
|
46
|
+
dark ? 'dark': null, error ? 'error': null,
|
|
47
|
+
globalProps(props),
|
|
48
|
+
className)
|
|
49
|
+
|
|
50
|
+
const displayRadio = (props: RadioProps & any) => {
|
|
51
|
+
if (children)
|
|
52
|
+
return (children)
|
|
53
|
+
else
|
|
54
|
+
return (
|
|
55
|
+
<input
|
|
56
|
+
id={id}
|
|
57
|
+
name={name}
|
|
58
|
+
onChange={onChange}
|
|
59
|
+
ref={ref}
|
|
60
|
+
text={text}
|
|
61
|
+
type="radio"
|
|
62
|
+
value={value}
|
|
63
|
+
{...props}
|
|
64
|
+
/>
|
|
65
|
+
)}
|
|
66
|
+
|
|
67
|
+
return (
|
|
68
|
+
<label
|
|
69
|
+
{...ariaProps}
|
|
70
|
+
{...dataProps}
|
|
71
|
+
className={classes}
|
|
72
|
+
htmlFor={id}
|
|
73
|
+
>
|
|
74
|
+
<>{displayRadio(props)}</>
|
|
75
|
+
<span className="pb_radio_button" />
|
|
76
|
+
<Body
|
|
77
|
+
dark={dark}
|
|
78
|
+
status={error ? 'negative' : null}
|
|
79
|
+
text={label}
|
|
80
|
+
variant={null}
|
|
81
|
+
/>
|
|
82
|
+
</label>
|
|
83
|
+
)
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
export default forwardRef(Radio)
|
data/dist/reset.css
CHANGED
|
@@ -1,2 +1,61 @@
|
|
|
1
|
-
|
|
1
|
+
/* CLEAN UP AND REMOVE */
|
|
2
|
+
/* Headings */
|
|
3
|
+
/* Standard Font Weights */
|
|
4
|
+
/* Non_Standard Font Weights */
|
|
5
|
+
/*=====================================
|
|
6
|
+
Base colors should not be documented.
|
|
7
|
+
Only document color use.
|
|
8
|
+
|
|
9
|
+
Colors -----------------------------*/
|
|
10
|
+
/* Specialty Gradient -----------------*/
|
|
11
|
+
/* Interface colors -------------------*/
|
|
12
|
+
/* Main colors ------------------------*/
|
|
13
|
+
/*=====================================
|
|
14
|
+
|
|
15
|
+
Background colors ------------------*/
|
|
16
|
+
/* Card colors ------------------*/
|
|
17
|
+
/* Active colors ----------------------*/
|
|
18
|
+
/* Hover colors -----------------------*/
|
|
19
|
+
/* Focus colors -----------------------*/
|
|
20
|
+
/* Border colors ----------------------*/
|
|
21
|
+
/* Shadow colors ----------------------*/
|
|
22
|
+
/* Text colors ------------------------*/
|
|
23
|
+
/* Data colors ------------------------*/
|
|
24
|
+
/* Status colors ----------------------*/
|
|
25
|
+
/* Link colors ------------------------*/
|
|
26
|
+
/* Product colors ---------------------*/
|
|
27
|
+
/* Category colors ---------------------*/
|
|
28
|
+
* {
|
|
29
|
+
box-sizing: border-box;
|
|
30
|
+
margin: 0;
|
|
31
|
+
padding: 0; }
|
|
32
|
+
*:before, *:after {
|
|
33
|
+
box-sizing: border-box; }
|
|
34
|
+
|
|
35
|
+
html {
|
|
36
|
+
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
37
|
+
height: 100vh;
|
|
38
|
+
overflow-x: hidden; }
|
|
39
|
+
|
|
40
|
+
body {
|
|
41
|
+
font-family: "Proxima Nova", "Helvetica Neue", Helvetica, Arial, sans_serif;
|
|
42
|
+
font-size: 16px;
|
|
43
|
+
line-height: 1.5;
|
|
44
|
+
background-color: #F3F7FB;
|
|
45
|
+
height: 100%;
|
|
46
|
+
letter-spacing: 0;
|
|
47
|
+
font-weight: 400;
|
|
48
|
+
font-style: normal;
|
|
49
|
+
text-rendering: optimizeLegibility;
|
|
50
|
+
-moz-font-feature-settings: "liga" on;
|
|
51
|
+
color: #242B42;
|
|
52
|
+
margin: 0 !important;
|
|
53
|
+
padding: 0 !important;
|
|
54
|
+
box-sizing: border-box;
|
|
55
|
+
min-height: 100vh;
|
|
56
|
+
padding: 50px; }
|
|
57
|
+
|
|
58
|
+
a {
|
|
59
|
+
text-decoration: none;
|
|
60
|
+
color: #0056CF; }
|
|
2
61
|
|
data/lib/playbook/version.rb
CHANGED
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: playbook_ui
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 11.1.
|
|
4
|
+
version: 11.1.2.pre.alpha1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Power UX
|
|
@@ -9,7 +9,7 @@ authors:
|
|
|
9
9
|
autorequire:
|
|
10
10
|
bindir: bin
|
|
11
11
|
cert_chain: []
|
|
12
|
-
date: 2022-07-
|
|
12
|
+
date: 2022-07-18 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: actionpack
|
|
@@ -1491,8 +1491,8 @@ files:
|
|
|
1491
1491
|
- app/pb_kits/playbook/pb_progress_step/progress_step.rb
|
|
1492
1492
|
- app/pb_kits/playbook/pb_progress_step/progress_step_item.html.erb
|
|
1493
1493
|
- app/pb_kits/playbook/pb_progress_step/progress_step_item.rb
|
|
1494
|
-
- app/pb_kits/playbook/pb_radio/_radio.jsx
|
|
1495
1494
|
- app/pb_kits/playbook/pb_radio/_radio.scss
|
|
1495
|
+
- app/pb_kits/playbook/pb_radio/_radio.tsx
|
|
1496
1496
|
- app/pb_kits/playbook/pb_radio/docs/_description.md
|
|
1497
1497
|
- app/pb_kits/playbook/pb_radio/docs/_footer.md
|
|
1498
1498
|
- app/pb_kits/playbook/pb_radio/docs/_radio_alignment.html.erb
|
|
@@ -2224,9 +2224,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
|
2224
2224
|
version: '0'
|
|
2225
2225
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
|
2226
2226
|
requirements:
|
|
2227
|
-
- - "
|
|
2227
|
+
- - ">"
|
|
2228
2228
|
- !ruby/object:Gem::Version
|
|
2229
|
-
version:
|
|
2229
|
+
version: 1.3.1
|
|
2230
2230
|
requirements: []
|
|
2231
2231
|
rubygems_version: 3.3.7
|
|
2232
2232
|
signing_key:
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
/* @flow */
|
|
2
|
-
/*eslint-disable react/no-multi-comp, flowtype/space-before-type-colon */
|
|
3
|
-
|
|
4
|
-
import React, { forwardRef } from 'react'
|
|
5
|
-
import Body from '../pb_body/_body'
|
|
6
|
-
import classnames from 'classnames'
|
|
7
|
-
import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
|
|
8
|
-
import { globalProps } from '../utilities/globalProps'
|
|
9
|
-
|
|
10
|
-
type RadioProps = {
|
|
11
|
-
aria?: object,
|
|
12
|
-
alignment?: String,
|
|
13
|
-
checked?: Boolean,
|
|
14
|
-
children?: Node,
|
|
15
|
-
className?: String,
|
|
16
|
-
dark?: boolean,
|
|
17
|
-
data?: object,
|
|
18
|
-
error?: Boolean,
|
|
19
|
-
id?: String,
|
|
20
|
-
label: String,
|
|
21
|
-
name: String,
|
|
22
|
-
value: String,
|
|
23
|
-
text: String,
|
|
24
|
-
onChange: (Boolean)=>void,
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
const Radio = ({
|
|
28
|
-
aria = {},
|
|
29
|
-
alignment = '',
|
|
30
|
-
children,
|
|
31
|
-
className,
|
|
32
|
-
dark = false,
|
|
33
|
-
data = {},
|
|
34
|
-
error = false,
|
|
35
|
-
id,
|
|
36
|
-
label,
|
|
37
|
-
name = 'radio_name',
|
|
38
|
-
text = 'Radio Text',
|
|
39
|
-
value = 'radio_text',
|
|
40
|
-
onChange = () => {},
|
|
41
|
-
...props
|
|
42
|
-
}: RadioProps, ref) => {
|
|
43
|
-
const ariaProps = buildAriaProps(aria)
|
|
44
|
-
const dataProps = buildDataProps(data)
|
|
45
|
-
const classes = classnames(buildCss('pb_radio_kit'), { error }, { dark }, globalProps(props), alignment, className)
|
|
46
|
-
|
|
47
|
-
return (
|
|
48
|
-
<label
|
|
49
|
-
{...ariaProps}
|
|
50
|
-
{...dataProps}
|
|
51
|
-
className={classes}
|
|
52
|
-
htmlFor={id}
|
|
53
|
-
>
|
|
54
|
-
<If condition={children}>
|
|
55
|
-
{children}
|
|
56
|
-
<Else />
|
|
57
|
-
<input
|
|
58
|
-
{...props}
|
|
59
|
-
id={id}
|
|
60
|
-
name={name}
|
|
61
|
-
onChange={onChange}
|
|
62
|
-
ref={ref}
|
|
63
|
-
text={text}
|
|
64
|
-
type="radio"
|
|
65
|
-
value={value}
|
|
66
|
-
/>
|
|
67
|
-
</If>
|
|
68
|
-
<span className="pb_radio_button" />
|
|
69
|
-
<Body
|
|
70
|
-
dark={dark}
|
|
71
|
-
status={error ? 'negative' : null}
|
|
72
|
-
text={label}
|
|
73
|
-
/>
|
|
74
|
-
</label>
|
|
75
|
-
)
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
export default forwardRef(Radio)
|