@licklist/design 0.72.72-dev.1 → 0.72.72-dev.3
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/dist/auth/Router.d.ts.map +1 -1
- package/dist/auth/Router.js +18 -14
- package/dist/events/edit-event-modal/component/SelectEventProductSet/component/EditEventProductSet.js +1 -1
- package/dist/index.d.ts +0 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +0 -3
- package/dist/product-set/product/ProductControl.d.ts +2 -2
- package/dist/product-set/product/ProductControl.d.ts.map +1 -1
- package/dist/product-set/product/ProductControl.js +4 -53
- package/dist/product-set/utils/index.d.ts +1 -1
- package/package.json +1 -1
- package/src/auth/Router.tsx +19 -19
- package/src/index.ts +0 -1
- package/src/product-set/product/Product.stories.tsx +1 -1
- package/src/product-set/product/ProductControl.tsx +3 -55
- package/yarn.lock +123 -123
- package/dist/header/BookeditHeader.d.ts +0 -12
- package/dist/header/BookeditHeader.d.ts.map +0 -1
- package/dist/header/BookeditHeader.js +0 -21
- package/dist/header/Header.d.ts +0 -24
- package/dist/header/Header.d.ts.map +0 -1
- package/dist/header/Header.js +0 -81
- package/dist/header/elements/CompanySelector.d.ts +0 -11
- package/dist/header/elements/CompanySelector.d.ts.map +0 -1
- package/dist/header/elements/CompanySelector.js +0 -36
- package/dist/header/elements/index.d.ts +0 -3
- package/dist/header/elements/index.d.ts.map +0 -1
- package/dist/header/index.d.ts +0 -6
- package/dist/header/index.d.ts.map +0 -1
- package/src/header/BookeditHeader.tsx +0 -34
- package/src/header/Header.stories.tsx +0 -72
- package/src/header/Header.tsx +0 -107
- package/src/header/elements/CompanySelector.tsx +0 -47
- package/src/header/elements/Elements.stories.tsx +0 -33
- package/src/header/elements/index.ts +0 -3
- package/src/header/index.ts +0 -7
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { isEmpty } from 'lodash';
|
|
3
|
-
import { Form } from 'react-bootstrap';
|
|
4
|
-
|
|
5
|
-
function CompanySelector(param) {
|
|
6
|
-
var value = param.value, list = param.list, onChange = param.onChange;
|
|
7
|
-
var hasItems = !isEmpty(list);
|
|
8
|
-
var hasOneItem = list.length === 1;
|
|
9
|
-
return /*#__PURE__*/ jsxs("div", {
|
|
10
|
-
className: "header-company-selector-container",
|
|
11
|
-
children: [
|
|
12
|
-
hasOneItem && /*#__PURE__*/ jsx("span", {
|
|
13
|
-
className: "company-selector-item company-selector-item__disabled",
|
|
14
|
-
children: list[0].title
|
|
15
|
-
}),
|
|
16
|
-
hasItems && !hasOneItem && /*#__PURE__*/ jsx(Form.Group, {
|
|
17
|
-
className: "m-0",
|
|
18
|
-
children: /*#__PURE__*/ jsx(Form.Control, {
|
|
19
|
-
className: "header-company-selector",
|
|
20
|
-
defaultValue: value,
|
|
21
|
-
as: "select",
|
|
22
|
-
onChange: onChange,
|
|
23
|
-
children: hasItems && list.map(function(item) {
|
|
24
|
-
return /*#__PURE__*/ jsx("option", {
|
|
25
|
-
className: "company-selector-item",
|
|
26
|
-
value: item.id,
|
|
27
|
-
children: item.title
|
|
28
|
-
}, item.id);
|
|
29
|
-
})
|
|
30
|
-
})
|
|
31
|
-
})
|
|
32
|
-
]
|
|
33
|
-
});
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
export { CompanySelector as default };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/header/elements/index.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,eAAe,EAAE,CAAA"}
|
package/dist/header/index.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/header/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,kBAAkB,CAAA;AAC7C,OAAO,MAAM,MAAM,UAAU,CAAA;AAE7B,cAAc,YAAY,CAAA;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,EAAE,CAAA;AACjC,YAAY,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA"}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import { ReactNode } from 'react'
|
|
2
|
-
import { ReactComponent as LogoSvg } from '../assets/logo/bookedit.svg'
|
|
3
|
-
import Logo from '../logo/Logo'
|
|
4
|
-
import Header, { NavigationItem } from './Header'
|
|
5
|
-
|
|
6
|
-
interface Props {
|
|
7
|
-
children?: ReactNode | ReactNode[]
|
|
8
|
-
href?: string
|
|
9
|
-
leftNavs?: ReactNode | ReactNode[]
|
|
10
|
-
navItems?: NavigationItem[]
|
|
11
|
-
renderMobileNavigation?: (navigationItems: NavigationItem[]) => ReactNode
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
function BookeditHeader({
|
|
15
|
-
children,
|
|
16
|
-
href,
|
|
17
|
-
leftNavs,
|
|
18
|
-
navItems,
|
|
19
|
-
renderMobileNavigation,
|
|
20
|
-
}: Props) {
|
|
21
|
-
return (
|
|
22
|
-
<Header
|
|
23
|
-
logo={<Logo logo={<LogoSvg />} className='mt-auto mr-0 mr-sm-3' />}
|
|
24
|
-
href={href}
|
|
25
|
-
leftNavs={leftNavs}
|
|
26
|
-
navItems={navItems}
|
|
27
|
-
renderMobileNavigation={renderMobileNavigation}
|
|
28
|
-
>
|
|
29
|
-
{children}
|
|
30
|
-
</Header>
|
|
31
|
-
)
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
export default BookeditHeader
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
import StyledButton from '../static/StyledButton'
|
|
3
|
-
import BookeditHeader from './BookeditHeader'
|
|
4
|
-
import CompanySelector from './elements/CompanySelector'
|
|
5
|
-
import { NavigationItem } from './Header'
|
|
6
|
-
|
|
7
|
-
const providerNavItems: NavigationItem[] = [
|
|
8
|
-
{ href: `/profile`, label: 'profile', pathname: [] },
|
|
9
|
-
{ href: `/events`, label: 'events', pathname: [] },
|
|
10
|
-
{ href: `/sales`, label: 'salesAndEnquiries', pathname: [] },
|
|
11
|
-
{ href: `/product-sets`, label: 'productSets', pathname: [] },
|
|
12
|
-
{ href: `/affiliates`, label: 'affiliates', pathname: [] },
|
|
13
|
-
{ href: `/product-groups`, label: 'productGroups', pathname: [] },
|
|
14
|
-
{ href: '/#', label: 'loyalty', pathname: [] },
|
|
15
|
-
{ href: '/#', label: 'emailAndSms', pathname: [] },
|
|
16
|
-
{ href: '/#', label: 'followersAndProfiles', pathname: [] },
|
|
17
|
-
]
|
|
18
|
-
|
|
19
|
-
export default {
|
|
20
|
-
title: 'Header',
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
export const Bookedit = () => (
|
|
24
|
-
<BookeditHeader navItems={providerNavItems}>
|
|
25
|
-
<StyledButton size='sm' className='rounded-pill mr-2'>
|
|
26
|
-
Login
|
|
27
|
-
</StyledButton>
|
|
28
|
-
<StyledButton
|
|
29
|
-
size='sm'
|
|
30
|
-
className='rounded-pill'
|
|
31
|
-
variant='outline-secondary'
|
|
32
|
-
>
|
|
33
|
-
Sign up
|
|
34
|
-
</StyledButton>
|
|
35
|
-
</BookeditHeader>
|
|
36
|
-
)
|
|
37
|
-
|
|
38
|
-
Bookedit.story = {
|
|
39
|
-
parameters: {
|
|
40
|
-
info: `
|
|
41
|
-
Bookedit header component
|
|
42
|
-
`,
|
|
43
|
-
},
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
export const BookeditWithElements = () => (
|
|
47
|
-
<BookeditHeader
|
|
48
|
-
leftNavs={
|
|
49
|
-
<div className='header-elements'>
|
|
50
|
-
<CompanySelector
|
|
51
|
-
value={1}
|
|
52
|
-
list={[
|
|
53
|
-
{ id: 1, title: 'Company #1' },
|
|
54
|
-
{ id: 2, title: 'Company #2' },
|
|
55
|
-
]}
|
|
56
|
-
onChange={() => null}
|
|
57
|
-
/>
|
|
58
|
-
</div>
|
|
59
|
-
}
|
|
60
|
-
navItems={providerNavItems}
|
|
61
|
-
/>
|
|
62
|
-
)
|
|
63
|
-
|
|
64
|
-
BookeditWithElements.story = {
|
|
65
|
-
name: 'Bookedit with elements',
|
|
66
|
-
|
|
67
|
-
parameters: {
|
|
68
|
-
info: `
|
|
69
|
-
Bookedit header component
|
|
70
|
-
`,
|
|
71
|
-
},
|
|
72
|
-
}
|
package/src/header/Header.tsx
DELETED
|
@@ -1,107 +0,0 @@
|
|
|
1
|
-
import { Accordion } from '@mantine/core'
|
|
2
|
-
import { ReactNode } from 'react'
|
|
3
|
-
import Nav from 'react-bootstrap/Nav'
|
|
4
|
-
import Navbar from 'react-bootstrap/Navbar'
|
|
5
|
-
import { NavLink } from 'react-router-dom'
|
|
6
|
-
|
|
7
|
-
export type NavigationItem =
|
|
8
|
-
| {
|
|
9
|
-
href: string
|
|
10
|
-
label: string
|
|
11
|
-
pathname: string[]
|
|
12
|
-
}
|
|
13
|
-
| {
|
|
14
|
-
label: string
|
|
15
|
-
links: {
|
|
16
|
-
href: string
|
|
17
|
-
label: string
|
|
18
|
-
pathname: string[]
|
|
19
|
-
}[]
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
type Props = {
|
|
23
|
-
children?: ReactNode | ReactNode[]
|
|
24
|
-
href?: string
|
|
25
|
-
logo?: ReactNode
|
|
26
|
-
leftNavs?: ReactNode | ReactNode[]
|
|
27
|
-
navItems?: NavigationItem[]
|
|
28
|
-
renderMobileNavigation?: (navigationItems: NavigationItem[]) => ReactNode
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
function Header({
|
|
32
|
-
children,
|
|
33
|
-
href,
|
|
34
|
-
logo,
|
|
35
|
-
leftNavs,
|
|
36
|
-
navItems,
|
|
37
|
-
renderMobileNavigation,
|
|
38
|
-
}: Props) {
|
|
39
|
-
return (
|
|
40
|
-
<Navbar
|
|
41
|
-
className='header'
|
|
42
|
-
variant='light'
|
|
43
|
-
collapseOnSelect
|
|
44
|
-
expand={false}
|
|
45
|
-
bg='none'
|
|
46
|
-
>
|
|
47
|
-
<div className='header-logo-container'>
|
|
48
|
-
<Navbar.Brand href={href} className='p-0'>
|
|
49
|
-
{logo}
|
|
50
|
-
</Navbar.Brand>
|
|
51
|
-
{navItems?.length && (
|
|
52
|
-
<>
|
|
53
|
-
<Navbar.Toggle
|
|
54
|
-
aria-controls='header-navbar-nav'
|
|
55
|
-
className='d-block d-md-none ml-2 border-0'
|
|
56
|
-
/>
|
|
57
|
-
</>
|
|
58
|
-
)}
|
|
59
|
-
</div>
|
|
60
|
-
<Nav className='mr-auto my-auto'>{leftNavs}</Nav>
|
|
61
|
-
<div className='user-section ml-3 my-auto'>{children}</div>
|
|
62
|
-
{navItems?.length && (
|
|
63
|
-
<Navbar.Collapse id='header-navbar-nav'>
|
|
64
|
-
{renderMobileNavigation ? (
|
|
65
|
-
renderMobileNavigation(navItems)
|
|
66
|
-
) : (
|
|
67
|
-
<Nav className='mr-auto'>
|
|
68
|
-
{navItems.map((item) => {
|
|
69
|
-
if ('links' in item) {
|
|
70
|
-
return (
|
|
71
|
-
<Accordion defaultValue='Apples'>
|
|
72
|
-
<Accordion.Item value={item.label}>
|
|
73
|
-
<Accordion.Control>{item.label}</Accordion.Control>
|
|
74
|
-
{item.links.map((subItem) => (
|
|
75
|
-
<Accordion.Panel key={subItem.href + subItem.label}>
|
|
76
|
-
<Nav.Item key={`${subItem.label}-${subItem.href}`}>
|
|
77
|
-
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
|
|
78
|
-
{/* @ts-ignore */}
|
|
79
|
-
<NavLink
|
|
80
|
-
exact
|
|
81
|
-
to={subItem.href}
|
|
82
|
-
className='nav-link'
|
|
83
|
-
>
|
|
84
|
-
{subItem.label}
|
|
85
|
-
</NavLink>
|
|
86
|
-
</Nav.Item>
|
|
87
|
-
</Accordion.Panel>
|
|
88
|
-
))}
|
|
89
|
-
</Accordion.Item>
|
|
90
|
-
</Accordion>
|
|
91
|
-
)
|
|
92
|
-
}
|
|
93
|
-
return (
|
|
94
|
-
<Nav.Link href={item.href} key={`${item.href}${item.label}`}>
|
|
95
|
-
{item.label}
|
|
96
|
-
</Nav.Link>
|
|
97
|
-
)
|
|
98
|
-
})}
|
|
99
|
-
</Nav>
|
|
100
|
-
)}
|
|
101
|
-
</Navbar.Collapse>
|
|
102
|
-
)}
|
|
103
|
-
</Navbar>
|
|
104
|
-
)
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
export default Header
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
import { isEmpty } from 'lodash'
|
|
2
|
-
import { Form } from 'react-bootstrap'
|
|
3
|
-
|
|
4
|
-
export interface CompanySelectorProps {
|
|
5
|
-
value: number
|
|
6
|
-
list: { id: number; title: string }[]
|
|
7
|
-
onChange: (e: React.ChangeEvent<HTMLSelectElement>) => void
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
function CompanySelector({ value, list, onChange }: CompanySelectorProps) {
|
|
11
|
-
const hasItems = !isEmpty(list)
|
|
12
|
-
const hasOneItem = list.length === 1
|
|
13
|
-
|
|
14
|
-
return (
|
|
15
|
-
<div className='header-company-selector-container'>
|
|
16
|
-
{hasOneItem && (
|
|
17
|
-
<span className='company-selector-item company-selector-item__disabled'>
|
|
18
|
-
{list[0].title}
|
|
19
|
-
</span>
|
|
20
|
-
)}
|
|
21
|
-
|
|
22
|
-
{hasItems && !hasOneItem && (
|
|
23
|
-
<Form.Group className='m-0'>
|
|
24
|
-
<Form.Control
|
|
25
|
-
className='header-company-selector'
|
|
26
|
-
defaultValue={value}
|
|
27
|
-
as='select'
|
|
28
|
-
onChange={onChange}
|
|
29
|
-
>
|
|
30
|
-
{hasItems &&
|
|
31
|
-
list.map((item) => (
|
|
32
|
-
<option
|
|
33
|
-
className='company-selector-item'
|
|
34
|
-
key={item.id}
|
|
35
|
-
value={item.id}
|
|
36
|
-
>
|
|
37
|
-
{item.title}
|
|
38
|
-
</option>
|
|
39
|
-
))}
|
|
40
|
-
</Form.Control>
|
|
41
|
-
</Form.Group>
|
|
42
|
-
)}
|
|
43
|
-
</div>
|
|
44
|
-
)
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
export default CompanySelector
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import { Meta, Story } from '@storybook/react'
|
|
2
|
-
import {
|
|
3
|
-
CompanySelectorProps,
|
|
4
|
-
default as CompanySelectorComponent,
|
|
5
|
-
} from './CompanySelector'
|
|
6
|
-
|
|
7
|
-
export default {
|
|
8
|
-
title: 'Header/Elements',
|
|
9
|
-
} as Meta
|
|
10
|
-
|
|
11
|
-
export const CompanySelector: Story<CompanySelectorProps> = (args) => {
|
|
12
|
-
return <CompanySelectorComponent {...args} />
|
|
13
|
-
}
|
|
14
|
-
CompanySelector.args = {
|
|
15
|
-
value: 1,
|
|
16
|
-
list: [
|
|
17
|
-
{ id: 1, title: 'Company #1' },
|
|
18
|
-
{ id: 2, title: 'Company #2' },
|
|
19
|
-
{ id: 3, title: 'Company #3' },
|
|
20
|
-
],
|
|
21
|
-
onChange: (e) => console.info(e),
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
export const CompanySelectorWithOneItem: Story<CompanySelectorProps> = (
|
|
25
|
-
args,
|
|
26
|
-
) => {
|
|
27
|
-
return <CompanySelectorComponent {...args} />
|
|
28
|
-
}
|
|
29
|
-
CompanySelectorWithOneItem.args = {
|
|
30
|
-
value: 1,
|
|
31
|
-
list: [{ id: 1, title: 'Company #1' }],
|
|
32
|
-
onChange: (e) => console.info(e),
|
|
33
|
-
}
|