@awenovations/aura 0.0.4 → 0.0.6

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,3 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M8 12H16M12 8V16M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
+ </svg>
@@ -0,0 +1,10 @@
1
+ <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_4430_282)">
3
+ <path d="M6 9H12M9 6V12M16.5 9C16.5 13.1421 13.1421 16.5 9 16.5C4.85786 16.5 1.5 13.1421 1.5 9C1.5 4.85786 4.85786 1.5 9 1.5C13.1421 1.5 16.5 4.85786 16.5 9Z" stroke="white" stroke-width="1.66667" stroke-linecap="round" stroke-linejoin="round"/>
4
+ </g>
5
+ <defs>
6
+ <clipPath id="clip0_4430_282">
7
+ <rect width="18" height="18" fill="white"/>
8
+ </clipPath>
9
+ </defs>
10
+ </svg>
@@ -0,0 +1,10 @@
1
+ <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_4430_283)">
3
+ <path d="M4.66675 7.00008H9.33341M7.00008 4.66675V9.33341M12.8334 7.00008C12.8334 10.2217 10.2217 12.8334 7.00008 12.8334C3.77842 12.8334 1.16675 10.2217 1.16675 7.00008C1.16675 3.77842 3.77842 1.16675 7.00008 1.16675C10.2217 1.16675 12.8334 3.77842 12.8334 7.00008Z" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
4
+ </g>
5
+ <defs>
6
+ <clipPath id="clip0_4430_283">
7
+ <rect width="14" height="14" fill="white"/>
8
+ </clipPath>
9
+ </defs>
10
+ </svg>
@@ -0,0 +1,13 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_4433_297)">
3
+ <path d="M22.56 12.25C22.56 11.47 22.49 10.72 22.36 10H12V14.26H17.92C17.66 15.63 16.88 16.79 15.71 17.57V20.34H19.28C21.36 18.42 22.56 15.6 22.56 12.25Z" fill="#4285F4"/>
4
+ <path d="M11.9999 23.0001C14.9699 23.0001 17.4599 22.0201 19.2799 20.3401L15.7099 17.5701C14.7299 18.2301 13.4799 18.6301 11.9999 18.6301C9.13993 18.6301 6.70993 16.7001 5.83993 14.1001H2.17993V16.9401C3.98993 20.5301 7.69993 23.0001 11.9999 23.0001Z" fill="#34A853"/>
5
+ <path d="M5.84 14.0901C5.62 13.4301 5.49 12.7301 5.49 12.0001C5.49 11.2701 5.62 10.5701 5.84 9.91007V7.07007H2.18C1.43 8.55007 1 10.2201 1 12.0001C1 13.7801 1.43 15.4501 2.18 16.9301L5.03 14.7101L5.84 14.0901Z" fill="#FBBC05"/>
6
+ <path d="M11.9999 5.38C13.6199 5.38 15.0599 5.94 16.2099 7.02L19.3599 3.87C17.4499 2.09 14.9699 1 11.9999 1C7.69993 1 3.98993 3.47 2.17993 7.07L5.83993 9.91C6.70993 7.31 9.13993 5.38 11.9999 5.38Z" fill="#EA4335"/>
7
+ </g>
8
+ <defs>
9
+ <clipPath id="clip0_4433_297">
10
+ <rect width="24" height="24" fill="white"/>
11
+ </clipPath>
12
+ </defs>
13
+ </svg>
@@ -0,0 +1,13 @@
1
+ <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_4433_302)">
3
+ <path d="M16.92 9.1875C16.92 8.6025 16.8675 8.04 16.77 7.5H9V10.695H13.44C13.245 11.7225 12.66 12.5925 11.7825 13.1775V15.255H14.46C16.02 13.815 16.92 11.7 16.92 9.1875Z" fill="#4285F4"/>
4
+ <path d="M9.00001 17.25C11.2275 17.25 13.095 16.515 14.46 15.255L11.7825 13.1775C11.0475 13.6725 10.11 13.9725 9.00001 13.9725C6.85501 13.9725 5.03251 12.525 4.38001 10.575H1.63501V12.705C2.99251 15.3975 5.77501 17.25 9.00001 17.25Z" fill="#34A853"/>
5
+ <path d="M4.38 10.5675C4.215 10.0725 4.1175 9.54749 4.1175 8.99999C4.1175 8.45249 4.215 7.92749 4.38 7.43249V5.30249H1.635C1.0725 6.41249 0.75 7.66499 0.75 8.99999C0.75 10.335 1.0725 11.5875 1.635 12.6975L3.7725 11.0325L4.38 10.5675Z" fill="#FBBC05"/>
6
+ <path d="M9.00001 4.035C10.215 4.035 11.295 4.455 12.1575 5.265L14.52 2.9025C13.0875 1.5675 11.2275 0.75 9.00001 0.75C5.77501 0.75 2.99251 2.6025 1.63501 5.3025L4.38001 7.4325C5.03251 5.4825 6.85501 4.035 9.00001 4.035Z" fill="#EA4335"/>
7
+ </g>
8
+ <defs>
9
+ <clipPath id="clip0_4433_302">
10
+ <rect width="18" height="18" fill="white"/>
11
+ </clipPath>
12
+ </defs>
13
+ </svg>
@@ -0,0 +1,18 @@
1
+ <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_4439_15)">
3
+ <g clip-path="url(#clip1_4439_15)">
4
+ <path d="M13.16 7.14575C13.16 6.69075 13.1192 6.25325 13.0433 5.83325H7V8.31825H10.4533C10.3017 9.11742 9.84667 9.79408 9.16417 10.2491V11.8649H11.2467C12.46 10.7449 13.16 9.09992 13.16 7.14575Z" fill="#4285F4"/>
5
+ <path d="M7.00006 13.4168C8.73256 13.4168 10.1851 12.8451 11.2467 11.8651L9.16423 10.2493C8.59256 10.6343 7.86339 10.8676 7.00006 10.8676C5.33173 10.8676 3.91423 9.74176 3.40673 8.2251H1.27173V9.88176C2.32756 11.9759 4.49173 13.4168 7.00006 13.4168Z" fill="#34A853"/>
6
+ <path d="M3.40659 8.21927C3.27825 7.83427 3.20242 7.42593 3.20242 7.0001C3.20242 6.57427 3.27825 6.16593 3.40659 5.78093V4.12427H1.27159C0.834085 4.9876 0.583252 5.96177 0.583252 7.0001C0.583252 8.03843 0.834085 9.0126 1.27159 9.87593L2.93409 8.58093L3.40659 8.21927Z" fill="#FBBC05"/>
7
+ <path d="M7.00006 3.13825C7.94506 3.13825 8.78506 3.46492 9.45589 4.09492L11.2934 2.25742C10.1792 1.21909 8.73256 0.583252 7.00006 0.583252C4.49173 0.583252 2.32756 2.02409 1.27173 4.12409L3.40673 5.78075C3.91423 4.26409 5.33173 3.13825 7.00006 3.13825Z" fill="#EA4335"/>
8
+ </g>
9
+ </g>
10
+ <defs>
11
+ <clipPath id="clip0_4439_15">
12
+ <rect width="14" height="14" fill="white"/>
13
+ </clipPath>
14
+ <clipPath id="clip1_4439_15">
15
+ <rect width="14" height="14" fill="white"/>
16
+ </clipPath>
17
+ </defs>
18
+ </svg>
@@ -1,23 +1 @@
1
- {
2
- "lastGenerated": 1720059251531,
3
- "icons": [
4
- { "name": "arrow-circle-left", "size": "large" },
5
- { "name": "arrow-circle-left", "size": "medium" },
6
- { "name": "arrow-circle-left", "size": "small" },
7
- { "name": "bug", "size": "large" },
8
- { "name": "bug", "size": "medium" },
9
- { "name": "bug", "size": "small" },
10
- { "name": "caret-down", "size": "large" },
11
- { "name": "caret-down", "size": "medium" },
12
- { "name": "caret-down", "size": "small" },
13
- { "name": "microsoft-color", "size": "large" },
14
- { "name": "microsoft-color", "size": "medium" },
15
- { "name": "microsoft-color", "size": "small" },
16
- { "name": "plan", "size": "large" },
17
- { "name": "plan", "size": "medium" },
18
- { "name": "plan", "size": "small" },
19
- { "name": "user-story", "size": "large" },
20
- { "name": "user-story", "size": "medium" },
21
- { "name": "user-story", "size": "small" }
22
- ]
23
- }
1
+ {"lastGenerated":1720314793220,"icons":[{"name":"arrow-circle-left","size":"large"},{"name":"arrow-circle-left","size":"medium"},{"name":"arrow-circle-left","size":"small"},{"name":"bug","size":"large"},{"name":"bug","size":"medium"},{"name":"bug","size":"small"},{"name":"caret-down","size":"large"},{"name":"caret-down","size":"medium"},{"name":"caret-down","size":"small"},{"name":"circle-plus","size":"large"},{"name":"circle-plus","size":"medium"},{"name":"circle-plus","size":"small"},{"name":"google-color","size":"large"},{"name":"google-color","size":"medium"},{"name":"google-color","size":"small"},{"name":"microsoft-color","size":"large"},{"name":"microsoft-color","size":"medium"},{"name":"microsoft-color","size":"small"},{"name":"plan","size":"large"},{"name":"plan","size":"medium"},{"name":"plan","size":"small"},{"name":"user-story","size":"large"},{"name":"user-story","size":"medium"},{"name":"user-story","size":"small"}]}
@@ -0,0 +1,20 @@
1
+ <script context="module">import "../../app.scss";
2
+ import Link from "./link.svelte";
3
+ export const meta = {
4
+ title: "AURA/Link",
5
+ component: Link,
6
+ tags: ["autodocs"],
7
+ argTypes: {
8
+ href: { control: "input:string" }
9
+ }
10
+ };
11
+ </script>
12
+
13
+ <script>import { Story, Template } from "@storybook/addon-svelte-csf";
14
+ </script>
15
+
16
+ <Template let:args>
17
+ <Link href="#">Example Link</Link>
18
+ </Template>
19
+
20
+ <Story name="Default Link" />
@@ -0,0 +1,27 @@
1
+ import { SvelteComponent } from "svelte";
2
+ import '../../app.scss';
3
+ export declare const meta: {
4
+ title: string;
5
+ component: typeof Link;
6
+ tags: string[];
7
+ argTypes: {
8
+ href: {
9
+ control: string;
10
+ };
11
+ };
12
+ };
13
+ declare const __propDef: {
14
+ props: Record<string, never>;
15
+ events: {
16
+ [evt: string]: CustomEvent<any>;
17
+ };
18
+ slots: {};
19
+ exports?: {} | undefined;
20
+ bindings?: string | undefined;
21
+ };
22
+ export type LinkProps = typeof __propDef.props;
23
+ export type LinkEvents = typeof __propDef.events;
24
+ export type LinkSlots = typeof __propDef.slots;
25
+ export default class Link extends SvelteComponent<LinkProps, LinkEvents, LinkSlots> {
26
+ }
27
+ export {};
@@ -0,0 +1,18 @@
1
+ <script>import classNames from "classnames";
2
+ export let href;
3
+ </script>
4
+
5
+ <a {href} {...$$props} class={classNames($$props.class, 'aura-link')}>
6
+ <slot />
7
+ </a>
8
+
9
+ <style>.aura-link {
10
+ color: var(--aura-link-color);
11
+ text-decoration: none;
12
+ }
13
+ .aura-link:hover, .aura-link:active {
14
+ text-decoration: underline;
15
+ }
16
+ .aura-link:active {
17
+ font: var(--aura-default-semibold);
18
+ }</style>
@@ -0,0 +1,20 @@
1
+ import { SvelteComponent } from "svelte";
2
+ declare const __propDef: {
3
+ props: Omit<Partial<import("svelte/elements").HTMLAnchorAttributes>, "href"> & {
4
+ href: string;
5
+ };
6
+ events: {
7
+ [evt: string]: CustomEvent<any>;
8
+ };
9
+ slots: {
10
+ default: {};
11
+ };
12
+ exports?: {} | undefined;
13
+ bindings?: string | undefined;
14
+ };
15
+ export type LinkProps = typeof __propDef.props;
16
+ export type LinkEvents = typeof __propDef.events;
17
+ export type LinkSlots = typeof __propDef.slots;
18
+ export default class Link extends SvelteComponent<LinkProps, LinkEvents, LinkSlots> {
19
+ }
20
+ export {};
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri Jul 05 2024 17:22:33 GMT+0000 (Coordinated Universal Time)
3
+ * Generated on Sun Jul 07 2024 01:19:23 GMT+0000 (Coordinated Universal Time)
4
4
  */
5
5
 
6
6
  :root {
@@ -62,7 +62,11 @@
62
62
  --aura-alert-border-radius: 5px;
63
63
  --aura-alert-padding-horizontal: 16px;
64
64
  --aura-alert-padding-vertical: 12px;
65
- --aura-alert-drop-shadow: 0px 6px 6px 0px rgba(0, 0, 0, 0.20); --aura-light-primary-10: #f5e1e1ff;
65
+ --aura-alert-drop-shadow: 0px 6px 6px 0px rgba(0, 0, 0, 0.20);
66
+ --aura-link-color: #005da8ff;
67
+ --aura-link-color: #00a5f0ff;
68
+ --aura-link-focused-decoration: underline;
69
+ --aura-link-hovered-decoration: underline; --aura-light-primary-10: #f5e1e1ff;
66
70
  --aura-light-primary-20: #eecacaff;
67
71
  --aura-light-primary-30: #e6b3b3ff;
68
72
  --aura-light-primary-40: #cd6868ff;
@@ -132,10 +136,10 @@
132
136
  --aura-dark-secondary-30: #4f6ba0ff;
133
137
  --aura-dark-secondary-20: #244789ff;
134
138
  --aura-dark-secondary-10: #0a317bff;
135
- --aura-dark-tertiary-70: #b0b1b4ff;
136
- --aura-dark-tertiary-60: #9a9c9fff;
137
- --aura-dark-tertiary-50: #898b8fff;
138
- --aura-dark-tertiary-40: #74767aff;
139
+ --aura-dark-tertiary-70: #dfe0e1ff;
140
+ --aura-dark-tertiary-60: #c1c2c4ff;
141
+ --aura-dark-tertiary-50: #a3a4a7ff;
142
+ --aura-dark-tertiary-40: #84868aff;
139
143
  --aura-dark-tertiary-30: #66686dff;
140
144
  --aura-dark-tertiary-20: #474a50ff;
141
145
  --aura-dark-tertiary-10: #292c33ff;
@@ -172,9 +176,9 @@
172
176
  --aura-dark-warning-10: #835200ff;
173
177
  --aura-dark-background: #1f1f1fff;
174
178
  --aura-dark-container-drop-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.50);
175
- --aura-dark-container-background: #898b8fff;
179
+ --aura-dark-container-background: #a3a4a7ff;
176
180
  --aura-dark-container-border-color: #c1c2c4ff;
177
- --aura-dark-label-text-color: #b0b1b4ff;
181
+ --aura-dark-label-text-color: #dfe0e1ff;
178
182
  }
179
183
 
180
184
  @media (prefers-color-scheme: light) {
@@ -255,10 +259,10 @@
255
259
  --aura-secondary-30: #4f6ba0ff;
256
260
  --aura-secondary-20: #244789ff;
257
261
  --aura-secondary-10: #0a317bff;
258
- --aura-tertiary-70: #b0b1b4ff;
259
- --aura-tertiary-60: #9a9c9fff;
260
- --aura-tertiary-50: #898b8fff;
261
- --aura-tertiary-40: #74767aff;
262
+ --aura-tertiary-70: #dfe0e1ff;
263
+ --aura-tertiary-60: #c1c2c4ff;
264
+ --aura-tertiary-50: #a3a4a7ff;
265
+ --aura-tertiary-40: #84868aff;
262
266
  --aura-tertiary-30: #66686dff;
263
267
  --aura-tertiary-20: #474a50ff;
264
268
  --aura-tertiary-10: #292c33ff;
@@ -295,9 +299,9 @@
295
299
  --aura-warning-10: #835200ff;
296
300
  --aura-background: #1f1f1fff;
297
301
  --aura-container-drop-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.50);
298
- --aura-container-background: #898b8fff;
302
+ --aura-container-background: #a3a4a7ff;
299
303
  --aura-container-border-color: #c1c2c4ff;
300
- --aura-label-text-color: #b0b1b4ff;
304
+ --aura-label-text-color: #dfe0e1ff;
301
305
  }
302
306
  }
303
307
 
@@ -376,10 +380,10 @@
376
380
  --aura-secondary-30: #4f6ba0ff;
377
381
  --aura-secondary-20: #244789ff;
378
382
  --aura-secondary-10: #0a317bff;
379
- --aura-tertiary-70: #b0b1b4ff;
380
- --aura-tertiary-60: #9a9c9fff;
381
- --aura-tertiary-50: #898b8fff;
382
- --aura-tertiary-40: #74767aff;
383
+ --aura-tertiary-70: #dfe0e1ff;
384
+ --aura-tertiary-60: #c1c2c4ff;
385
+ --aura-tertiary-50: #a3a4a7ff;
386
+ --aura-tertiary-40: #84868aff;
383
387
  --aura-tertiary-30: #66686dff;
384
388
  --aura-tertiary-20: #474a50ff;
385
389
  --aura-tertiary-10: #292c33ff;
@@ -416,9 +420,9 @@
416
420
  --aura-warning-10: #835200ff;
417
421
  --aura-background: #1f1f1fff;
418
422
  --aura-container-drop-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.50);
419
- --aura-container-background: #898b8fff;
423
+ --aura-container-background: #a3a4a7ff;
420
424
  --aura-container-border-color: #c1c2c4ff;
421
- --aura-label-text-color: #b0b1b4ff;
425
+ --aura-label-text-color: #dfe0e1ff;
422
426
  }
423
427
 
424
428
  /* http://meyerweb.com/eric/tools/css/reset/
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@awenovations/aura",
3
- "version": "0.0.4",
3
+ "version": "0.0.6",
4
4
  "scripts": {
5
5
  "dev": "vite dev",
6
6
  "build": "npm run transform-tokens && vite build && npm run package",
@@ -14,13 +14,13 @@
14
14
  "lint": "prettier --check . && eslint .",
15
15
  "format": "prettier --write .",
16
16
  "transform-tokens": "node ./src/tokens/transform-tokens.js",
17
- "storybook": "npm run transform-tokens && storybook dev -p 6006",
18
- "build-storybook": "npm run transform-tokens && storybook build",
17
+ "storybook": "npm run generate-icon-meta-data && npm run transform-tokens && storybook dev -p 6006",
18
+ "build-storybook": "npm run generate-icon-meta-data && npm run transform-tokens && storybook build",
19
19
  "replace-icons": "replace-in-file //icons//g ../icons/ docs/**/*.* --isRegex",
20
20
  "replace-svgs": "replace-in-file //svgs//g ../svgs/ docs/**/*.* --isRegex",
21
21
  "replace-meta-json-for-gh-pages": "replace-in-file ../icons/meta.json /aura/icons/meta.json docs/**/*.*",
22
22
  "generate-icon-meta-data": "node src/tokens/generate-icon-meta.js",
23
- "build-storybook-for-pages": "rimraf docs && npm run transform-tokens && storybook build --output-dir docs && npm run replace-icons && npm run replace-svgs && npm run replace-meta-json-for-gh-pages && touch docs/.nojekyll"
23
+ "build-storybook-for-pages": "rimraf docs && npm run generate-icon-meta-data && npm run transform-tokens && storybook build --output-dir docs && npm run replace-icons && npm run replace-svgs && npm run replace-meta-json-for-gh-pages && touch docs/.nojekyll"
24
24
  },
25
25
  "exports": {
26
26
  ".": {
@@ -40,6 +40,7 @@
40
40
  "./progress-ring.svelte": "./dist/progress/progress-ring.svelte",
41
41
  "./skeleton.svelte": "./dist/skeleton/skeleton.svelte",
42
42
  "./alert.svelte": "./dist/alert/alert.svelte",
43
+ "./link.svelte": "./dist/link/link.svelte",
43
44
  "./dist/tokens/_variables.css": {
44
45
  "import": "./dist/tokens/_variables.css",
45
46
  "require": "./dist/tokens/_variables.css"
@@ -94,6 +95,7 @@
94
95
  "@floating-ui/dom": "^1.6.6",
95
96
  "@storybook/addon-svelte-csf": "^4.1.3",
96
97
  "@storybook/addon-themes": "^8.1.11",
98
+ "classnames": "^2.5.1",
97
99
  "replace-in-file": "^8.0.1",
98
100
  "reset-css": "^5.0.2"
99
101
  }