trepur_components 1.0.0 → 1.0.2
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/components/Accordion/Accordion.stories.tsx +1 -1
- package/dist/components/Accordion/index.tsx +2 -2
- package/dist/components/Carousel/index.tsx +1 -1
- package/dist/components/Collapsible/index.tsx +1 -1
- package/dist/components/FooterBar/{footerBar.stories.tsx → FooterBar.stories.tsx} +0 -0
- package/dist/components/HamburgerIcon/index.tsx +1 -1
- package/dist/components/ImageLinkList/ImageLinkList.stories.tsx +5 -3
- package/dist/components/ImageLinkList/index.tsx +1 -1
- package/dist/components/Nav/index.tsx +4 -4
- package/dist/src/lib/components/Accordion/Accordion.stories.js +19 -11
- package/dist/src/lib/components/Accordion/Accordion.stories.js.map +1 -1
- package/dist/src/lib/components/Accordion/index.d.ts +1 -2
- package/dist/src/lib/components/Accordion/index.js +1 -1
- package/dist/src/lib/components/Accordion/index.js.map +1 -1
- package/dist/src/lib/components/AlertBar/AlertBar.stories.js +1 -1
- package/dist/src/lib/components/AlertBar/AlertBar.stories.js.map +1 -1
- package/dist/src/lib/components/AlertBar/index.js +21 -19
- package/dist/src/lib/components/AlertBar/index.js.map +1 -1
- package/dist/src/lib/components/Breadcrumbs/Breadcrumbs.stories.js.map +1 -1
- package/dist/src/lib/components/Breadcrumbs/index.js +8 -10
- package/dist/src/lib/components/Breadcrumbs/index.js.map +1 -1
- package/dist/src/lib/components/BreadcrumbsBordered/BreadcrumbsBordered.stories.js +1 -1
- package/dist/src/lib/components/BreadcrumbsBordered/BreadcrumbsBordered.stories.js.map +1 -1
- package/dist/src/lib/components/BreadcrumbsBordered/index.d.ts +1 -1
- package/dist/src/lib/components/BreadcrumbsBordered/index.js +7 -7
- package/dist/src/lib/components/BreadcrumbsBordered/index.js.map +1 -1
- package/dist/src/lib/components/BreadcrumbsItem/BreadcrumbsItem.stories.js +2 -2
- package/dist/src/lib/components/BreadcrumbsItem/BreadcrumbsItem.stories.js.map +1 -1
- package/dist/src/lib/components/BreadcrumbsItem/index.js +33 -35
- package/dist/src/lib/components/BreadcrumbsItem/index.js.map +1 -1
- package/dist/src/lib/components/Button/button.stories.js +64 -19
- package/dist/src/lib/components/Button/button.stories.js.map +1 -1
- package/dist/src/lib/components/Button/index.js +11 -11
- package/dist/src/lib/components/Button/index.js.map +1 -1
- package/dist/src/lib/components/Card/Card.stories.d.ts +4 -1
- package/dist/src/lib/components/Card/Card.stories.js +32 -32
- package/dist/src/lib/components/Card/Card.stories.js.map +1 -1
- package/dist/src/lib/components/Card/index.d.ts +3 -3
- package/dist/src/lib/components/Card/index.js +43 -40
- package/dist/src/lib/components/Card/index.js.map +1 -1
- package/dist/src/lib/components/CardWithTopImage/CardWithTopImage.stories.js +3 -3
- package/dist/src/lib/components/CardWithTopImage/CardWithTopImage.stories.js.map +1 -1
- package/dist/src/lib/components/CardWithTopImage/index.js +1 -1
- package/dist/src/lib/components/CardWithTopImage/index.js.map +1 -1
- package/dist/src/lib/components/Carousel/Carousel.stories.js +12 -12
- package/dist/src/lib/components/Carousel/Carousel.stories.js.map +1 -1
- package/dist/src/lib/components/Carousel/index.d.ts +6 -8
- package/dist/src/lib/components/Carousel/index.js +95 -54
- package/dist/src/lib/components/Carousel/index.js.map +1 -1
- package/dist/src/lib/components/ChevronCard/ChevronCard.stories.js +1 -1
- package/dist/src/lib/components/ChevronCard/ChevronCard.stories.js.map +1 -1
- package/dist/src/lib/components/ChevronCard/index.js +8 -8
- package/dist/src/lib/components/ChevronCard/index.js.map +1 -1
- package/dist/src/lib/components/Collapsible/Collapsible.stories.js +5 -3
- package/dist/src/lib/components/Collapsible/Collapsible.stories.js.map +1 -1
- package/dist/src/lib/components/Collapsible/index.d.ts +1 -1
- package/dist/src/lib/components/Collapsible/index.js +22 -22
- package/dist/src/lib/components/Collapsible/index.js.map +1 -1
- package/dist/src/lib/components/Column/Column.stories.js +42 -8
- package/dist/src/lib/components/Column/Column.stories.js.map +1 -1
- package/dist/src/lib/components/Column/index.js +2 -2
- package/dist/src/lib/components/Column/index.js.map +1 -1
- package/dist/src/lib/components/Container/Container.stories.js +1 -1
- package/dist/src/lib/components/Container/Container.stories.js.map +1 -1
- package/dist/src/lib/components/Container/index.js +1 -1
- package/dist/src/lib/components/Container/index.js.map +1 -1
- package/dist/src/lib/components/FooterBar/footerBar.stories.js +2 -2
- package/dist/src/lib/components/FooterBar/footerBar.stories.js.map +1 -1
- package/dist/src/lib/components/FooterBar/index.js +1 -1
- package/dist/src/lib/components/FooterBar/index.js.map +1 -1
- package/dist/src/lib/components/Form/Form.stories.js +1 -1
- package/dist/src/lib/components/Form/Form.stories.js.map +1 -1
- package/dist/src/lib/components/Form/index.js +4 -4
- package/dist/src/lib/components/Form/index.js.map +1 -1
- package/dist/src/lib/components/FyreCard/FyreCard.stories.js +3 -3
- package/dist/src/lib/components/FyreCard/FyreCard.stories.js.map +1 -1
- package/dist/src/lib/components/FyreCard/index.js +6 -7
- package/dist/src/lib/components/FyreCard/index.js.map +1 -1
- package/dist/src/lib/components/Greeting/Greeting.stories.js +1 -1
- package/dist/src/lib/components/Greeting/Greeting.stories.js.map +1 -1
- package/dist/src/lib/components/Greeting/index.js +4 -4
- package/dist/src/lib/components/Greeting/index.js.map +1 -1
- package/dist/src/lib/components/HamburgerIcon/HamburgerIcon.stories.d.ts +6 -0
- package/dist/src/lib/components/HamburgerIcon/HamburgerIcon.stories.js +46 -0
- package/dist/src/lib/components/HamburgerIcon/HamburgerIcon.stories.js.map +1 -0
- package/dist/src/lib/components/HamburgerIcon/index.d.ts +7 -0
- package/dist/src/lib/components/HamburgerIcon/index.js +26 -0
- package/dist/src/lib/components/HamburgerIcon/index.js.map +1 -0
- package/dist/src/lib/components/Icon/Icon.stories.d.ts +1 -1
- package/dist/src/lib/components/Icon/Icon.stories.js +4 -2
- package/dist/src/lib/components/Icon/Icon.stories.js.map +1 -1
- package/dist/src/lib/components/Icon/index.d.ts +4 -2
- package/dist/src/lib/components/Icon/index.js +17 -3
- package/dist/src/lib/components/Icon/index.js.map +1 -1
- package/dist/src/lib/components/Image/Image.stories.js +2 -2
- package/dist/src/lib/components/Image/Image.stories.js.map +1 -1
- package/dist/src/lib/components/Image/index.js +3 -3
- package/dist/src/lib/components/Image/index.js.map +1 -1
- package/dist/src/lib/components/ImageLink/ImageLink.stories.d.ts +4 -1
- package/dist/src/lib/components/ImageLink/ImageLink.stories.js +8 -7
- package/dist/src/lib/components/ImageLink/ImageLink.stories.js.map +1 -1
- package/dist/src/lib/components/ImageLink/index.js +6 -6
- package/dist/src/lib/components/ImageLink/index.js.map +1 -1
- package/dist/src/lib/components/ImageLinkList/ImageLinkList.stories.d.ts +2 -2
- package/dist/src/lib/components/ImageLinkList/ImageLinkList.stories.js +5 -3
- package/dist/src/lib/components/ImageLinkList/ImageLinkList.stories.js.map +1 -1
- package/dist/src/lib/components/ImageLinkList/index.d.ts +1 -1
- package/dist/src/lib/components/ImageLinkList/index.js +3 -3
- package/dist/src/lib/components/ImageLinkList/index.js.map +1 -1
- package/dist/src/lib/components/InformationIcon/InformationIcon.stories.js +5 -3
- package/dist/src/lib/components/InformationIcon/InformationIcon.stories.js.map +1 -1
- package/dist/src/lib/components/InformationIcon/index.d.ts +1 -1
- package/dist/src/lib/components/InformationIcon/index.js +12 -13
- package/dist/src/lib/components/InformationIcon/index.js.map +1 -1
- package/dist/src/lib/components/Input/Input.stories.js +10 -10
- package/dist/src/lib/components/Input/Input.stories.js.map +1 -1
- package/dist/src/lib/components/Input/index.d.ts +1 -1
- package/dist/src/lib/components/Input/index.js +14 -14
- package/dist/src/lib/components/Input/index.js.map +1 -1
- package/dist/src/lib/components/Jumbotron/Jumbotron.stories.js +1 -1
- package/dist/src/lib/components/Jumbotron/Jumbotron.stories.js.map +1 -1
- package/dist/src/lib/components/Jumbotron/index.js +1 -1
- package/dist/src/lib/components/Jumbotron/index.js.map +1 -1
- package/dist/src/lib/components/Nav/Nav.stories.d.ts +6 -0
- package/dist/src/lib/components/Nav/Nav.stories.js +12 -12
- package/dist/src/lib/components/Nav/Nav.stories.js.map +1 -1
- package/dist/src/lib/components/Nav/index.d.ts +2 -2
- package/dist/src/lib/components/Nav/index.js +25 -35
- package/dist/src/lib/components/Nav/index.js.map +1 -1
- package/dist/src/lib/components/NavItem/NavItem.stories.js +1 -1
- package/dist/src/lib/components/NavItem/NavItem.stories.js.map +1 -1
- package/dist/src/lib/components/NavItem/index.js +2 -2
- package/dist/src/lib/components/NavItem/index.js.map +1 -1
- package/dist/src/lib/components/NewsCard/NewsCard.stories.js +1 -1
- package/dist/src/lib/components/NewsCard/NewsCard.stories.js.map +1 -1
- package/dist/src/lib/components/NewsCard/index.js +3 -3
- package/dist/src/lib/components/NewsCard/index.js.map +1 -1
- package/dist/src/lib/components/Profile/Profile.stories.js +2 -2
- package/dist/src/lib/components/Profile/Profile.stories.js.map +1 -1
- package/dist/src/lib/components/Profile/index.js +9 -11
- package/dist/src/lib/components/Profile/index.js.map +1 -1
- package/dist/src/lib/components/Row/Row.stories.js +4 -4
- package/dist/src/lib/components/Row/Row.stories.js.map +1 -1
- package/dist/src/lib/components/Row/index.js.map +1 -1
- package/dist/src/lib/components/Search/Search.stories.js +1 -1
- package/dist/src/lib/components/Search/Search.stories.js.map +1 -1
- package/dist/src/lib/components/Search/index.js +10 -10
- package/dist/src/lib/components/Search/index.js.map +1 -1
- package/dist/src/lib/components/SocialBlock/SocialBlock.stories.js +9 -9
- package/dist/src/lib/components/SocialBlock/SocialBlock.stories.js.map +1 -1
- package/dist/src/lib/components/SocialBlock/index.d.ts +2 -2
- package/dist/src/lib/components/SocialBlock/index.js +20 -21
- package/dist/src/lib/components/SocialBlock/index.js.map +1 -1
- package/dist/src/lib/components/StarRating/StarRating.stories.js +1 -1
- package/dist/src/lib/components/StarRating/StarRating.stories.js.map +1 -1
- package/dist/src/lib/components/StarRating/index.js +3 -3
- package/dist/src/lib/components/StarRating/index.js.map +1 -1
- package/dist/src/lib/components/Testimonial/Testimonial.stories.js +1 -1
- package/dist/src/lib/components/Testimonial/Testimonial.stories.js.map +1 -1
- package/dist/src/lib/components/Testimonial/index.js.map +1 -1
- package/dist/src/lib/components/TextAndTitle/TextAndTitle.stories.js +2 -2
- package/dist/src/lib/components/TextAndTitle/TextAndTitle.stories.js.map +1 -1
- package/dist/src/lib/components/TextAndTitle/index.d.ts +2 -2
- package/dist/src/lib/components/TextAndTitle/index.js +55 -64
- package/dist/src/lib/components/TextAndTitle/index.js.map +1 -1
- package/dist/src/lib/components/TextArea/TextArea.stories.js +3 -3
- package/dist/src/lib/components/TextArea/TextArea.stories.js.map +1 -1
- package/dist/src/lib/components/TextArea/index.js +4 -3
- package/dist/src/lib/components/TextArea/index.js.map +1 -1
- package/dist/src/lib/components/Timeline/Timeline.stories.js +12 -13
- package/dist/src/lib/components/Timeline/Timeline.stories.js.map +1 -1
- package/dist/src/lib/components/Timeline/index.d.ts +1 -1
- package/dist/src/lib/components/Timeline/index.js +57 -35
- package/dist/src/lib/components/Timeline/index.js.map +1 -1
- package/dist/src/lib/components/Tubestops/Tubestops.stories.js +4 -4
- package/dist/src/lib/components/Tubestops/Tubestops.stories.js.map +1 -1
- package/dist/src/lib/components/Tubestops/index.js +5 -5
- package/dist/src/lib/components/Tubestops/index.js.map +1 -1
- package/dist/src/lib/components/UserIcon/UserIcon.stories.js.map +1 -1
- package/dist/src/lib/components/UserIcon/index.js +5 -6
- package/dist/src/lib/components/UserIcon/index.js.map +1 -1
- package/dist/src/lib/components/Video/Video.stories.js +1 -1
- package/dist/src/lib/components/Video/Video.stories.js.map +1 -1
- package/dist/src/lib/components/Video/index.js +2 -2
- package/dist/src/lib/components/Video/index.js.map +1 -1
- package/dist/src/lib/index.js.map +1 -1
- package/dist/src/lib/typography/Fonts.stories.d.ts +2 -2
- package/dist/src/lib/typography/Fonts.stories.js +2 -32
- package/dist/src/lib/typography/Fonts.stories.js.map +1 -1
- package/dist/src/lib/typography/index.d.ts +4 -2
- package/dist/src/lib/typography/index.js.map +1 -1
- package/dist/src/lib/utils/controls.js.map +1 -1
- package/dist/src/lib/utils/theme.d.ts +3 -2
- package/dist/src/lib/utils/theme.js +20 -0
- package/dist/src/lib/utils/theme.js.map +1 -1
- package/dist/tailwind.config.d.ts +1 -0
- package/dist/tailwind.config.js +1 -0
- package/dist/tailwind.config.js.map +1 -1
- package/package.json +2 -1
|
@@ -4,7 +4,7 @@ import Collapsible, { Props as collapsibleProps } from '@components/Collapsible'
|
|
|
4
4
|
export interface Props {
|
|
5
5
|
id?: string
|
|
6
6
|
className?: string
|
|
7
|
-
items:
|
|
7
|
+
items: any
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
const Accordion: React.FC<Props> = ({
|
|
@@ -14,7 +14,7 @@ const Accordion: React.FC<Props> = ({
|
|
|
14
14
|
}: Props): JSX.Element => {
|
|
15
15
|
return (
|
|
16
16
|
<div id={id} className={className}>
|
|
17
|
-
{items?.map((item, i) => {
|
|
17
|
+
{items?.map((item: any, i: number) => {
|
|
18
18
|
return (
|
|
19
19
|
<Collapsible
|
|
20
20
|
key={`collapsible_item_${i}`}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useState } from 'react'
|
|
2
|
-
import 'keen-slider/keen-slider.min.css'
|
|
2
|
+
// import 'keen-slider/keen-slider.min.css'
|
|
3
3
|
import { useKeenSlider, KeenSliderInstance, KeenSliderHooks, KeenSliderOptions } from 'keen-slider/react'
|
|
4
4
|
import classNames from 'classnames'
|
|
5
5
|
import Icon from '@components/Icon'
|
|
File without changes
|
|
@@ -2,7 +2,7 @@ import React, { useState } from 'react'
|
|
|
2
2
|
import classNames from 'classnames'
|
|
3
3
|
import Button from '@components/Button'
|
|
4
4
|
|
|
5
|
-
interface Props extends Partial<Pick<HTMLElement, 'className' | 'id'>> {
|
|
5
|
+
export interface Props extends Partial<Pick<HTMLElement, 'className' | 'id'>> {
|
|
6
6
|
opened?: boolean
|
|
7
7
|
onClick?: React.MouseEventHandler
|
|
8
8
|
}
|
|
@@ -1,14 +1,16 @@
|
|
|
1
1
|
import React from 'react'
|
|
2
2
|
import { idAndClassName } from '@utils/controls'
|
|
3
|
-
import ImageLinkList from './index'
|
|
3
|
+
import ImageLinkList, { Props as imageLinkListProps } from './index'
|
|
4
4
|
import { ComponentStory, ComponentMeta } from '@storybook/react'
|
|
5
5
|
|
|
6
|
-
const getLinks = ():
|
|
6
|
+
const getLinks = (): any => {
|
|
7
7
|
return new Array(16).fill(null).map(() => {
|
|
8
8
|
return {
|
|
9
9
|
image: 'https://picsum.photos/400/400',
|
|
10
10
|
title: 'Hi',
|
|
11
|
-
|
|
11
|
+
buttonProps: {
|
|
12
|
+
children: <p>button</p>
|
|
13
|
+
}
|
|
12
14
|
}
|
|
13
15
|
})
|
|
14
16
|
}
|
|
@@ -3,10 +3,10 @@ import classNames from 'classnames'
|
|
|
3
3
|
import NavItem, { Props as navItemProps } from '@components/NavItem'
|
|
4
4
|
import HamburgerIcon from '@components/HamburgerIcon'
|
|
5
5
|
|
|
6
|
-
interface Props {
|
|
6
|
+
export interface Props {
|
|
7
7
|
id: string
|
|
8
8
|
className: string
|
|
9
|
-
navLinks: navItemProps
|
|
9
|
+
navLinks: Array<navItemProps>
|
|
10
10
|
asSideBar: boolean
|
|
11
11
|
dropdownNavHeight: string
|
|
12
12
|
logo: string
|
|
@@ -68,7 +68,7 @@ const Nav = ({
|
|
|
68
68
|
|
|
69
69
|
const desktopClassList = classNames({
|
|
70
70
|
'fixed w-full z-50 top-0 mt-0': fixedTop
|
|
71
|
-
}, 'w-full justify-between hidden md:flex items-center justify-between sm:items-stretch text-center')
|
|
71
|
+
}, 'w-full justify-between hidden md:flex items-center justify-between sm:items-stretch text-center flex bg-primary')
|
|
72
72
|
|
|
73
73
|
const toggleMenu = (): void => {
|
|
74
74
|
getNavStatus?.(asSideBar, true)
|
|
@@ -99,7 +99,7 @@ const Nav = ({
|
|
|
99
99
|
</a>
|
|
100
100
|
</div>
|
|
101
101
|
|
|
102
|
-
<div id='destop-nav' className={
|
|
102
|
+
<div id='destop-nav' className={desktopClassList}>
|
|
103
103
|
<div className={logoClassList}>
|
|
104
104
|
<a id='logo-link' className='mx-auto' href={logoLink}>
|
|
105
105
|
<img className={logoImageClassList} src={theme === 'dark' ? logoDarkTheme : logo} alt='Logo' />
|
|
@@ -1,24 +1,28 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import Accordion from './index';
|
|
3
|
-
import { idAndClassName } from '
|
|
3
|
+
import { idAndClassName } from '../../utils/controls';
|
|
4
4
|
const items = [
|
|
5
5
|
{
|
|
6
6
|
title: 'This is a title',
|
|
7
7
|
boldTitle: true,
|
|
8
8
|
iconProps: {
|
|
9
9
|
type: 'heart',
|
|
10
|
-
hollow: true
|
|
10
|
+
hollow: true,
|
|
11
|
+
colour: 'white',
|
|
12
|
+
bgColour: 'primary'
|
|
11
13
|
},
|
|
12
|
-
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
14
|
+
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
13
15
|
},
|
|
14
16
|
{
|
|
15
17
|
title: 'This is a title',
|
|
16
18
|
subtitle: 'This is a subtitle',
|
|
17
19
|
boldTitle: true,
|
|
18
20
|
iconProps: {
|
|
19
|
-
type: 'heart'
|
|
21
|
+
type: 'heart',
|
|
22
|
+
colour: 'white',
|
|
23
|
+
bgColour: 'primary'
|
|
20
24
|
},
|
|
21
|
-
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
25
|
+
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
22
26
|
},
|
|
23
27
|
{
|
|
24
28
|
title: 'This is a title',
|
|
@@ -27,27 +31,31 @@ const items = [
|
|
|
27
31
|
iconProps: {
|
|
28
32
|
type: 'heart',
|
|
29
33
|
size: 2,
|
|
30
|
-
hollow: true
|
|
34
|
+
hollow: true,
|
|
35
|
+
colour: 'white',
|
|
36
|
+
bgColour: 'primary'
|
|
31
37
|
},
|
|
32
|
-
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
38
|
+
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
33
39
|
},
|
|
34
40
|
{
|
|
35
41
|
title: 'This is a title',
|
|
36
42
|
subtitle: 'This is a subtitle',
|
|
37
43
|
boldTitle: true,
|
|
38
|
-
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
44
|
+
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
39
45
|
},
|
|
40
46
|
{
|
|
41
47
|
boldTitle: true,
|
|
42
48
|
iconProps: {
|
|
43
|
-
type: 'heart'
|
|
49
|
+
type: 'heart',
|
|
50
|
+
colour: 'white',
|
|
51
|
+
bgColour: 'primary'
|
|
44
52
|
},
|
|
45
|
-
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
53
|
+
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
46
54
|
},
|
|
47
55
|
{
|
|
48
56
|
title: 'This is title 6',
|
|
49
57
|
boldTitle: true,
|
|
50
|
-
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
58
|
+
children: React.createElement("p", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper in neque in venenatis. Mauris scelerisque orci magna, et ultricies nulla lobortis ac. Aliquam vitae faucibus nisl. Nunc in tellus libero. Donec ut augue consequat, convallis risus in, pulvinar nibh. Duis mi nibh, posuere molestie pharetra cursus, viverra ut dolor. Vivamus eget arcu dui. Donec ullamcorper ornare justo sed feugiat. Curabitur aliquam lectus sed quam pharetra scelerisque. Integer vitae eleifend dolor. Duis luctus metus ipsum, et commodo magna bibendum quis. Quisque gravida leo sodales quam feugiat, id vulputate arcu pulvinar. Duis dictum gravida risus, et bibendum nunc condimentum eu.")
|
|
51
59
|
}
|
|
52
60
|
];
|
|
53
61
|
const componentMeta = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/Accordion/Accordion.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,SAAS,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAGhD,MAAM,KAAK,GAAG;
|
|
1
|
+
{"version":3,"file":"Accordion.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/Accordion/Accordion.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,SAAS,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAGhD,MAAM,KAAK,GAAG;IACZ;QACE,KAAK,EAAE,iBAAiB;QACxB,SAAS,EAAE,IAAI;QACf,SAAS,EAAE;YACT,IAAI,EAAE,OAAO;YACb,MAAM,EAAE,IAAI;YACZ,MAAM,EAAE,OAAO;YACf,QAAQ,EAAE,SAAS;SACpB;QACD,QAAQ,EAAE,qsBAA0qB;KACrrB;IACD;QACE,KAAK,EAAE,iBAAiB;QACxB,QAAQ,EAAE,oBAAoB;QAC9B,SAAS,EAAE,IAAI;QACf,SAAS,EAAE;YACT,IAAI,EAAE,OAAO;YACb,MAAM,EAAE,OAAO;YACf,QAAQ,EAAE,SAAS;SACpB;QACD,QAAQ,EAAE,qsBAA0qB;KACrrB;IACD;QACE,KAAK,EAAE,iBAAiB;QACxB,QAAQ,EAAE,oBAAoB;QAC9B,SAAS,EAAE,IAAI;QACf,SAAS,EAAE;YACT,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,CAAC;YACP,MAAM,EAAE,IAAI;YACZ,MAAM,EAAE,OAAO;YACf,QAAQ,EAAE,SAAS;SACpB;QACD,QAAQ,EAAE,qsBAA0qB;KACrrB;IACD;QACE,KAAK,EAAE,iBAAiB;QACxB,QAAQ,EAAE,oBAAoB;QAC9B,SAAS,EAAE,IAAI;QACf,QAAQ,EAAE,qsBAA0qB;KACrrB;IACD;QACE,SAAS,EAAE,IAAI;QACf,SAAS,EAAE;YACT,IAAI,EAAE,OAAO;YACb,MAAM,EAAE,OAAO;YACf,QAAQ,EAAE,SAAS;SACpB;QACD,QAAQ,EAAE,qsBAA0qB;KACrrB;IACD;QACE,KAAK,EAAE,iBAAiB;QACxB,SAAS,EAAE,IAAI;QACf,QAAQ,EAAE,qsBAA0qB;KACrrB;CACF,CAAA;AAED,MAAM,aAAa,GAAoC;IACrD,KAAK,EAAE,6CAA6C;IACpD,SAAS,EAAE,SAAS;IACpB,QAAQ,kCACH,cAAc,KACjB,KAAK,EAAE;YACL,WAAW,EAAE,+BAA+B;YAC5C,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE;YAC9C,KAAK,EAAE;gBACL,QAAQ,EAAE,WAAW;gBACrB,IAAI,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;gBAC1B,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF,GACF;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,KAAK;KACb;CACF,CAAA;AAED,MAAM,QAAQ,GAAqC,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,SAAS,oBAAK,IAAI,EAAI,CAAA;AAEpF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE3C,eAAe,aAAa,CAAA"}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { Props as collapsibleProps } from '../Collapsible';
|
|
3
2
|
export interface Props {
|
|
4
3
|
id?: string;
|
|
5
4
|
className?: string;
|
|
6
|
-
items:
|
|
5
|
+
items: any;
|
|
7
6
|
}
|
|
8
7
|
declare const Accordion: React.FC<Props>;
|
|
9
8
|
export default Accordion;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import Collapsible from '../Collapsible';
|
|
3
3
|
const Accordion = ({ id, className, items }) => {
|
|
4
|
-
return (React.createElement("div",
|
|
4
|
+
return (React.createElement("div", { id: id, className: className }, items === null || items === void 0 ? void 0 : items.map((item, i) => {
|
|
5
5
|
return (React.createElement(Collapsible, Object.assign({ key: `collapsible_item_${i}` }, item), item.children));
|
|
6
6
|
})));
|
|
7
7
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/Accordion/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/Accordion/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,WAA0C,MAAM,yBAAyB,CAAA;AAQhF,MAAM,SAAS,GAAoB,CAAC,EAClC,EAAE,EACF,SAAS,EACT,KAAK,EACC,EAAe,EAAE;IACvB,OAAO,CACL,6BAAK,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,IAC9B,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,GAAG,CAAC,CAAC,IAAS,EAAE,CAAS,EAAE,EAAE;QACnC,OAAO,CACL,oBAAC,WAAW,kBACV,GAAG,EAAE,oBAAoB,CAAC,EAAE,IACxB,IAAI,GAEP,IAAI,CAAC,QAAQ,CACF,CACf,CAAA;IACH,CAAC,CAAC,CACE,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,SAAS,CAAA"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import AlertBar from './index';
|
|
3
|
-
import { idAndClassName } from '
|
|
3
|
+
import { idAndClassName } from '../../utils/controls';
|
|
4
4
|
const componentMeta = {
|
|
5
5
|
title: 'Trepur Components/Rupert Bennett/Atoms/Alert Bar',
|
|
6
6
|
component: AlertBar,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlertBar.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/AlertBar/AlertBar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,QAAQ,MAAM,SAAS,CAAA;AAE9B,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAEhD,MAAM,aAAa,GAAmC;
|
|
1
|
+
{"version":3,"file":"AlertBar.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/AlertBar/AlertBar.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,27 +1,27 @@
|
|
|
1
1
|
import React, { useState } from 'react';
|
|
2
2
|
import Icon from '../Icon';
|
|
3
3
|
import classNames from 'classnames';
|
|
4
|
-
import { getTheme } from '
|
|
4
|
+
import { getTheme } from '../../utils/theme';
|
|
5
5
|
const AlertBar = ({ id, className, type = 'warning', text, theme = 'light', leftIconProps, rightIconProps, textCenter = false, isDismissable = false, onDismissClick }) => {
|
|
6
|
-
const themeToUse = getTheme()
|
|
6
|
+
const themeToUse = getTheme();
|
|
7
7
|
const [alertBarStatus, setAlertBarStatus] = useState({
|
|
8
8
|
state: 'open',
|
|
9
9
|
display: true
|
|
10
10
|
});
|
|
11
11
|
const bgColor = classNames({
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
12
|
+
'bg-rupertbennett-success': type === 'success' && themeToUse === 'rupertbennett',
|
|
13
|
+
'bg-rupertbennett-warning': type === 'warning' && themeToUse === 'rupertbennett',
|
|
14
|
+
'bg-rupertbennett-error': type === 'error' && themeToUse === 'rupertbennett',
|
|
15
|
+
'bg-rupertbennett-info-light': type === 'info' && themeToUse === 'rupertbennett',
|
|
16
|
+
'bg-bootson-success': type === 'success' && themeToUse === 'bootson',
|
|
17
|
+
'bg-bootson-warning': type === 'warning' && themeToUse === 'bootson',
|
|
18
|
+
'bg-bootson-error': type === 'error' && themeToUse === 'bootson',
|
|
19
|
+
'bg-bootson-info-light': type === 'info' && themeToUse === 'bootson'
|
|
20
20
|
});
|
|
21
21
|
const alertBarState = classNames({
|
|
22
22
|
'opacity-100': alertBarStatus.state === 'open',
|
|
23
23
|
'opacity-0': alertBarStatus.state === 'closed',
|
|
24
|
-
|
|
24
|
+
hidden: !alertBarStatus.display
|
|
25
25
|
});
|
|
26
26
|
const classList = classNames(className, bgColor, alertBarState, 'text-white w-parent flex py-2 transition-opactiy duration-700');
|
|
27
27
|
const textClassList = classNames({
|
|
@@ -32,7 +32,7 @@ const AlertBar = ({ id, className, type = 'warning', text, theme = 'light', left
|
|
|
32
32
|
'hover:cursor-pointer': isDismissable
|
|
33
33
|
}, 'px-8 pt-3');
|
|
34
34
|
const leftIconClasses = 'pt-3 pl-8';
|
|
35
|
-
const closeAlertBar = () => {
|
|
35
|
+
const closeAlertBar = (e) => {
|
|
36
36
|
setAlertBarStatus({
|
|
37
37
|
state: 'closed',
|
|
38
38
|
display: alertBarStatus.display
|
|
@@ -41,21 +41,23 @@ const AlertBar = ({ id, className, type = 'warning', text, theme = 'light', left
|
|
|
41
41
|
state: 'closed',
|
|
42
42
|
display: false
|
|
43
43
|
}), 700);
|
|
44
|
-
onDismissClick
|
|
44
|
+
if (onDismissClick != null) {
|
|
45
|
+
onDismissClick(e);
|
|
46
|
+
}
|
|
45
47
|
};
|
|
46
|
-
|
|
47
|
-
|
|
48
|
+
const dismissIcon = (React.createElement(Icon, { type: 'multiply', colour: 'white' }));
|
|
49
|
+
const iconLeft = (leftIconProps != null) &&
|
|
48
50
|
React.createElement(Icon, Object.assign({}, leftIconProps));
|
|
49
|
-
|
|
51
|
+
const iconRight = (rightIconProps != null) &&
|
|
50
52
|
React.createElement(Icon, Object.assign({}, rightIconProps));
|
|
51
53
|
return (React.createElement("div", { id: id, className: classList },
|
|
52
|
-
leftIconProps &&
|
|
54
|
+
(leftIconProps != null) &&
|
|
53
55
|
React.createElement("span", { className: leftIconClasses }, iconLeft),
|
|
54
56
|
React.createElement("h3", { className: textClassList }, text),
|
|
55
57
|
isDismissable &&
|
|
56
|
-
React.createElement("a", { className: rightIconClasses, onClick: closeAlertBar },
|
|
58
|
+
React.createElement("a", { className: rightIconClasses, onClick: (e) => closeAlertBar(e) },
|
|
57
59
|
React.createElement("span", null, dismissIcon)),
|
|
58
|
-
iconRight && !isDismissable &&
|
|
60
|
+
(iconRight != null) && !isDismissable &&
|
|
59
61
|
React.createElement("span", { className: rightIconClasses }, iconRight)));
|
|
60
62
|
};
|
|
61
63
|
export default AlertBar;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/AlertBar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/AlertBar/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumbs.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/Breadcrumbs/Breadcrumbs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,WAAW,MAAM,SAAS,CAAA;AAGjC,MAAM,aAAa,GAAsC;
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/Breadcrumbs/Breadcrumbs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,WAAW,MAAM,SAAS,CAAA;AAGjC,MAAM,aAAa,GAAsC;IACvD,KAAK,EAAE,2CAA2C;IAClD,SAAS,EAAE,WAAW;IACtB,QAAQ,EAAE;QACR,EAAE,EAAE;YACF,WAAW,EAAE,iCAAiC;YAC9C,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF;QACD,SAAS,EAAE;YACT,WAAW,EAAE,mDAAmD;YAChE,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF;QACD,KAAK,EAAE;YACL,WAAW,EAAE,oDAAoD;YACjE,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,IAAI,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;gBAC1B,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF;KACF;IACD,IAAI,EAAE;QACJ,KAAK,EAAE;YACL;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,QAAQ;aACf;YACD;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,QAAQ;aACf;YACD;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,QAAQ;aACf;YACD;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,QAAQ;aACf;SACF;KACF;CACF,CAAA;AAED,MAAM,QAAQ,GAAuC,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,WAAW,oBAAK,IAAI,EAAI,CAAA;AAExF,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAE7C,eAAe,aAAa,CAAA"}
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import classNames from 'classnames';
|
|
3
3
|
const Breadcrumbs = ({ id, className, links }) => {
|
|
4
|
-
const linksLength = links
|
|
4
|
+
const linksLength = (links != null)
|
|
5
5
|
? Object.keys(links).length
|
|
6
6
|
: 0;
|
|
7
|
-
const classList = classNames(
|
|
8
|
-
return (React.createElement("ul", { id: id, className: classList }, links
|
|
9
|
-
return (React.createElement(
|
|
10
|
-
React.createElement("
|
|
11
|
-
React.createElement("
|
|
12
|
-
|
|
13
|
-
:
|
|
14
|
-
React.createElement("p", { className: 'px-1 py-1' },
|
|
15
|
-
React.createElement("a", { className: 'text-facebook hover:underline', href: link.href }, link.name)))),
|
|
7
|
+
const classList = classNames(className, 'flex py-2 px-8');
|
|
8
|
+
return (React.createElement("ul", { id: id, className: classList }, links === null || links === void 0 ? void 0 : links.map((link, i) => {
|
|
9
|
+
return (React.createElement("div", { key: `breadcrumb_${i + 1}`, className: 'flex' },
|
|
10
|
+
React.createElement("li", { className: 'h-8' }, i + 1 >= linksLength
|
|
11
|
+
? (React.createElement("p", { className: 'px-1 py-1' }, link.name))
|
|
12
|
+
: (React.createElement("p", { className: 'px-1 py-1' },
|
|
13
|
+
React.createElement("a", { className: 'text-facebook hover:underline', href: link.href }, link.name)))),
|
|
16
14
|
i + 1 < linksLength &&
|
|
17
15
|
React.createElement("li", { className: 'h-8' },
|
|
18
16
|
React.createElement("p", { className: 'py-1' }, "\u00A0 > \u00A0"))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/Breadcrumbs/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,UAAU,MAAM,YAAY,CAAA;AAQnC,MAAM,WAAW,GAAG,CAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/Breadcrumbs/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,UAAU,MAAM,YAAY,CAAA;AAQnC,MAAM,WAAW,GAAG,CAAC,EACnB,EAAE,EACF,SAAS,EACT,KAAK,EACC,EAAe,EAAE;IACvB,MAAM,WAAW,GAAG,CAAC,KAAK,IAAI,IAAI,CAAC;QACjC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM;QAC3B,CAAC,CAAC,CAAC,CAAA;IAEL,MAAM,SAAS,GAAG,UAAU,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAA;IAEzD,OAAO,CACL,4BAAI,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,IAC7B,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;QACtB,OAAO,CACL,6BAAK,GAAG,EAAE,cAAc,CAAC,GAAG,CAAC,EAAE,EAAE,SAAS,EAAC,MAAM;YAC/C,4BAAI,SAAS,EAAC,KAAK,IAChB,CAAC,GAAG,CAAC,IAAI,WAAW;gBACnB,CAAC,CAAC,CACA,2BAAG,SAAS,EAAC,WAAW,IACrB,IAAI,CAAC,IAAI,CACR,CACH;gBACH,CAAC,CAAC,CACA,2BAAG,SAAS,EAAC,WAAW;oBACtB,2BACE,SAAS,EAAC,+BAA+B,EACzC,IAAI,EAAE,IAAI,CAAC,IAAI,IAEd,IAAI,CAAC,IAAI,CACR,CACF,CACH,CACF;YACJ,CAAC,GAAG,CAAC,GAAG,WAAW;gBAClB,4BAAI,SAAS,EAAC,KAAK;oBACjB,2BAAG,SAAS,EAAC,MAAM,sBAAwB,CACxC,CACH,CACP,CAAA;IACH,CAAC,CAAC,CACC,CACN,CAAA;AACH,CAAC,CAAA;AAED,eAAe,WAAW,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BreadcrumbsBordered.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/BreadcrumbsBordered/BreadcrumbsBordered.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,
|
|
1
|
+
{"version":3,"file":"BreadcrumbsBordered.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/BreadcrumbsBordered/BreadcrumbsBordered.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,mBAAmB,MAAM,SAAS,CAAA;AAGzC,MAAM,aAAa,GAA8C;IAC/D,KAAK,EAAE,+CAA+C;IACtD,SAAS,EAAE,mBAAmB;IAC9B,UAAU,EAAE,EAAE;IACd,QAAQ,kCACH,cAAc,KACjB,KAAK,EAAE;YACL,WAAW,EAAE,sDAAsD;YACnE,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE;YAC9C,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,IAAI,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;gBAC1B,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF,GACF;IACD,IAAI,EAAE;QACJ,KAAK,EAAE;YACL;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,QAAQ;aACf;YACD;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,QAAQ;aACf;YACD;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,QAAQ;aACf;YACD;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,QAAQ;aACf;YACD;gBACE,IAAI,EAAE,GAAG;gBACT,IAAI,EAAE,QAAQ;aACf;SACF;KACF;CACF,CAAA;AAED,MAAM,QAAQ,GAA+C,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,mBAAmB,oBAAK,IAAI,EAAI,CAAA;AAExG,MAAM,CAAC,MAAM,oBAAoB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAErD,eAAe,aAAa,CAAA"}
|
|
@@ -3,7 +3,7 @@ import { Props as breadcrumbsItemProps } from '../BreadcrumbsItem/index';
|
|
|
3
3
|
export interface Props {
|
|
4
4
|
id?: string;
|
|
5
5
|
className?: string;
|
|
6
|
-
links?:
|
|
6
|
+
links?: breadcrumbsItemProps[];
|
|
7
7
|
}
|
|
8
8
|
declare const Breadcrumbs: React.FC<Props>;
|
|
9
9
|
export default Breadcrumbs;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import BreadcrumbsItem from '../BreadcrumbsItem/index';
|
|
3
|
+
import classNames from 'classnames';
|
|
3
4
|
const Breadcrumbs = ({ id, className, links }) => {
|
|
4
|
-
const linksLength = links === null || links === void 0 ? void 0 : links.length;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
let first = i === 0 ? true : false;
|
|
5
|
+
const linksLength = (links === null || links === void 0 ? void 0 : links.length) !== undefined ? links.length : 0;
|
|
6
|
+
const classList = classNames(className, 'flex');
|
|
7
|
+
return (React.createElement("ul", { id: id, className: classList }, links === null || links === void 0 ? void 0 : links.map((link, i) => {
|
|
8
|
+
const margin = i === 0 ? ' mr-3' : ' mx-3';
|
|
9
|
+
const first = i === 0;
|
|
10
10
|
let bType = 'standard';
|
|
11
|
-
if (linksLength
|
|
11
|
+
if (linksLength >= 1 && i + 1 < linksLength) {
|
|
12
12
|
bType = 'link';
|
|
13
13
|
}
|
|
14
14
|
return (React.createElement(BreadcrumbsItem, { key: `breadcrumb_item_${i + 0}`, className: margin, name: link.name, link: link.link, type: bType, firstItem: first }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/BreadcrumbsBordered/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/lib/components/BreadcrumbsBordered/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,eAAkD,MAAM,mCAAmC,CAAA;AAClG,OAAO,UAAU,MAAM,YAAY,CAAA;AAQnC,MAAM,WAAW,GAAoB,CAAC,EACpC,EAAE,EACF,SAAS,EACT,KAAK,EACN,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,MAAK,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAA;IAClE,MAAM,SAAS,GAAG,UAAU,CAAC,SAAS,EAAE,MAAM,CAAC,CAAA;IAE/C,OAAO,CACL,4BAAI,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,IAC7B,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,GAAG,CAAC,CAAC,IAA0B,EAAE,CAAS,EAAE,EAAE;QACpD,MAAM,MAAM,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAA;QAC1C,MAAM,KAAK,GAAG,CAAC,KAAK,CAAC,CAAA;QAErB,IAAI,KAAK,GAAG,UAAU,CAAA;QACtB,IAAI,WAAW,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,WAAW,EAAE;YAC3C,KAAK,GAAG,MAAM,CAAA;SACf;QACD,OAAO,CACL,oBAAC,eAAe,IACd,GAAG,EAAE,mBAAmB,CAAC,GAAG,CAAC,EAAE,EAC/B,SAAS,EAAE,MAAM,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,KAAK,EACX,SAAS,EAAE,KAAK,GAChB,CACH,CAAA;IACH,CAAC,CAAC,CACC,CACN,CAAA;AACH,CAAC,CAAA;AAED,eAAe,WAAW,CAAA"}
|
|
@@ -36,13 +36,13 @@ const componentMeta = {
|
|
|
36
36
|
type: { summary: 'string' },
|
|
37
37
|
defaultValue: { summary: 'undefined' }
|
|
38
38
|
}
|
|
39
|
-
}
|
|
39
|
+
}
|
|
40
40
|
},
|
|
41
41
|
args: {
|
|
42
42
|
name: 'Link 1',
|
|
43
43
|
href: '/',
|
|
44
44
|
firstItem: false
|
|
45
|
-
}
|
|
45
|
+
}
|
|
46
46
|
};
|
|
47
47
|
const Template = (args) => React.createElement(BreadcrumbsItem, Object.assign({}, args));
|
|
48
48
|
export const _BreadcrumbsItem = Template.bind({});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BreadcrumbsItem.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/BreadcrumbsItem/BreadcrumbsItem.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,eAAe,MAAM,SAAS,CAAA;AAGrC,MAAM,aAAa,GAA0C;
|
|
1
|
+
{"version":3,"file":"BreadcrumbsItem.stories.js","sourceRoot":"","sources":["../../../../../src/lib/components/BreadcrumbsItem/BreadcrumbsItem.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,eAAe,MAAM,SAAS,CAAA;AAGrC,MAAM,aAAa,GAA0C;IAC3D,KAAK,EAAE,gDAAgD;IACvD,SAAS,EAAE,eAAe;IAC1B,UAAU,EAAE,EAAE;IACd,QAAQ,EAAE;QACR,EAAE,EAAE;YACF,WAAW,EAAE,iCAAiC;YAC9C,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF;QACD,SAAS,EAAE;YACT,WAAW,EAAE,mDAAmD;YAChE,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF;QACD,IAAI,EAAE;YACJ,WAAW,EAAE,0CAA0C;YACvD,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF;QACD,IAAI,EAAE;YACJ,WAAW,EAAE,sDAAsD;YACnE,KAAK,EAAE;gBACL,QAAQ,EAAE,EAAE;gBACZ,IAAI,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE;gBAC3B,YAAY,EAAE,EAAE,OAAO,EAAE,WAAW,EAAE;aACvC;SACF;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,GAAG;QACT,SAAS,EAAE,KAAK;KACjB;CACF,CAAA;AAED,MAAM,QAAQ,GAA2C,CAAC,IAAI,EAAE,EAAE,CAAC,oBAAC,eAAe,oBAAK,IAAI,EAAI,CAAA;AAEhG,MAAM,CAAC,MAAM,gBAAgB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAEjD,eAAe,aAAa,CAAA"}
|
|
@@ -6,54 +6,52 @@ const BreadcrumbsItem = ({ id, className, name, link, href, type, firstItem }) =
|
|
|
6
6
|
const bottomArrowClasses = 'bottom-0';
|
|
7
7
|
const textClassList = 'text-center pt-1';
|
|
8
8
|
const liClassList = 'list-none';
|
|
9
|
-
const classList = classNames(
|
|
9
|
+
const classList = classNames(className, 'item');
|
|
10
10
|
const itemClassList = classNames({
|
|
11
|
-
'hover:underline': type === 'link'
|
|
11
|
+
'hover:underline': type === 'link',
|
|
12
|
+
'mb-0': isHovering
|
|
12
13
|
}, 'bc-item relative px-4 h-8');
|
|
13
|
-
const backArrowsClasses =
|
|
14
|
-
const frontArrowClasses =
|
|
15
|
-
const frontArrow = React.createElement("span", { style: {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
}, className: frontArrowClasses });
|
|
21
|
-
const backArrows = React.createElement(React.Fragment, null,
|
|
14
|
+
const backArrowsClasses = 'absolute w-0 h-0 bg-transparent border-l-transparent';
|
|
15
|
+
const frontArrowClasses = 'absolute top-0 w-0 h-0 border-t';
|
|
16
|
+
const frontArrow = (React.createElement("span", { style: {
|
|
17
|
+
borderTop: '17px solid transparent',
|
|
18
|
+
borderBottom: '15px solid transparent',
|
|
19
|
+
borderLeft: '16px solid',
|
|
20
|
+
right: '-16px'
|
|
21
|
+
}, className: frontArrowClasses }));
|
|
22
|
+
const backArrows = (React.createElement(React.Fragment, null,
|
|
22
23
|
React.createElement("span", { style: {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
24
|
+
borderTop: '17px solid',
|
|
25
|
+
borderBottom: '18px solid transparent',
|
|
26
|
+
borderLeft: '17px solid transparent',
|
|
27
|
+
left: '-17px',
|
|
27
28
|
// '-webkit-transform': 'scaleY(-1)',
|
|
28
|
-
|
|
29
|
+
transform: 'scaleY(-1)'
|
|
29
30
|
}, className: `${backArrowsClasses} ${bottomArrowClasses}` }),
|
|
30
31
|
React.createElement("span", { style: {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
}, className: `${backArrowsClasses} ${topArrowClasses}` }));
|
|
36
|
-
const renderWithFrontArrow = (
|
|
32
|
+
borderTop: '18px solid',
|
|
33
|
+
borderBottom: '17px solid transparent',
|
|
34
|
+
borderLeft: '17px solid transparent',
|
|
35
|
+
left: '-17px'
|
|
36
|
+
}, className: `${backArrowsClasses} ${topArrowClasses}` })));
|
|
37
|
+
const renderWithFrontArrow = (React.createElement("div", { className: itemClassList },
|
|
37
38
|
React.createElement("p", { className: textClassList },
|
|
38
39
|
name,
|
|
39
40
|
frontArrow)));
|
|
40
|
-
const renderWithBackArrows = (
|
|
41
|
+
const renderWithBackArrows = (React.createElement("div", { className: itemClassList },
|
|
41
42
|
React.createElement("p", { className: textClassList },
|
|
42
43
|
backArrows,
|
|
43
44
|
name,
|
|
44
45
|
frontArrow)));
|
|
45
|
-
return (React.createElement("div",
|
|
46
|
-
firstItem
|
|
47
|
-
React.createElement("a", { onMouseOver: () => setIsHovering(true), onMouseOut: () => setIsHovering(false), href: href },
|
|
48
|
-
React.createElement("li", { className: liClassList }, renderWithFrontArrow
|
|
49
|
-
:
|
|
50
|
-
React.createElement("
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
React.createElement("li", { className: liClassList, onMouseOver: () => setIsHovering(true), onMouseOut: () => setIsHovering(false) }, renderWithFrontArrow())
|
|
55
|
-
:
|
|
56
|
-
React.createElement("li", { className: liClassList, onMouseOver: () => setIsHovering(true), onMouseOut: () => setIsHovering(false) }, renderWithBackArrows())));
|
|
46
|
+
return (React.createElement("div", { id: id, className: classList }, type === 'link'
|
|
47
|
+
? (firstItem === true
|
|
48
|
+
? (React.createElement("a", { onMouseOver: () => setIsHovering(true), onMouseOut: () => setIsHovering(false), href: href },
|
|
49
|
+
React.createElement("li", { className: liClassList }, renderWithFrontArrow)))
|
|
50
|
+
: (React.createElement("a", { onMouseOver: () => setIsHovering(true), onMouseOut: () => setIsHovering(false), href: href },
|
|
51
|
+
React.createElement("li", { className: liClassList }, renderWithBackArrows))))
|
|
52
|
+
: (firstItem === true
|
|
53
|
+
? (React.createElement("li", { className: liClassList, onMouseOver: () => setIsHovering(true), onMouseOut: () => setIsHovering(false) }, renderWithFrontArrow))
|
|
54
|
+
: (React.createElement("li", { className: liClassList, onMouseOver: () => setIsHovering(true), onMouseOut: () => setIsHovering(false) }, renderWithBackArrows)))));
|
|
57
55
|
};
|
|
58
56
|
export default BreadcrumbsItem;
|
|
59
57
|
//# sourceMappingURL=index.js.map
|