();
15 | const { container } = render();
16 |
17 | expect(container.firstChild).toBe(ref.current);
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/notifications/src/styled/content/StyledParagraph.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'notifications.paragraph';
12 |
13 | /**
14 | * Used for multi-line Notification content. Supports all `` props
15 | */
16 | export const StyledParagraph = styled.p.attrs({
17 | 'data-garden-id': COMPONENT_ID,
18 | 'data-garden-version': PACKAGE_VERSION
19 | })`
20 | margin: ${props => props.theme.space.base * 2}px 0 0;
21 |
22 | ${componentStyles};
23 | `;
24 |
--------------------------------------------------------------------------------
/packages/notifications/src/styled/global-alert/StyledGlobalAlertContent.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'notifications.global_alert.content';
12 |
13 | export const StyledGlobalAlertContent = styled.div.attrs({
14 | 'data-garden-id': COMPONENT_ID,
15 | 'data-garden-version': PACKAGE_VERSION
16 | })`
17 | flex-grow: 1;
18 |
19 | ${componentStyles};
20 | `;
21 |
--------------------------------------------------------------------------------
/packages/notifications/src/styled/global-alert/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export { StyledGlobalAlert } from './StyledGlobalAlert';
9 | export { StyledGlobalAlertButton } from './StyledGlobalAlertButton';
10 | export { StyledGlobalAlertClose } from './StyledGlobalAlertClose';
11 | export { StyledGlobalAlertContent } from './StyledGlobalAlertContent';
12 | export { StyledGlobalAlertIcon } from './StyledGlobalAlertIcon';
13 | export { StyledGlobalAlertTitle } from './StyledGlobalAlertTitle';
14 |
--------------------------------------------------------------------------------
/packages/notifications/src/styled/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export { StyledClose } from './content/StyledClose';
9 | export { StyledParagraph } from './content/StyledParagraph';
10 | export { StyledTitle } from './content/StyledTitle';
11 |
12 | export { StyledAlert } from './StyledAlert';
13 | export { StyledNotification } from './StyledNotification';
14 | export { StyledWell } from './StyledWell';
15 | export { StyledIcon } from './StyledIcon';
16 |
17 | export { StyledBase } from './StyledBase';
18 |
19 | export * from './global-alert';
20 |
--------------------------------------------------------------------------------
/packages/notifications/src/utils/useGlobalAlertContext.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import { createContext, useContext } from 'react';
9 |
10 | import { IGlobalAlertProps } from '../types';
11 |
12 | export type GlobalAlertContextProps = Pick;
13 |
14 | export const GlobalAlertContext = createContext({ type: 'info' });
15 |
16 | export const useGlobalAlertContext = () => useContext(GlobalAlertContext);
17 |
--------------------------------------------------------------------------------
/packages/notifications/src/utils/useNotificationsContext.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import { createContext, useContext } from 'react';
9 | import { Type } from '../types';
10 |
11 | export const NotificationsContext = createContext(undefined);
12 |
13 | export const useNotificationsContext = () => {
14 | return useContext(NotificationsContext);
15 | };
16 |
--------------------------------------------------------------------------------
/packages/notifications/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "rootDir": "src",
5 | "declarationDir": "dist/typings",
6 | "declaration": true,
7 | "sourceMap": false,
8 | "noEmit": false,
9 | "paths": {}
10 | },
11 | "include": ["src/**/*"],
12 | "exclude": ["**/*.spec.tsx", "**/*.spec.ts"]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/pagination/src/elements/OffsetPagination/components/Gap.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { Gap } from './Gap';
11 |
12 | describe('Gap', () => {
13 | it('passes ref to underlying DOM element', () => {
14 | const ref = React.createRef();
15 | const { container } = render();
16 |
17 | expect(container.firstElementChild).toBe(ref.current);
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/pagination/src/elements/OffsetPagination/components/Next.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { Next } from './Next';
11 |
12 | describe('Next', () => {
13 | it('passes ref to underlying DOM element', () => {
14 | const ref = React.createRef();
15 | const { container } = render();
16 |
17 | expect(container.firstElementChild).toBe(ref.current);
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/pagination/src/elements/OffsetPagination/components/Page.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { Page } from './Page';
11 |
12 | describe('Page', () => {
13 | it('passes ref to underlying DOM element', () => {
14 | const ref = React.createRef();
15 | const { container } = render();
16 |
17 | expect(container.firstElementChild).toBe(ref.current);
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/pagination/src/elements/OffsetPagination/components/Previous.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { Previous } from './Previous';
11 |
12 | describe('Previous', () => {
13 | it('passes ref to underlying DOM element', () => {
14 | const ref = React.createRef();
15 | const { container } = render();
16 |
17 | expect(container.firstElementChild).toBe(ref.current);
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/pagination/src/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export { OffsetPagination } from './elements/OffsetPagination/OffsetPagination';
9 | export { CursorPagination } from './elements/CursorPagination/CursorPagination';
10 |
11 | export type { IPaginationProps, PageType } from './types';
12 |
--------------------------------------------------------------------------------
/packages/pagination/src/styled/CursorPagination/StyledCursorPagination.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'cursor_pagination';
12 |
13 | export const StyledCursorPagination = styled.nav.attrs({
14 | 'data-garden-id': COMPONENT_ID,
15 | 'data-garden-version': PACKAGE_VERSION
16 | })`
17 | display: flex;
18 | justify-content: center;
19 |
20 | ${componentStyles};
21 | `;
22 |
--------------------------------------------------------------------------------
/packages/pagination/src/styled/OffsetPagination/StyledGapListItem.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { StyledGapListItem } from './StyledGapListItem';
11 |
12 | describe('StyledGapListItem', () => {
13 | it('renders the expected element', () => {
14 | const { container } = render();
15 |
16 | expect(container.firstChild!.nodeName).toBe('LI');
17 | });
18 | });
19 |
--------------------------------------------------------------------------------
/packages/pagination/src/styled/OffsetPagination/StyledNav.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'pagination.pagination_view';
12 |
13 | export const StyledNav = styled.nav.attrs({
14 | 'data-garden-id': COMPONENT_ID,
15 | 'data-garden-version': PACKAGE_VERSION
16 | })`
17 | ${componentStyles};
18 | `;
19 |
--------------------------------------------------------------------------------
/packages/pagination/src/styled/OffsetPagination/StyledNavigation.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 | import { StyledPage } from './StyledPage';
11 |
12 | const COMPONENT_ID = 'pagination.navigation';
13 |
14 | export const StyledNavigation = styled(StyledPage).attrs({
15 | 'data-garden-id': COMPONENT_ID,
16 | 'data-garden-version': PACKAGE_VERSION
17 | })`
18 | display: flex;
19 | align-items: center;
20 | justify-content: center;
21 |
22 | ${componentStyles};
23 | `;
24 |
--------------------------------------------------------------------------------
/packages/pagination/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "rootDir": "src",
5 | "declarationDir": "dist/typings",
6 | "declaration": true,
7 | "sourceMap": false,
8 | "noEmit": false,
9 | "paths": {}
10 | },
11 | "include": ["src/**/*"],
12 | "exclude": ["**/*.spec.tsx", "**/*.spec.ts"]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/tables/demo/stories/types.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import { ICellProps } from '@zendeskgarden/react-tables';
9 |
10 | export type CELL_WIDTH = ICellProps['width'];
11 |
12 | export type TABLE_ROW = string | Record;
13 |
--------------------------------------------------------------------------------
/packages/tables/src/elements/Body.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { HTMLAttributes, forwardRef } from 'react';
9 | import { StyledBody } from '../styled';
10 |
11 | /**
12 | * @deprecated use `Table.Body` instead
13 | *
14 | * @extends HTMLAttributes
15 | */
16 | export const Body = forwardRef>(
17 | (props, ref) =>
18 | );
19 |
20 | Body.displayName = 'Table.Body';
21 |
--------------------------------------------------------------------------------
/packages/tables/src/elements/Caption.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { HTMLAttributes, forwardRef } from 'react';
9 | import { StyledCaption } from '../styled';
10 |
11 | /**
12 | * @deprecated use `Table.Caption` instead
13 | *
14 | * @extends HTMLAttributes
15 | */
16 | export const Caption = forwardRef>(
17 | (props, ref) =>
18 | );
19 |
20 | Caption.displayName = 'Table.Caption';
21 |
--------------------------------------------------------------------------------
/packages/tables/src/elements/Head.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { forwardRef } from 'react';
9 | import { StyledHead } from '../styled';
10 | import { IHeadProps } from '../types';
11 |
12 | /**
13 | * @deprecated use `Table.Head` instead
14 | *
15 | * @extends HTMLAttributes
16 | */
17 | export const Head = forwardRef(
18 | ({ isSticky, ...props }, ref) =>
19 | );
20 |
21 | Head.displayName = 'Table.Head';
22 |
--------------------------------------------------------------------------------
/packages/tables/src/elements/OverflowButton.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { OverflowButton } from './OverflowButton';
11 |
12 | describe('OverflowButton', () => {
13 | it('passes ref to underlying DOM element', () => {
14 | const ref = React.createRef();
15 | const { container } = render();
16 |
17 | expect(container.firstChild).toBe(ref.current);
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/tables/src/elements/Table.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 |
11 | import { Table } from './Table';
12 |
13 | describe('Table', () => {
14 | it('passes ref to underlying DOM element', () => {
15 | const ref = React.createRef();
16 | const { container } = render();
17 |
18 | expect(container.firstChild).toBe(ref.current);
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/tables/src/styled/StyledBody.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'tables.body';
12 |
13 | export const StyledBody = styled.tbody.attrs({
14 | 'data-garden-id': COMPONENT_ID,
15 | 'data-garden-version': PACKAGE_VERSION
16 | })`
17 | ${componentStyles};
18 | `;
19 |
--------------------------------------------------------------------------------
/packages/tables/src/styled/StyledCaption.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'tables.caption';
12 |
13 | export const StyledCaption = styled.caption.attrs({
14 | 'data-garden-id': COMPONENT_ID,
15 | 'data-garden-version': PACKAGE_VERSION
16 | })`
17 | display: table-caption;
18 | text-align: ${props => (props.theme.rtl ? 'right' : 'left')};
19 |
20 | ${componentStyles};
21 | `;
22 |
--------------------------------------------------------------------------------
/packages/tables/src/styled/StyledHiddenCell.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { hideVisually } from 'polished';
10 | import { componentStyles } from '@zendeskgarden/react-theming';
11 |
12 | const COMPONENT_ID = 'tables.hidden_cell';
13 |
14 | export const StyledHiddenCell = styled.div.attrs({
15 | 'data-garden-id': COMPONENT_ID,
16 | 'data-garden-version': PACKAGE_VERSION
17 | })`
18 | ${hideVisually()}
19 |
20 | ${componentStyles};
21 | `;
22 |
--------------------------------------------------------------------------------
/packages/tables/src/styled/style-utils.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import { ThemeProps, DefaultTheme } from 'styled-components';
9 | import { ITableProps } from '../types';
10 |
11 | export const getRowHeight = (props: { $size?: ITableProps['size'] } & ThemeProps) => {
12 | if (props.$size === 'large') {
13 | return `${props.theme.space.base * 16}px`;
14 | } else if (props.$size === 'small') {
15 | return `${props.theme.space.base * 8}px`;
16 | }
17 |
18 | return `${props.theme.space.base * 10}px`;
19 | };
20 |
--------------------------------------------------------------------------------
/packages/tables/src/utils/useTableContext.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { useContext } from 'react';
9 | import { ITableProps } from '../types';
10 |
11 | interface ITableContext {
12 | size: NonNullable;
13 | isReadOnly: NonNullable;
14 | }
15 |
16 | export const TableContext = React.createContext({
17 | size: 'medium',
18 | isReadOnly: false
19 | });
20 |
21 | export const useTableContext = () => {
22 | return useContext(TableContext);
23 | };
24 |
--------------------------------------------------------------------------------
/packages/tables/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "rootDir": "src",
5 | "declarationDir": "dist/typings",
6 | "declaration": true,
7 | "sourceMap": false,
8 | "noEmit": false,
9 | "paths": {}
10 | },
11 | "include": ["src/**/*"],
12 | "exclude": ["**/*.spec.tsx", "**/*.spec.ts"]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/tabs/demo/stories/types.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export interface ITab {
9 | value: string;
10 | panel: string;
11 | disabled?: boolean;
12 | }
13 |
--------------------------------------------------------------------------------
/packages/tabs/src/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export { Tab } from './elements/Tab';
9 | export { TabList } from './elements/TabList';
10 | export { TabPanel } from './elements/TabPanel';
11 | export { Tabs } from './elements/Tabs';
12 |
13 | export type { ITabProps, ITabPanelProps, ITabsProps } from './types';
14 |
--------------------------------------------------------------------------------
/packages/tabs/src/styled/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export { StyledTab } from './StyledTab';
9 | export { StyledTabList } from './StyledTabList';
10 | export { StyledTabPanel } from './StyledTabPanel';
11 | export { StyledTabs } from './StyledTabs';
12 |
--------------------------------------------------------------------------------
/packages/tabs/src/utils/useTabsContext.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import { createContext, useContext } from 'react';
9 | import { IUseTabsReturnValue } from '@zendeskgarden/container-tabs';
10 |
11 | interface ITabsContext extends IUseTabsReturnValue {
12 | isVertical?: boolean;
13 | }
14 |
15 | export const TabsContext = createContext(undefined);
16 |
17 | export const useTabsContext = () => {
18 | return useContext(TabsContext);
19 | };
20 |
--------------------------------------------------------------------------------
/packages/tabs/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "rootDir": "src",
5 | "declarationDir": "dist/typings",
6 | "declaration": true,
7 | "sourceMap": false,
8 | "noEmit": false,
9 | "paths": {}
10 | },
11 | "include": ["src/**/*"],
12 | "exclude": ["**/*.spec.tsx", "**/*.spec.ts"]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/tags/demo/~patterns/stories/data.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export const FAUX_INPUT_TAGS = [
9 | 'veggies es bonus',
10 | 'beet greens corn soko endive',
11 | 'shallot courgette tatsoi pea sprouts',
12 | 'cauliflower',
13 | 'turnip yarrow ricebean rutabaga',
14 | 'celery quandong swiss chard chicory earthnut pea potato',
15 | 'grape wattle seed'
16 | ];
17 |
--------------------------------------------------------------------------------
/packages/tags/src/elements/Avatar.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { SVGAttributes } from 'react';
9 | import { StyledAvatar } from '../styled';
10 |
11 | const AvatarComponent = (props: SVGAttributes) => ;
12 |
13 | AvatarComponent.displayName = 'Tag.Avatar';
14 |
15 | /**
16 | * @extends SVGAttributes
17 | */
18 | export const Avatar = AvatarComponent;
19 |
--------------------------------------------------------------------------------
/packages/tags/src/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export { Tag } from './elements/Tag';
9 |
10 | export type { ITagProps } from './types';
11 |
--------------------------------------------------------------------------------
/packages/tags/src/styled/StyledAvatar.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled, { DataAttributes } from 'styled-components';
9 | import { StyledBaseIcon, componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'tags.avatar';
12 |
13 | export const StyledAvatar = styled(StyledBaseIcon).attrs({
14 | 'data-garden-id': COMPONENT_ID,
15 | 'data-garden-version': PACKAGE_VERSION
16 | })`
17 | flex-shrink: 0;
18 | font-size: 0; /* text content reset */
19 |
20 | ${componentStyles};
21 | `;
22 |
--------------------------------------------------------------------------------
/packages/tags/src/styled/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export * from './StyledTag';
9 | export * from './StyledAvatar';
10 | export * from './StyledClose';
11 |
--------------------------------------------------------------------------------
/packages/tags/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "rootDir": "src",
5 | "declarationDir": "dist/typings",
6 | "declaration": true,
7 | "sourceMap": false,
8 | "noEmit": false,
9 | "paths": {}
10 | },
11 | "include": ["src/**/*"],
12 | "exclude": ["**/*.spec.tsx", "**/*.spec.ts"]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/theming/demo/colorSchemeProvider.stories.mdx:
--------------------------------------------------------------------------------
1 | import { Meta, ArgsTable, Canvas, Story, Markdown } from '@storybook/addon-docs';
2 | import { ColorSchemeProvider } from '@zendeskgarden/react-theming';
3 | import { ColorSchemeProviderStory } from './stories/ColorSchemeProviderStory';
4 | import README from '../README.md';
5 |
6 |
7 |
8 | # API
9 |
10 |
11 |
12 | # Demo
13 |
14 | ## ColorSchemeProvider
15 |
16 |
21 |
22 | {README}
23 |
--------------------------------------------------------------------------------
/packages/theming/demo/stories/data.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export const ARROW_POSITIONS = [
9 | 'top',
10 | 'top-left',
11 | 'top-right',
12 | 'right',
13 | 'right-top',
14 | 'right-bottom',
15 | 'bottom',
16 | 'bottom-left',
17 | 'bottom-right',
18 | 'left',
19 | 'left-top',
20 | 'left-bottom'
21 | ];
22 |
23 | export const MENU_POSITIONS = ['top', 'right', 'bottom', 'left'];
24 |
--------------------------------------------------------------------------------
/packages/theming/src/elements/ThemeProvider.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { PropsWithChildren } from 'react';
9 | import { ThemeProvider as StyledThemeProvider } from 'styled-components';
10 | import { IGardenTheme, IThemeProviderProps } from '../types';
11 | import DEFAULT_THEME from './theme';
12 |
13 | export const ThemeProvider = ({
14 | theme = DEFAULT_THEME,
15 | ...other
16 | }: PropsWithChildren) => (
17 |
18 | );
19 |
--------------------------------------------------------------------------------
/packages/theming/src/elements/palette/index.spec.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import PALETTE from '.';
9 |
10 | describe('PALETTE', () => {
11 | it('matches snapshot', () => {
12 | expect(PALETTE).toMatchSnapshot();
13 | });
14 | });
15 |
--------------------------------------------------------------------------------
/packages/theming/src/utils/StyledBaseIcon.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { Children, cloneElement, ReactElement } from 'react';
10 | import { IStyledBaseIconProps } from '../types';
11 |
12 | export const StyledBaseIcon = styled(
13 | // eslint-disable-next-line @typescript-eslint/no-unused-vars
14 | ({ children, theme, ...props }: IStyledBaseIconProps) =>
15 | cloneElement(Children.only(children as ReactElement), props)
16 | )`
17 | /* empty-source */
18 | `;
19 |
--------------------------------------------------------------------------------
/packages/theming/src/utils/getMenuPosition.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import { Placement } from '@floating-ui/react-dom';
9 | import { MenuPosition } from '../types';
10 |
11 | /**
12 | * Convert Floating-UI placement to a valid `menuStyles` position.
13 | *
14 | * @param {string} placement A Floating-UI placement.
15 | *
16 | * @returns A `menuStyles` position.
17 | */
18 | export const getMenuPosition = (placement: Placement): MenuPosition => {
19 | return placement.split('-')[0] as MenuPosition;
20 | };
21 |
--------------------------------------------------------------------------------
/packages/theming/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "rootDir": "src",
5 | "declarationDir": "dist/typings",
6 | "declaration": true,
7 | "sourceMap": false,
8 | "noEmit": false,
9 | "paths": {}
10 | },
11 | "include": ["src/**/*"],
12 | "exclude": ["**/*.spec.tsx", "**/*.spec.ts"]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/tooltips/demo/stories/data.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import { ITooltipContent } from './types';
9 |
10 | export const TOOLTIP_CONTENT: ITooltipContent = {
11 | title: 'Title text',
12 | paragraph: 'Veggies es bonus'
13 | };
14 |
--------------------------------------------------------------------------------
/packages/tooltips/demo/stories/types.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export interface ITooltipContent {
9 | title: string;
10 | paragraph: string;
11 | }
12 |
--------------------------------------------------------------------------------
/packages/tooltips/src/elements/Paragraph.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { forwardRef, HTMLAttributes } from 'react';
9 | import { StyledParagraph } from '../styled';
10 |
11 | /**
12 | * @deprecated use `Tooltip.Paragraph` instead
13 | *
14 | * @extends HTMLAttributes
15 | */
16 | export const Paragraph = forwardRef>(
17 | (props, ref) =>
18 | );
19 |
20 | Paragraph.displayName = 'Tooltip.Paragraph';
21 |
--------------------------------------------------------------------------------
/packages/tooltips/src/elements/Title.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { forwardRef, HTMLAttributes } from 'react';
9 | import { StyledTitle } from '../styled';
10 |
11 | /**
12 | * @deprecated use `Tooltip.Title` instead
13 | *
14 | * @extends HTMLAttributes
15 | */
16 | export const Title = forwardRef>((props, ref) => (
17 |
18 | ));
19 |
20 | Title.displayName = 'Tooltip.Title';
21 |
--------------------------------------------------------------------------------
/packages/tooltips/src/elements/utils.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import { ITooltipProps } from '../types';
9 |
10 | /**
11 | * Convert to the intended tooltip size for the given type.
12 | *
13 | * @param {string} size Tooltip size prop value
14 | * @param {string} type Tooltip type prop value
15 | *
16 | * @returns A tooltip size.
17 | */
18 | export const toSize = (size: ITooltipProps['size'], type: ITooltipProps['type']) => {
19 | let retVal = size;
20 |
21 | if (retVal === undefined) {
22 | retVal = type === 'dark' ? 'small' : 'large';
23 | }
24 |
25 | return retVal;
26 | };
27 |
--------------------------------------------------------------------------------
/packages/tooltips/src/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export { Paragraph } from './elements/Paragraph';
9 | export { Title } from './elements/Title';
10 | export { Tooltip } from './elements/Tooltip';
11 |
12 | export type { ITooltipProps } from './types';
13 |
--------------------------------------------------------------------------------
/packages/tooltips/src/styled/StyledParagraph.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'tooltip.paragraph';
12 |
13 | /**
14 | * Accepts all `` props
15 | */
16 | export const StyledParagraph = styled.p.attrs({
17 | 'data-garden-id': COMPONENT_ID,
18 | 'data-garden-version': PACKAGE_VERSION
19 | })`
20 | margin: 0;
21 |
22 | ${componentStyles};
23 | `;
24 |
--------------------------------------------------------------------------------
/packages/tooltips/src/styled/StyledTitle.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'tooltip.title';
12 |
13 | /**
14 | * Accepts all `
` props
15 | */
16 | export const StyledTitle = styled.strong.attrs({
17 | 'data-garden-id': COMPONENT_ID,
18 | 'data-garden-version': PACKAGE_VERSION
19 | })`
20 | display: none;
21 | margin: 0;
22 | font-weight: ${props => props.theme.fontWeights.semibold};
23 |
24 | ${componentStyles};
25 | `;
26 |
--------------------------------------------------------------------------------
/packages/tooltips/src/styled/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export { StyledParagraph } from './StyledParagraph';
9 | export { StyledTitle } from './StyledTitle';
10 | export { StyledTooltip } from './StyledTooltip';
11 | export { StyledTooltipWrapper } from './StyledTooltipWrapper';
12 |
--------------------------------------------------------------------------------
/packages/tooltips/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "rootDir": "src",
5 | "declarationDir": "dist/typings",
6 | "declaration": true,
7 | "sourceMap": false,
8 | "noEmit": false,
9 | "paths": {}
10 | },
11 | "include": ["src/**/*"],
12 | "exclude": ["**/*.spec.tsx", "**/*.spec.ts"]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/typography/demo/ellipsis.stories.mdx:
--------------------------------------------------------------------------------
1 | import { Meta, ArgsTable, Canvas, Story, Markdown } from '@storybook/addon-docs';
2 | import { Ellipsis } from '@zendeskgarden/react-typography';
3 | import README from '../README.md';
4 |
5 |
6 |
7 | # API
8 |
9 |
10 |
11 | # Demo
12 |
13 |
25 |
26 |
{README}
27 |
--------------------------------------------------------------------------------
/packages/typography/demo/paragraph.stories.mdx:
--------------------------------------------------------------------------------
1 | import { Meta, ArgsTable, Canvas, Story, Markdown } from '@storybook/addon-docs';
2 | import { Paragraph } from '@zendeskgarden/react-typography';
3 | import { ParagraphStory } from './stories/ParagraphStory';
4 | import { PARAGRAPH_CHILDREN as CHILDREN } from './stories/data';
5 | import README from '../README.md';
6 |
7 |
8 |
9 | # API
10 |
11 |
12 |
13 | # Demo
14 |
15 |
20 |
21 |
{README}
22 |
--------------------------------------------------------------------------------
/packages/typography/demo/stories/types.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export interface IListItem {
9 | text: string;
10 | items?: IListItem[];
11 | }
12 |
--------------------------------------------------------------------------------
/packages/typography/src/elements/lists/OrderedListItem.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { OrderedList } from './OrderedList';
11 |
12 | describe('OrderedListItem', () => {
13 | it('applies default padding', () => {
14 | const { container } = render(
15 |
16 |
17 |
18 | );
19 |
20 | expect(container.querySelector('li')).toHaveStyleRule('padding-top', '4px');
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/typography/src/elements/lists/UnorderedListItem.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { UnorderedList } from './UnorderedList';
11 |
12 | describe('UnorderedListItem', () => {
13 | it('applies default padding', () => {
14 | const { container } = render(
15 |
16 |
17 |
18 | );
19 |
20 | expect(container.querySelector('li')).toHaveStyleRule('padding-top', '4px');
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/typography/src/elements/span/Icon.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { SVGAttributes } from 'react';
9 | import { StyledIcon } from '../../styled';
10 |
11 | const IconComponent = (props: SVGAttributes
) => ;
12 |
13 | IconComponent.displayName = 'Span.Icon';
14 |
15 | /**
16 | * @extends SVGAttributes
17 | */
18 | export const Icon = IconComponent;
19 |
--------------------------------------------------------------------------------
/packages/typography/src/elements/span/StartIcon.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React, { SVGAttributes } from 'react';
9 | import { StyledIcon } from '../../styled';
10 |
11 | const StartIconComponent = (props: SVGAttributes) => ;
12 |
13 | StartIconComponent.displayName = 'Span.StartIcon';
14 |
15 | /**
16 | * @extends SVGAttributes
17 | */
18 | export const StartIcon = StartIconComponent;
19 |
--------------------------------------------------------------------------------
/packages/typography/src/styled/StyledCodeBlockContainer.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { StyledCodeBlockContainer } from './StyledCodeBlockContainer';
11 |
12 | describe('StyledCodeBlockContainer', () => {
13 | it('renders the expected element', () => {
14 | const { container } = render();
15 |
16 | expect(container.firstChild!.nodeName).toBe('DIV');
17 | });
18 | });
19 |
--------------------------------------------------------------------------------
/packages/typography/src/styled/StyledCodeBlockToken.spec.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 | import { render } from 'garden-test-utils';
10 | import { StyledCodeBlockToken } from './StyledCodeBlockToken';
11 |
12 | describe('StyledCodeBlockToken', () => {
13 | it('renders the expected element', () => {
14 | const { container } = render();
15 |
16 | expect(container.firstChild!.nodeName).toBe('SPAN');
17 | });
18 | });
19 |
--------------------------------------------------------------------------------
/packages/typography/src/styled/StyledEllipsis.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import styled from 'styled-components';
9 | import { componentStyles } from '@zendeskgarden/react-theming';
10 |
11 | const COMPONENT_ID = 'typography.ellipsis';
12 |
13 | export const StyledEllipsis = styled.div.attrs({
14 | 'data-garden-id': COMPONENT_ID,
15 | 'data-garden-version': PACKAGE_VERSION
16 | })`
17 | overflow: hidden;
18 | text-overflow: ellipsis;
19 | white-space: nowrap;
20 | direction: ${props => (props.theme.rtl ? 'rtl' : 'ltr')};
21 |
22 | ${componentStyles};
23 | `;
24 |
--------------------------------------------------------------------------------
/packages/typography/src/styled/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | export * from './StyledBlockquote';
9 | export * from './StyledCode';
10 | export * from './StyledCodeBlock';
11 | export * from './StyledCodeBlockContainer';
12 | export * from './StyledCodeBlockLine';
13 | export * from './StyledCodeBlockToken';
14 | export * from './StyledEllipsis';
15 | export * from './StyledFont';
16 | export * from './StyledIcon';
17 | export * from './StyledList';
18 | export * from './StyledListItem';
19 | export * from './StyledParagraph';
20 |
--------------------------------------------------------------------------------
/packages/typography/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "rootDir": "src",
5 | "declarationDir": "dist/typings",
6 | "declaration": true,
7 | "sourceMap": false,
8 | "noEmit": false,
9 | "paths": {}
10 | },
11 | "include": ["src/**/*"],
12 | "exclude": ["**/*.spec.tsx", "**/*.spec.ts"]
13 | }
14 |
--------------------------------------------------------------------------------
/utils/build/Intl.d.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | declare namespace Intl {
9 | interface DateTimeFormatOptions extends Intl.DateTimeFormatOptions {
10 | dateStyle?: 'full' | 'long' | 'medium' | 'short';
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/utils/build/declarations.d.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | /* Globals */
9 | declare const PACKAGE_VERSION: string;
10 |
11 | /** Files */
12 | declare module '*.svg';
13 |
--------------------------------------------------------------------------------
/utils/build/react.d.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import 'react';
9 |
10 | declare module 'react' {
11 | interface HTMLAttributes extends AriaAttributes, DOMAttributes {
12 | 'data-garden-id'?: string;
13 | 'data-garden-version'?: string;
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/utils/scripts/build.sh:
--------------------------------------------------------------------------------
1 | #!/bin/bash
2 | set -x
3 | set -e
4 |
5 | NODE_ENV=production rollup -c ../../utils/build/rollup.config.js --bundleConfigAsCjs
6 |
--------------------------------------------------------------------------------
/utils/test/jest.d.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | /** JestDom matcher support */
9 | import '@testing-library/jest-dom';
10 |
11 | /** Jest matchers for styled-components */
12 | import 'jest-styled-components';
13 |
--------------------------------------------------------------------------------
/utils/test/rootDir/__mocks__/dom-helpers/scrollTo.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | /* eslint-disable no-unused-vars */
9 |
10 | /**
11 | * Mock `scrollTo` implementation
12 | * @param {*} domNode
13 | */
14 | export default function scrollTo(domNode) {
15 | return undefined;
16 | }
17 |
--------------------------------------------------------------------------------
/utils/test/svg-mock.tsx:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright Zendesk, Inc.
3 | *
4 | * Use of this source code is governed under the Apache License, Version 2.0
5 | * found at http://www.apache.org/licenses/LICENSE-2.0.
6 | */
7 |
8 | import React from 'react';
9 |
10 | const MockSVG = props => ;
11 |
12 | export default MockSVG;
13 |
--------------------------------------------------------------------------------
/utils/test/tsconfig.test.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "module": "commonjs",
5 | "target": "ES2019",
6 | "jsx": "react",
7 | "noEmit": false
8 | }
9 | }
10 |
--------------------------------------------------------------------------------