@utrecht/web-component-library-stencil 1.0.0-alpha.207 → 1.0.0-alpha.208

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.
@@ -0,0 +1,25 @@
1
+ import clsx from 'clsx';
2
+
3
+ export const defaultArgs = {
4
+ external: false,
5
+ hover: false,
6
+ href: '',
7
+ focus: false,
8
+ focusVisible: false,
9
+ textContent: '',
10
+ };
11
+
12
+ export const ButtonLink = ({
13
+ external = false,
14
+ hover = false,
15
+ href = '',
16
+ focus = false,
17
+ focusVisible = false,
18
+ textContent = '',
19
+ }) =>
20
+ `<a role="button" href="${href}" class="${clsx(
21
+ 'utrecht-button-link',
22
+ hover && 'utrecht-button-link--hover',
23
+ focus && 'utrecht-button-link--focus',
24
+ focusVisible && 'utrecht-button-link--focus-visible',
25
+ )}"${external ? ' rel="external noopener noreferrer"' : ''}>${textContent}</a>`;
@@ -0,0 +1,42 @@
1
+ /**
2
+ * @license EUPL-1.2
3
+ * Copyright (c) 2022 Robbert Broersma
4
+ */
5
+
6
+ import clsx from 'clsx';
7
+
8
+ export const defaultArgs = {
9
+ active: false,
10
+ external: false,
11
+ focus: false,
12
+ focusVisible: false,
13
+ hover: false,
14
+ href: '',
15
+ textContent: '',
16
+ };
17
+
18
+ export const LinkButton = ({
19
+ active = false,
20
+ external = false,
21
+ href = '',
22
+ focus = false,
23
+ focusVisible = false,
24
+ hover = false,
25
+ textContent = '',
26
+ }) => {
27
+ const stateClassNames = {
28
+ 'utrecht-link-button--active': active,
29
+ 'utrecht-link-button--focus': focus,
30
+ 'utrecht-link-button--focus-visible': focusVisible,
31
+ 'utrecht-link-button--hover': hover,
32
+ };
33
+ return href
34
+ ? `<a href="${href}" class="${clsx('utrecht-link-button', stateClassNames)}"${
35
+ external ? ' rel="external noopener noreferrer"' : ''
36
+ }>${textContent}</a>`
37
+ : `<button class="${clsx(
38
+ 'utrecht-link-button',
39
+ 'utrecht-link-button--html-button',
40
+ stateClassNames,
41
+ )}">${textContent}</button>`;
42
+ };
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.207",
2
+ "version": "1.0.0-alpha.208",
3
3
  "author": "Community for NL Design System",
4
4
  "description": "Stencil component library bundle for the Municipality of Utrecht based on the NL Design System architecture",
5
5
  "license": "EUPL-1.2",
@@ -55,5 +55,5 @@
55
55
  "watch:stencil": "chokidar --follow-symlinks --initial --command \"npm run build:stencil\" \"../../components/**/*.(js|jsx|ts|tsx)\"",
56
56
  "generate": "stencil generate"
57
57
  },
58
- "gitHead": "6cdfa3731ad2ef4e2e43add8c193d9f311e045c8"
58
+ "gitHead": "2cf2c1bc155fc767995dedf10f623a4dc5eb6c81"
59
59
  }