playbook_ui 13.31.0.pre.alpha.PLAY10863202 → 13.31.0.pre.alpha.PLAY10863204
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_title/_title.tsx +1 -2
- data/app/pb_kits/playbook/pb_tooltip/_tooltip.tsx +1 -1
- data/app/pb_kits/playbook/pb_treemap_chart/_treemap_chart.tsx +2 -2
- data/app/pb_kits/playbook/pb_typeahead/_typeahead.tsx +1 -2
- data/app/pb_kits/playbook/pb_typeahead/components/ClearIndicator.tsx +2 -10
- data/app/pb_kits/playbook/pb_typeahead/components/MultiValue.tsx +2 -8
- data/app/pb_kits/playbook/pb_typeahead/components/Option.tsx +1 -16
- data/app/pb_kits/playbook/pb_typeahead/components/Placeholder.tsx +1 -8
- data/app/pb_kits/playbook/pb_typeahead/components/ValueContainer.tsx +1 -5
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_highlight.jsx +1 -7
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async_custom_options.jsx +1 -1
- data/app/pb_kits/playbook/pb_typeahead/index.ts +2 -2
- data/dist/playbook-rails.js +1 -1
- data/lib/playbook/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: eb0b0eeaa6db40584611bedb1796a2f95dbf7693f4cce865be1ed5c87d1d8819
|
4
|
+
data.tar.gz: 3617a015115e540c14349aa3c5b0e741edb566e8ce5bcd72803f255e7e4f6beb
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 895e69139eb0eb62e0037cbc89ff412c748d2f2154a0433a86318df38f526b3036e6643b390ba58772d9d06447297b80d52b64753706db6156e7a28454e3d782
|
7
|
+
data.tar.gz: '0093caf11bc2960351ae3045e2db58cacbf46352d5062d0abdc0112e29b5520ebfdef2d534f6d3158a91a4ed42852885549eb71b53014d4fcf8cf6f169b8e2bd'
|
@@ -62,8 +62,7 @@ const Title = (props: TitleProps): React.ReactElement => {
|
|
62
62
|
buildResponsiveSizeCss(),
|
63
63
|
className
|
64
64
|
)
|
65
|
-
|
66
|
-
const Tag: keyof JSX.IntrinsicElements = `${tag}`
|
65
|
+
const Tag: React.ReactElement | any = `${tag}`
|
67
66
|
|
68
67
|
return (
|
69
68
|
<Tag
|
@@ -20,7 +20,7 @@ import Flex from "../pb_flex/_flex"
|
|
20
20
|
type TooltipProps = {
|
21
21
|
aria?: { [key: string]: string },
|
22
22
|
className?: string | string[],
|
23
|
-
children:
|
23
|
+
children: JSX.Element,
|
24
24
|
data?: { [key: string]: string },
|
25
25
|
delay?: number | Partial<{open: number; close: number}>,
|
26
26
|
htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
|
@@ -95,10 +95,10 @@ const TreemapChart = ({
|
|
95
95
|
},
|
96
96
|
};
|
97
97
|
|
98
|
-
const [options, setOptions] = useState(
|
98
|
+
const [options, setOptions] = useState({});
|
99
99
|
|
100
100
|
useEffect(() => {
|
101
|
-
setOptions(
|
101
|
+
setOptions(merge(staticOptions, customOptions));
|
102
102
|
}, [chartData]);
|
103
103
|
|
104
104
|
return (
|
@@ -104,8 +104,7 @@ const Typeahead = ({
|
|
104
104
|
multiKit: '',
|
105
105
|
onCreateOption: null as null,
|
106
106
|
plusIcon: false,
|
107
|
-
|
108
|
-
onMultiValueClick: (_option: SelectValueType): void => undefined,
|
107
|
+
onMultiValueClick: (_option: SelectValueType): any => undefined,
|
109
108
|
...props,
|
110
109
|
}
|
111
110
|
|
@@ -1,19 +1,11 @@
|
|
1
1
|
import React, { useEffect } from 'react'
|
2
2
|
import { components } from 'react-select'
|
3
3
|
|
4
|
-
|
5
|
-
children: React.ReactNode,
|
6
|
-
selectProps?: {
|
7
|
-
id: string,
|
8
|
-
},
|
9
|
-
clearValue: () => void,
|
10
|
-
}
|
11
|
-
|
12
|
-
const ClearContainer = (props: ClearContainerProps): React.ReactElement => {
|
4
|
+
const ClearContainer = (props: any): React.ReactElement => {
|
13
5
|
const { selectProps, clearValue } = props
|
14
6
|
useEffect(() => {
|
15
7
|
document.addEventListener(`pb-typeahead-kit-${selectProps.id}:clear`, clearValue)
|
16
|
-
}, [
|
8
|
+
}, [])
|
17
9
|
|
18
10
|
return (
|
19
11
|
<components.ClearIndicator
|
@@ -7,14 +7,8 @@ import { SelectValueType } from '../_typeahead'
|
|
7
7
|
|
8
8
|
type Props = {
|
9
9
|
data: SelectValueType,
|
10
|
-
removeProps
|
11
|
-
|
12
|
-
onMouseDown?: React.MouseEventHandler<HTMLSpanElement>,
|
13
|
-
onTouchEnd?: React.TouchEventHandler<HTMLSpanElement>,
|
14
|
-
},
|
15
|
-
selectProps: {
|
16
|
-
multiKit?: string,
|
17
|
-
},
|
10
|
+
removeProps: any,
|
11
|
+
selectProps: any,
|
18
12
|
}
|
19
13
|
|
20
14
|
const MultiValue = (props: Props): React.ReactElement => {
|
@@ -3,22 +3,7 @@ import { components } from 'react-select'
|
|
3
3
|
|
4
4
|
import User from '../../pb_user/_user'
|
5
5
|
|
6
|
-
|
7
|
-
children: React.ReactNode,
|
8
|
-
label?: string,
|
9
|
-
data: {
|
10
|
-
imageUrl?: string,
|
11
|
-
},
|
12
|
-
selectProps: {
|
13
|
-
dark?: boolean,
|
14
|
-
valueComponent?: (data: {
|
15
|
-
imageUrl?: string,
|
16
|
-
}) => React.ReactNode,
|
17
|
-
},
|
18
|
-
}
|
19
|
-
|
20
|
-
|
21
|
-
const Option = (props: OptionProps): React.ReactElement => {
|
6
|
+
const Option = (props: any): React.ReactElement => {
|
22
7
|
const {
|
23
8
|
imageUrl,
|
24
9
|
} = props.data
|
@@ -4,14 +4,7 @@ import { components } from 'react-select'
|
|
4
4
|
import Flex from '../../pb_flex/_flex'
|
5
5
|
import Icon from '../../pb_icon/_icon'
|
6
6
|
|
7
|
-
|
8
|
-
children: React.ReactNode,
|
9
|
-
selectProps: {
|
10
|
-
plusIcon?: boolean,
|
11
|
-
},
|
12
|
-
}
|
13
|
-
|
14
|
-
const Placeholder = (props: PlaceholderProps): React.ReactElement => (
|
7
|
+
const Placeholder = (props: any): React.ReactElement => (
|
15
8
|
<>
|
16
9
|
<Flex
|
17
10
|
align="center"
|
@@ -1,11 +1,7 @@
|
|
1
1
|
import React from 'react'
|
2
2
|
import { components } from 'react-select'
|
3
3
|
|
4
|
-
|
5
|
-
children: React.ReactNode,
|
6
|
-
}
|
7
|
-
|
8
|
-
const ValueContainer = (props: ValueContainerProps): React.ReactElement => (
|
4
|
+
const ValueContainer = (props: any): React.ReactElement => (
|
9
5
|
<components.ValueContainer
|
10
6
|
className="text_input_value_container"
|
11
7
|
{...props}
|
@@ -14,12 +14,6 @@ import {
|
|
14
14
|
Typeahead,
|
15
15
|
} from '../..'
|
16
16
|
|
17
|
-
type TypeAheadWithHighlightProps = {
|
18
|
-
data: {
|
19
|
-
name: String,
|
20
|
-
},
|
21
|
-
};
|
22
|
-
|
23
17
|
const USERS = [
|
24
18
|
{
|
25
19
|
name: "Wade Winningham",
|
@@ -43,7 +37,7 @@ const USERS = [
|
|
43
37
|
},
|
44
38
|
];
|
45
39
|
|
46
|
-
const TypeaheadWithHighlight = (props
|
40
|
+
const TypeaheadWithHighlight = (props) => {
|
47
41
|
const [selectedUser, setSelectedUser] = useState()
|
48
42
|
|
49
43
|
const formatOptionLabel = ({name, territory, title}, {inputValue}) => {
|
@@ -48,7 +48,7 @@ const promiseOptions = (inputValue) =>
|
|
48
48
|
|
49
49
|
const TypeaheadWithPillsAsyncCustomOptions = (props) => {
|
50
50
|
const [users, setUsers] = useState([])
|
51
|
-
const handleOnChange = (value) =>
|
51
|
+
const handleOnChange = (value) => setUsers(value)
|
52
52
|
|
53
53
|
/**
|
54
54
|
*
|
@@ -97,7 +97,7 @@ export default class PbTypeahead extends PbEnhancedElement {
|
|
97
97
|
this.resultsElement.innerHTML = ''
|
98
98
|
}
|
99
99
|
|
100
|
-
newResultOption(content: DocumentFragment
|
100
|
+
newResultOption(content: DocumentFragment) {
|
101
101
|
const resultOption = (this.resultOptionTemplate as HTMLTemplateElement).content.cloneNode(true) as Element
|
102
102
|
resultOption.querySelector('slot[name="content"]').replaceWith(content)
|
103
103
|
return resultOption
|
@@ -186,7 +186,7 @@ export default class PbTypeahead extends PbEnhancedElement {
|
|
186
186
|
)
|
187
187
|
}
|
188
188
|
|
189
|
-
get resultsOptionCache()
|
189
|
+
get resultsOptionCache() {
|
190
190
|
return this._resultsOptionCache = (
|
191
191
|
this._resultsOptionCache ||
|
192
192
|
new Map
|