@public-ui/theme-default 2.0.0-rc.3 → 2.0.0-rc.5

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 (4) hide show
  1. package/dist/index.cjs +49 -32
  2. package/dist/index.d.ts +0 -1
  3. package/dist/index.mjs +49 -32
  4. package/package.json +7 -7
package/dist/index.cjs CHANGED
@@ -377,10 +377,9 @@ var TagEnum = /* @__PURE__ */ ((TagEnum2) => {
377
377
  TagEnum2[TagEnum2["table"] = 41] = "table";
378
378
  TagEnum2[TagEnum2["tabs"] = 42] = "tabs";
379
379
  TagEnum2[TagEnum2["textarea"] = 43] = "textarea";
380
- TagEnum2[TagEnum2["toast"] = 44] = "toast";
381
- TagEnum2[TagEnum2["toast-container"] = 45] = "toast-container";
382
- TagEnum2[TagEnum2["toolbar"] = 46] = "toolbar";
383
- TagEnum2[TagEnum2["tooltip"] = 47] = "tooltip";
380
+ TagEnum2[TagEnum2["toast-container"] = 44] = "toast-container";
381
+ TagEnum2[TagEnum2["toolbar"] = 45] = "toolbar";
382
+ TagEnum2[TagEnum2["tooltip"] = 46] = "tooltip";
384
383
  return TagEnum2;
385
384
  })(TagEnum || {});
386
385
 
@@ -594,6 +593,12 @@ const DEFAULT = KoliBri.createTheme("default", {
594
593
  background-color: transparent;
595
594
  border-color: transparent;
596
595
  }
596
+ .access-key-hint {
597
+ background: var(--color-mute-variant);
598
+ border-radius: 3px;
599
+ color: var(--color-text);
600
+ padding: 0 0.3em;
601
+ }
597
602
  `,
598
603
  "KOL-INPUT-TEXT": css`
599
604
  kol-input {
@@ -2271,8 +2276,6 @@ const DEFAULT = KoliBri.createTheme("default", {
2271
2276
  right: 1rem;
2272
2277
  width: 440px;
2273
2278
  }
2274
- `,
2275
- "KOL-TOAST": css`
2276
2279
  .toast {
2277
2280
  margin-top: 1rem;
2278
2281
  }
@@ -2412,38 +2415,46 @@ const DEFAULT = KoliBri.createTheme("default", {
2412
2415
  }
2413
2416
  `,
2414
2417
  "KOL-PAGINATION": css`
2415
- :host {
2416
- display: grid;
2417
- gap: 1rem;
2418
- }
2419
- :host .navigation-list {
2420
- display: inline-flex;
2421
- flex-wrap: wrap;
2422
- align-items: center;
2423
- gap: 0.5rem;
2418
+ .button:focus {
2419
+ outline: none;
2424
2420
  }
2425
- :host .selected button {
2426
- min-width: var(--a11y-min-size);
2427
- min-height: var(--a11y-min-size);
2428
- display: grid;
2429
- place-items: center;
2430
- font-family: var(--font-family);
2431
- cursor: not-allowed;
2421
+ .button-inner {
2422
+ background-color: var(--color-light);
2423
+ border-radius: var(--border-radius);
2424
+ border: 1px solid var(--color-primary);
2425
+ color: var(--color-primary);
2432
2426
  font-weight: 700;
2433
- border-radius: 50%;
2434
- border: none;
2435
- font-style: normal;
2427
+ min-height: var(--a11y-min-size);
2428
+ min-width: var(--a11y-min-size);
2429
+ padding: 8px;
2436
2430
  text-align: center;
2437
- width: inherit;
2438
2431
  transition-duration: 0.5s;
2439
2432
  transition-property: background-color, color, border-color;
2440
- color: var(--color-primary);
2441
- background-color: var(--color-mute-variant);
2442
2433
  }
2443
- :host > div > span {
2444
- align-self: flex-end;
2445
- padding-bottom: 0.5rem;
2446
- color: var(--color-primary);
2434
+ .button:focus .button-inner {
2435
+ outline-offset: 2px;
2436
+ outline: 2px solid var(--color-primary-variant);
2437
+ transition: outline-offset 0.2s linear;
2438
+ }
2439
+ .button:is(:active, :hover):not(:disabled) .button-inner {
2440
+ background-color: var(--color-primary-variant);
2441
+ border-color: var(--color-primary-variant);
2442
+ box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);
2443
+ color: var(--color-light);
2444
+ }
2445
+ .button:active .button-inner {
2446
+ color: var(--color-light);
2447
+ outline: none;
2448
+ }
2449
+ .button:disabled .button-inner {
2450
+ cursor: not-allowed;
2451
+ opacity: 0.5;
2452
+ }
2453
+ .selected .button-inner {
2454
+ background-color: var(--color-mute-variant);
2455
+ border-radius: var(--a11y-min-size);
2456
+ border: 0;
2457
+ opacity: 1 !important;
2447
2458
  }
2448
2459
  `,
2449
2460
  "KOL-INPUT-RANGE": css`
@@ -2684,6 +2695,12 @@ const DEFAULT = KoliBri.createTheme("default", {
2684
2695
  left: unset;
2685
2696
  position: unset;
2686
2697
  }
2698
+ .access-key-hint {
2699
+ background: var(--color-mute-variant);
2700
+ border-radius: 3px;
2701
+ color: var(--color-text);
2702
+ padding: 0 0.3em;
2703
+ }
2687
2704
  `,
2688
2705
  "KOL-ABBR": css`
2689
2706
  abbr {
package/dist/index.d.ts CHANGED
@@ -45,7 +45,6 @@ declare const DEFAULT: (patch: (name: string, map: {
45
45
  "KOL-TABLE"?: string | undefined;
46
46
  "KOL-TABS"?: string | undefined;
47
47
  "KOL-TEXTAREA"?: string | undefined;
48
- "KOL-TOAST"?: string | undefined;
49
48
  "KOL-TOAST-CONTAINER"?: string | undefined;
50
49
  "KOL-TOOLBAR"?: string | undefined;
51
50
  "KOL-TOOLTIP"?: string | undefined;
package/dist/index.mjs CHANGED
@@ -375,10 +375,9 @@ var TagEnum = /* @__PURE__ */ ((TagEnum2) => {
375
375
  TagEnum2[TagEnum2["table"] = 41] = "table";
376
376
  TagEnum2[TagEnum2["tabs"] = 42] = "tabs";
377
377
  TagEnum2[TagEnum2["textarea"] = 43] = "textarea";
378
- TagEnum2[TagEnum2["toast"] = 44] = "toast";
379
- TagEnum2[TagEnum2["toast-container"] = 45] = "toast-container";
380
- TagEnum2[TagEnum2["toolbar"] = 46] = "toolbar";
381
- TagEnum2[TagEnum2["tooltip"] = 47] = "tooltip";
378
+ TagEnum2[TagEnum2["toast-container"] = 44] = "toast-container";
379
+ TagEnum2[TagEnum2["toolbar"] = 45] = "toolbar";
380
+ TagEnum2[TagEnum2["tooltip"] = 46] = "tooltip";
382
381
  return TagEnum2;
383
382
  })(TagEnum || {});
384
383
 
@@ -592,6 +591,12 @@ const DEFAULT = KoliBri.createTheme("default", {
592
591
  background-color: transparent;
593
592
  border-color: transparent;
594
593
  }
594
+ .access-key-hint {
595
+ background: var(--color-mute-variant);
596
+ border-radius: 3px;
597
+ color: var(--color-text);
598
+ padding: 0 0.3em;
599
+ }
595
600
  `,
596
601
  "KOL-INPUT-TEXT": css`
597
602
  kol-input {
@@ -2269,8 +2274,6 @@ const DEFAULT = KoliBri.createTheme("default", {
2269
2274
  right: 1rem;
2270
2275
  width: 440px;
2271
2276
  }
2272
- `,
2273
- "KOL-TOAST": css`
2274
2277
  .toast {
2275
2278
  margin-top: 1rem;
2276
2279
  }
@@ -2410,38 +2413,46 @@ const DEFAULT = KoliBri.createTheme("default", {
2410
2413
  }
2411
2414
  `,
2412
2415
  "KOL-PAGINATION": css`
2413
- :host {
2414
- display: grid;
2415
- gap: 1rem;
2416
- }
2417
- :host .navigation-list {
2418
- display: inline-flex;
2419
- flex-wrap: wrap;
2420
- align-items: center;
2421
- gap: 0.5rem;
2416
+ .button:focus {
2417
+ outline: none;
2422
2418
  }
2423
- :host .selected button {
2424
- min-width: var(--a11y-min-size);
2425
- min-height: var(--a11y-min-size);
2426
- display: grid;
2427
- place-items: center;
2428
- font-family: var(--font-family);
2429
- cursor: not-allowed;
2419
+ .button-inner {
2420
+ background-color: var(--color-light);
2421
+ border-radius: var(--border-radius);
2422
+ border: 1px solid var(--color-primary);
2423
+ color: var(--color-primary);
2430
2424
  font-weight: 700;
2431
- border-radius: 50%;
2432
- border: none;
2433
- font-style: normal;
2425
+ min-height: var(--a11y-min-size);
2426
+ min-width: var(--a11y-min-size);
2427
+ padding: 8px;
2434
2428
  text-align: center;
2435
- width: inherit;
2436
2429
  transition-duration: 0.5s;
2437
2430
  transition-property: background-color, color, border-color;
2438
- color: var(--color-primary);
2439
- background-color: var(--color-mute-variant);
2440
2431
  }
2441
- :host > div > span {
2442
- align-self: flex-end;
2443
- padding-bottom: 0.5rem;
2444
- color: var(--color-primary);
2432
+ .button:focus .button-inner {
2433
+ outline-offset: 2px;
2434
+ outline: 2px solid var(--color-primary-variant);
2435
+ transition: outline-offset 0.2s linear;
2436
+ }
2437
+ .button:is(:active, :hover):not(:disabled) .button-inner {
2438
+ background-color: var(--color-primary-variant);
2439
+ border-color: var(--color-primary-variant);
2440
+ box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);
2441
+ color: var(--color-light);
2442
+ }
2443
+ .button:active .button-inner {
2444
+ color: var(--color-light);
2445
+ outline: none;
2446
+ }
2447
+ .button:disabled .button-inner {
2448
+ cursor: not-allowed;
2449
+ opacity: 0.5;
2450
+ }
2451
+ .selected .button-inner {
2452
+ background-color: var(--color-mute-variant);
2453
+ border-radius: var(--a11y-min-size);
2454
+ border: 0;
2455
+ opacity: 1 !important;
2445
2456
  }
2446
2457
  `,
2447
2458
  "KOL-INPUT-RANGE": css`
@@ -2682,6 +2693,12 @@ const DEFAULT = KoliBri.createTheme("default", {
2682
2693
  left: unset;
2683
2694
  position: unset;
2684
2695
  }
2696
+ .access-key-hint {
2697
+ background: var(--color-mute-variant);
2698
+ border-radius: 3px;
2699
+ color: var(--color-text);
2700
+ padding: 0 0.3em;
2701
+ }
2685
2702
  `,
2686
2703
  "KOL-ABBR": css`
2687
2704
  abbr {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@public-ui/theme-default",
3
- "version": "2.0.0-rc.3",
3
+ "version": "2.0.0-rc.5",
4
4
  "license": "EUPL-1.2",
5
5
  "homepage": "https://public-ui.github.io",
6
6
  "repository": "https://github.com/public-ui/kolibri",
@@ -38,18 +38,18 @@
38
38
  "wcag"
39
39
  ],
40
40
  "devDependencies": {
41
- "@public-ui/schema": "2.0.0-rc.3",
42
- "@public-ui/visual-tests": "2.0.0-rc.3",
41
+ "@public-ui/schema": "2.0.0-rc.5",
42
+ "@public-ui/visual-tests": "2.0.0-rc.5",
43
43
  "@types/node": "ts5.2",
44
- "@typescript-eslint/eslint-plugin": "6.8.0",
45
- "@typescript-eslint/parser": "6.8.0",
46
- "eslint": "8.51.0",
44
+ "@typescript-eslint/eslint-plugin": "6.9.0",
45
+ "@typescript-eslint/parser": "6.9.0",
46
+ "eslint": "8.52.0",
47
47
  "eslint-plugin-no-loops": "0.3.0",
48
48
  "typescript": "5.2.2",
49
49
  "unbuild": "1.2.1"
50
50
  },
51
51
  "peerDependencies": {
52
- "@public-ui/components": "2.0.0-rc.3"
52
+ "@public-ui/components": "2.0.0-rc.5"
53
53
  },
54
54
  "sideEffects": false,
55
55
  "type": "module",