Compare commits
21 Commits
Author | SHA1 | Date |
---|---|---|
Bauke | 998fa08fad | |
Bauke | 5cdb02bc80 | |
Bauke | c3a9013c23 | |
Bauke | e901bd6019 | |
Bauke | c02a5740ae | |
Bauke | c5a38cf4ac | |
Bauke | c25fb4ece4 | |
Bauke | 1080648ead | |
Bauke | d8d0f76497 | |
Bauke | 7c38f3c882 | |
Bauke | 62e8a6cb4d | |
Bauke | a5d288c558 | |
Bauke | 89bec5af88 | |
Bauke | 594e06f0f5 | |
Bauke | 57b07a4531 | |
Bauke | 03f3dbc7dc | |
Bauke | 3d6898444d | |
Bauke | 7a3efe6377 | |
Bauke | 2ef20ca431 | |
Bauke | 3cc7d3e6b9 | |
Bauke | dfeaa5db22 |
143
LICENSE
143
LICENSE
|
@ -1,5 +1,5 @@
|
|||
GNU GENERAL PUBLIC LICENSE
|
||||
Version 3, 29 June 2007
|
||||
GNU AFFERO GENERAL PUBLIC LICENSE
|
||||
Version 3, 19 November 2007
|
||||
|
||||
Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
|
||||
Everyone is permitted to copy and distribute verbatim copies
|
||||
|
@ -7,17 +7,15 @@
|
|||
|
||||
Preamble
|
||||
|
||||
The GNU General Public License is a free, copyleft license for
|
||||
software and other kinds of works.
|
||||
The GNU Affero General Public License is a free, copyleft license for
|
||||
software and other kinds of works, specifically designed to ensure
|
||||
cooperation with the community in the case of network server software.
|
||||
|
||||
The licenses for most software and other practical works are designed
|
||||
to take away your freedom to share and change the works. By contrast,
|
||||
the GNU General Public License is intended to guarantee your freedom to
|
||||
our General Public Licenses are intended to guarantee your freedom to
|
||||
share and change all versions of a program--to make sure it remains free
|
||||
software for all its users. We, the Free Software Foundation, use the
|
||||
GNU General Public License for most of our software; it applies also to
|
||||
any other work released this way by its authors. You can apply it to
|
||||
your programs, too.
|
||||
software for all its users.
|
||||
|
||||
When we speak of free software, we are referring to freedom, not
|
||||
price. Our General Public Licenses are designed to make sure that you
|
||||
|
@ -26,44 +24,34 @@ them if you wish), that you receive source code or can get it if you
|
|||
want it, that you can change the software or use pieces of it in new
|
||||
free programs, and that you know you can do these things.
|
||||
|
||||
To protect your rights, we need to prevent others from denying you
|
||||
these rights or asking you to surrender the rights. Therefore, you have
|
||||
certain responsibilities if you distribute copies of the software, or if
|
||||
you modify it: responsibilities to respect the freedom of others.
|
||||
Developers that use our General Public Licenses protect your rights
|
||||
with two steps: (1) assert copyright on the software, and (2) offer
|
||||
you this License which gives you legal permission to copy, distribute
|
||||
and/or modify the software.
|
||||
|
||||
For example, if you distribute copies of such a program, whether
|
||||
gratis or for a fee, you must pass on to the recipients the same
|
||||
freedoms that you received. You must make sure that they, too, receive
|
||||
or can get the source code. And you must show them these terms so they
|
||||
know their rights.
|
||||
A secondary benefit of defending all users' freedom is that
|
||||
improvements made in alternate versions of the program, if they
|
||||
receive widespread use, become available for other developers to
|
||||
incorporate. Many developers of free software are heartened and
|
||||
encouraged by the resulting cooperation. However, in the case of
|
||||
software used on network servers, this result may fail to come about.
|
||||
The GNU General Public License permits making a modified version and
|
||||
letting the public access it on a server without ever releasing its
|
||||
source code to the public.
|
||||
|
||||
Developers that use the GNU GPL protect your rights with two steps:
|
||||
(1) assert copyright on the software, and (2) offer you this License
|
||||
giving you legal permission to copy, distribute and/or modify it.
|
||||
The GNU Affero General Public License is designed specifically to
|
||||
ensure that, in such cases, the modified source code becomes available
|
||||
to the community. It requires the operator of a network server to
|
||||
provide the source code of the modified version running there to the
|
||||
users of that server. Therefore, public use of a modified version, on
|
||||
a publicly accessible server, gives the public access to the source
|
||||
code of the modified version.
|
||||
|
||||
For the developers' and authors' protection, the GPL clearly explains
|
||||
that there is no warranty for this free software. For both users' and
|
||||
authors' sake, the GPL requires that modified versions be marked as
|
||||
changed, so that their problems will not be attributed erroneously to
|
||||
authors of previous versions.
|
||||
|
||||
Some devices are designed to deny users access to install or run
|
||||
modified versions of the software inside them, although the manufacturer
|
||||
can do so. This is fundamentally incompatible with the aim of
|
||||
protecting users' freedom to change the software. The systematic
|
||||
pattern of such abuse occurs in the area of products for individuals to
|
||||
use, which is precisely where it is most unacceptable. Therefore, we
|
||||
have designed this version of the GPL to prohibit the practice for those
|
||||
products. If such problems arise substantially in other domains, we
|
||||
stand ready to extend this provision to those domains in future versions
|
||||
of the GPL, as needed to protect the freedom of users.
|
||||
|
||||
Finally, every program is threatened constantly by software patents.
|
||||
States should not allow patents to restrict development and use of
|
||||
software on general-purpose computers, but in those that do, we wish to
|
||||
avoid the special danger that patents applied to a free program could
|
||||
make it effectively proprietary. To prevent this, the GPL assures that
|
||||
patents cannot be used to render the program non-free.
|
||||
An older license, called the Affero General Public License and
|
||||
published by Affero, was designed to accomplish similar goals. This is
|
||||
a different license, not a version of the Affero GPL, but Affero has
|
||||
released a new version of the Affero GPL which permits relicensing under
|
||||
this license.
|
||||
|
||||
The precise terms and conditions for copying, distribution and
|
||||
modification follow.
|
||||
|
@ -72,7 +60,7 @@ modification follow.
|
|||
|
||||
0. Definitions.
|
||||
|
||||
"This License" refers to version 3 of the GNU General Public License.
|
||||
"This License" refers to version 3 of the GNU Affero General Public License.
|
||||
|
||||
"Copyright" also means copyright-like laws that apply to other kinds of
|
||||
works, such as semiconductor masks.
|
||||
|
@ -549,35 +537,45 @@ to collect a royalty for further conveying from those to whom you convey
|
|||
the Program, the only way you could satisfy both those terms and this
|
||||
License would be to refrain entirely from conveying the Program.
|
||||
|
||||
13. Use with the GNU Affero General Public License.
|
||||
13. Remote Network Interaction; Use with the GNU General Public License.
|
||||
|
||||
Notwithstanding any other provision of this License, if you modify the
|
||||
Program, your modified version must prominently offer all users
|
||||
interacting with it remotely through a computer network (if your version
|
||||
supports such interaction) an opportunity to receive the Corresponding
|
||||
Source of your version by providing access to the Corresponding Source
|
||||
from a network server at no charge, through some standard or customary
|
||||
means of facilitating copying of software. This Corresponding Source
|
||||
shall include the Corresponding Source for any work covered by version 3
|
||||
of the GNU General Public License that is incorporated pursuant to the
|
||||
following paragraph.
|
||||
|
||||
Notwithstanding any other provision of this License, you have
|
||||
permission to link or combine any covered work with a work licensed
|
||||
under version 3 of the GNU Affero General Public License into a single
|
||||
under version 3 of the GNU General Public License into a single
|
||||
combined work, and to convey the resulting work. The terms of this
|
||||
License will continue to apply to the part which is the covered work,
|
||||
but the special requirements of the GNU Affero General Public License,
|
||||
section 13, concerning interaction through a network will apply to the
|
||||
combination as such.
|
||||
but the work with which it is combined will remain governed by version
|
||||
3 of the GNU General Public License.
|
||||
|
||||
14. Revised Versions of this License.
|
||||
|
||||
The Free Software Foundation may publish revised and/or new versions of
|
||||
the GNU General Public License from time to time. Such new versions will
|
||||
be similar in spirit to the present version, but may differ in detail to
|
||||
the GNU Affero General Public License from time to time. Such new versions
|
||||
will be similar in spirit to the present version, but may differ in detail to
|
||||
address new problems or concerns.
|
||||
|
||||
Each version is given a distinguishing version number. If the
|
||||
Program specifies that a certain numbered version of the GNU General
|
||||
Program specifies that a certain numbered version of the GNU Affero General
|
||||
Public License "or any later version" applies to it, you have the
|
||||
option of following the terms and conditions either of that numbered
|
||||
version or of any later version published by the Free Software
|
||||
Foundation. If the Program does not specify a version number of the
|
||||
GNU General Public License, you may choose any version ever published
|
||||
GNU Affero General Public License, you may choose any version ever published
|
||||
by the Free Software Foundation.
|
||||
|
||||
If the Program specifies that a proxy can decide which future
|
||||
versions of the GNU General Public License can be used, that proxy's
|
||||
versions of the GNU Affero General Public License can be used, that proxy's
|
||||
public statement of acceptance of a version permanently authorizes you
|
||||
to choose that version for the Program.
|
||||
|
||||
|
@ -635,40 +633,29 @@ the "copyright" line and a pointer to where the full notice is found.
|
|||
Copyright (C) <year> <name of author>
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
it under the terms of the GNU Affero General Public License as published
|
||||
by the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU General Public License for more details.
|
||||
GNU Affero General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License
|
||||
You should have received a copy of the GNU Affero General Public License
|
||||
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
|
||||
Also add information on how to contact you by electronic and paper mail.
|
||||
|
||||
If the program does terminal interaction, make it output a short
|
||||
notice like this when it starts in an interactive mode:
|
||||
|
||||
<program> Copyright (C) <year> <name of author>
|
||||
This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
|
||||
This is free software, and you are welcome to redistribute it
|
||||
under certain conditions; type `show c' for details.
|
||||
|
||||
The hypothetical commands `show w' and `show c' should show the appropriate
|
||||
parts of the General Public License. Of course, your program's commands
|
||||
might be different; for a GUI interface, you would use an "about box".
|
||||
If your software can interact with users remotely through a computer
|
||||
network, you should also make sure that it provides a way for users to
|
||||
get its source. For example, if your program is a web application, its
|
||||
interface could display a "Source" link that leads users to an archive
|
||||
of the code. There are many ways you could offer source, and different
|
||||
solutions will be better for different programs; see section 13 for the
|
||||
specific requirements.
|
||||
|
||||
You should also get your employer (if you work as a programmer) or school,
|
||||
if any, to sign a "copyright disclaimer" for the program, if necessary.
|
||||
For more information on this, and how to apply and follow the GNU GPL, see
|
||||
For more information on this, and how to apply and follow the GNU AGPL, see
|
||||
<https://www.gnu.org/licenses/>.
|
||||
|
||||
The GNU General Public License does not permit incorporating your program
|
||||
into proprietary programs. If your program is a subroutine library, you
|
||||
may consider it more useful to permit linking proprietary applications with
|
||||
the library. If this is what you want to do, use the GNU Lesser General
|
||||
Public License instead of this License. But first, please read
|
||||
<https://www.gnu.org/licenses/why-not-lgpl.html>.
|
||||
|
|
26
README.md
26
README.md
|
@ -1,27 +1,7 @@
|
|||
# Gram
|
||||
# Preact 🧵 Components
|
||||
|
||||
> Opinionated component library using [HTM] & [Preact].
|
||||
|
||||
[HTM]: https://github.com/developit/htm
|
||||
[Preact]: https://preactjs.com/
|
||||
|
||||
## Installation
|
||||
|
||||
Add `@holllo/gram`, `htm` and `preact` with your Node package manager of choice ([pnpm] in our case).
|
||||
|
||||
[pnpm]: https://pnpm.io
|
||||
|
||||
```sh
|
||||
pnpm add @holllo/gram htm preact
|
||||
```
|
||||
|
||||
## Components
|
||||
|
||||
* [ConfirmButton](source/buttons/confirm-button.ts)
|
||||
* [PrivacyLink](source/links/privacy-link.ts)
|
||||
> **Holllo's Preact component library.**
|
||||
|
||||
## License
|
||||
|
||||
Gram is open-sourced with the [GPL-3.0-or-later] license.
|
||||
|
||||
[GPL-3.0-or-later]: https://github.com/Holllo/gram/blob/main/LICENSE
|
||||
Distributed under the [AGPL-3.0-or-later](https://spdx.org/licenses/AGPL-3.0-or-later.html) license, see [LICENSE](https://git.bauke.xyz/Holllo/preact-components/src/branch/main/LICENSE) for more information.
|
||||
|
|
38
package.json
38
package.json
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"name": "@holllo/gram",
|
||||
"description": "Opinionated component library using HTM & Preact.",
|
||||
"license": "GPL-3.0-or-later",
|
||||
"version": "0.1.0",
|
||||
"author": "Holllo <helllo@holllo.cc>",
|
||||
"name": "@holllo/preact-components",
|
||||
"description": "Holllo's Preact component library.",
|
||||
"license": "AGPL-3.0-or-later",
|
||||
"version": "0.2.3",
|
||||
"author": "Holllo <helllo@holllo.org>",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/Holllo/gram"
|
||||
"url": "https://git.bauke.xyz/Holllo/preact-components"
|
||||
},
|
||||
"scripts": {
|
||||
"build": "tsc",
|
||||
|
@ -15,23 +15,23 @@
|
|||
"test:snapshots": "ava --update-snapshots"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@happy-dom/global-registrator": "^2.47.3",
|
||||
"ava": "^4.0.1",
|
||||
"c8": "^7.11.0",
|
||||
"htm": "^3.1.0",
|
||||
"preact": "^10.6.6",
|
||||
"preact-render-to-string": "^5.1.20",
|
||||
"ts-node": "^10.6.0",
|
||||
"typescript": "^4.6.2",
|
||||
"xo": "^0.48.0"
|
||||
"@happy-dom/global-registrator": "^6.0.4",
|
||||
"ava": "^4.3.3",
|
||||
"c8": "^7.12.0",
|
||||
"htm": "^3.1.1",
|
||||
"preact": "^10.11.0",
|
||||
"preact-render-to-string": "^5.2.4",
|
||||
"ts-node": "^10.9.1",
|
||||
"typescript": "^4.8.4",
|
||||
"xo": "^0.52.3"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"htm": "3.x",
|
||||
"preact": "10.x"
|
||||
},
|
||||
"type": "module",
|
||||
"main": "build/source/gram.js",
|
||||
"types": "build/source/gram.d.ts",
|
||||
"main": "build/source/index.js",
|
||||
"types": "build/source/index.d.ts",
|
||||
"files": [
|
||||
"build/source/",
|
||||
"package.json",
|
||||
|
@ -65,6 +65,10 @@
|
|||
},
|
||||
"xo": {
|
||||
"prettier": true,
|
||||
"rules": {
|
||||
"@typescript-eslint/consistent-type-imports": "off",
|
||||
"n/file-extension-in-import": "off"
|
||||
},
|
||||
"space": true
|
||||
}
|
||||
}
|
||||
|
|
1289
pnpm-lock.yaml
1289
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
|
@ -5,11 +5,11 @@ import {Component, VNode} from 'preact';
|
|||
* Component properties for {@linkcode ConfirmButton}.
|
||||
*/
|
||||
export type ConfirmButtonProps = {
|
||||
attributes: Record<string, unknown>;
|
||||
class: string;
|
||||
click: (event: MouseEvent) => unknown;
|
||||
confirmClass: string;
|
||||
confirmText: string;
|
||||
extraAttributes: Record<string, string>;
|
||||
preventDefault: boolean;
|
||||
text: string;
|
||||
timeout: number;
|
||||
|
@ -76,11 +76,7 @@ export class ConfirmButton extends Component<
|
|||
}
|
||||
|
||||
return html`
|
||||
<button
|
||||
...${this.props.extraAttributes}
|
||||
...${props}
|
||||
onclick=${this.click}
|
||||
>
|
||||
<button ...${this.props.attributes} ...${props} onclick=${this.click}>
|
||||
${text}
|
||||
</button>
|
||||
`;
|
||||
|
|
|
@ -0,0 +1,70 @@
|
|||
import {html} from 'htm/preact';
|
||||
import {Component, VNode} from 'preact';
|
||||
|
||||
/**
|
||||
* Component properties for {@linkcode FeedbackButton}.
|
||||
*/
|
||||
export type FeedbackButtonProps = {
|
||||
attributes: Record<string, unknown>;
|
||||
click: (event: MouseEvent) => unknown;
|
||||
feedbackText: string;
|
||||
text: string;
|
||||
timeout: number;
|
||||
};
|
||||
|
||||
/**
|
||||
* Component state for {@linkcode FeedbackButton}.
|
||||
*/
|
||||
export type FeedbackButtonState = {
|
||||
currentText: string;
|
||||
timeoutHandle: number | undefined;
|
||||
};
|
||||
|
||||
/**
|
||||
* A {@linkcode https://developer.mozilla.org/docs/Web/HTML/Element/button <button>}
|
||||
* element wrapper that changes its text for a given time after being clicked.
|
||||
*/
|
||||
export class FeedbackButton extends Component<
|
||||
FeedbackButtonProps,
|
||||
FeedbackButtonState
|
||||
> {
|
||||
constructor(props: FeedbackButtonProps) {
|
||||
super(props);
|
||||
|
||||
this.state = {
|
||||
currentText: this.props.text,
|
||||
timeoutHandle: undefined,
|
||||
};
|
||||
}
|
||||
|
||||
click = async (event: MouseEvent) => {
|
||||
if ((await this.props.click(event)) === false) {
|
||||
return;
|
||||
}
|
||||
|
||||
let {timeoutHandle} = this.state;
|
||||
if (timeoutHandle !== undefined) {
|
||||
window.clearTimeout(timeoutHandle);
|
||||
}
|
||||
|
||||
timeoutHandle = window.setTimeout(() => {
|
||||
this.setState({
|
||||
currentText: this.props.text,
|
||||
timeoutHandle: undefined,
|
||||
});
|
||||
}, this.props.timeout);
|
||||
|
||||
this.setState({
|
||||
currentText: this.props.feedbackText,
|
||||
timeoutHandle,
|
||||
});
|
||||
};
|
||||
|
||||
render(): VNode {
|
||||
return html`
|
||||
<button ...${this.props.attributes} onclick=${this.click}>
|
||||
${this.state.currentText}
|
||||
</button>
|
||||
`;
|
||||
}
|
||||
}
|
|
@ -1,5 +1,6 @@
|
|||
// Button Exports
|
||||
export * from './buttons/confirm-button.js';
|
||||
export * from './buttons/feedback-button.js';
|
||||
|
||||
// Link Exports
|
||||
export * from './links/privacy-link.js';
|
|
@ -5,9 +5,8 @@ import {Component, ComponentChildren, VNode} from 'preact';
|
|||
* Component properties for {@linkcode PrivacyLink}.
|
||||
*/
|
||||
export type PrivacyLinkProps = {
|
||||
attributes: Record<string, unknown>;
|
||||
children: ComponentChildren;
|
||||
class: string;
|
||||
href: string;
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -18,8 +17,7 @@ export type PrivacyLinkProps = {
|
|||
export class PrivacyLink extends Component<PrivacyLinkProps> {
|
||||
render(): VNode {
|
||||
const props: Record<string, string> = {
|
||||
class: this.props.class,
|
||||
href: this.props.href,
|
||||
...this.props.attributes,
|
||||
rel: 'noopener noreferrer',
|
||||
target: '_blank',
|
||||
};
|
||||
|
|
|
@ -3,7 +3,7 @@ import test from 'ava';
|
|||
import {html} from 'htm/preact';
|
||||
import {render} from 'preact';
|
||||
|
||||
import {ConfirmButton, ConfirmButtonProps} from '../../source/gram.js';
|
||||
import {ConfirmButton, ConfirmButtonProps} from '../../source/index.js';
|
||||
import {sleep} from '../utilities.js';
|
||||
|
||||
test.before(() => {
|
||||
|
@ -14,13 +14,13 @@ test('ConfirmButton', async (t) => {
|
|||
t.plan(3);
|
||||
|
||||
const props: ConfirmButtonProps = {
|
||||
attributes: {
|
||||
id: 'confirm-button',
|
||||
},
|
||||
class: 'button',
|
||||
click: (event) => t.true(event !== undefined),
|
||||
confirmClass: 'confirm',
|
||||
confirmText: 'Confirm Button',
|
||||
extraAttributes: {
|
||||
id: 'confirm-button',
|
||||
},
|
||||
preventDefault: true,
|
||||
text: 'Button',
|
||||
timeout: 1000,
|
||||
|
|
|
@ -0,0 +1,68 @@
|
|||
import {GlobalRegistrator} from '@happy-dom/global-registrator';
|
||||
import test from 'ava';
|
||||
import {html} from 'htm/preact';
|
||||
import {render} from 'preact';
|
||||
|
||||
import {FeedbackButton, FeedbackButtonProps} from '../../source/index.js';
|
||||
import {sleep} from '../utilities.js';
|
||||
|
||||
test.before(() => {
|
||||
GlobalRegistrator.register();
|
||||
});
|
||||
|
||||
test('FeedbackButton', async (t) => {
|
||||
t.plan(7);
|
||||
|
||||
const props: FeedbackButtonProps = {
|
||||
attributes: {
|
||||
id: 'feedback-button',
|
||||
},
|
||||
click: (event) => t.true(event !== undefined),
|
||||
feedbackText: 'Feedback Example',
|
||||
text: 'Example',
|
||||
timeout: 1000,
|
||||
};
|
||||
|
||||
const noFeedbackProps: FeedbackButtonProps = {
|
||||
...props,
|
||||
attributes: {
|
||||
id: 'no-feedback-button',
|
||||
},
|
||||
click(event) {
|
||||
props.click(event);
|
||||
return false;
|
||||
},
|
||||
};
|
||||
|
||||
render(
|
||||
html`
|
||||
<${FeedbackButton} ...${props} />
|
||||
<${FeedbackButton} ...${noFeedbackProps} />
|
||||
`,
|
||||
document,
|
||||
);
|
||||
|
||||
const noFeedbackButton = document.querySelector<HTMLButtonElement>(
|
||||
'#no-feedback-button',
|
||||
)!;
|
||||
|
||||
noFeedbackButton.click();
|
||||
await sleep();
|
||||
t.false(noFeedbackButton.outerHTML.includes(props.feedbackText));
|
||||
|
||||
const buttonElement =
|
||||
document.querySelector<HTMLButtonElement>('#feedback-button')!;
|
||||
|
||||
t.snapshot(buttonElement.outerHTML, 'Default state');
|
||||
buttonElement.click();
|
||||
|
||||
// Wait for Preact to do its stuff.
|
||||
await sleep();
|
||||
|
||||
t.snapshot(buttonElement.outerHTML, 'Feedback state');
|
||||
buttonElement.click();
|
||||
|
||||
await sleep(props.timeout * 1.25);
|
||||
|
||||
t.snapshot(buttonElement.outerHTML, 'Back to default state');
|
||||
});
|
|
@ -0,0 +1,19 @@
|
|||
# Snapshot report for `tests/buttons/feedback-button.test.ts`
|
||||
|
||||
The actual snapshot is saved in `feedback-button.test.ts.snap`.
|
||||
|
||||
Generated by [AVA](https://avajs.dev).
|
||||
|
||||
## FeedbackButton
|
||||
|
||||
> Default state
|
||||
|
||||
'<button id="feedback-button">Example</button>'
|
||||
|
||||
> Feedback state
|
||||
|
||||
'<button id="feedback-button">Feedback Example</button>'
|
||||
|
||||
> Back to default state
|
||||
|
||||
'<button id="feedback-button">Example</button>'
|
Binary file not shown.
|
@ -2,20 +2,23 @@ import test from 'ava';
|
|||
import {html} from 'htm/preact';
|
||||
import {render} from 'preact-render-to-string';
|
||||
|
||||
import {PrivacyLink} from '../../source/gram.js';
|
||||
import {PrivacyLink} from '../../source/index.js';
|
||||
|
||||
test('PrivacyLink', (t) => {
|
||||
t.snapshot(render(html`<${PrivacyLink} />`), 'Empty');
|
||||
|
||||
const attributes: Record<string, unknown> = {
|
||||
href: 'https://example.org',
|
||||
};
|
||||
t.snapshot(
|
||||
render(html`<${PrivacyLink} href="https://example.org">Example<//>`),
|
||||
render(html`<${PrivacyLink} attributes=${attributes}>Example<//>`),
|
||||
'Text children',
|
||||
);
|
||||
|
||||
t.snapshot(
|
||||
render(
|
||||
html`
|
||||
<${PrivacyLink} href="https://example.org">
|
||||
<${PrivacyLink} attributes=${attributes}>
|
||||
Example <span class="bold">with children</span>
|
||||
<//>
|
||||
`,
|
||||
|
@ -23,14 +26,9 @@ test('PrivacyLink', (t) => {
|
|||
'HTML children',
|
||||
);
|
||||
|
||||
attributes.class = 'bold italic';
|
||||
t.snapshot(
|
||||
render(
|
||||
html`
|
||||
<${PrivacyLink} class="bold italic" href="https://example.org">
|
||||
Example
|
||||
<//>
|
||||
`,
|
||||
),
|
||||
render(html`<${PrivacyLink} attributes=${attributes}>Example<//>`),
|
||||
'CSS class',
|
||||
);
|
||||
});
|
||||
|
|
|
@ -20,4 +20,4 @@ Generated by [AVA](https://avajs.dev).
|
|||
|
||||
> CSS class
|
||||
|
||||
'<a class="bold italic" href="https://example.org" rel="noopener noreferrer" target="_blank">Example</a>'
|
||||
'<a href="https://example.org" class="bold italic" rel="noopener noreferrer" target="_blank">Example</a>'
|
||||
|
|
Binary file not shown.
Loading…
Reference in New Issue