@onsvisual/svelte-components 1.1.3 → 1.1.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 (10) hide show
  1. package/dist/components/Header/Header.svelte +10 -4
  2. package/dist/components/Header/Header.svelte.d.ts +2 -2
  3. package/dist/components/Header/HeaderNav.svelte +3 -7
  4. package/dist/components/Header/HeaderNav.svelte.d.ts +0 -2
  5. package/dist/components/Header/HeaderNavCompact.svelte +1 -5
  6. package/dist/components/Header/HeaderNavCompact.svelte.d.ts +0 -2
  7. package/dist/components/PhaseBanner/PhaseBanner.svelte +7 -1
  8. package/dist/components/PhaseBanner/PhaseBanner.svelte.d.ts +2 -0
  9. package/dist/css/main.css +1 -1
  10. package/package.json +1 -1
package/dist/components/Header/Header.svelte CHANGED
@@ -94,7 +94,7 @@
94
94
  });
95
95
  </script>
96
96
 
97
- <header class="ons-header" role="banner">
97
+ <header class="ons-header" class:ons-header--border={border && !title} role="banner">
98
98
  {#if skipHref}
99
99
  <SkipLink href={skipHref} />
100
100
  {/if}
@@ -106,14 +106,14 @@
106
106
  >
107
107
  <!-- <div id="pagePath" class="hide">{path}</div> -->
108
108
  {#if compact}
109
- <HeaderNavCompact {border} {baseurl} {i18n} />
109
+ <HeaderNavCompact {baseurl} {i18n} />
110
110
  {:else if !legacy}
111
- <HeaderNav {search} {border} {bilingual} {lang} {baseurl} {baseother} {path} {i18n} />
111
+ <HeaderNav {search} {bilingual} {lang} {baseurl} {baseother} {path} {i18n} />
112
112
  {:else}
113
113
  <HeaderNavLegacy {search} {bilingual} {lang} {baseurl} {baseother} {path} {i18n} />
114
114
  {/if}
115
115
  {#if title}
116
- <div class="ons-header__main">
116
+ <div class="ons-header__main" class:ons-header--border={border}>
117
117
  <div class="ons-container">
118
118
  <div
119
119
  class="ons-grid ons-grid-flex ons-grid-flex--between ons-grid-flex--vertical-center ons-grid-flex--no-wrap ons-grid--gutterless"
@@ -133,3 +133,9 @@
133
133
  {/if}
134
134
  </Theme>
135
135
  </header>
136
+
137
+ <style>
138
+ .ons-header--border {
139
+ border-bottom: 1px solid var(--ons-color-borders);
140
+ }
141
+ </style>
package/dist/components/Header/Header.svelte.d.ts CHANGED
@@ -8,9 +8,9 @@ export default class Header extends SvelteComponentTyped<{
8
8
  title?: string | null | undefined;
9
9
  skipHref?: string | null | undefined;
10
10
  compact?: boolean | undefined;
11
- border?: boolean | undefined;
12
11
  bilingual?: boolean | undefined;
13
12
  titleHref?: string | null | undefined;
13
+ border?: boolean | undefined;
14
14
  legacy?: boolean | undefined;
15
15
  }, {
16
16
  [evt: string]: CustomEvent<any>;
@@ -30,9 +30,9 @@ declare const __propDef: {
30
30
  title?: string | null | undefined;
31
31
  skipHref?: string | null | undefined;
32
32
  compact?: boolean | undefined;
33
- border?: boolean | undefined;
34
33
  bilingual?: boolean | undefined;
35
34
  titleHref?: string | null | undefined;
35
+ border?: boolean | undefined;
36
36
  legacy?: boolean | undefined;
37
37
  };
38
38
  events: {
package/dist/components/Header/HeaderNav.svelte CHANGED
@@ -3,7 +3,6 @@
3
3
  import initNav from "./nav.js";
4
4
 
5
5
  export let search = true;
6
- export let border = false;
7
6
  export let bilingual = true;
8
7
  export let lang = "en";
9
8
  export let baseurl = "https://www.ons.gov.uk";
@@ -254,7 +253,7 @@
254
253
  </p>
255
254
  </div>
256
255
  </div>
257
- <div class="ons-header__top" class:ons-header__top--border={border}>
256
+ <div class="ons-header__top">
258
257
  <div class="ons-container">
259
258
  <div
260
259
  class="ons-header__grid-top ons-grid ons-grid-flex ons-grid-flex--between ons-grid-flex--vertical-center ons-grid-flex--no-wrap ons-grid--gutterless"
@@ -530,10 +529,10 @@
530
529
  </nav>
531
530
  {#if search}
532
531
  <nav
533
- class="ons-js-header-search ons-header-nav-search"
532
+ class="ons-js-header-search ons-header-nav-search ons-u-d-no"
534
533
  id="search"
535
534
  aria-label="Nav Search"
536
- aria-hidden="false"
535
+ aria-hidden="true"
537
536
  >
538
537
  <div class="ons-container">
539
538
  <form
@@ -605,9 +604,6 @@
605
604
  .ons-icon--logo__group--text {
606
605
  fill: var(--ons-color-text-link-hover);
607
606
  }
608
- .ons-header__top--border {
609
- border-bottom: 1px solid var(--ons-color-borders);
610
- }
611
607
  .ons-header__language {
612
608
  display: block;
613
609
  margin-top: 0.85em;
package/dist/components/Header/HeaderNav.svelte.d.ts CHANGED
@@ -4,7 +4,6 @@
4
4
  export default class HeaderNav extends SvelteComponentTyped<{
5
5
  search?: boolean | undefined;
6
6
  path?: string | undefined;
7
- border?: boolean | undefined;
8
7
  bilingual?: boolean | undefined;
9
8
  lang?: string | undefined;
10
9
  baseurl?: string | undefined;
@@ -22,7 +21,6 @@ declare const __propDef: {
22
21
  props: {
23
22
  search?: boolean | undefined;
24
23
  path?: string | undefined;
25
- border?: boolean | undefined;
26
24
  bilingual?: boolean | undefined;
27
25
  lang?: string | undefined;
28
26
  baseurl?: string | undefined;
package/dist/components/Header/HeaderNavCompact.svelte CHANGED
@@ -1,5 +1,4 @@
1
1
  <script>
2
- export let border = false;
3
2
  export let baseurl = "https://www.ons.gov.uk";
4
3
  export let i18n = (text) => text;
5
4
  </script>
@@ -16,7 +15,7 @@
16
15
  </p>
17
16
  </div>
18
17
  </div>
19
- <div class="ons-header__top" class:ons-header__top--border={border}>
18
+ <div class="ons-header__top">
20
19
  <div class="ons-container">
21
20
  <div
22
21
  class="ons-header__grid-top ons-grid ons-grid-flex ons-grid-flex--between ons-grid-flex--vertical-center ons-grid-flex--no-wrap ons-grid--gutterless"
@@ -179,7 +178,4 @@
179
178
  .ons-icon--logo__group--text {
180
179
  fill: var(--ons-color-text-link-hover);
181
180
  }
182
- .ons-header__top--border {
183
- border-bottom: 1px solid var(--ons-color-borders);
184
- }
185
181
  </style>
package/dist/components/Header/HeaderNavCompact.svelte.d.ts CHANGED
@@ -2,7 +2,6 @@
2
2
  /** @typedef {typeof __propDef.events} HeaderNavCompactEvents */
3
3
  /** @typedef {typeof __propDef.slots} HeaderNavCompactSlots */
4
4
  export default class HeaderNavCompact extends SvelteComponentTyped<{
5
- border?: boolean | undefined;
6
5
  baseurl?: string | undefined;
7
6
  i18n?: ((text: any) => any) | undefined;
8
7
  }, {
@@ -15,7 +14,6 @@ export type HeaderNavCompactSlots = typeof __propDef.slots;
15
14
  import { SvelteComponentTyped } from "svelte";
16
15
  declare const __propDef: {
17
16
  props: {
18
- border?: boolean | undefined;
19
17
  baseurl?: string | undefined;
20
18
  i18n?: ((text: any) => any) | undefined;
21
19
  };
package/dist/components/PhaseBanner/PhaseBanner.svelte CHANGED
@@ -4,6 +4,12 @@
4
4
  * @type {string}
5
5
  */
6
6
  export let phase = "Beta";
7
+ /**
8
+ * Message to describe the phase
9
+ * @type {string}
10
+ */
11
+ export let description =
12
+ phase === "Prototype" ? "This is a prototype." : "This is a new service.";
7
13
  /**
8
14
  * URL of feedback form (relative or absolute)
9
15
  * @type {string}
@@ -26,7 +32,7 @@
26
32
  </div>
27
33
  <div class="ons-grid__col ons-col-auto ons-u-flex-shrink">
28
34
  <p class="ons-phase-banner__desc ons-u-fs-s ons-u-mb-no">
29
- This is a {phase === "Prototype" ? "new service" : "prototype"}.
35
+ {description}
30
36
  {#if href}
31
37
  To help us improve it, <a
32
38
  {href}
package/dist/components/PhaseBanner/PhaseBanner.svelte.d.ts CHANGED
@@ -4,6 +4,7 @@
4
4
  export default class PhaseBanner extends SvelteComponentTyped<{
5
5
  cls?: string | null | undefined;
6
6
  href?: string | undefined;
7
+ description?: string | undefined;
7
8
  phase?: string | undefined;
8
9
  }, {
9
10
  [evt: string]: CustomEvent<any>;
@@ -17,6 +18,7 @@ declare const __propDef: {
17
18
  props: {
18
19
  cls?: string | null | undefined;
19
20
  href?: string | undefined;
21
+ description?: string | undefined;
20
22
  phase?: string | undefined;
21
23
  };
22
24
  events: {