playbook_ui_docs 13.24.0.pre.alpha.PBNTR261NewKitDropdown2681 β†’ 13.24.0.pre.alpha.PLAY998backgroundkitremoveemptyinlinline2666

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 (10) hide show
  1. checksums.yaml +4 -4
  2. data/dist/menu.yml +1 -5
  3. data/dist/playbook-doc.js +10 -10
  4. metadata +2 -8
  5. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.jsx +0 -53
  6. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx +0 -104
  7. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.jsx +0 -69
  8. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.jsx +0 -78
  9. data/app/pb_kits/playbook/pb_dropdown/docs/example.yml +0 -9
  10. data/app/pb_kits/playbook/pb_dropdown/docs/index.js +0 -4
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: playbook_ui_docs
3
3
  version: !ruby/object:Gem::Version
4
- version: 13.24.0.pre.alpha.PBNTR261NewKitDropdown2681
4
+ version: 13.24.0.pre.alpha.PLAY998backgroundkitremoveemptyinlinline2666
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: 2024-04-11 00:00:00.000000000 Z
12
+ date: 2024-04-09 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: playbook_ui
@@ -590,12 +590,6 @@ files:
590
590
  - app/pb_kits/playbook/pb_distribution_bar/docs/_distribution_bar_default.jsx
591
591
  - app/pb_kits/playbook/pb_distribution_bar/docs/example.yml
592
592
  - app/pb_kits/playbook/pb_distribution_bar/docs/index.js
593
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.jsx
594
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx
595
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.jsx
596
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.jsx
597
- - app/pb_kits/playbook/pb_dropdown/docs/example.yml
598
- - app/pb_kits/playbook/pb_dropdown/docs/index.js
599
593
  - app/pb_kits/playbook/pb_file_upload/docs/_description.md
600
594
  - app/pb_kits/playbook/pb_file_upload/docs/_file_upload_accept.jsx
601
595
  - app/pb_kits/playbook/pb_file_upload/docs/_file_upload_custom.html.erb
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.jsx DELETED
@@ -1,53 +0,0 @@
1
- import React, { useState } from 'react'
2
- import { Dropdown } from '../../'
3
-
4
- const DropdownDefault = (props) => {
5
- // eslint-disable-next-line no-unused-vars
6
- const [selectedOption, setSelectedOption] = useState();
7
-
8
- const options = [
9
- {
10
- label: "United States",
11
- value: "United States",
12
- areaCode: "+1",
13
- icon: "πŸ‡ΊπŸ‡Έ",
14
- id: "United-states"
15
- },
16
- {
17
- label: "Ukraine",
18
- value: "Ukraine",
19
- areaCode: "+380",
20
- icon: "πŸ‡ΊπŸ‡¦",
21
- id: "ukraine"
22
- },
23
- {
24
- label: "Pakistan",
25
- value: "Pakistan",
26
- areaCode: "+92",
27
- icon: "πŸ‡΅πŸ‡°",
28
- id: "pakistan"
29
- }
30
- ];
31
-
32
-
33
- return (
34
- <div>
35
- <Dropdown
36
- onSelect={(selectedItem) => setSelectedOption(selectedItem)}
37
- options={options}
38
- {...props}
39
- >
40
- <Dropdown.Trigger/>
41
- <Dropdown.Container>
42
- {options.map((option) => (
43
- <Dropdown.Option key={option.id}
44
- option={option}
45
- />
46
- ))}
47
- </Dropdown.Container>
48
- </Dropdown>
49
- </div>
50
- )
51
- }
52
-
53
- export default DropdownDefault
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx DELETED
@@ -1,104 +0,0 @@
1
- import React, { useState } from 'react'
2
- import { Dropdown, User, FlexItem, Badge, Avatar } from '../../'
3
-
4
- const DropdownWithCustomDisplay = (props) => {
5
- const [selectedOption, setSelectedOption] = useState();
6
-
7
- const options = [
8
- {
9
- label: "Jasper Furniss",
10
- value: "Jasper Furniss",
11
- territory: "PHL",
12
- title: "Senior UX Engineer",
13
- id: "jasper-furniss",
14
- status: "Offline"
15
- },
16
- {
17
- label: "Ramon Ruiz",
18
- value: "Ramon Ruiz",
19
- territory: "PHL",
20
- title: "Senior UX Desinger",
21
- id: "ramon-ruiz",
22
- status: "Away"
23
- },
24
- {
25
- label: "Jason Cypret",
26
- value: "Jason Cypret",
27
- territory: "PHL",
28
- title: "VP of User Experience",
29
- id: "jason-cypret",
30
- status: "Online"
31
- },
32
- {
33
- label: "Courtney Long",
34
- value: "Courtney Long",
35
- territory: "PHL",
36
- title: "UX Design Mentor",
37
- id: "courtney-long",
38
- status: "Online"
39
- }
40
- ];
41
-
42
- const customDisplay = () => {
43
- return (
44
- <>
45
- {
46
- selectedOption && (
47
- <Avatar
48
- name={selectedOption.label}
49
- size="sm"
50
- />
51
- )
52
- }
53
- </>
54
- )
55
- };
56
-
57
-
58
- return (
59
- <div>
60
- <Dropdown
61
- onSelect={(selectedItem) => setSelectedOption(selectedItem)}
62
- options={options}
63
- {...props}
64
- >
65
- <Dropdown.Trigger customDisplay={customDisplay()}/>
66
- <Dropdown.Container>
67
- {options.map((option) => (
68
- <Dropdown.Option key={option.id}
69
- option={option}
70
- >
71
- <>
72
- <FlexItem>
73
- <User
74
- align="left"
75
- avatar
76
- name={option.label}
77
- orientation="horizontal"
78
- territory={option.territory}
79
- title={option.title}
80
- />
81
- </FlexItem>
82
- <FlexItem>
83
- <Badge
84
- rounded
85
- text={option.status}
86
- variant={`${
87
- option.status === "Offline"
88
- ? "neutral"
89
- : option.status === "Online"
90
- ? "success"
91
- : "warning"
92
- }`}
93
- />
94
- </FlexItem>
95
- </>
96
- </Dropdown.Option>
97
- ))}
98
- </Dropdown.Container>
99
- </Dropdown>
100
- </div>
101
- )
102
- }
103
-
104
- export default DropdownWithCustomDisplay
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.jsx DELETED
@@ -1,69 +0,0 @@
1
- import React, { useState } from 'react'
2
- import { Dropdown, Icon, Body, FlexItem, Flex } from '../..'
3
-
4
- const DropdownWithCustomOptions = (props) => {
5
- // eslint-disable-next-line no-unused-vars
6
- const [selectedOption, setSelectedOption] = useState();
7
-
8
- const options = [
9
- {
10
- label: "United States",
11
- value: "United States",
12
- areaCode: "+1",
13
- icon: "πŸ‡ΊπŸ‡Έ",
14
- id: "United-states"
15
- },
16
- {
17
- label: "Ukraine",
18
- value: "Ukraine",
19
- areaCode: "+380",
20
- icon: "πŸ‡ΊπŸ‡¦",
21
- id: "ukraine"
22
- },
23
- {
24
- label: "Pakistan",
25
- value: "Pakistan",
26
- areaCode: "+92",
27
- icon: "πŸ‡΅πŸ‡°",
28
- id: "pakistan"
29
- }
30
- ];
31
-
32
-
33
- return (
34
- <div>
35
- <Dropdown
36
- onSelect={(selectedItem) => setSelectedOption(selectedItem)}
37
- options={options}
38
- {...props}
39
- >
40
- <Dropdown.Trigger/>
41
- <Dropdown.Container>
42
- {options.map((option) => (
43
- <Dropdown.Option key={option.id}
44
- option={option}
45
- >
46
- <>
47
- <FlexItem>
48
- <Flex>
49
- <Icon icon={option.icon}
50
- paddingRight="xs"
51
- />
52
- <Body text={option.label} />
53
- </Flex>
54
- </FlexItem>
55
- <FlexItem>
56
- <Body color="light"
57
- text={option.areaCode}
58
- />
59
- </FlexItem>
60
- </>
61
- </Dropdown.Option>
62
- ))}
63
- </Dropdown.Container>
64
- </Dropdown>
65
- </div>
66
- )
67
- }
68
-
69
- export default DropdownWithCustomOptions
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.jsx DELETED
@@ -1,78 +0,0 @@
1
- import React, { useState } from 'react'
2
- import { Dropdown, Icon, Body, FlexItem, Flex, IconCircle } from '../..'
3
-
4
- const DropdownWithCustomTrigger = (props) => {
5
-
6
- const [selectedOption, setSelectedOption] = useState();
7
-
8
- const options = [
9
- {
10
- label: "United States",
11
- value: "United States",
12
- areaCode: "+1",
13
- icon: "πŸ‡ΊπŸ‡Έ",
14
- id: "United-states"
15
- },
16
- {
17
- label: "Ukraine",
18
- value: "Ukraine",
19
- areaCode: "+380",
20
- icon: "πŸ‡ΊπŸ‡¦",
21
- id: "ukraine"
22
- },
23
- {
24
- label: "Pakistan",
25
- value: "Pakistan",
26
- areaCode: "+92",
27
- icon: "πŸ‡΅πŸ‡°",
28
- id: "pakistan"
29
- }
30
- ];
31
-
32
-
33
- return (
34
- <div>
35
- <Dropdown
36
- onSelect={(selectedItem) => setSelectedOption(selectedItem)}
37
- options={options}
38
- {...props}
39
- >
40
- <Dropdown.Trigger>
41
- <div key={selectedOption ? selectedOption.icon : "flag"}>
42
- <IconCircle
43
- cursor="pointer"
44
- icon={selectedOption ? selectedOption.icon : "flag"}
45
- variant="royal"
46
- />
47
- </div>
48
- </Dropdown.Trigger>
49
-
50
- <Dropdown.Container>
51
- {options.map((option) => (
52
- <Dropdown.Option key={option.id}
53
- option={option}
54
- >
55
- <>
56
- <FlexItem>
57
- <Flex>
58
- <Icon icon={option.icon}
59
- paddingRight="xs"
60
- />
61
- <Body text={option.label} />
62
- </Flex>
63
- </FlexItem>
64
- <FlexItem>
65
- <Body color="light"
66
- text={option.areaCode}
67
- />
68
- </FlexItem>
69
- </>
70
- </Dropdown.Option>
71
- ))}
72
- </Dropdown.Container>
73
- </Dropdown>
74
- </div>
75
- )
76
- }
77
-
78
- export default DropdownWithCustomTrigger
data/app/pb_kits/playbook/pb_dropdown/docs/example.yml DELETED
@@ -1,9 +0,0 @@
1
- examples:
2
-
3
-
4
- react:
5
- - dropdown_default: Default
6
- - dropdown_with_custom_options: Custom Options
7
- - dropdown_with_custom_display: Custom Display
8
- - dropdown_with_custom_trigger: Custom Trigger
9
-
data/app/pb_kits/playbook/pb_dropdown/docs/index.js DELETED
@@ -1,4 +0,0 @@
1
- export { default as DropdownDefault } from './_dropdown_default.jsx'
2
- export { default as DropdownWithCustomDisplay } from './_dropdown_with_custom_display.jsx'
3
- export { default as DropdownWithCustomOptions } from './_dropdown_with_custom_options.jsx'
4
- export { default as DropdownWithCustomTrigger } from './_dropdown_with_custom_trigger.jsx'