@internetarchive/elements 0.2.6-alpha-webdev8447.0 → 0.2.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.
Files changed (14) hide show
  1. package/LICENSE +661 -661
  2. package/README.md +320 -320
  3. package/dist/src/elements/ia-combo-box/caret-closed.svg +8 -8
  4. package/dist/src/elements/ia-combo-box/caret-open.svg +8 -8
  5. package/dist/src/elements/ia-combo-box/clear.svg +8 -8
  6. package/dist/src/elements/ia-dropdown-search-bar/ia-dropdown-search-bar.js +165 -165
  7. package/dist/src/elements/ia-dropdown-search-bar/ia-dropdown-search-bar.js.map +1 -1
  8. package/dist/src/elements/ia-dropdown-search-bar/models.js.map +1 -1
  9. package/dist/src/elements/ia-dropdown-search-bar/search.svg +10 -10
  10. package/dist/src/elements/index.js.map +1 -1
  11. package/dist/src/labs/ia-snow/flake.svg +1 -1
  12. package/dist/src/themes/theme-styles.js +87 -87
  13. package/dist/src/themes/theme-styles.js.map +1 -1
  14. package/package.json +120 -120
package/dist/src/themes/theme-styles.js CHANGED
@@ -1,91 +1,91 @@
1
1
  import { css } from 'lit';
2
- const themeStyles = css `
3
- :host {
4
- /*
5
- BASE STYLES
6
- Default fallback values for theme styles. Assumes 16px root font size.
7
- To adjust values, use theme styles below.
8
- */
9
-
10
- /* Typography */
11
- --default-font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
12
-
13
- /* Sizing */
14
- --default-icon-width: 1.25rem;
15
- --default-padding-sm: 5px;
16
- --default-combo-box-width: auto;
17
- --default-search-bar-width: auto;
18
- --default-search-bar-height: 30px;
19
- --default-font-size-standard: 0.875rem; /* 14px with 16px root font size */
20
- --default-font-size-lg: 2.25rem; /* 36px with 16px root font size */
21
-
22
- /* Colors */
23
- --true-white: #fff;
24
- --off-white: #fbfbfd;
25
- --dark-gray: #2c2c2c;
26
- --light-gray: #666;
27
- --classic-red: #e51c23;
28
- --mint-green: #31a481;
29
- --navy-blue: #194880;
30
- --bright-blue: #4b64ff;
31
-
32
- /*
33
- ADJUSTABLE STYLES
34
- To be adjusted by setting i.e. --ia-theme-link-color at the :root or component level.
35
- */
36
-
37
- /* Text */
38
- --base-font-family: var(
39
- --ia-theme-base-font-family,
40
- var(--default-font-family)
41
- );
42
- --primary-text-color: var(--ia-theme-primary-text-color, var(--dark-gray));
43
- --secondary-text-color: var(
44
- --ia-theme-secondary-text-color,
45
- var(--light-gray)
46
- );
47
- --link-color: var(--ia-theme-link-color, var(--bright-blue));
48
-
49
- /* Sizing */
50
- --icon-width: var(--ia-theme-icon-width, var(--default-icon-width));
51
- --padding-sm: var(--ia-theme-padding-sm, var(--default-padding-sm));
52
- --search-bar-height: var(
53
- --ia-theme-search-bar-height,
54
- var(--default-search-bar-height)
55
- );
56
- --search-bar-width: var(
57
- --ia-theme-search-bar-width,
58
- var(--default-search-bar-width)
59
- );
60
- --combo-box-width: var(
61
- --ia-theme-combo-box-width,
62
- var(--default-combo-box-width)
63
- );
64
- --font-size-standard: var(
65
- --ia-theme-font-size-standard,
66
- var(--default-font-size-standard)
67
- );
68
- --font-size-lg: var(--ia-theme-font-size-lg, var(--default-font-size-lg));
69
-
70
- /* Backgrounds and fills */
71
- --primary-background-color: var(
72
- --ia-theme-primary-background-color,
73
- var(--off-white)
74
- );
75
- --secondary-background-color: var(
76
- --ia-theme-secondary-background-color,
77
- var(--true-white)
78
- );
79
-
80
- /* State colors */
81
- --primary-cta-fill: var(--ia-theme-primary-cta-fill, var(--navy-blue));
82
- --primary-cta-text-color: var(
83
- --ia-theme-primary-cta-text-color,
84
- var(--true-white)
85
- );
86
- --color-success: var(--ia-theme-color-success, var(--mint-green));
87
- --color-danger: var(--ia-theme-color-danger, var(--classic-red));
88
- }
2
+ const themeStyles = css `
3
+ :host {
4
+ /*
5
+ BASE STYLES
6
+ Default fallback values for theme styles. Assumes 16px root font size.
7
+ To adjust values, use theme styles below.
8
+ */
9
+
10
+ /* Typography */
11
+ --default-font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
12
+
13
+ /* Sizing */
14
+ --default-icon-width: 1.25rem;
15
+ --default-padding-sm: 5px;
16
+ --default-combo-box-width: auto;
17
+ --default-search-bar-width: auto;
18
+ --default-search-bar-height: 30px;
19
+ --default-font-size-standard: 0.875rem; /* 14px with 16px root font size */
20
+ --default-font-size-lg: 2.25rem; /* 36px with 16px root font size */
21
+
22
+ /* Colors */
23
+ --true-white: #fff;
24
+ --off-white: #fbfbfd;
25
+ --dark-gray: #2c2c2c;
26
+ --light-gray: #666;
27
+ --classic-red: #e51c23;
28
+ --mint-green: #31a481;
29
+ --navy-blue: #194880;
30
+ --bright-blue: #4b64ff;
31
+
32
+ /*
33
+ ADJUSTABLE STYLES
34
+ To be adjusted by setting i.e. --ia-theme-link-color at the :root or component level.
35
+ */
36
+
37
+ /* Text */
38
+ --base-font-family: var(
39
+ --ia-theme-base-font-family,
40
+ var(--default-font-family)
41
+ );
42
+ --primary-text-color: var(--ia-theme-primary-text-color, var(--dark-gray));
43
+ --secondary-text-color: var(
44
+ --ia-theme-secondary-text-color,
45
+ var(--light-gray)
46
+ );
47
+ --link-color: var(--ia-theme-link-color, var(--bright-blue));
48
+
49
+ /* Sizing */
50
+ --icon-width: var(--ia-theme-icon-width, var(--default-icon-width));
51
+ --padding-sm: var(--ia-theme-padding-sm, var(--default-padding-sm));
52
+ --search-bar-height: var(
53
+ --ia-theme-search-bar-height,
54
+ var(--default-search-bar-height)
55
+ );
56
+ --search-bar-width: var(
57
+ --ia-theme-search-bar-width,
58
+ var(--default-search-bar-width)
59
+ );
60
+ --combo-box-width: var(
61
+ --ia-theme-combo-box-width,
62
+ var(--default-combo-box-width)
63
+ );
64
+ --font-size-standard: var(
65
+ --ia-theme-font-size-standard,
66
+ var(--default-font-size-standard)
67
+ );
68
+ --font-size-lg: var(--ia-theme-font-size-lg, var(--default-font-size-lg));
69
+
70
+ /* Backgrounds and fills */
71
+ --primary-background-color: var(
72
+ --ia-theme-primary-background-color,
73
+ var(--off-white)
74
+ );
75
+ --secondary-background-color: var(
76
+ --ia-theme-secondary-background-color,
77
+ var(--true-white)
78
+ );
79
+
80
+ /* State colors */
81
+ --primary-cta-fill: var(--ia-theme-primary-cta-fill, var(--navy-blue));
82
+ --primary-cta-text-color: var(
83
+ --ia-theme-primary-cta-text-color,
84
+ var(--true-white)
85
+ );
86
+ --color-success: var(--ia-theme-color-success, var(--mint-green));
87
+ --color-danger: var(--ia-theme-color-danger, var(--classic-red));
88
+ }
89
89
  `;
90
90
  export default themeStyles;
91
91
  //# sourceMappingURL=theme-styles.js.map
package/dist/src/themes/theme-styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"theme-styles.js","sourceRoot":"","sources":["../../../src/themes/theme-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,WAAW,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuFtB,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { css } from 'lit';\r\n\r\nconst themeStyles = css`\r\n :host {\r\n /*\r\n BASE STYLES\r\n Default fallback values for theme styles. Assumes 16px root font size.\r\n To adjust values, use theme styles below.\r\n */\r\n\r\n /* Typography */\r\n --default-font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n\r\n /* Sizing */\r\n --default-icon-width: 1.25rem;\r\n --default-padding-sm: 5px;\r\n --default-combo-box-width: auto;\r\n --default-search-bar-width: auto;\r\n --default-search-bar-height: 30px;\r\n --default-font-size-standard: 0.875rem; /* 14px with 16px root font size */\r\n --default-font-size-lg: 2.25rem; /* 36px with 16px root font size */\r\n\r\n /* Colors */\r\n --true-white: #fff;\r\n --off-white: #fbfbfd;\r\n --dark-gray: #2c2c2c;\r\n --light-gray: #666;\r\n --classic-red: #e51c23;\r\n --mint-green: #31a481;\r\n --navy-blue: #194880;\r\n --bright-blue: #4b64ff;\r\n\r\n /*\r\n ADJUSTABLE STYLES\r\n To be adjusted by setting i.e. --ia-theme-link-color at the :root or component level.\r\n */\r\n\r\n /* Text */\r\n --base-font-family: var(\r\n --ia-theme-base-font-family,\r\n var(--default-font-family)\r\n );\r\n --primary-text-color: var(--ia-theme-primary-text-color, var(--dark-gray));\r\n --secondary-text-color: var(\r\n --ia-theme-secondary-text-color,\r\n var(--light-gray)\r\n );\r\n --link-color: var(--ia-theme-link-color, var(--bright-blue));\r\n\r\n /* Sizing */\r\n --icon-width: var(--ia-theme-icon-width, var(--default-icon-width));\r\n --padding-sm: var(--ia-theme-padding-sm, var(--default-padding-sm));\r\n --search-bar-height: var(\r\n --ia-theme-search-bar-height,\r\n var(--default-search-bar-height)\r\n );\r\n --search-bar-width: var(\r\n --ia-theme-search-bar-width,\r\n var(--default-search-bar-width)\r\n );\r\n --combo-box-width: var(\r\n --ia-theme-combo-box-width,\r\n var(--default-combo-box-width)\r\n );\r\n --font-size-standard: var(\r\n --ia-theme-font-size-standard,\r\n var(--default-font-size-standard)\r\n );\r\n --font-size-lg: var(--ia-theme-font-size-lg, var(--default-font-size-lg));\r\n\r\n /* Backgrounds and fills */\r\n --primary-background-color: var(\r\n --ia-theme-primary-background-color,\r\n var(--off-white)\r\n );\r\n --secondary-background-color: var(\r\n --ia-theme-secondary-background-color,\r\n var(--true-white)\r\n );\r\n\r\n /* State colors */\r\n --primary-cta-fill: var(--ia-theme-primary-cta-fill, var(--navy-blue));\r\n --primary-cta-text-color: var(\r\n --ia-theme-primary-cta-text-color,\r\n var(--true-white)\r\n );\r\n --color-success: var(--ia-theme-color-success, var(--mint-green));\r\n --color-danger: var(--ia-theme-color-danger, var(--classic-red));\r\n }\r\n`;\r\n\r\nexport default themeStyles;\r\n"]}
1
+ {"version":3,"file":"theme-styles.js","sourceRoot":"","sources":["../../../src/themes/theme-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,WAAW,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuFtB,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { css } from 'lit';\n\nconst themeStyles = css`\n :host {\n /*\n BASE STYLES\n Default fallback values for theme styles. Assumes 16px root font size.\n To adjust values, use theme styles below.\n */\n\n /* Typography */\n --default-font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\n\n /* Sizing */\n --default-icon-width: 1.25rem;\n --default-padding-sm: 5px;\n --default-combo-box-width: auto;\n --default-search-bar-width: auto;\n --default-search-bar-height: 30px;\n --default-font-size-standard: 0.875rem; /* 14px with 16px root font size */\n --default-font-size-lg: 2.25rem; /* 36px with 16px root font size */\n\n /* Colors */\n --true-white: #fff;\n --off-white: #fbfbfd;\n --dark-gray: #2c2c2c;\n --light-gray: #666;\n --classic-red: #e51c23;\n --mint-green: #31a481;\n --navy-blue: #194880;\n --bright-blue: #4b64ff;\n\n /*\n ADJUSTABLE STYLES\n To be adjusted by setting i.e. --ia-theme-link-color at the :root or component level.\n */\n\n /* Text */\n --base-font-family: var(\n --ia-theme-base-font-family,\n var(--default-font-family)\n );\n --primary-text-color: var(--ia-theme-primary-text-color, var(--dark-gray));\n --secondary-text-color: var(\n --ia-theme-secondary-text-color,\n var(--light-gray)\n );\n --link-color: var(--ia-theme-link-color, var(--bright-blue));\n\n /* Sizing */\n --icon-width: var(--ia-theme-icon-width, var(--default-icon-width));\n --padding-sm: var(--ia-theme-padding-sm, var(--default-padding-sm));\n --search-bar-height: var(\n --ia-theme-search-bar-height,\n var(--default-search-bar-height)\n );\n --search-bar-width: var(\n --ia-theme-search-bar-width,\n var(--default-search-bar-width)\n );\n --combo-box-width: var(\n --ia-theme-combo-box-width,\n var(--default-combo-box-width)\n );\n --font-size-standard: var(\n --ia-theme-font-size-standard,\n var(--default-font-size-standard)\n );\n --font-size-lg: var(--ia-theme-font-size-lg, var(--default-font-size-lg));\n\n /* Backgrounds and fills */\n --primary-background-color: var(\n --ia-theme-primary-background-color,\n var(--off-white)\n );\n --secondary-background-color: var(\n --ia-theme-secondary-background-color,\n var(--true-white)\n );\n\n /* State colors */\n --primary-cta-fill: var(--ia-theme-primary-cta-fill, var(--navy-blue));\n --primary-cta-text-color: var(\n --ia-theme-primary-cta-text-color,\n var(--true-white)\n );\n --color-success: var(--ia-theme-color-success, var(--mint-green));\n --color-danger: var(--ia-theme-color-danger, var(--classic-red));\n }\n`;\n\nexport default themeStyles;\n"]}
package/package.json CHANGED
@@ -1,120 +1,120 @@
1
- {
2
- "name": "@internetarchive/elements",
3
- "version": "0.2.6-alpha-webdev8447.0",
4
- "description": "A web component library from the Internet Archive.",
5
- "license": "AGPL-3.0-only",
6
- "types": "./dist/src/elements/index.d.ts",
7
- "type": "module",
8
- "publishConfig": {
9
- "access": "public"
10
- },
11
- "repository": {
12
- "type": "git",
13
- "url": "git+https://github.com/internetarchive/elements.git"
14
- },
15
- "bugs": {
16
- "url": "https://github.com/internetarchive/elements/issues"
17
- },
18
- "scripts": {
19
- "dev": "wireit",
20
- "build": "wireit",
21
- "clean": "wireit",
22
- "lint": "wireit",
23
- "format": "wireit",
24
- "circular": "wireit",
25
- "prepare": "wireit",
26
- "test": "wireit",
27
- "ghpages:build": "wireit"
28
- },
29
- "dependencies": {
30
- "@lit/localize": "^0.12.2",
31
- "@internetarchive/ia-clearable-text-input": "^1.1.1",
32
- "@internetarchive/ia-dropdown": "2.2.0-alpha-webdev8447.0",
33
- "lit": "^2.8.0 || ^3.3.2",
34
- "magic-snowflakes": "^7.0.2",
35
- "tslib": "^2.8.1"
36
- },
37
- "devDependencies": {
38
- "@open-wc/testing-helpers": "^3.0.1",
39
- "@typescript-eslint/eslint-plugin": "^8.46.4",
40
- "@vitest/browser": "^4.0.8",
41
- "@vitest/browser-playwright": "^4.0.8",
42
- "@vitest/coverage-v8": "^4.0.8",
43
- "eslint": "^9.39.1",
44
- "eslint-config-prettier": "^10.1.8",
45
- "eslint-plugin-html": "^8.1.3",
46
- "eslint-plugin-import": "^2.32.0",
47
- "eslint-plugin-lit": "^1.15.0",
48
- "eslint-plugin-lit-a11y": "^4.1.4",
49
- "eslint-plugin-no-only-tests": "^3.3.0",
50
- "eslint-plugin-wc": "^2.2.1",
51
- "highlight.js": "^11.11.1",
52
- "madge": "^8.0.0",
53
- "playwright": "^1.56.1",
54
- "prettier": "^3.6.2",
55
- "ts-lit-plugin": "^2.0.2",
56
- "tsc-alias": "^1.8.16",
57
- "typescript": "^5.9.3",
58
- "vite": "^7.2.2",
59
- "vitest": "^4.0.8",
60
- "wireit": "^0.14.12"
61
- },
62
- "exports": {
63
- ".": "./dist/src/index.js",
64
- "./*": "./dist/src/elements/*.js",
65
- "./labs/*": "./dist/src/labs/*.js"
66
- },
67
- "files": [
68
- "README.md",
69
- "dist",
70
- "!dist/**/*.test*",
71
- "!dist/**/*-story*",
72
- "!dist/demo",
73
- "!dist/src/internal",
74
- "!dist/*.tsbuildinfo"
75
- ],
76
- "wireit": {
77
- "build": {
78
- "command": "tsc --build --pretty && tsc-alias && rsync -zarvm --prune-empty-dirs --include \"*/\" --include \"*.svg\" --exclude=\"*\" src dist",
79
- "dependencies": [
80
- "circular"
81
- ],
82
- "files": [
83
- "src/**/*.ts",
84
- "tsconfig.json"
85
- ],
86
- "output": [
87
- "dist/**"
88
- ]
89
- },
90
- "circular": {
91
- "command": "madge --circular --extensions ts ."
92
- },
93
- "clean": {
94
- "command": "rm -rf dist"
95
- },
96
- "dev": {
97
- "command": "vite"
98
- },
99
- "lint": {
100
- "command": "eslint . && prettier \"**/*.ts\" --check"
101
- },
102
- "format": {
103
- "command": "eslint . --fix && prettier \"**/*.ts\" --write"
104
- },
105
- "prepare": {
106
- "dependencies": [
107
- "build"
108
- ]
109
- },
110
- "test": {
111
- "command": "vitest",
112
- "dependencies": [
113
- "circular"
114
- ]
115
- },
116
- "ghpages:build": {
117
- "command": "vite build --config vite.config.ghpages.ts && touch ./ghpages/.nojekyll"
118
- }
119
- }
120
- }
1
+ {
2
+ "name": "@internetarchive/elements",
3
+ "version": "0.2.6",
4
+ "description": "A web component library from the Internet Archive.",
5
+ "license": "AGPL-3.0-only",
6
+ "types": "./dist/src/elements/index.d.ts",
7
+ "type": "module",
8
+ "publishConfig": {
9
+ "access": "public"
10
+ },
11
+ "repository": {
12
+ "type": "git",
13
+ "url": "git+https://github.com/internetarchive/elements.git"
14
+ },
15
+ "bugs": {
16
+ "url": "https://github.com/internetarchive/elements/issues"
17
+ },
18
+ "scripts": {
19
+ "dev": "wireit",
20
+ "build": "wireit",
21
+ "clean": "wireit",
22
+ "lint": "wireit",
23
+ "format": "wireit",
24
+ "circular": "wireit",
25
+ "prepare": "wireit",
26
+ "test": "wireit",
27
+ "ghpages:build": "wireit"
28
+ },
29
+ "dependencies": {
30
+ "@lit/localize": "^0.12.2",
31
+ "@internetarchive/ia-clearable-text-input": "^1.1.1",
32
+ "@internetarchive/ia-dropdown": "^2.2.0",
33
+ "lit": "^2.8.0 || ^3.3.2",
34
+ "magic-snowflakes": "^7.0.2",
35
+ "tslib": "^2.8.1"
36
+ },
37
+ "devDependencies": {
38
+ "@open-wc/testing-helpers": "^3.0.1",
39
+ "@typescript-eslint/eslint-plugin": "^8.46.4",
40
+ "@vitest/browser": "^4.0.8",
41
+ "@vitest/browser-playwright": "^4.0.8",
42
+ "@vitest/coverage-v8": "^4.0.8",
43
+ "eslint": "^9.39.1",
44
+ "eslint-config-prettier": "^10.1.8",
45
+ "eslint-plugin-html": "^8.1.3",
46
+ "eslint-plugin-import": "^2.32.0",
47
+ "eslint-plugin-lit": "^1.15.0",
48
+ "eslint-plugin-lit-a11y": "^4.1.4",
49
+ "eslint-plugin-no-only-tests": "^3.3.0",
50
+ "eslint-plugin-wc": "^2.2.1",
51
+ "highlight.js": "^11.11.1",
52
+ "madge": "^8.0.0",
53
+ "playwright": "^1.56.1",
54
+ "prettier": "^3.6.2",
55
+ "ts-lit-plugin": "^2.0.2",
56
+ "tsc-alias": "^1.8.16",
57
+ "typescript": "^5.9.3",
58
+ "vite": "^7.2.2",
59
+ "vitest": "^4.0.8",
60
+ "wireit": "^0.14.12"
61
+ },
62
+ "exports": {
63
+ ".": "./dist/src/index.js",
64
+ "./*": "./dist/src/elements/*.js",
65
+ "./labs/*": "./dist/src/labs/*.js"
66
+ },
67
+ "files": [
68
+ "README.md",
69
+ "dist",
70
+ "!dist/**/*.test*",
71
+ "!dist/**/*-story*",
72
+ "!dist/demo",
73
+ "!dist/src/internal",
74
+ "!dist/*.tsbuildinfo"
75
+ ],
76
+ "wireit": {
77
+ "build": {
78
+ "command": "tsc --build --pretty && tsc-alias && rsync -zarvm --prune-empty-dirs --include \"*/\" --include \"*.svg\" --exclude=\"*\" src dist",
79
+ "dependencies": [
80
+ "circular"
81
+ ],
82
+ "files": [
83
+ "src/**/*.ts",
84
+ "tsconfig.json"
85
+ ],
86
+ "output": [
87
+ "dist/**"
88
+ ]
89
+ },
90
+ "circular": {
91
+ "command": "madge --circular --extensions ts ."
92
+ },
93
+ "clean": {
94
+ "command": "rm -rf dist"
95
+ },
96
+ "dev": {
97
+ "command": "vite"
98
+ },
99
+ "lint": {
100
+ "command": "eslint . && prettier \"**/*.ts\" --check"
101
+ },
102
+ "format": {
103
+ "command": "eslint . --fix && prettier \"**/*.ts\" --write"
104
+ },
105
+ "prepare": {
106
+ "dependencies": [
107
+ "build"
108
+ ]
109
+ },
110
+ "test": {
111
+ "command": "vitest",
112
+ "dependencies": [
113
+ "circular"
114
+ ]
115
+ },
116
+ "ghpages:build": {
117
+ "command": "vite build --config vite.config.ghpages.ts && touch ./ghpages/.nojekyll"
118
+ }
119
+ }
120
+ }