srf-feathers 1.0.3 → 1.1.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/README.md CHANGED
@@ -1,22 +1,22 @@
1
- # React Component Library
1
+ # SRF Feathers 🪶
2
2
 
3
- [![Build status](https://badge.buildkite.com/90ff98db996bb137c5be1bdce666c4b1ce68a25b17af0a6a04.svg?branch=master)](https://buildkite.com/harvey/react-component-library)
4
3
  [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg)](https://opensource.org/licenses/MIT)
5
4
 
6
- This project skeleton was created to help people get started with creating their own React component library using:
5
+ Shared Frontend Components for SRF applications
7
6
 
8
7
  - [Rollup](https://github.com/rollup/rollup)
9
8
  - [Sass](https://sass-lang.com/)
10
9
  - [TypeScript](https://www.typescriptlang.org/)
11
-
12
- It also features:
13
-
14
10
  - [Storybook](https://storybook.js.org/) to help you create and show off your components
15
11
  - [Jest](https://jestjs.io/) and [React Testing Library](https://github.com/testing-library/react-testing-library) enabling testing of the components
16
12
 
17
- [**Read my blog post about why and how I created this project skeleton ▸**](https://blog.harveydelaney.com/creating-your-own-react-component-library/)
13
+ ## Installation
18
14
 
19
- [Check out this CodeSandbox to see the component library in action ▸](https://codesandbox.io/s/harvey-component-library-example-y2b60)
15
+ * check out srf-feathers `git clone git@github.com:mmz-srf/feathers.git`
16
+ * enter directory where you installed it, e.g. `cd feathers`
17
+ * install dependencies `npm install`
18
+
19
+ ℹ️ If you have to update the _secrets_ (e.g. `CHROMATIC_PROJECT_TOKEN` for deployment to chromatic or `NPM_TOKEN` for deploying on NPM), you can change them on https://github.com/mmz-srf/feathers/settings/secrets/actions
20
20
 
21
21
  ## Development
22
22
 
@@ -40,17 +40,15 @@ To run a live-reload Storybook server on your local machine:
40
40
  npm run storybook
41
41
  ```
42
42
 
43
- To export your Storybook as static files:
43
+ ## Publishing
44
44
 
45
- ```
46
- npm run storybook:export
47
- ```
45
+ `srf-feathers` is published on [NPM](https://www.npmjs.com/package/srf-feathers). A github workflow is used to auto-publish on NPM when the version number in `package.json` is increased on the master branch.
48
46
 
49
- You can then serve the files under `storybook-static` using S3, GitHub pages, Express etc. I've hosted this library at: https://www.harveydelaney.com/react-component-library
47
+ In case this fails, publish via `npm publish` (you must be logged into npm in the CLI).
50
48
 
51
49
  ### Generating New Components
52
50
 
53
- I've included a handy NodeJS util file under `util` called `create-component.js`. Instead of copy pasting components to create a new component, you can instead run this command to generate all the files you need to start building out a new component. To use it:
51
+ There is a handy NodeJS util file under `util` called `create-component.js`. Instead of copy pasting components to create a new component, you can instead run this command to generate all the files you need to start building out a new component. To use it:
54
52
 
55
53
  ```
56
54
  npm run generate YourComponentName
@@ -70,231 +68,33 @@ This will generate:
70
68
 
71
69
  The default templates for each file can be modified under `util/templates`.
72
70
 
73
- Don't forget to add the component to your `index.ts` exports if you want the library to export the component!
74
-
75
- ### Installing Component Library Locally
76
-
77
- Let's say you have another project (`test-app`) on your machine that you want to try installing the component library into without having to first publish the component library. In the `test-app` directory, you can run:
78
-
79
- ```
80
- npm i --save ../react-component-library
81
- ```
82
-
83
- which will install the local component library as a dependency in `test-app`. It'll then appear as a dependency in `package.json` like:
84
-
85
- ```
86
- ...
87
- "dependencies": {
88
- ...
89
- "react-component-library": "file:../react-component-library",
90
- ...
91
- },
92
- ...
93
- ```
94
-
95
- Your components can then be imported and used in that project.
96
-
97
- **NOTE**: After installing the component library locally, you may run into:
98
-
99
- ```
100
- Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
101
-
102
- You might have mismatching versions of React and the renderer (such as React DOM)
103
- You might be breaking the Rules of Hooks
104
- You might have more than one copy of React in the same app See for tips about how to debug and fix this problem.
105
- ```
106
-
107
- This is the most commonly encountered problem people face when installing the library locally. This is most likely due to the third reason: `You might have more than one copy of React in the app`.
108
-
109
- Normally when a library is published, dev dependencies are excluded. However, when the library is symlinked, all local dev depdendencies are persisted in the libraries `node_modules` (includes React). Your bundler may see two versions of React, one in the consuming app and one in the symlinked library. The solution is to have the component library use the React version in the consuming app. So from your component library folder, run:
110
-
111
- ```
112
- npm link ../test-app/node_modules/react
113
- ```
114
-
115
- **OR**, if you are using Webpack in app you can follow [this GitHub comment](https://github.com/facebook/react/issues/13991#issuecomment-435587809).
116
-
117
- Read more about this issue [here](https://reactjs.org/warnings/invalid-hook-call-warning.html).
118
-
119
- ## Publishing
120
-
121
- ### Hosting via NPM
122
-
123
- First, make sure you have an NPM account and are [logged into NPM using the `npm login` command.](https://docs.npmjs.com/creating-a-new-npm-user-account)
124
-
125
- Then update the `name` field in `package.json` to reflect your NPM package name in your private or public NPM registry. Then run:
126
-
127
- ```
128
- npm publish
129
- ```
130
-
131
- The `"prepublishOnly": "npm run build"` script in `package.json` will execute before publish occurs, ensuring the `build/` directory and the compiled component library exist.
132
-
133
- ### Hosting via GitHub
134
-
135
- I recommend you host the component library using NPM. However, if you don't want to use NPM, you can use GitHub to host it instead.
136
-
137
- You'll need to remove `build/` from `.gitignore`, build the component library (`npm run build`), add, commit and push the contents of `build`. [See this branch for an example.](https://github.com/HarveyD/react-component-library/tree/host-via-github)
138
-
139
- You can then install your library into other projects by running:
140
-
141
- ```
142
- npm i --save git+https://github.com/HarveyD/react-component-library.git#branch-name
143
- ```
144
-
145
- OR
146
-
147
- ```
148
- npm i --save github:harveyd/react-component-library#branch-name
149
- ```
150
-
151
- ## Usage
152
-
153
- Let's say you created a public NPM package called `harvey-component-library` with the `TestComponent` component created in this repository.
154
-
155
- Usage of the component (after the library installed as a dependency into another project) will be:
156
-
157
- ```TSX
158
- import React from "react";
159
- import { TestComponent } from "harvey-component-library";
160
-
161
- const App = () => (
162
- <div className="app-container">
163
- <h1>Hello I'm consuming the component library</h1>
164
- <TestComponent theme="primary" />
165
- </div>
166
- );
167
-
168
- export default App;
169
- ```
170
-
171
- [Check out this Code Sandbox for a live example.](https://codesandbox.io/s/harvey-component-library-example-y2b60?file=/src/App.js)
172
-
173
- ### Using Component Library SASS Variables
174
-
175
- I've found that it's helpful to export SASS variables to projects consuming the library. As such, I've added the `rollup-plugin-copy` NPM package and used it to copy the [`src/typography.scss`](src/typography.scss) and [`variables.scss`](src/variables.scss) into the `build` directory as part of the Rollup bundle process. This allows you to use these variables in your projects consuming the component library.
176
-
177
- For example, let's say you installed `harvey-component-library` into your project. To use the exported variables/mixins, in a SASS file you would do the following:
178
-
179
- ```Sass
180
- @import '~harvey-component-library/build/typography';
181
-
182
- .example-container {
183
- @include heading;
184
-
185
- color: $harvey-white;
186
- }
187
- ```
71
+ ⚠️ **Don't forget to add the component to your `index.ts` exports if you want the library to export the component!**
188
72
 
189
73
  ## Additional Help
190
74
 
191
- ### Dark Mode
75
+ ### Install local version of feathers in your project
192
76
 
193
- The example component `TestComponent` respects the user's dark mode operating system preferences and renders the component in the appropriate theme.
194
-
195
- This is achieved by using the media query: `@media (prefers-color-scheme: dark)` in combination with CSS variables. The colours that change depending on dark mode preference can be found in [`src/variables.scss`](src/variables.scss). Example usage of these variables can be found within [`src/TestComponent/TestComponent.scss`](src/TestComponent/TestComponent.scss).
196
-
197
- Read https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme for more details.
198
-
199
- ### Using Alternatives to Sass
200
-
201
- #### Less or Stylus
202
-
203
- The Rollup plugin `rollup-plugin-postcss` supports Sass, Less and Stylus:
204
-
205
- - For Stylus, install stylus: `yarn add stylus --dev`
206
- - For Less, install less: `yarn add less --dev`
207
-
208
- You can then remove `node-sass` from your dependencies.
209
-
210
- #### CSS Modules
211
-
212
- If you want to use CSS Modules, update `postcss` in `rollup-config.js` to:
77
+ While developing, it is useful to not have to publish every little change to NPM before you can use it in your project.
78
+ For this, it's possible to "install" a local version of srf-feathers in your project with
213
79
 
214
80
  ```
215
- postcss({
216
- modules: true
217
- })
81
+ npm i --save relative/path/to/feathers/repo
218
82
  ```
219
83
 
220
- #### Styled Components
221
-
222
- If you want to use [`styled-components`](https://styled-components.com/), the changes required are a bit more involved. As such, I've created a branch where I've got `styled-components` working in this component library, [check it out here](https://github.com/HarveyD/react-component-library/tree/styled-components).
223
-
224
- ### Component Code Splitting
225
-
226
- Code splitting of your components is not supported by default.
84
+ If, for example, your project's repository is in the same folder you checked out srf-feather, you can run the following command in your project's root folder:
227
85
 
228
- [Read this section of my blog post](https://blog.harveydelaney.com/creating-your-own-react-component-library/#introducing-code-splitting-optional-) to find out how and why you would enable code splitting of your components. In summary, code splitting enables users to import components in isolation like:
229
-
230
- ```
231
- import TestComponent from 'harvey-component-library/build/TestComponent';
232
- ```
233
-
234
- This can reduce the bundle size for projects using older (CJS) module formats.
235
-
236
- You can check out [this branch](https://github.com/HarveyD/react-component-library/tree/code-splitting) or [this commit](https://github.com/HarveyD/react-component-library/commit/94631be5a871f3b39dbc3e9bd3e75a8ae5b3b759) to see what changes are neccesary to implement it.
237
-
238
- Please note, there's an issue with code splitting and using `rollup-plugin-postcss`. I recommend using `rollup-plugin-sass` instead alongside code splitting.
239
-
240
- ### Supporting Image Imports
241
-
242
- Add the following library to your component library [@rollup/plugin-image](https://github.com/rollup/plugins/tree/master/packages/image):
243
-
244
- ```
245
- npm i -D @rollup/plugin-image
246
- ```
247
-
248
- Then add it to `rollup-config.js`:
249
-
250
- ```
251
- ...
252
- plugins:[
253
- ...,
254
- image(),
255
- ...
256
- ]
257
- ...
258
86
  ```
259
-
260
- You can then import and render images in your components like:
261
-
262
- ```tsx
263
- import logo from "./rollup.png";
264
-
265
- export const ImageComponent = () => (
266
- <div>
267
- <img src={logo} />
268
- </div>
269
- );
87
+ npm i --save ../feathers
270
88
  ```
271
89
 
272
- ### Supporting JSON Imports
273
-
274
- Add the following library to your component library [@rollup/plugin-json](https://github.com/rollup/plugins/tree/master/packages/json):
90
+ ⚠️ If you've previously installed srf-feathers via NPM, you might have to remove the folder in your `node_modules`.
275
91
 
276
- ```
277
- npm i -D @rollup/plugin-json
278
- ```
92
+ ### dev-tools (feathers-dev)
279
93
 
280
- Then add it to `rollup-config.js`:
94
+ For a smoother experience, a collection of the most used commands has been added to a dev-script in `/bin/feathers-dev`. List the available commands with
281
95
 
282
96
  ```
283
- ...
284
- plugins:[
285
- ...,
286
- json(),
287
- ...
288
- ]
289
- ...
290
- ```
291
-
292
- You can then import and use JSON as ES6 Modules:
293
-
294
- ```tsx
295
- import data from "./some-data.json";
296
-
297
- export const JsonDataComponent = () => <div>{data.description}</div>;
97
+ ./bin/feathers-dev help
298
98
  ```
299
99
 
300
- Checkout the [official Rollup plugin list](https://github.com/rollup/plugins) for additional helpful plugins.
100
+ ℹ️ Pro tip: add `alias feathers-dev='path/to/feathers/bin/feathers-dev'` to your `~/.zshrc` or equivalent to be able to type `feathers-dev`!
@@ -0,0 +1,37 @@
1
+ ==Release notes SRG SSR Type VF==
2
+
3
+ Compiler of release notes: Dalton Maag
4
+ Designer: Dalton Maag
5
+ Designer URL: daltonmaag.com
6
+
7
+ Release date: 2020-11-18
8
+
9
+ Change log:
10
+ - v2.000: This is the first release of the VF.
11
+
12
+ Basic information
13
+ 1 Font name: SRG SSR Type VF
14
+ 2 TrueType Version record: 2.000
15
+ 3 Character Set: Western European Latin
16
+ 4 Supported scripts: Latin
17
+ 5 Number of glyphs: 325
18
+ 6 Usage: Text and Display
19
+ 7 Number of axes: 1
20
+ 8 Axes:
21
+ - Weight
22
+ tag: wght
23
+ range: 300 (Light) - 800 (Heavy)
24
+ 5 Named instances per style:
25
+ - Text: Text Light, Text Regular, Text Medium, Text Bold, Text Heavy.
26
+ - Display: Display Light, Display Regular, Display Medium, Display Bold, Display Heavy
27
+
28
+ Technology
29
+ 1 File formats: The files have been delivered as variable fonts in the TrueType-based OpenType format, for use in all major Operating Systems, TTF for use in apps, and in web font format: WOFF2.
30
+ 2 Embedding settings: Editing of the document is allowed (editable mode); subsetting is allowed.
31
+ 3 Screen optimization information: No screen optimization.
32
+ 4 Default numerals: Proportional. Tabular figures accessible via OpenType features.
33
+
34
+ Other Information
35
+ The fonts contain the following OpenType Stylistic Sets:
36
+ - ss01: alternates K, P, R, Thorn
37
+
@@ -0,0 +1,10 @@
1
+ import React from "react";
2
+ import { ButtonProps } from "./Button.types";
3
+ import { TooltipProps } from "../Tooltip/Tooltip.types";
4
+ import "./Button.scss";
5
+ import "./../Tooltip/Tooltip.scss";
6
+ export declare const ButtonModifiers: readonly ["primary", "save", "publish", "retire", "danger", "favorite", "white", "unobtrusive", "fullwidth", "margin_top", "margin_bottom", "left_align", "icon_rotated", "invisible_content", "no_outline", "extra_big", "big", "small", "extra_tiny", "tiny", "hidden", "icon_right", "icon_sticks_to_border", "spread_content", "bold", "selected", "uppercase", "link", "circle"];
7
+ export declare type ButtonModifiersType = typeof ButtonModifiers[number];
8
+ declare const Button: React.FC<ButtonProps>;
9
+ export declare const ButtonTooltip: React.FC<TooltipProps>;
10
+ export default Button;
@@ -0,0 +1,17 @@
1
+ import { MouseEventHandler, ReactElement } from "react";
2
+ import { ButtonModifiersType } from "./Button";
3
+ import { IconProps } from "../Icon/Icon.types";
4
+ import { TooltipProps } from "../Tooltip/Tooltip.types";
5
+ export interface ButtonProps {
6
+ modifier?: ButtonModifiersType | Array<ButtonModifiersType>;
7
+ children?: JSX.Element;
8
+ text?: string;
9
+ title?: string;
10
+ onClick?: MouseEventHandler<HTMLButtonElement>;
11
+ icon?: ReactElement<IconProps>;
12
+ disabled?: boolean;
13
+ tabIndex?: number;
14
+ dataId?: string;
15
+ dataCy?: string;
16
+ tooltip?: ReactElement<TooltipProps>;
17
+ }
@@ -0,0 +1,110 @@
1
+ import React from "react";
2
+ import { IconProps } from "./Icon.types";
3
+ import "./Icon.scss";
4
+ export declare const IconModifiers: readonly ["success", "danger", "info", "branding", "small", "tiny", "white", "rotatable", "rotated-180"];
5
+ export declare type IconModifiersType = typeof IconModifiers[number];
6
+ declare const Icon: React.FC<IconProps>;
7
+ export declare const UpdateIcon: React.FC<IconProps>;
8
+ export declare const ExclamationMarkIcon: React.FC<IconProps>;
9
+ export declare const QuestionMarkIcon: React.FC<IconProps>;
10
+ export declare const ErrorIcon: React.FC<IconProps>;
11
+ export declare const ChecklistFailedIcon: React.FC<IconProps>;
12
+ export declare const ChecklistPassedIcon: React.FC<IconProps>;
13
+ export declare const CloseIcon: React.FC<IconProps>;
14
+ export declare const CopyIcon: React.FC<IconProps>;
15
+ export declare const GlobiLogoIcon: React.FC<IconProps>;
16
+ export declare const HtmlEmbedIcon: React.FC<IconProps>;
17
+ export declare const LivetickerIcon: React.FC<IconProps>;
18
+ export declare const ImageIcon: React.FC<IconProps>;
19
+ export declare const LinkboxIcon: React.FC<IconProps>;
20
+ export declare const PlusIcon: React.FC<IconProps>;
21
+ export declare const PublishIcon: React.FC<IconProps>;
22
+ export declare const PublishAndLeaveIcon: React.FC<IconProps>;
23
+ export declare const SaveAndLeaveIcon: React.FC<IconProps>;
24
+ export declare const SaveIcon: React.FC<IconProps>;
25
+ export declare const RetireIcon: React.FC<IconProps>;
26
+ export declare const SchorschLogoIcon: React.FC<IconProps>;
27
+ export declare const SearchIcon: React.FC<IconProps>;
28
+ export declare const SettingsIcon: React.FC<IconProps>;
29
+ export declare const TextboxIcon: React.FC<IconProps>;
30
+ export declare const CheckIcon: React.FC<IconProps>;
31
+ export declare const DatawrapperIcon: React.FC<IconProps>;
32
+ export declare const ImageGalleryIcon: React.FC<IconProps>;
33
+ export declare const VideoGalleryIcon: React.FC<IconProps>;
34
+ export declare const AudioGalleryIcon: React.FC<IconProps>;
35
+ export declare const PeopleIcon: React.FC<IconProps>;
36
+ export declare const TwitterIcon: React.FC<IconProps>;
37
+ export declare const EdithIcon: React.FC<IconProps>;
38
+ export declare const CaretIcon: React.FC<IconProps>;
39
+ export declare const SpinnerIcon: React.FC<IconProps>;
40
+ export declare const CheckmarkIcon: React.FC<IconProps>;
41
+ export declare const TrashcanIcon: React.FC<IconProps>;
42
+ export declare const DangerIcon: React.FC<IconProps>;
43
+ export declare const WarningIcon: React.FC<IconProps>;
44
+ export declare const SuccessIcon: React.FC<IconProps>;
45
+ export declare const EditArticleIcon: React.FC<IconProps>;
46
+ export declare const EditTickerItemIcon: React.FC<IconProps>;
47
+ export declare const RevertIcon: React.FC<IconProps>;
48
+ export declare const ForbiddenIcon: React.FC<IconProps>;
49
+ export declare const PlusCircleIcon: React.FC<IconProps>;
50
+ export declare const PreviewIcon: React.FC<IconProps>;
51
+ export declare const PodcastIcon: React.FC<IconProps>;
52
+ export declare const FocusIcon: React.FC<IconProps>;
53
+ export declare const RotateBackIcon: React.FC<IconProps>;
54
+ export declare const RotateForwardIcon: React.FC<IconProps>;
55
+ export declare const ZoomInIcon: React.FC<IconProps>;
56
+ export declare const ZoomOutIcon: React.FC<IconProps>;
57
+ export declare const DropAddIcon: React.FC<IconProps>;
58
+ export declare const DropDownIcon: React.FC<IconProps>;
59
+ export declare const DropUpIcon: React.FC<IconProps>;
60
+ export declare const DropDeleteIcon: React.FC<IconProps>;
61
+ export declare const AudioIcon: React.FC<IconProps>;
62
+ export declare const VideoIcon: React.FC<IconProps>;
63
+ export declare const MeteoMapIcon: React.FC<IconProps>;
64
+ export declare const VideoeditorIcon: React.FC<IconProps>;
65
+ export declare const AudioeditorIcon: React.FC<IconProps>;
66
+ export declare const ArticleIcon: React.FC<IconProps>;
67
+ export declare const AudioFeedIcon: React.FC<IconProps>;
68
+ export declare const FeedIcon: React.FC<IconProps>;
69
+ export declare const TeaserIcon: React.FC<IconProps>;
70
+ export declare const VideoFeedIcon: React.FC<IconProps>;
71
+ export declare const EmptyIcon: React.FC<IconProps>;
72
+ export declare const OpinionIcon: React.FC<IconProps>;
73
+ export declare const LongformIcon: React.FC<IconProps>;
74
+ export declare const LiveIcon: React.FC<IconProps>;
75
+ export declare const TVIcon: React.FC<IconProps>;
76
+ export declare const FacebookIcon: React.FC<IconProps>;
77
+ export declare const TimeIcon: React.FC<IconProps>;
78
+ export declare const InvisibleIcon: React.FC<IconProps>;
79
+ export declare const HeadingIcon: React.FC<IconProps>;
80
+ export declare const BoldIcon: React.FC<IconProps>;
81
+ export declare const ItalicIcon: React.FC<IconProps>;
82
+ export declare const UnorderedListIcon: React.FC<IconProps>;
83
+ export declare const OrderedListIcon: React.FC<IconProps>;
84
+ export declare const LinkIcon: React.FC<IconProps>;
85
+ export declare const UnlinkIcon: React.FC<IconProps>;
86
+ export declare const CommentIcon: React.FC<IconProps>;
87
+ export declare const PolisMapIcon: React.FC<IconProps>;
88
+ export declare const FederalVotesIcon: React.FC<IconProps>;
89
+ export declare const CHMapIcon: React.FC<IconProps>;
90
+ export declare const CropIcon: React.FC<IconProps>;
91
+ export declare const PushIcon: React.FC<IconProps>;
92
+ export declare const MaterialBoxIcon: React.FC<IconProps>;
93
+ export declare const QuoteIcon: React.FC<IconProps>;
94
+ export declare const ExternalLinkIcon: React.FC<IconProps>;
95
+ export declare const ImportImageIcon: React.FC<IconProps>;
96
+ export declare const ArrowDownIcon: React.FC<IconProps>;
97
+ export declare const ArrowUpIcon: React.FC<IconProps>;
98
+ export declare const RawHTMLIcon: React.FC<IconProps>;
99
+ export declare const FormIcon: React.FC<IconProps>;
100
+ export declare const NewsGraphicIcon: React.FC<IconProps>;
101
+ export declare const PollIcon: React.FC<IconProps>;
102
+ export declare const TableIcon: React.FC<IconProps>;
103
+ export declare const AddRowIcon: React.FC<IconProps>;
104
+ export declare const DeleteRowIcon: React.FC<IconProps>;
105
+ export declare const AddColumnIcon: React.FC<IconProps>;
106
+ export declare const DeleteColumnIcon: React.FC<IconProps>;
107
+ export declare const TableHeadIcon: React.FC<IconProps>;
108
+ export declare const TableWidthIcon: React.FC<IconProps>;
109
+ export declare const InstagramIcon: React.FC<IconProps>;
110
+ export default Icon;
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ import { IconModifiersType } from "./Icon";
3
+ export interface IconProps {
4
+ modifier?: IconModifiersType | Array<IconModifiersType>;
5
+ children?: JSX.Element;
6
+ alt?: string;
7
+ noStroke?: boolean;
8
+ }
@@ -0,0 +1,9 @@
1
+ import React from "react";
2
+ import { TooltipProps } from "./Tooltip.types";
3
+ import "./Tooltip.scss";
4
+ export declare const TooltipModifiers: readonly ["always_open", "space_filling", "no_min_width", "show_delayed", "validation", "max_parent_width", "no_word_wrap", "no_border", "no_margin", "clickable"];
5
+ export declare type TooltipModifiersType = typeof TooltipModifiers[number];
6
+ export declare const TooltipDirections: readonly ["up", "right", "down", "left", "down-edge-left", "down-edge-right"];
7
+ export declare type TooltipDirectionsType = typeof TooltipDirections[number];
8
+ declare const Tooltip: React.FC<TooltipProps>;
9
+ export default Tooltip;
@@ -0,0 +1,8 @@
1
+ import React from "react";
2
+ import { TooltipDirectionsType, TooltipModifiersType } from "./Tooltip";
3
+ export interface TooltipProps {
4
+ modifier?: TooltipModifiersType | Array<TooltipModifiersType>;
5
+ text?: string | React.ReactNode;
6
+ direction?: TooltipDirectionsType;
7
+ content: string;
8
+ }
package/build/index.d.ts CHANGED
@@ -1,2 +1,4 @@
1
- import { UpdateIcon, ExclamationMarkIcon, SettingsIcon } from './Icon/Icon';
2
- export { UpdateIcon, ExclamationMarkIcon, SettingsIcon };
1
+ import { AddColumnIcon, AddRowIcon, ArrowDownIcon, ArrowUpIcon, ArticleIcon, AudioFeedIcon, AudioGalleryIcon, AudioIcon, AudioeditorIcon, BoldIcon, CHMapIcon, CaretIcon, CheckIcon, ChecklistFailedIcon, ChecklistPassedIcon, CheckmarkIcon, CloseIcon, CommentIcon, CopyIcon, CropIcon, DangerIcon, DatawrapperIcon, DeleteColumnIcon, DeleteRowIcon, DropAddIcon, DropDeleteIcon, DropDownIcon, DropUpIcon, EditArticleIcon, EditTickerItemIcon, EdithIcon, EmptyIcon, ErrorIcon, ExclamationMarkIcon, ExternalLinkIcon, FacebookIcon, FederalVotesIcon, FeedIcon, FocusIcon, ForbiddenIcon, FormIcon, GlobiLogoIcon, HeadingIcon, HtmlEmbedIcon, ImageGalleryIcon, ImageIcon, ImportImageIcon, InstagramIcon, InvisibleIcon, ItalicIcon, LinkIcon, LinkboxIcon, LiveIcon, LivetickerIcon, LongformIcon, MaterialBoxIcon, MeteoMapIcon, NewsGraphicIcon, OpinionIcon, OrderedListIcon, PeopleIcon, PlusCircleIcon, PlusIcon, PodcastIcon, PolisMapIcon, PollIcon, PreviewIcon, PublishAndLeaveIcon, PublishIcon, PushIcon, QuestionMarkIcon, QuoteIcon, RawHTMLIcon, RetireIcon, RevertIcon, RotateBackIcon, RotateForwardIcon, SaveAndLeaveIcon, SaveIcon, SchorschLogoIcon, SearchIcon, SettingsIcon, SpinnerIcon, SuccessIcon, TVIcon, TableHeadIcon, TableIcon, TableWidthIcon, TeaserIcon, TextboxIcon, TimeIcon, TrashcanIcon, TwitterIcon, UnlinkIcon, UnorderedListIcon, UpdateIcon, VideoFeedIcon, VideoGalleryIcon, VideoIcon, VideoeditorIcon, WarningIcon, ZoomInIcon, ZoomOutIcon } from "./elements/Icon/Icon";
2
+ import Button, { ButtonTooltip } from "./elements/Button/Button";
3
+ import Tooltip from "./elements/Tooltip/Tooltip";
4
+ export { AddColumnIcon, AddRowIcon, ArrowDownIcon, ArrowUpIcon, ArticleIcon, AudioFeedIcon, AudioGalleryIcon, AudioIcon, AudioeditorIcon, BoldIcon, Button, ButtonTooltip, CHMapIcon, CaretIcon, CheckIcon, ChecklistFailedIcon, ChecklistPassedIcon, CheckmarkIcon, CloseIcon, CommentIcon, CopyIcon, CropIcon, DangerIcon, DatawrapperIcon, DeleteColumnIcon, DeleteRowIcon, DropAddIcon, DropDeleteIcon, DropDownIcon, DropUpIcon, EditArticleIcon, EditTickerItemIcon, EdithIcon, EmptyIcon, ErrorIcon, ExclamationMarkIcon, ExternalLinkIcon, FacebookIcon, FederalVotesIcon, FeedIcon, FocusIcon, ForbiddenIcon, FormIcon, GlobiLogoIcon, HeadingIcon, HtmlEmbedIcon, ImageGalleryIcon, ImageIcon, ImportImageIcon, InstagramIcon, InvisibleIcon, ItalicIcon, LinkIcon, LinkboxIcon, LiveIcon, LivetickerIcon, LongformIcon, MaterialBoxIcon, MeteoMapIcon, NewsGraphicIcon, OpinionIcon, OrderedListIcon, PeopleIcon, PlusCircleIcon, PlusIcon, PodcastIcon, PolisMapIcon, PollIcon, PreviewIcon, PublishAndLeaveIcon, PublishIcon, PushIcon, QuestionMarkIcon, QuoteIcon, RawHTMLIcon, RetireIcon, RevertIcon, RotateBackIcon, RotateForwardIcon, SaveAndLeaveIcon, SaveIcon, SchorschLogoIcon, SearchIcon, SettingsIcon, SpinnerIcon, SuccessIcon, TVIcon, TableHeadIcon, TableIcon, TableWidthIcon, TeaserIcon, TextboxIcon, TimeIcon, Tooltip, TrashcanIcon, TwitterIcon, UnlinkIcon, UnorderedListIcon, UpdateIcon, VideoFeedIcon, VideoGalleryIcon, VideoIcon, VideoeditorIcon, WarningIcon, ZoomInIcon, ZoomOutIcon, };