@coreui/react 5.10.0 → 5.11.0
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.
- package/README.md +1 -1
- package/dist/cjs/components/dropdown/CDropdown.js +1 -1
- package/dist/cjs/components/dropdown/CDropdown.js.map +1 -1
- package/dist/cjs/components/index.d.ts +1 -0
- package/dist/cjs/components/nav/CNavGroup.d.ts +3 -1
- package/dist/cjs/components/nav/CNavGroup.js +9 -5
- package/dist/cjs/components/nav/CNavGroup.js.map +1 -1
- package/dist/cjs/components/popover/CPopover.js +14 -17
- package/dist/cjs/components/popover/CPopover.js.map +1 -1
- package/dist/cjs/components/search-button/CSearchButton.d.ts +32 -0
- package/dist/cjs/components/search-button/CSearchButton.js +77 -0
- package/dist/cjs/components/search-button/CSearchButton.js.map +1 -0
- package/dist/cjs/components/search-button/index.d.ts +2 -0
- package/dist/cjs/components/search-button/types.d.ts +10 -0
- package/dist/cjs/components/search-button/utils.d.ts +11 -0
- package/dist/cjs/components/search-button/utils.js +115 -0
- package/dist/cjs/components/search-button/utils.js.map +1 -0
- package/dist/cjs/components/sidebar/CSidebarNav.d.ts +12 -0
- package/dist/cjs/components/sidebar/CSidebarNav.js +7 -2
- package/dist/cjs/components/sidebar/CSidebarNav.js.map +1 -1
- package/dist/cjs/components/tooltip/CTooltip.js +14 -17
- package/dist/cjs/components/tooltip/CTooltip.js.map +1 -1
- package/dist/cjs/index.js +2 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/components/dropdown/CDropdown.js +1 -1
- package/dist/esm/components/dropdown/CDropdown.js.map +1 -1
- package/dist/esm/components/index.d.ts +1 -0
- package/dist/esm/components/nav/CNavGroup.d.ts +3 -1
- package/dist/esm/components/nav/CNavGroup.js +9 -5
- package/dist/esm/components/nav/CNavGroup.js.map +1 -1
- package/dist/esm/components/popover/CPopover.js +14 -17
- package/dist/esm/components/popover/CPopover.js.map +1 -1
- package/dist/esm/components/search-button/CSearchButton.d.ts +32 -0
- package/dist/esm/components/search-button/CSearchButton.js +75 -0
- package/dist/esm/components/search-button/CSearchButton.js.map +1 -0
- package/dist/esm/components/search-button/index.d.ts +2 -0
- package/dist/esm/components/search-button/types.d.ts +10 -0
- package/dist/esm/components/search-button/utils.d.ts +11 -0
- package/dist/esm/components/search-button/utils.js +104 -0
- package/dist/esm/components/search-button/utils.js.map +1 -0
- package/dist/esm/components/sidebar/CSidebarNav.d.ts +12 -0
- package/dist/esm/components/sidebar/CSidebarNav.js +7 -2
- package/dist/esm/components/sidebar/CSidebarNav.js.map +1 -1
- package/dist/esm/components/tooltip/CTooltip.js +14 -17
- package/dist/esm/components/tooltip/CTooltip.js.map +1 -1
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +1 -1
- package/package.json +5 -5
- package/src/components/dropdown/CDropdown.tsx +1 -1
- package/src/components/dropdown/__tests__/CDropdown.spec.tsx +1 -1
- package/src/components/dropdown/__tests__/__snapshots__/CDropdown.spec.tsx.snap +2 -2
- package/src/components/dropdown/__tests__/__snapshots__/CDropdownMenu.spec.tsx.snap +1 -1
- package/src/components/index.ts +1 -0
- package/src/components/nav/CNavGroup.tsx +11 -6
- package/src/components/nav/__tests__/CNavGroup.spec.tsx +29 -1
- package/src/components/nav/__tests__/__snapshots__/CNavGroup.spec.tsx.snap +1 -1
- package/src/components/popover/CPopover.tsx +15 -20
- package/src/components/popover/__tests__/CPopover.spec.tsx +10 -4
- package/src/components/search-button/CSearchButton.tsx +195 -0
- package/src/components/search-button/__tests__/CSearchButton.spec.tsx +95 -0
- package/src/components/search-button/__tests__/__snapshots__/CSearchButton.spec.tsx.snap +87 -0
- package/src/components/search-button/index.ts +3 -0
- package/src/components/search-button/types.ts +10 -0
- package/src/components/search-button/utils.ts +140 -0
- package/src/components/sidebar/CSidebarNav.tsx +27 -2
- package/src/components/tooltip/CTooltip.tsx +15 -20
- package/src/components/tooltip/__tests__/CTooltip.spec.tsx +6 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CTooltip.js","sources":["../../../../src/components/tooltip/CTooltip.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;AA+IO,MAAM,QAAQ,GAAG,UAAU,CAChC,CACE,EAgBC,EACD,GAAG,KACD;AAlBF,IAAA,IAAA,EACE,QAAQ,EACR,SAAS,GAAG,IAAI,EAChB,SAAS,EACT,SAAS,EACT,OAAO,EACP,KAAK,GAAG,CAAC,EACT,kBAAkB,GAAG,CAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,CAAC,EACvD,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,EACf,MAAM,EACN,MAAM,EACN,SAAS,GAAG,KAAK,EACjB,YAAY,EACZ,OAAO,GAAG,CAAC,OAAO,EAAE,OAAO,CAAC,EAC5B,OAAO,EAAA,GAAA,EAER,EADI,IAAI,GAAA,MAAA,CAAA,EAAA,EAfT,CAAA,UAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,SAAA,EAAA,OAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,QAAA,EAAA,QAAA,EAAA,WAAA,EAAA,cAAA,EAAA,SAAA,EAAA,SAAA,CAgBC,CADQ;AAIT,IAAA,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC;AAC/C,IAAA,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC;IAC/B,MAAM,SAAS,GAAG,YAAY,CAAC,GAAG,EAAE,UAAU,CAAC;AAE/C,IAAA,MAAM,EAAE,GAAG,CAAA,OAAA,EAAU,KAAK,EAAE,EAAE;IAC9B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAC7C,MAAM,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC;IAEhD,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,GAAG,SAAS,EAAE;IAE/D,MAAM,MAAM,GAAG,OAAO,KAAK,KAAK,QAAQ,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK;AAE/E,IAAA,MAAM,mBAAmB,GAAqB;AAC5C,QAAA,SAAS,EAAE;YACT,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,gBAAgB,EAAE,EAAE;YACzD,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,kBAAkB,EAAE,EAAE;YACjD,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,MAAM,EAAE,EAAE;AACxC,SAAA;QACD,SAAS,EAAE,eAAe,CAAC,SAAS,EAAE,UAAU,CAAC,OAAO,CAAC;KAC1D;IAED,MAAM,oBAAoB,mCACrB,mBAAmB,CAAA,GAClB,OAAO,YAAY,KAAK,UAAU,GAAG,YAAY,CAAC,mBAAmB,CAAC,GAAG,YAAY,EAC1F;IAED,SAAS,CAAC,MAAK;
|
|
1
|
+
{"version":3,"file":"CTooltip.js","sources":["../../../../src/components/tooltip/CTooltip.tsx"],"sourcesContent":[null],"names":[],"mappings":"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"}
|
package/dist/esm/index.js
CHANGED
|
@@ -100,6 +100,7 @@ export { CProgress } from './components/progress/CProgress.js';
|
|
|
100
100
|
export { CProgressBar } from './components/progress/CProgressBar.js';
|
|
101
101
|
export { CProgressStacked } from './components/progress/CProgressStacked.js';
|
|
102
102
|
export { CPopover } from './components/popover/CPopover.js';
|
|
103
|
+
export { CSearchButton } from './components/search-button/CSearchButton.js';
|
|
103
104
|
export { CSidebar } from './components/sidebar/CSidebar.js';
|
|
104
105
|
export { CSidebarBrand } from './components/sidebar/CSidebarBrand.js';
|
|
105
106
|
export { CSidebarFooter } from './components/sidebar/CSidebarFooter.js';
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coreui/react",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.11.0",
|
|
4
4
|
"description": "UI Components Library for React.js",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -41,12 +41,12 @@
|
|
|
41
41
|
"test:update": "jest --coverage --updateSnapshot"
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@coreui/coreui": "^5.
|
|
44
|
+
"@coreui/coreui": "^5.7.0",
|
|
45
45
|
"@popperjs/core": "^2.11.8",
|
|
46
46
|
"prop-types": "^15.8.1"
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
|
-
"@rollup/plugin-commonjs": "^29.0.
|
|
49
|
+
"@rollup/plugin-commonjs": "^29.0.2",
|
|
50
50
|
"@rollup/plugin-node-resolve": "^16.0.3",
|
|
51
51
|
"@rollup/plugin-typescript": "^12.3.0",
|
|
52
52
|
"@testing-library/dom": "^10.4.1",
|
|
@@ -64,8 +64,8 @@
|
|
|
64
64
|
"react": "^18.3.1",
|
|
65
65
|
"react-dom": "^18.3.1",
|
|
66
66
|
"react-transition-group": "^4.4.5",
|
|
67
|
-
"rollup": "^4.
|
|
68
|
-
"ts-jest": "^29.4.
|
|
67
|
+
"rollup": "^4.60.4",
|
|
68
|
+
"ts-jest": "^29.4.9",
|
|
69
69
|
"tslib": "^2.8.1",
|
|
70
70
|
"typescript": "^5.9.3"
|
|
71
71
|
},
|
|
@@ -89,7 +89,7 @@ test('CDropdown opens on toggle click and closes on clicking outside', async ()
|
|
|
89
89
|
|
|
90
90
|
// Click outside the dropdown to close it
|
|
91
91
|
const externalArea = screen.getByTestId('external-area')
|
|
92
|
-
fireEvent.
|
|
92
|
+
fireEvent.click(externalArea)
|
|
93
93
|
|
|
94
94
|
// Wait for the dropdown menu to be hidden
|
|
95
95
|
await waitFor(() => {
|
|
@@ -13,7 +13,7 @@ exports[`CDropdown customize 1`] = `
|
|
|
13
13
|
exports[`CDropdown example 1`] = `
|
|
14
14
|
<div>
|
|
15
15
|
<div
|
|
16
|
-
class="
|
|
16
|
+
class="dropdown"
|
|
17
17
|
>
|
|
18
18
|
<button
|
|
19
19
|
aria-expanded="false"
|
|
@@ -68,7 +68,7 @@ exports[`CDropdown example 1`] = `
|
|
|
68
68
|
exports[`loads and displays CDropdown component 1`] = `
|
|
69
69
|
<div>
|
|
70
70
|
<div
|
|
71
|
-
class="
|
|
71
|
+
class="dropdown"
|
|
72
72
|
>
|
|
73
73
|
Test
|
|
74
74
|
</div>
|
package/src/components/index.ts
CHANGED
|
@@ -17,7 +17,6 @@ import type { TransitionStatus } from 'react-transition-group'
|
|
|
17
17
|
import { PolymorphicRefForwardingComponent } from '../../helpers'
|
|
18
18
|
|
|
19
19
|
import { CSidebarNavContext } from '../sidebar/CSidebarNavContext'
|
|
20
|
-
|
|
21
20
|
export interface CNavGroupProps extends HTMLAttributes<HTMLDivElement | HTMLLIElement> {
|
|
22
21
|
/**
|
|
23
22
|
* Component used for the root node. Either a string to use a HTML element or a component.
|
|
@@ -36,7 +35,7 @@ export interface CNavGroupProps extends HTMLAttributes<HTMLDivElement | HTMLLIEl
|
|
|
36
35
|
/**
|
|
37
36
|
* Set group toggler label.
|
|
38
37
|
*/
|
|
39
|
-
toggler?: string | ReactNode
|
|
38
|
+
toggler?: string | ReactNode | (({ visible }: { visible: boolean }) => ReactNode)
|
|
40
39
|
/**
|
|
41
40
|
* Show nav group items.
|
|
42
41
|
*/
|
|
@@ -69,8 +68,12 @@ export const CNavGroup: PolymorphicRefForwardingComponent<'li', CNavGroupProps>
|
|
|
69
68
|
)
|
|
70
69
|
|
|
71
70
|
useEffect(() => {
|
|
72
|
-
|
|
73
|
-
}, [
|
|
71
|
+
visible !== undefined && setVisible(visible)
|
|
72
|
+
}, [visible])
|
|
73
|
+
|
|
74
|
+
useEffect(() => {
|
|
75
|
+
visibleGroup && setVisible(Boolean(idx && visibleGroup && isInVisibleGroup(visibleGroup, idx)))
|
|
76
|
+
}, [idx, visibleGroup])
|
|
74
77
|
|
|
75
78
|
const handleTogglerOnCLick = (event: React.MouseEvent<HTMLElement>) => {
|
|
76
79
|
event.preventDefault()
|
|
@@ -116,6 +119,7 @@ export const CNavGroup: PolymorphicRefForwardingComponent<'li', CNavGroupProps>
|
|
|
116
119
|
}
|
|
117
120
|
|
|
118
121
|
const NavGroupItemsComponent = Component === 'li' ? 'ul' : 'div'
|
|
122
|
+
const togglerContent = typeof toggler === 'function' ? toggler({ visible: _visible }) : toggler
|
|
119
123
|
|
|
120
124
|
return (
|
|
121
125
|
<Component
|
|
@@ -129,10 +133,11 @@ export const CNavGroup: PolymorphicRefForwardingComponent<'li', CNavGroupProps>
|
|
|
129
133
|
href="#"
|
|
130
134
|
onClick={(event) => handleTogglerOnCLick(event)}
|
|
131
135
|
>
|
|
132
|
-
{
|
|
136
|
+
{togglerContent}
|
|
133
137
|
</a>
|
|
134
138
|
)}
|
|
135
139
|
<Transition
|
|
140
|
+
appear
|
|
136
141
|
in={_visible}
|
|
137
142
|
nodeRef={navItemsRef}
|
|
138
143
|
onEntering={onEntering}
|
|
@@ -167,7 +172,7 @@ CNavGroup.propTypes = {
|
|
|
167
172
|
className: PropTypes.string,
|
|
168
173
|
compact: PropTypes.bool,
|
|
169
174
|
idx: PropTypes.string,
|
|
170
|
-
toggler: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
|
|
175
|
+
toggler: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.func]),
|
|
171
176
|
visible: PropTypes.bool,
|
|
172
177
|
}
|
|
173
178
|
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
|
-
import { render } from '@testing-library/react'
|
|
2
|
+
import { fireEvent, render, screen } from '@testing-library/react'
|
|
3
3
|
import '@testing-library/jest-dom'
|
|
4
4
|
import { CNavGroup } from '../index'
|
|
5
|
+
import { CSidebarNavContext } from '../../sidebar/CSidebarNavContext'
|
|
5
6
|
|
|
6
7
|
test('loads and displays CNavGroup component', async () => {
|
|
7
8
|
const { container } = render(<CNavGroup toggler="anchorText" />)
|
|
@@ -23,3 +24,30 @@ test('CNavGroup customize', async () => {
|
|
|
23
24
|
expect(true).toBe(false)
|
|
24
25
|
}
|
|
25
26
|
})
|
|
27
|
+
|
|
28
|
+
test('CNavGroup stays expanded when visible prop is set', async () => {
|
|
29
|
+
render(
|
|
30
|
+
<CSidebarNavContext.Provider value={{ visibleGroup: '', setVisibleGroup: jest.fn() }}>
|
|
31
|
+
<CNavGroup idx="1" toggler="anchorText" visible={true} />
|
|
32
|
+
</CSidebarNavContext.Provider>
|
|
33
|
+
)
|
|
34
|
+
|
|
35
|
+
expect(screen.getByRole('listitem')).toHaveClass('show')
|
|
36
|
+
})
|
|
37
|
+
|
|
38
|
+
test('CNavGroup toggler render function receives visible state', async () => {
|
|
39
|
+
render(
|
|
40
|
+
<CSidebarNavContext.Provider value={{ visibleGroup: '1', setVisibleGroup: jest.fn() }}>
|
|
41
|
+
<CNavGroup
|
|
42
|
+
idx="1"
|
|
43
|
+
toggler={({ visible }) => <span>{visible ? 'expanded' : 'collapsed'}</span>}
|
|
44
|
+
/>
|
|
45
|
+
</CSidebarNavContext.Provider>
|
|
46
|
+
)
|
|
47
|
+
|
|
48
|
+
expect(screen.getByText('expanded')).toBeInTheDocument()
|
|
49
|
+
|
|
50
|
+
fireEvent.click(screen.getByRole('link'))
|
|
51
|
+
|
|
52
|
+
expect(screen.getByText('collapsed')).toBeInTheDocument()
|
|
53
|
+
})
|
|
@@ -197,13 +197,24 @@ export const CPopover = forwardRef<HTMLDivElement, CPopoverProps>(
|
|
|
197
197
|
...(typeof popperConfig === 'function' ? popperConfig(defaultPopperConfig) : popperConfig),
|
|
198
198
|
}
|
|
199
199
|
|
|
200
|
+
const handleShow = () => {
|
|
201
|
+
setMounted(true)
|
|
202
|
+
onShow?.()
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
const handleHide = () => {
|
|
206
|
+
setTimeout(() => {
|
|
207
|
+
setVisible(false)
|
|
208
|
+
onHide?.()
|
|
209
|
+
}, _delay.hide)
|
|
210
|
+
}
|
|
211
|
+
|
|
200
212
|
useEffect(() => {
|
|
201
|
-
if (visible) {
|
|
213
|
+
if (visible === true) {
|
|
202
214
|
handleShow()
|
|
203
|
-
|
|
215
|
+
} else if (visible === false) {
|
|
216
|
+
handleHide()
|
|
204
217
|
}
|
|
205
|
-
|
|
206
|
-
handleHide()
|
|
207
218
|
}, [visible])
|
|
208
219
|
|
|
209
220
|
useEffect(() => {
|
|
@@ -229,22 +240,6 @@ export const CPopover = forwardRef<HTMLDivElement, CPopoverProps>(
|
|
|
229
240
|
}
|
|
230
241
|
}, [_visible])
|
|
231
242
|
|
|
232
|
-
const handleShow = () => {
|
|
233
|
-
setMounted(true)
|
|
234
|
-
if (onShow) {
|
|
235
|
-
onShow()
|
|
236
|
-
}
|
|
237
|
-
}
|
|
238
|
-
|
|
239
|
-
const handleHide = () => {
|
|
240
|
-
setTimeout(() => {
|
|
241
|
-
setVisible(false)
|
|
242
|
-
if (onHide) {
|
|
243
|
-
onHide()
|
|
244
|
-
}
|
|
245
|
-
}, _delay.hide)
|
|
246
|
-
}
|
|
247
|
-
|
|
248
243
|
return (
|
|
249
244
|
<>
|
|
250
245
|
{React.cloneElement(children as React.ReactElement<any>, {
|
|
@@ -57,16 +57,16 @@ test('CPopover customize', async () => {
|
|
|
57
57
|
test('CPopover onShow and onHide', async () => {
|
|
58
58
|
jest.useFakeTimers()
|
|
59
59
|
|
|
60
|
+
const onShow = jest.fn()
|
|
61
|
+
const onHide = jest.fn()
|
|
62
|
+
|
|
60
63
|
render(
|
|
61
|
-
<CPopover content="content" title="title" trigger="click" placement="right"
|
|
64
|
+
<CPopover content="content" title="title" trigger="click" placement="right" onShow={onShow} onHide={onHide}>
|
|
62
65
|
<CButton color="primary">Test</CButton>
|
|
63
66
|
</CPopover>,
|
|
64
67
|
{ container: container! }
|
|
65
68
|
)
|
|
66
69
|
|
|
67
|
-
const onShow = jest.fn()
|
|
68
|
-
const onHide = jest.fn()
|
|
69
|
-
|
|
70
70
|
const btn = screen.getByRole('button', { name: /test/i })
|
|
71
71
|
|
|
72
72
|
expect(onShow).toHaveBeenCalledTimes(0)
|
|
@@ -74,6 +74,9 @@ test('CPopover onShow and onHide', async () => {
|
|
|
74
74
|
|
|
75
75
|
act(() => {
|
|
76
76
|
fireEvent.click(btn)
|
|
77
|
+
})
|
|
78
|
+
|
|
79
|
+
act(() => {
|
|
77
80
|
jest.runAllTimers()
|
|
78
81
|
})
|
|
79
82
|
|
|
@@ -82,6 +85,9 @@ test('CPopover onShow and onHide', async () => {
|
|
|
82
85
|
|
|
83
86
|
act(() => {
|
|
84
87
|
fireEvent.click(btn)
|
|
88
|
+
})
|
|
89
|
+
|
|
90
|
+
act(() => {
|
|
85
91
|
jest.runAllTimers()
|
|
86
92
|
})
|
|
87
93
|
|
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
import React, {
|
|
2
|
+
ButtonHTMLAttributes,
|
|
3
|
+
MouseEvent,
|
|
4
|
+
ReactNode,
|
|
5
|
+
forwardRef,
|
|
6
|
+
useCallback,
|
|
7
|
+
useEffect,
|
|
8
|
+
useMemo,
|
|
9
|
+
useRef,
|
|
10
|
+
useState,
|
|
11
|
+
} from 'react'
|
|
12
|
+
import PropTypes from 'prop-types'
|
|
13
|
+
import classNames from 'classnames'
|
|
14
|
+
|
|
15
|
+
import { useForkedRef } from '../../hooks'
|
|
16
|
+
import {
|
|
17
|
+
formatShortcutTokens,
|
|
18
|
+
getPreferredShortcut,
|
|
19
|
+
getPressedKeys,
|
|
20
|
+
matchesShortcut,
|
|
21
|
+
parseShortcut,
|
|
22
|
+
shouldIgnoreShortcut,
|
|
23
|
+
} from './utils'
|
|
24
|
+
|
|
25
|
+
export interface CSearchButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
26
|
+
/**
|
|
27
|
+
* Content to customize the full button body.
|
|
28
|
+
*/
|
|
29
|
+
children?: ReactNode
|
|
30
|
+
/**
|
|
31
|
+
* A string of all className you want applied to the base component.
|
|
32
|
+
*/
|
|
33
|
+
className?: string
|
|
34
|
+
/**
|
|
35
|
+
* Custom icon displayed before the placeholder text.
|
|
36
|
+
*/
|
|
37
|
+
icon?: ReactNode
|
|
38
|
+
/**
|
|
39
|
+
* Placeholder content rendered inside `.search-button-placeholder`.
|
|
40
|
+
*/
|
|
41
|
+
placeholder?: ReactNode
|
|
42
|
+
/**
|
|
43
|
+
* Callback fired when the component is activated by click or keyboard shortcut.
|
|
44
|
+
*/
|
|
45
|
+
onTrigger?: () => void
|
|
46
|
+
/**
|
|
47
|
+
* Prevent the browser's default behavior when the configured shortcut matches.
|
|
48
|
+
*/
|
|
49
|
+
preventDefault?: boolean
|
|
50
|
+
/**
|
|
51
|
+
* Comma-separated shortcut list. The component matches all configured shortcuts and renders the platform-preferred one.
|
|
52
|
+
*/
|
|
53
|
+
shortcut?: string
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
export const CSearchButton = forwardRef<HTMLButtonElement, CSearchButtonProps>(
|
|
57
|
+
(
|
|
58
|
+
{
|
|
59
|
+
children,
|
|
60
|
+
className,
|
|
61
|
+
disabled,
|
|
62
|
+
icon,
|
|
63
|
+
onClick,
|
|
64
|
+
onTrigger,
|
|
65
|
+
placeholder = 'Search',
|
|
66
|
+
preventDefault = true,
|
|
67
|
+
shortcut = 'meta+/,ctrl+/',
|
|
68
|
+
type = 'button',
|
|
69
|
+
...rest
|
|
70
|
+
},
|
|
71
|
+
ref
|
|
72
|
+
) => {
|
|
73
|
+
const buttonRef = useRef<HTMLButtonElement>(null)
|
|
74
|
+
const forkedRef = useForkedRef(ref, buttonRef)
|
|
75
|
+
const [activeKeys, setActiveKeys] = useState<string[]>([])
|
|
76
|
+
const shortcuts = useMemo(() => parseShortcut(shortcut), [shortcut])
|
|
77
|
+
const preferredShortcut = useMemo(() => getPreferredShortcut(shortcuts), [shortcuts])
|
|
78
|
+
const shortcutTokens = useMemo(
|
|
79
|
+
() => formatShortcutTokens(preferredShortcut?.shortcut || ''),
|
|
80
|
+
[preferredShortcut]
|
|
81
|
+
)
|
|
82
|
+
|
|
83
|
+
const handleShortcut = useCallback(
|
|
84
|
+
(event: KeyboardEvent) => {
|
|
85
|
+
if (disabled || event.defaultPrevented || event.repeat || shouldIgnoreShortcut(event)) {
|
|
86
|
+
return
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
const matchedShortcut = shortcuts.find((shortcut) => matchesShortcut(shortcut, event))
|
|
90
|
+
|
|
91
|
+
if (!matchedShortcut) {
|
|
92
|
+
return
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
if (preventDefault) {
|
|
96
|
+
event.preventDefault()
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
onTrigger?.()
|
|
100
|
+
},
|
|
101
|
+
[disabled, onTrigger, preventDefault, shortcuts]
|
|
102
|
+
)
|
|
103
|
+
|
|
104
|
+
const handleDocumentKeydown = useCallback(
|
|
105
|
+
(event: KeyboardEvent) => {
|
|
106
|
+
setActiveKeys(Array.from(getPressedKeys(event)))
|
|
107
|
+
handleShortcut(event)
|
|
108
|
+
},
|
|
109
|
+
[handleShortcut]
|
|
110
|
+
)
|
|
111
|
+
|
|
112
|
+
const handleDocumentKeyup = useCallback((event: KeyboardEvent) => {
|
|
113
|
+
setActiveKeys(Array.from(getPressedKeys(event)))
|
|
114
|
+
}, [])
|
|
115
|
+
|
|
116
|
+
const handleWindowBlur = useCallback(() => {
|
|
117
|
+
setActiveKeys([])
|
|
118
|
+
}, [])
|
|
119
|
+
|
|
120
|
+
useEffect(() => {
|
|
121
|
+
if (typeof document === 'undefined' || typeof window === 'undefined') {
|
|
122
|
+
return
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
document.addEventListener('keydown', handleDocumentKeydown)
|
|
126
|
+
document.addEventListener('keyup', handleDocumentKeyup)
|
|
127
|
+
window.addEventListener('blur', handleWindowBlur)
|
|
128
|
+
|
|
129
|
+
return () => {
|
|
130
|
+
document.removeEventListener('keydown', handleDocumentKeydown)
|
|
131
|
+
document.removeEventListener('keyup', handleDocumentKeyup)
|
|
132
|
+
window.removeEventListener('blur', handleWindowBlur)
|
|
133
|
+
}
|
|
134
|
+
}, [handleDocumentKeydown, handleDocumentKeyup, handleWindowBlur])
|
|
135
|
+
|
|
136
|
+
const handleClick = (event: MouseEvent<HTMLButtonElement>) => {
|
|
137
|
+
onClick?.(event)
|
|
138
|
+
onTrigger?.()
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
return (
|
|
142
|
+
<button
|
|
143
|
+
type={type}
|
|
144
|
+
className={classNames('search-button', className)}
|
|
145
|
+
disabled={disabled}
|
|
146
|
+
onClick={handleClick}
|
|
147
|
+
{...rest}
|
|
148
|
+
ref={forkedRef}
|
|
149
|
+
>
|
|
150
|
+
{children ?? (
|
|
151
|
+
<>
|
|
152
|
+
{icon ?? (
|
|
153
|
+
<svg
|
|
154
|
+
className="search-button-icon"
|
|
155
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
156
|
+
viewBox="0 0 512 512"
|
|
157
|
+
aria-hidden="true"
|
|
158
|
+
>
|
|
159
|
+
<path
|
|
160
|
+
fill="currentColor"
|
|
161
|
+
d="m479.6 399.716-81.084-81.084-62.368-25.767A175 175 0 0 0 368 192c0-97.047-78.953-176-176-176S16 94.953 16 192s78.953 176 176 176a175.03 175.03 0 0 0 101.619-32.377l25.7 62.2 81.081 81.088a56 56 0 1 0 79.2-79.195M48 192c0-79.4 64.6-144 144-144s144 64.6 144 144-64.6 144-144 144S48 271.4 48 192m408.971 264.284a24.03 24.03 0 0 1-33.942 0l-76.572-76.572-23.894-57.835 57.837 23.894 76.573 76.572a24.03 24.03 0 0 1-.002 33.941"
|
|
162
|
+
/>
|
|
163
|
+
</svg>
|
|
164
|
+
)}
|
|
165
|
+
<span className="search-button-placeholder">{placeholder}</span>
|
|
166
|
+
</>
|
|
167
|
+
)}
|
|
168
|
+
<span className="search-button-keys" aria-hidden="true">
|
|
169
|
+
{shortcutTokens.map((key) => (
|
|
170
|
+
<span
|
|
171
|
+
className={classNames('search-button-key', { active: activeKeys.includes(key) })}
|
|
172
|
+
data-coreui-search-button-key={key}
|
|
173
|
+
key={key}
|
|
174
|
+
>
|
|
175
|
+
{key}
|
|
176
|
+
</span>
|
|
177
|
+
))}
|
|
178
|
+
</span>
|
|
179
|
+
</button>
|
|
180
|
+
)
|
|
181
|
+
}
|
|
182
|
+
)
|
|
183
|
+
|
|
184
|
+
CSearchButton.propTypes = {
|
|
185
|
+
children: PropTypes.node,
|
|
186
|
+
className: PropTypes.string,
|
|
187
|
+
disabled: PropTypes.bool,
|
|
188
|
+
icon: PropTypes.node,
|
|
189
|
+
onTrigger: PropTypes.func,
|
|
190
|
+
placeholder: PropTypes.node,
|
|
191
|
+
preventDefault: PropTypes.bool,
|
|
192
|
+
shortcut: PropTypes.string,
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
CSearchButton.displayName = 'CSearchButton'
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import * as React from 'react'
|
|
2
|
+
import { fireEvent, render, screen } from '@testing-library/react'
|
|
3
|
+
import '@testing-library/jest-dom'
|
|
4
|
+
import { CSearchButton } from '../index'
|
|
5
|
+
|
|
6
|
+
const originalPlatform = window.navigator.platform
|
|
7
|
+
|
|
8
|
+
beforeEach(() => {
|
|
9
|
+
Object.defineProperty(window.navigator, 'platform', {
|
|
10
|
+
configurable: true,
|
|
11
|
+
value: 'MacIntel',
|
|
12
|
+
})
|
|
13
|
+
})
|
|
14
|
+
|
|
15
|
+
afterEach(() => {
|
|
16
|
+
Object.defineProperty(window.navigator, 'platform', {
|
|
17
|
+
configurable: true,
|
|
18
|
+
value: originalPlatform,
|
|
19
|
+
})
|
|
20
|
+
})
|
|
21
|
+
|
|
22
|
+
test('loads and displays CSearchButton component', async () => {
|
|
23
|
+
const { container } = render(<CSearchButton />)
|
|
24
|
+
expect(container).toMatchSnapshot()
|
|
25
|
+
})
|
|
26
|
+
|
|
27
|
+
test('CSearchButton customize', async () => {
|
|
28
|
+
const { container } = render(
|
|
29
|
+
<CSearchButton className="bazinga" placeholder="Command palette" shortcut="meta+k,ctrl+k" />,
|
|
30
|
+
)
|
|
31
|
+
|
|
32
|
+
expect(container).toMatchSnapshot()
|
|
33
|
+
expect(container.firstChild).toHaveClass('search-button')
|
|
34
|
+
expect(container.firstChild).toHaveClass('bazinga')
|
|
35
|
+
expect(screen.getByText('Command palette')).toBeInTheDocument()
|
|
36
|
+
expect(screen.getByText('⌘')).toBeInTheDocument()
|
|
37
|
+
expect(screen.getByText('K')).toBeInTheDocument()
|
|
38
|
+
})
|
|
39
|
+
|
|
40
|
+
test('CSearchButton triggers click on matching shortcut', async () => {
|
|
41
|
+
const onClick = jest.fn()
|
|
42
|
+
const onTrigger = jest.fn()
|
|
43
|
+
|
|
44
|
+
render(<CSearchButton onClick={onClick} onTrigger={onTrigger} shortcut="meta+k,ctrl+k" />)
|
|
45
|
+
|
|
46
|
+
fireEvent.keyDown(document, { key: 'k', metaKey: true })
|
|
47
|
+
|
|
48
|
+
expect(onClick).toHaveBeenCalledTimes(0)
|
|
49
|
+
expect(onTrigger).toHaveBeenCalledTimes(1)
|
|
50
|
+
})
|
|
51
|
+
|
|
52
|
+
test('CSearchButton ignores plain typing in editable fields', async () => {
|
|
53
|
+
const onClick = jest.fn()
|
|
54
|
+
|
|
55
|
+
render(
|
|
56
|
+
<>
|
|
57
|
+
<input aria-label="Search input" />
|
|
58
|
+
<CSearchButton onClick={onClick} shortcut="k" />
|
|
59
|
+
</>,
|
|
60
|
+
)
|
|
61
|
+
|
|
62
|
+
fireEvent.keyDown(screen.getByLabelText('Search input'), { key: 'k' })
|
|
63
|
+
|
|
64
|
+
expect(onClick).not.toHaveBeenCalled()
|
|
65
|
+
})
|
|
66
|
+
|
|
67
|
+
test('CSearchButton highlights active shortcut keys', async () => {
|
|
68
|
+
render(<CSearchButton shortcut="meta+k,ctrl+k" />)
|
|
69
|
+
|
|
70
|
+
fireEvent.keyDown(document, { key: 'Meta', metaKey: true })
|
|
71
|
+
|
|
72
|
+
expect(screen.getByText('⌘')).toHaveClass('active')
|
|
73
|
+
|
|
74
|
+
fireEvent.keyDown(document, { key: 'k', metaKey: true })
|
|
75
|
+
|
|
76
|
+
expect(screen.getByText('⌘')).toHaveClass('active')
|
|
77
|
+
expect(screen.getByText('K')).toHaveClass('active')
|
|
78
|
+
|
|
79
|
+
fireEvent.keyUp(document, { key: 'k' })
|
|
80
|
+
|
|
81
|
+
expect(screen.getByText('⌘')).not.toHaveClass('active')
|
|
82
|
+
expect(screen.getByText('K')).not.toHaveClass('active')
|
|
83
|
+
})
|
|
84
|
+
|
|
85
|
+
test('CSearchButton triggers onTrigger on click', async () => {
|
|
86
|
+
const onClick = jest.fn()
|
|
87
|
+
const onTrigger = jest.fn()
|
|
88
|
+
|
|
89
|
+
render(<CSearchButton onClick={onClick} onTrigger={onTrigger} />)
|
|
90
|
+
|
|
91
|
+
fireEvent.click(screen.getByRole('button'))
|
|
92
|
+
|
|
93
|
+
expect(onClick).toHaveBeenCalledTimes(1)
|
|
94
|
+
expect(onTrigger).toHaveBeenCalledTimes(1)
|
|
95
|
+
})
|