npm - @nationalarchives/frontend - Versions diffs - 0.1.17-prerelease → 0.1.19-prerelease - Mend

@nationalarchives/frontend 0.1.17-prerelease → 0.1.19-prerelease

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 (170) hide show

package/nationalarchives/components/tabs/tabs.css.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sourceRoot":"","sources":["../../../../src/nationalarchives/utilities/_typography.scss","../../../../src/nationalarchives/tools/_colour.scss","../../../../src/nationalarchives/tools/_spacing.scss","../../../../src/nationalarchives/utilities/_a11y.scss","../../../../src/nationalarchives/utilities/_global.scss","../../../../src/nationalarchives/tools/_media.scss","../../../../src/nationalarchives/utilities/_overrides.scss","../../../../src/nationalarchives/tools/_typography.scss","../../../../src/nationalarchives/variables/_typography.scss","../../../../src/nationalarchives/variables/_grid.scss","../../../../src/nationalarchives/components/tabs/tabs.scss"],"names":[],"mappings":"CAQQ,6CC+JR,0BACE,uCACA,uCACA,yCACA,6BACA,6CACA,mCACA,6CACA,2CACA,uDACA,uDACA,mEAhFA,yBAEA,4CAPA,4BACA,uBAuHF,0DACE,qCACA,qCACA,uCACA,2BACA,2CACA,iCACA,2CA1HA,sBAEA,0CAPA,4BACA,uBAiJF,8BA7IE,yBAEA,gDA8IA,qBACA,kBACA,oCACA,aACA,wBACA,gBACA,wBACA,oBACA,0BAIA,0BAIA,gCC/PF,sFACE,mBAEA,mKACE,gBCPJ,qBACE,qBACA,sBACA,oBACA,qBAEA,6BACA,uBACA,wBACA,sBAEA,2BAEA,iCAEA,oBAEA,0CAEA,yDAEE,YCfJ,MHKI,olCGDJ,cACE,gBACA,WACA,YAEA,kBACA,gBACA,iCAEA,eH+EA,yBAEA,wCG7EA,2BHwBE,oCACA,oCACA,yDACA,+BACA,uCACA,sDACA,2DG5BF,4BHdE,olCGiBA,mCAHF,4BHRE,snCGeA,+BAPF,4BHFE,8/BGYE,8BACE,kCAIJ,+DAfF,4BHIE,kjCGgBF,2BHlCE,olCGsCF,0BHhCE,qnCGoCF,mCH9BE,8/BGiCA,qCACE,iCAGF,4DH/BA,ijCG0CF,6BHpCE,0BACA,qCACA,8CACA,oCACA,oCACA,mDACA,+BACA,uCACA,gDACA,qDACA,4CG8BF,2BH5BE,oCACA,oCACA,yDACA,+BACA,uCACA,sDACA,2DASE,sCAEE,6BACA,wCACA,8CACA,+CGYN,6BHhCE,oCACA,oCACA,yDACA,+BACA,uCACA,sDACA,2DASE,sCAOE,6BACA,wCACA,8CACA,+CGWN,4BHpCE,oCACA,oCACA,yDACA,+BACA,uCACA,sDACA,2DASE,sCAYE,6BACA,wCACA,8CACA,+CGUN,2BHxCE,oCACA,oCACA,yDACA,+BACA,uCACA,sDACA,2DASE,sCAiBE,6BACA,wCACA,8CACA,+CGSN,+BACE,gBACE,0BACA,4BAKN,oBACE,gBACA,SACA,UAEA,cAEA,oFACE,aACA,sBAEA,6GACE,OAKN,6BAKE,eAEA,cAGF,aAEE,WAGF,SACE,aAGF,QAEE,uBHSA,sBAEA,mCGTA,uBAGF,GACE,c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","file":"tabs.css","sourcesContent":["@use \"sass:math\";\n@use \"../tools/colour\";\n@use \"../tools/media\";\n@use \"../tools/spacing\";\n@use \"../tools/typography\";\n@use \"../variables/assets\";\n@use \"../variables/grid\";\n\n@import \"https://use.typekit.net/hkj3kuz.css\";\n\n@font-face {\n font-family: \"Open Sans\";\n src: url(\"#{assets.$tna-font-path}/OpenSans-Medium.ttf\");\n font-weight: normal;\n font-style: normal;\n}\n\n@font-face {\n font-family: \"Open Sans\";\n src: url(\"#{assets.$tna-font-path}/OpenSans-Bold.ttf\");\n font-weight: bold;\n font-style: normal;\n}\n\n@font-face {\n font-family: \"Roboto Mono\";\n src: url(\"#{assets.$tna-font-path}/RobotoMono-Regular.ttf\");\n font-weight: normal;\n font-style: normal;\n}\n\n.tna-template {\n @include colour.colour-font(\"font-base\");\n @include typography.main-font;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n text-rendering: optimizeLegibility;\n -webkit-text-size-adjust: none;\n direction: ltr;\n}\n\n.tna-template__body {\n color: inherit;\n @include typography.relative-font-size(18);\n // line-height: 1.6;\n line-height: #{math.div(16, 18) * 2};\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nul,\nol {\n margin-top: 0;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nstrong {\n @include typography.main-font-weight-bold;\n}\n\np {\n margin: 0 0 1.5rem;\n\n @include media.on-tiny {\n margin-bottom: 1rem;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n}\n\na {\n @include colour.colour-font(\"link\");\n text-decoration-thickness: 1.5px;\n\n &:visited {\n @include colour.colour-font(\"link-visited\");\n }\n\n &:hover,\n &:active {\n @include typography.interacted-text-decoration;\n }\n\n &.tna-chip {\n text-decoration: none;\n\n &,\n &:link,\n &:visited {\n @include colour.colour-font(\"font-dark\");\n }\n\n &:hover {\n @include typography.interacted-text-decoration;\n }\n }\n}\n\n.tna-ul,\n.tna-ol {\n margin-top: 0;\n margin-right: 0;\n margin-left: 0;\n padding: 0 0 0 2rem;\n\n @include spacing.space-below;\n\n li::marker {\n @include colour.colour-font(\"accent-background\");\n font-weight: 700;\n }\n\n &--plain {\n padding-left: 0;\n\n list-style: none;\n }\n}\n\n%chip {\n max-width: max-content;\n padding: 0.375em 0.5rem;\n\n display: block;\n\n @include colour.colour-font(\"font-dark\");\n @include typography.detail-font-small;\n line-height: 1;\n\n @include colour.accent;\n}\n\n.tna-chip {\n @extend %chip;\n}\n\n.tna-chip-list {\n padding-left: 0;\n\n display: flex;\n flex-wrap: wrap;\n gap: 1rem;\n\n list-style: none;\n\n @include spacing.space-below;\n\n &__item {\n }\n}\n\n%heading {\n @include colour.colour-font(\"font-dark\");\n @include typography.heading-font;\n\n a {\n display: inline-block;\n\n &::after {\n padding-left: 0.25rem;\n\n display: inline-block;\n\n font-weight: 700;\n\n content: \"\\203A\";\n }\n\n &:hover {\n &::after {\n padding-left: 0.5rem;\n }\n }\n }\n}\n\n%heading-xl {\n @include typography.relative-font-size(64);\n line-height: 1.2;\n\n @include media.on-medium {\n // @include typography.relative-font-size(42);\n @include typography.relative-font-size(50);\n }\n\n @include media.on-mobile {\n @include typography.relative-font-size(36);\n }\n}\n\n%heading-l {\n @include typography.relative-font-size(32);\n line-height: 1.4;\n\n @include media.on-medium {\n // @include typography.relative-font-size(26);\n @include typography.relative-font-size(28);\n }\n\n @include media.on-mobile {\n @include typography.relative-font-size(24);\n }\n}\n\n%heading-m {\n @include typography.relative-font-size(20);\n line-height: 1.6;\n}\n\n%heading-s {\n @include typography.relative-font-size(18);\n line-height: 1.6;\n}\n\n.tna-heading {\n @extend %heading;\n\n &--xl {\n @extend %heading-xl;\n }\n\n &--l {\n @extend %heading-l;\n }\n\n &--m {\n @extend %heading-m;\n }\n\n &--s {\n @extend %heading-s;\n }\n}\n\n.tna-hgroup {\n &__supertitle {\n margin: 0 0 0.5rem;\n\n @extend %chip;\n }\n\n &__title {\n margin: 0;\n\n display: block;\n\n @extend %heading;\n }\n\n &--xl &__title {\n @extend %heading-xl;\n }\n\n &--l &__title {\n @extend %heading-l;\n }\n\n &--m &__title {\n @extend %heading-m;\n }\n\n &--s &__title {\n @extend %heading-s;\n }\n}\n\n.tna-heading,\n.tna-hgroup {\n margin-top: 3rem;\n margin-bottom: 1rem;\n\n &:first-child {\n margin-top: 0;\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n}\n\n.tna-blockquote {\n margin-top: 0;\n margin-right: 0;\n margin-left: 0;\n padding: 1rem 1rem 1rem 2rem;\n\n @include colour.colour-border(\"accent-background\", 0.35rem, solid, left);\n\n @include spacing.space-below;\n\n &__quote {\n font-weight: 700;\n }\n\n &__author {\n font-style: italic;\n\n .tna-blockquote & {\n margin: 1rem 0 0;\n }\n\n &::before {\n content: \"\\2014\" \" \";\n }\n }\n}\n\n.tna-scene-setter {\n @include typography.detail-font;\n @include colour.colour-font(\"font-dark\");\n @include typography.relative-font-size(30);\n line-height: math.div(50, 30);\n\n @include spacing.space-below;\n\n @include media.on-mobile {\n @include typography.relative-font-size(24);\n line-height: 2;\n }\n\n a {\n color: inherit;\n text-decoration-thickness: 2px;\n\n &:hover {\n text-decoration-thickness: 4.5px;\n }\n }\n}\n\n.tna-columns {\n column-gap: grid.$gutter-width;\n\n &--2 {\n column-count: 2;\n }\n\n &--3 {\n column-count: 3;\n }\n\n @include media.on-mobile {\n column-gap: grid.$gutter-width-mobile;\n }\n\n @include media.on-small {\n @for $i from 1 through 4 {\n &--#{$i}-small {\n column-count: $i;\n }\n }\n }\n\n @include media.on-tiny {\n @for $i from 1 through 4 {\n &--#{$i}-tiny {\n column-count: $i;\n }\n }\n }\n\n &__block {\n break-inside: avoid;\n }\n\n &:has(&__block:only-of-type) {\n column-count: 1;\n }\n}\n","@use \"sass:map\";\n@use \"../features\";\n@use \"../variables/colour\";\n@use \"../tools/media\";\n\n@function brand-colour($colour) {\n @return map.get(colour.$colour-palette-brand, $colour);\n}\n\n@mixin colour-css-vars() {\n @each $name, $value in colour.$colour-palette-default {\n --#{$name}: #{$value};\n }\n}\n\n@mixin colour-css-vars-dark() {\n @each $name, $value in colour.$colour-palette-dark {\n --#{$name}: #{$value};\n }\n}\n\n@mixin colour-css-vars-high-contrast() {\n @each $name, $value in colour.$colour-palette-high-contrast {\n --#{$name}: #{$value};\n }\n}\n\n@mixin colour-css-vars-high-contrast-dark() {\n @each $name, $value in colour.$colour-palette-high-contrast-dark {\n --#{$name}: #{$value};\n }\n}\n\n@mixin accent-css-vars($colour) {\n @if $colour == \"yellow\" {\n --accent: #{brand-colour(\"yellow\")} !important;\n --accent-background: #{brand-colour(\"yellow\")} !important;\n --accent-background-light: #{brand-colour(\"cream\")} !important;\n --accent-font-base: #{brand-colour(\"black\")} !important;\n --accent-font-dark: #{brand-colour(\"black\")} !important;\n --accent-font-light: #{rgba(brand-colour(\"black\"), 0.7)} !important;\n --accent-link: #{brand-colour(\"black\")} !important;\n --accent-link-visited: #{brand-colour(\"black\")} !important;\n --accent-keyline: #{rgba(brand-colour(\"black\"), 0.5)} !important;\n --accent-keyline-dark: #{rgba(brand-colour(\"black\"), 0.8)} !important;\n --button-accent-background: #{brand-colour(\"yellow\")} !important;\n } @else {\n --accent-font-base: #{brand-colour(\"white\")} !important;\n --accent-font-dark: #{brand-colour(\"white\")} !important;\n --accent-font-light: #{rgba(brand-colour(\"white\"), 0.7)} !important;\n --accent-link: #{brand-colour(\"white\")} !important;\n --accent-link-visited: #{brand-colour(\"white\")} !important;\n --accent-keyline: #{rgba(brand-colour(\"white\"), 0.5)} !important;\n --accent-keyline-dark: #{rgba(brand-colour(\"white\"), 0.8)} !important;\n\n @if $colour == \"black\" {\n // --accent: #{brand-colour(\"light-grey\")} !important;\n // --accent-background: #{brand-colour(\"black\")} !important;\n // --accent-background-light: #{brand-colour(\"light-grey\")} !important;\n // --button-accent-text: #{brand-colour(\"black\")} !important;\n // --button-accent-background: #{brand-colour(\"grey\")} !important;\n } @else {\n --button-accent-text: #{brand-colour(\"white\")} !important;\n @if $colour == \"pink\" {\n --accent: #{brand-colour(\"pink\")} !important;\n --accent-background: #{brand-colour(\"maroon\")} !important;\n --accent-background-light: #{brand-colour(\"pastel-pink\")} !important;\n --button-accent-background: #{brand-colour(\"maroon\")} !important;\n } @else if $colour == \"orange\" {\n --accent: #{brand-colour(\"orange\")} !important;\n --accent-background: #{brand-colour(\"chestnut\")} !important;\n --accent-background-light: #{brand-colour(\"pastel-orange\")} !important;\n --button-accent-background: #{brand-colour(\"chestnut\")} !important;\n } @else if $colour == \"green\" {\n --accent: #{brand-colour(\"green\")} !important;\n --accent-background: #{brand-colour(\"forest\")} !important;\n --accent-background-light: #{brand-colour(\"pastel-green\")} !important;\n --button-accent-background: #{brand-colour(\"forest\")} !important;\n } @else if $colour == \"blue\" {\n --accent: #{brand-colour(\"blue\")} !important;\n --accent-background: #{brand-colour(\"navy\")} !important;\n --accent-background-light: #{brand-colour(\"pastel-blue\")} !important;\n --button-accent-background: #{brand-colour(\"navy\")} !important;\n }\n }\n }\n}\n\n@mixin colour-font(\n $colour,\n $important: false,\n $default-palette: colour.$colour-palette-default\n) {\n color: map.get($default-palette, $colour) if($important, !important, null);\n color: var(--#{$colour}) if($important, !important, null);\n}\n\n@mixin colour-background($colour, $important: false) {\n background-color: map.get(colour.$colour-palette-default, $colour)\n if($important, !important, null);\n background-color: var(--#{$colour}) if($important, !important, null);\n}\n\n@mixin colour-border(\n $colour,\n $width: \"\",\n $style: solid,\n $direction: \"\",\n $important: false\n) {\n @if $direction != \"\" {\n @if $width != \"\" {\n $property: border-#{$direction};\n border-#{$direction}: $width\n map.get(colour.$colour-palette-default, $colour)\n $style\n if($important, !important, null);\n border-#{$direction}: $width\n var(--#{$colour})\n $style\n if($important, !important, null);\n } @else {\n border-#{$direction}-color: map.get(\n colour.$colour-palette-default,\n $colour\n )\n if($important, !important, null);\n border-#{$direction}-color: var(--#{$colour})\n if($important, !important, null);\n }\n } @else {\n @if $width != \"\" {\n border: $width\n map.get(colour.$colour-palette-default, $colour)\n $style\n if($important, !important, null);\n border: $width var(--#{$colour}) $style if($important, !important, null);\n } @else {\n border-color: map.get(colour.$colour-palette-default, $colour)\n if($important, !important, null);\n border-color: var(--#{$colour}) if($important, !important, null);\n }\n }\n}\n\n@mixin colour-outline($colour, $important: false) {\n outline-color: map.get(colour.$colour-palette-default, $colour)\n if($important, !important, null);\n outline-color: var(--#{$colour}) if($important, !important, null);\n}\n\n@mixin colour-fill($colour, $important: false) {\n fill: map.get(colour.$colour-palette-default, $colour)\n if($important, !important, null);\n fill: var(--#{$colour}) if($important, !important, null);\n}\n\n%fixed {\n @include colour-css-vars;\n\n @include colour-font(\"font-base\");\n}\n\n@mixin fixed {\n @extend %fixed;\n}\n\n%invert {\n --font-base: var(--contrast-font-base);\n --font-dark: var(--contrast-font-dark);\n --font-light: var(--contrast-font-light);\n --link: var(--contrast-link);\n --link-visited: var(--contrast-link-visited);\n --keyline: var(--contrast-keyline);\n --keyline-dark: var(--contrast-keyline-dark);\n --button-text: var(--contrast-button-text);\n --button-background: var(--contrast-button-background);\n --button-hover-text: var(--contrast-button-hover-text);\n --button-hover-background: var(--contrast-button-hover-background);\n\n @include colour-background(\"contrast-background\");\n\n @include colour-font(\"font-base\", false, colour.$colour-palette-dark);\n}\n\n@mixin invert {\n @extend %invert;\n}\n\n%invert-on-mobile {\n @include media.on-mobile {\n --font-base: var(--contrast-font-base);\n --font-dark: var(--contrast-font-dark);\n --font-light: var(--contrast-font-light);\n --link: var(--contrast-link);\n --link-visited: var(--contrast-link-visited);\n --keyline: var(--contrast-keyline);\n --keyline-dark: var(--contrast-keyline-dark);\n --button-text: var(--contrast-button-text);\n --button-background: var(--contrast-button-background);\n --button-hover-text: var(--contrast-button-hover-text);\n --button-hover-background: var(--contrast-button-hover-background);\n\n @include colour-background(\"contrast-background\");\n\n @include colour-font(\"font-base\", false, colour.$colour-palette-dark);\n }\n}\n\n@mixin invert-on-mobile {\n @extend %invert-on-mobile;\n}\n\n%accent {\n --font-base: var(--accent-font-base);\n --font-dark: var(--accent-font-dark);\n --font-light: var(--accent-font-light);\n --link: var(--accent-link);\n --link-visited: var(--accent-link-visited);\n --keyline: var(--accent-keyline);\n --keyline-dark: var(--accent-keyline-dark);\n\n @include colour-background(\"accent-background\");\n\n @include colour-font(\"font-base\", false, colour.$colour-palette-dark);\n}\n\n@mixin accent {\n @extend %accent;\n}\n\n%accent-background {\n @include colour-background(\"accent-background\");\n}\n\n@mixin accent-background {\n @extend %accent-background;\n}\n\n%light-accent-background {\n @include colour-background(\"accent-background-light\");\n\n --font-base: #{map.get(colour.$colour-palette-default, \"font-base\")};\n --font-dark: #{map.get(colour.$colour-palette-default, \"font-dark\")};\n --font-light: #{map.get(colour.$colour-palette-default, \"font-light\")};\n --link: #{map.get(colour.$colour-palette-default, \"font-dark\")};\n --link-visited: #{map.get(colour.$colour-palette-default, \"link-visited\")};\n --keyline: #{map.get(colour.$colour-palette-default, \"keyline\")};\n --keyline-dark: #{map.get(colour.$colour-palette-default, \"keyline-dark\")};\n --button-text: #{map.get(colour.$colour-palette-default, \"button-text\")};\n --button-background: #{map.get(\n colour.$colour-palette-default,\n \"button-background\"\n )};\n --button-hover-text: #{map.get(\n colour.$colour-palette-default,\n \"button-hover-text\"\n )};\n --button-hover-background: #{map.get(\n colour.$colour-palette-default,\n \"button-hover-background\"\n )};\n}\n\n@mixin light-accent-background {\n @extend %light-accent-background;\n}\n\n@mixin on-high-contrast {\n .tna-template--high-contrast-theme & {\n @content;\n }\n\n .tna-template--system-theme & {\n @media (prefers-contrast: more) {\n @content;\n }\n }\n}\n","@use \"sass:map\";\n@use \"../variables/spacing\";\n\n%space-below {\n margin-bottom: 2rem;\n\n &:last-child {\n margin-bottom: 0;\n }\n}\n\n@mixin space-below {\n @extend %space-below;\n}\n\n@function spacing($size) {\n @return map.get(spacing.$spacing, $size);\n}\n\n@function spacing-mobile($size) {\n @return map.get(spacing.$spacing-mobile, $size);\n}\n",".tna-visually-hidden {\n width: 1px !important;\n height: 1px !important;\n margin: 0 !important;\n padding: 0 !important;\n\n position: absolute !important;\n top: -9999px !important;\n left: -9999px !important;\n z-index: -1 !important;\n\n overflow: hidden !important;\n\n clip: rect(0, 0, 0, 0) !important;\n\n border: 0 !important;\n\n background-color: transparent !important;\n\n &::before,\n &::after {\n content: \"\\00a0\";\n }\n}\n","@use \"../features\";\n@use \"../tools/colour\";\n@use \"../tools/media\";\n@use \"../tools/spacing\";\n@use \"../variables/typography\";\n\n:root {\n @include colour.colour-css-vars;\n}\n\n.tna-template {\n min-width: 320px;\n width: 100%;\n height: 100%;\n\n overflow-x: hidden;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n\n font-size: #{typography.$base-font-size-px}px;\n\n @include colour.colour-background(\"page-background\");\n\n accent-color: var(--accent);\n\n &--system-theme {\n @include colour.colour-css-vars;\n\n @media (prefers-color-scheme: dark) {\n @include colour.colour-css-vars-dark;\n }\n\n @media (prefers-contrast: more) {\n @include colour.colour-css-vars-high-contrast;\n\n * {\n background-image: none !important;\n }\n }\n\n @media (prefers-contrast: more) and (prefers-color-scheme: dark) {\n @include colour.colour-css-vars-high-contrast-dark;\n }\n }\n\n &--light-theme {\n @include colour.colour-css-vars;\n }\n\n &--dark-theme {\n @include colour.colour-css-vars-dark;\n }\n\n &--high-contrast-theme {\n @include colour.colour-css-vars-high-contrast;\n\n * {\n background-image: none !important;\n }\n\n &.tna-template--dark-theme {\n @include colour.colour-css-vars-high-contrast-dark;\n }\n }\n\n @include colour.accent-css-vars(\"black\"); // TODO: Temp\n\n // &--black-accent {\n // @include colour.accent-css-vars(\"black\");\n // }\n\n &--yellow-accent {\n @include colour.accent-css-vars(\"yellow\");\n }\n\n &--pink-accent {\n @include colour.accent-css-vars(\"pink\");\n }\n\n &--orange-accent {\n @include colour.accent-css-vars(\"orange\");\n }\n\n &--green-accent {\n @include colour.accent-css-vars(\"green\");\n }\n\n &--blue-accent {\n @include colour.accent-css-vars(\"blue\");\n }\n\n @media (prefers-reduced-motion) {\n * {\n animation: none !important;\n transition: none !important;\n }\n }\n}\n\n.tna-template__body {\n min-height: 100%;\n margin: 0;\n padding: 0;\n\n overflow: auto;\n\n &:has(.tna-header):has(#main-content[role=\"main\"]):has(.tna-footer) {\n display: flex;\n flex-direction: column;\n\n #main-content[role=\"main\"] {\n flex: 1;\n }\n }\n}\n\nimg,\nsvg,\npicture,\nvideo,\ncanvas {\n max-width: 100%;\n\n display: block;\n}\n\nvideo,\ncanvas {\n width: 100%;\n}\n\n[hidden] {\n display: none;\n}\n\n*:focus {\n // outline: 0.3125rem colour.$focus-colour solid;\n outline: 0.3125rem solid;\n @include colour.colour-outline(\"focus-outline\");\n outline-offset: 0.125rem;\n}\n\nhr {\n margin: 2rem 0;\n\n border-width: 1px 0 0;\n @include colour.colour-border(\"keyline\");\n border-style: solid;\n\n // @include colour.on-high-contrast {\n // border-style: solid;\n // }\n}\n\n.tna-section {\n padding-top: 3rem;\n padding-bottom: 3rem;\n\n @include media.on-mobile {\n padding-top: 2rem;\n padding-bottom: 2rem;\n }\n}\n\n.tna-aside {\n padding: 2rem;\n\n @include spacing.space-below;\n\n @include media.on-mobile {\n padding: 1rem;\n }\n\n @include colour.on-high-contrast {\n @include colour.colour-border(\"keyline-dark\", 1px);\n }\n}\n\n.tna-background--contrast {\n @include colour.invert;\n}\n\n.tna-background--accent {\n @include colour.accent;\n}\n\n.tna-background--accent-light {\n @include colour.light-accent-background;\n}\n","@use \"../variables/media\";\n\n// 0 ======= 320 = 480 ===== 768 == 1024 ========================== min-width/max-width (px)\n// | . | | |\n// |-TINY----------|-SMALL---|-MED--|-LARGE------------------------\n// | . | | |\n// |<------------->| | | on-tiny\n// |<----------------------->| | on-mobile\n// |<------------------------------>| on-smaller-than-large\n// | . |<------->| | on-small\n// | . |<------------------------- on-larger-than-tiny\n// | . | |<---->| on-medium\n// | . | |<--------------- on-larger-than-mobile\n// | . | | |<-------- on-large\n// |<------->. | | | Smallest device\n\n@mixin on-large() {\n @media #{media.$media-large} {\n @content;\n }\n}\n\n@mixin on-medium() {\n @media #{media.$media-medium} {\n @content;\n }\n}\n\n@mixin on-small() {\n @media #{media.$media-small} {\n @content;\n }\n}\n\n@mixin on-tiny() {\n @media #{media.$media-tiny} {\n @content;\n }\n}\n\n@mixin on-larger-than-mobile() {\n @media #{media.$media-gt-mobile} {\n @content;\n }\n}\n\n@mixin on-larger-than-tiny() {\n @media #{media.$media-gt-tiny} {\n @content;\n }\n}\n\n@mixin on-smaller-than-large() {\n @media #{media.$media-lt-large} {\n @content;\n }\n}\n\n@mixin on-mobile() {\n @media #{media.$media-mobile} {\n @content;\n }\n}\n","@use \"../variables/spacing\";\n@use \"../tools/media\";\n\n@mixin no-spacing-generator($suffix: \"\") {\n @if $suffix != \"\" {\n $suffix: \"-\" + $suffix;\n }\n\n @each $property in margin, padding {\n @each $direction in top, bottom {\n .tna-\\!--no-#{$property}-#{$direction}#{$suffix},\n .tna-\\!--no-#{$property}-vertical#{$suffix} {\n #{$property}-#{$direction}: 0 !important;\n }\n }\n }\n}\n\n@mixin overrides($spacing, $suffix: \"\") {\n @if $suffix != \"\" {\n $suffix: \"-\" + $suffix;\n }\n\n @each $property in margin, padding {\n @each $direction in top, bottom {\n @each $size, $amount in $spacing {\n .tna-\\!--#{$property}-#{$direction}-#{$size}#{$suffix},\n .tna-\\!--#{$property}-vertical-#{$size}#{$suffix} {\n #{$property}-#{$direction}: #{$amount} !important;\n }\n }\n }\n }\n}\n\n@include no-spacing-generator;\n@include overrides(spacing.$spacing);\n\n@include media.on-medium {\n @include no-spacing-generator(\"medium\");\n @include overrides(spacing.$spacing, \"medium\");\n}\n\n@include media.on-small {\n @include no-spacing-generator(\"small\");\n @include overrides(spacing.$spacing-mobile, \"small\");\n}\n\n@include media.on-tiny {\n @include no-spacing-generator(\"tiny\");\n @include overrides(spacing.$spacing-mobile, \"tiny\");\n}\n","@use \"sass:math\";\n@use \"../variables/typography\";\n\n@mixin relative-font-size($fontSizePx) {\n font-size: #{math.div($fontSizePx, typography.$base-font-size-px)}rem;\n}\n\n@mixin interacted-text-decoration {\n text-decoration: underline;\n text-decoration-thickness: typography.$interactive-text-decoration-thickness;\n}\n\n@mixin main-font-weight {\n font-weight: typography.$font-weight-main;\n}\n\n@mixin main-font-weight-bold {\n font-weight: typography.$font-weight-main-bold;\n}\n\n@mixin main-font {\n font-family: typography.$font-family-main;\n @include main-font-weight;\n}\n\n@mixin heading-font {\n font-family: typography.$font-family-heading;\n font-weight: typography.$font-weight-heading;\n}\n\n@mixin detail-font {\n font-family: typography.$font-family-detail;\n font-weight: typography.$font-weight-detail;\n}\n\n@mixin detail-font-small {\n @include detail-font;\n @include relative-font-size(14);\n text-transform: uppercase;\n line-height: #{math.div(typography.$base-font-size-px, 14)};\n // line-height: 1;\n}\n","$base-font-size-px: 16;\n\n$interactive-text-decoration-thickness: 3.5px;\n\n$font-family-main: \"Open Sans\", serif;\n// $font-weight-main: 500;\n$font-weight-main: normal;\n// $font-weight-main-bold: 700;\n$font-weight-main-bold: bold;\n\n$font-family-heading: supria-sans-condensed, \"Arial Narrow\", sans-serif;\n$font-weight-heading: 400;\n\n$font-family-detail: \"Roboto Mono\", monospace;\n// $font-weight-detail: 400;\n$font-weight-detail: normal;\n","$largest-container-width: 75.25rem !default;\n\n$gutter-width: 2rem !default;\n$gutter-width-mobile: 1.5rem !default;\n\n$column-count: 12 !default;\n$column-count-medium: 6 !default;\n$column-count-small: 4 !default;\n$column-count-tiny: 2 !default;\n","@use \"../../tools/colour\";\n@use \"../../tools/typography\";\n@use \"../../tools/spacing\";\n@use \"../../utilities\";\n\n.tna-tabs {\n @include spacing.space-below;\n\n &__list {\n margin: 0 0 1rem;\n padding: 0;\n\n display: flex;\n align-items: stretch;\n gap: 1rem;\n flex-wrap: nowrap;\n\n list-style: none;\n }\n\n &__list-item {\n }\n\n &__list-item-link {\n padding: 0.5rem 0;\n\n display: flex;\n\n align-items: center;\n position: relative;\n\n @include typography.relative-font-size(20);\n @include typography.heading-font;\n text-decoration: none;\n // line-height: 1.5;\n text-align: center;\n\n background: transparent;\n\n border: none;\n\n cursor: pointer;\n\n &,\n &:link,\n &:visited {\n @include colour.colour-font(\"font-dark\");\n }\n\n &::after {\n height: 0;\n\n position: absolute;\n right: 0;\n bottom: 0;\n left: 0;\n\n @include colour.colour-background(\"keyline-dark\");\n\n content: \"\";\n }\n\n &:hover,\n &--selected,\n &--selected:hover {\n text-decoration: none;\n\n &::after {\n height: 0.25rem;\n }\n }\n\n .tna-template--js-enabled & {\n @include colour.colour-font(\"font-light\");\n\n &:hover {\n &::after {\n height: 0.125rem;\n\n @include colour.colour-background(\"font-light\");\n }\n }\n\n &--selected {\n @include colour.colour-font(\"font-dark\");\n\n &::after,\n &:hover::after {\n height: 0.25rem;\n\n @include colour.colour-background(\"keyline-dark\");\n }\n }\n }\n }\n\n &__items {\n // &:not(:target-within) {\n // .tna-tabs__item:first-child {\n // display: block;\n // }\n // }\n }\n\n &__item {\n display: none;\n\n &:first-child {\n display: block;\n }\n\n &:has(~ :target) {\n display: none;\n }\n\n &:target {\n display: block;\n }\n\n .tna-template--js-enabled & {\n display: block;\n\n &[hidden] {\n display: none;\n }\n }\n\n .tna-template--clicked &:focus {\n outline: none;\n }\n }\n\n @include colour.on-high-contrast {\n &__list-item-link {\n padding-right: 1rem;\n padding-left: 1rem;\n\n overflow: hidden;\n\n @include colour.colour-border(\"keyline-dark\", 1px);\n }\n }\n}\n"]}

package/nationalarchives/components/tabs/tabs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("TNAFrontend",[],e):"object"==typeof exports?exports.TNAFrontend=e():(t.TNAFrontend=t.TNAFrontend||{},t.TNAFrontend["components/tabs/tabs"]=e())}(self,(()=>(()=>{"use strict";var t={d:(e,i)=>{for(var n in i)t.o(i,n)&&!t.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:i[n]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function i(t){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},i(t)}function n(t){return function(t){if(Array.isArray(t))return r(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||function(t,e){if(t){if("string"==typeof t)return r(t,e);var i=Object.prototype.toString.call(t).slice(8,-1);return"Object"===i&&t.constructor&&(i=t.constructor.name),"Map"===i||"Set"===i?Array.from(t):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?r(t,e):void 0}}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function r(t,e){(null==e||e>t.length)&&(e=t.length);for(var i=0,n=new Array(e);i<e;i++)n[i]=t[i];return n}function s(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,(void 0,s=function(t,e){if("object"!==i(t)||null===t)return t;var n=t[Symbol.toPrimitive];if(void 0!==n){var r=n.call(t,"string");if("object"!==i(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(r.key),"symbol"===i(s)?s:String(s)),r)}var s}t.r(e),t.d(e,{Tabs:()=>a});var a=function(){function t(e){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.$module=e,this.$tabList=e&&e.querySelector(".tna-tabs__list"),this.$tabListItemLinks=e&&this.$tabList&&e.querySelectorAll(".tna-tabs__list-item-link"),this.$tabItems=e&&e.querySelectorAll(".tna-tabs__item")}var e,i;return e=t,(i=[{key:"init",value:function(){var t=this;if(this.$module&&this.$tabList&&this.$tabListItemLinks&&this.$tabItems&&this.$tabListItemLinks.length===this.$tabItems.length){this.sticky=this.$module.classList.contains("tna-tabs--sticky");var e=window.location.hash.replace(/^#/,"");this.$newTabList=document.createElement("div"),this.$newTabList.setAttribute("role","tablist"),this.$newTabList.setAttribute("class",this.$tabList.getAttribute("class")),this.$tabItems.forEach((function(t,i){t.setAttribute("role","tabpanel"),t.setAttribute("aria-labelledby","".concat(t.getAttribute("id"),"-tab")),t.setAttribute("tabindex","0"),(e&&t.getAttribute("id")!==e||!e&&i>0)&&t.setAttribute("hidden",!0)})),this.$tabListItemLinks.forEach((function(e){var i=document.createElement("button");i.innerText=e.innerText,i.setAttribute("class",e.getAttribute("class")),i.setAttribute("role","tab"),i.setAttribute("id",e.getAttribute("id")),i.setAttribute("aria-controls",e.getAttribute("href").replace(/^#/,"")),i.setAttribute("tabindex","-1"),t.$newTabList.appendChild(i)})),this.$tabList.replaceWith(this.$newTabList),this.$tabListItemLinks=this.$module.querySelectorAll(".tna-tabs__list-item-link"),this.$tabListItemLinks.forEach((function(i,n){e&&i.getAttribute("aria-controls")==="".concat(e)||!e&&0===n?(i.classList.add("tna-tabs__list-item-link--selected"),i.setAttribute("aria-selected",!0),i.setAttribute("tabindex","0")):i.setAttribute("aria-selected",!1),i.addEventListener("keydown",(function(e){return t.handleItemLinkKeyDown(e)}),!0),i.addEventListener("click",(function(e){return t.handleItemLinkClick(e)}),!0)}))}}},{key:"handleItemLinkClick",value:function(t){t.preventDefault();var e=t.currentTarget.getAttribute("aria-controls");this.switchTab(e)}},{key:"handleItemLinkKeyDown",value:function(t){var e=t.currentTarget,i=!1;switch(t.key){case"ArrowLeft":this.setSelectedToPreviousTab(e),i=!0;break;case"ArrowRight":this.setSelectedToNextTab(e),i=!0;break;case"Home":this.switchTab(this.$tabListItemLinks[0].getAttribute("aria-controls")),i=!0;break;case"End":this.switchTab(this.$tabListItemLinks[this.$tabListItemLinks.length-1].getAttribute("aria-controls")),i=!0}i&&(t.stopPropagation(),t.preventDefault())}},{key:"setSelectedToNextTab",value:function(t){console.log("setSelectedToNextTab",t);var e,i=n(this.$tabListItemLinks).findIndex((function(e){return e.getAttribute("id")===t.getAttribute("id")}));e=i<this.$tabListItemLinks.length-1?i+1:0,console.log(i,e),this.switchTab(this.$tabListItemLinks[e].getAttribute("aria-controls"))}},{key:"setSelectedToPreviousTab",value:function(t){console.log("setSelectedToPreviousTab",t);var e,i=n(this.$tabListItemLinks).findIndex((function(e){return e.getAttribute("id")===t.getAttribute("id")}));e=i>=1?i-1:this.$tabListItemLinks.length-1,console.log(i,e),this.switchTab(this.$tabListItemLinks[e].getAttribute("aria-controls"))}},{key:"switchTab",value:function(t){this.$tabListItemLinks.forEach((function(e){e.getAttribute("aria-controls")===t?(e.classList.add("tna-tabs__list-item-link--selected"),e.setAttribute("aria-selected",!0),e.setAttribute("tabindex","0"),e.focus()):(e.classList.remove("tna-tabs__list-item-link--selected"),e.setAttribute("aria-selected",!1),e.setAttribute("tabindex","-1"))})),this.$tabItems.forEach((function(e){e.getAttribute("id")===t?(e.removeAttribute("hidden"),e.setAttribute("tabindex","0")):(e.setAttribute("hidden",!0),e.setAttribute("tabindex","-1"))})),this.sticky&&(history.replaceState?history.replaceState(null,null,"#".concat(t)):location.hash="#".concat(t))}}])&&s(e.prototype,i),Object.defineProperty(e,"prototype",{writable:!1}),t}();return e})()));
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("TNAFrontend",[],e):"object"==typeof exports?exports.TNAFrontend=e():t.TNAFrontend=e()}(self,(()=>(()=>{"use strict";var t={d:(e,i)=>{for(var r in i)t.o(i,r)&&!t.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:i[r]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};function i(t){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},i(t)}function r(t){return function(t){if(Array.isArray(t))return n(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||function(t,e){if(t){if("string"==typeof t)return n(t,e);var i=Object.prototype.toString.call(t).slice(8,-1);return"Object"===i&&t.constructor&&(i=t.constructor.name),"Map"===i||"Set"===i?Array.from(t):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?n(t,e):void 0}}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function n(t,e){(null==e||e>t.length)&&(e=t.length);for(var i=0,r=new Array(e);i<e;i++)r[i]=t[i];return r}function s(t,e){for(var r=0;r<e.length;r++){var n=e[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,(void 0,s=function(t,e){if("object"!==i(t)||null===t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var n=r.call(t,"string");if("object"!==i(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(t)}(n.key),"symbol"===i(s)?s:String(s)),n)}var s}t.r(e),t.d(e,{Tabs:()=>a});var a=function(){function t(e){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.$module=e,this.$tabList=e&&e.querySelector(".tna-tabs__list"),this.$tabListItemLinks=e&&this.$tabList&&e.querySelectorAll(".tna-tabs__list-item-link"),this.$tabItems=e&&e.querySelectorAll(".tna-tabs__item")}var e,i;return e=t,(i=[{key:"init",value:function(){var t=this;if(this.$module&&this.$tabList&&this.$tabListItemLinks&&this.$tabItems&&this.$tabListItemLinks.length===this.$tabItems.length){this.sticky=this.$module.classList.contains("tna-tabs--sticky");var e=window.location.hash.replace(/^#/,"");this.$newTabList=document.createElement("div"),this.$newTabList.setAttribute("role","tablist"),this.$newTabList.setAttribute("class",this.$tabList.getAttribute("class")),this.$tabItems.forEach((function(t,i){t.setAttribute("role","tabpanel"),t.setAttribute("aria-labelledby","".concat(t.getAttribute("id"),"-tab")),t.setAttribute("tabindex","0"),(e&&t.getAttribute("id")!==e||!e&&i>0)&&t.setAttribute("hidden",!0)})),this.$tabListItemLinks.forEach((function(e){var i=document.createElement("button");i.innerText=e.innerText,i.setAttribute("class",e.getAttribute("class")),i.setAttribute("role","tab"),i.setAttribute("id",e.getAttribute("id")),i.setAttribute("aria-controls",e.getAttribute("href").replace(/^#/,"")),i.setAttribute("tabindex","-1"),t.$newTabList.appendChild(i)})),this.$tabList.replaceWith(this.$newTabList),this.$tabListItemLinks=this.$module.querySelectorAll(".tna-tabs__list-item-link"),this.$tabListItemLinks.forEach((function(i,r){e&&i.getAttribute("aria-controls")==="".concat(e)||!e&&0===r?(i.classList.add("tna-tabs__list-item-link--selected"),i.setAttribute("aria-selected",!0),i.setAttribute("tabindex","0")):i.setAttribute("aria-selected",!1),i.addEventListener("keydown",(function(e){return t.handleItemLinkKeyDown(e)}),!0),i.addEventListener("click",(function(e){return t.handleItemLinkClick(e)}),!0)}))}}},{key:"handleItemLinkClick",value:function(t){t.preventDefault();var e=t.currentTarget.getAttribute("aria-controls");this.switchTab(e)}},{key:"handleItemLinkKeyDown",value:function(t){var e=t.currentTarget,i=!1;switch(t.key){case"ArrowLeft":case"ArrowUp":this.setSelectedToPreviousTab(e),i=!0;break;case"ArrowRight":case"ArrowDown":this.setSelectedToNextTab(e),i=!0;break;case"Home":this.switchTab(this.$tabListItemLinks[0].getAttribute("aria-controls")),i=!0;break;case"End":this.switchTab(this.$tabListItemLinks[this.$tabListItemLinks.length-1].getAttribute("aria-controls")),i=!0}i&&(t.stopPropagation(),t.preventDefault())}},{key:"setSelectedToNextTab",value:function(t){console.log("setSelectedToNextTab",t);var e,i=r(this.$tabListItemLinks).findIndex((function(e){return e.getAttribute("id")===t.getAttribute("id")}));e=i<this.$tabListItemLinks.length-1?i+1:0,console.log(i,e),this.switchTab(this.$tabListItemLinks[e].getAttribute("aria-controls"))}},{key:"setSelectedToPreviousTab",value:function(t){console.log("setSelectedToPreviousTab",t);var e,i=r(this.$tabListItemLinks).findIndex((function(e){return e.getAttribute("id")===t.getAttribute("id")}));e=i>=1?i-1:this.$tabListItemLinks.length-1,console.log(i,e),this.switchTab(this.$tabListItemLinks[e].getAttribute("aria-controls"))}},{key:"switchTab",value:function(t){this.$tabListItemLinks.forEach((function(e){e.getAttribute("aria-controls")===t?(e.classList.add("tna-tabs__list-item-link--selected"),e.setAttribute("aria-selected",!0),e.setAttribute("tabindex","0"),e.focus()):(e.classList.remove("tna-tabs__list-item-link--selected"),e.setAttribute("aria-selected",!1),e.setAttribute("tabindex","-1"))})),this.$tabItems.forEach((function(e){e.getAttribute("id")===t?(e.removeAttribute("hidden"),e.setAttribute("tabindex","0")):(e.setAttribute("hidden",!0),e.setAttribute("tabindex","-1"))})),this.sticky&&(history.replaceState?history.replaceState(null,null,"#".concat(t)):location.hash="#".concat(t))}}])&&s(e.prototype,i),Object.defineProperty(e,"prototype",{writable:!1}),t}();return e})()));
 //# sourceMappingURL=tabs.js.map

package/nationalarchives/components/tabs/tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"components/tabs/tabs.js","mappings":"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","sources":["webpack://TNAFrontend/webpack/universalModuleDefinition","webpack://TNAFrontend/webpack/bootstrap","webpack://TNAFrontend/webpack/runtime/define property getters","webpack://TNAFrontend/webpack/runtime/hasOwnProperty shorthand","webpack://TNAFrontend/webpack/runtime/make namespace object","webpack://TNAFrontend/./src/nationalarchives/components/tabs/tabs.mjs"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine(\"TNAFrontend\", [], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"TNAFrontend\"] = factory();\n\telse\n\t\troot[\"TNAFrontend\"] = root[\"TNAFrontend\"] \|\| {}, root[\"TNAFrontend\"][\"components/tabs/tabs\"] = factory();\n})(self, () => {\nreturn ","// The require scope\nvar __webpack_require__ = {};\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","export class Tabs {\n constructor($module) {\n this.$module = $module;\n this.$tabList = $module && $module.querySelector(\".tna-tabs__list\");\n this.$tabListItemLinks =\n $module &&\n this.$tabList &&\n $module.querySelectorAll(\".tna-tabs__list-item-link\");\n this.$tabItems = $module && $module.querySelectorAll(\".tna-tabs__item\");\n }\n\n init() {\n if (\n !this.$module \|\|\n !this.$tabList \|\|\n !this.$tabListItemLinks \|\|\n !this.$tabItems \|\|\n this.$tabListItemLinks.length !== this.$tabItems.length\n ) {\n return;\n }\n\n this.sticky = this.$module.classList.contains(\"tna-tabs--sticky\");\n\n const startingTarget = window.location.hash.replace(/^#/, \"\");\n\n this.$newTabList = document.createElement(\"div\");\n this.$newTabList.setAttribute(\"role\", \"tablist\");\n this.$newTabList.setAttribute(\"class\", this.$tabList.getAttribute(\"class\"));\n\n this.$tabItems.forEach(($tabItem, index) => {\n $tabItem.setAttribute(\"role\", \"tabpanel\");\n $tabItem.setAttribute(\n \"aria-labelledby\",\n `${$tabItem.getAttribute(\"id\")}-tab`,\n );\n $tabItem.setAttribute(\"tabindex\", \"0\");\n if (\n (startingTarget && $tabItem.getAttribute(\"id\") !== startingTarget) \|\|\n (!startingTarget && index > 0)\n ) {\n $tabItem.setAttribute(\"hidden\", true);\n }\n });\n\n this.$tabListItemLinks.forEach(($tabListItemLink) => {\n const $replacementButton = document.createElement(\"button\");\n $replacementButton.innerText = $tabListItemLink.innerText;\n $replacementButton.setAttribute(\n \"class\",\n $tabListItemLink.getAttribute(\"class\"),\n );\n $replacementButton.setAttribute(\"role\", \"tab\");\n $replacementButton.setAttribute(\n \"id\",\n $tabListItemLink.getAttribute(\"id\"),\n );\n $replacementButton.setAttribute(\n \"aria-controls\",\n $tabListItemLink.getAttribute(\"href\").replace(/^#/, \"\"),\n );\n $replacementButton.setAttribute(\"tabindex\", \"-1\");\n this.$newTabList.appendChild($replacementButton);\n });\n\n this.$tabList.replaceWith(this.$newTabList);\n\n this.$tabListItemLinks = this.$module.querySelectorAll(\n \".tna-tabs__list-item-link\",\n );\n\n this.$tabListItemLinks.forEach(($tabListItemLink, index) => {\n if (\n (startingTarget &&\n $tabListItemLink.getAttribute(\"aria-controls\") ===\n `${startingTarget}`) \|\|\n (!startingTarget && index === 0)\n ) {\n $tabListItemLink.classList.add(\"tna-tabs__list-item-link--selected\");\n $tabListItemLink.setAttribute(\"aria-selected\", true);\n $tabListItemLink.setAttribute(\"tabindex\", \"0\");\n } else {\n $tabListItemLink.setAttribute(\"aria-selected\", false);\n }\n\n $tabListItemLink.addEventListener(\n \"keydown\",\n (e) => this.handleItemLinkKeyDown(e),\n true,\n );\n $tabListItemLink.addEventListener(\n \"click\",\n (e) => this.handleItemLinkClick(e),\n true,\n );\n });\n }\n\n handleItemLinkClick(itemLinkClickEvent) {\n itemLinkClickEvent.preventDefault();\n const targetItem =\n itemLinkClickEvent.currentTarget.getAttribute(\"aria-controls\");\n\n this.switchTab(targetItem);\n }\n\n handleItemLinkKeyDown(itemLinkKeyDownEvent) {\n const targetItem = itemLinkKeyDownEvent.currentTarget;\n let overwriteKeyAction = false;\n\n switch (itemLinkKeyDownEvent.key) {\n case \"ArrowLeft\":\n this.setSelectedToPreviousTab(targetItem);\n overwriteKeyAction = true;\n break;\n\n case \"ArrowRight\":\n this.setSelectedToNextTab(targetItem);\n overwriteKeyAction = true;\n break;\n\n case \"Home\":\n this.switchTab(this.$tabListItemLinks[0].getAttribute(\"aria-controls\"));\n overwriteKeyAction = true;\n break;\n\n case \"End\":\n this.switchTab(\n this.$tabListItemLinks[\n this.$tabListItemLinks.length - 1\n ].getAttribute(\"aria-controls\"),\n );\n overwriteKeyAction = true;\n break;\n\n default:\n break;\n }\n\n if (overwriteKeyAction) {\n itemLinkKeyDownEvent.stopPropagation();\n itemLinkKeyDownEvent.preventDefault();\n }\n }\n\n setSelectedToNextTab(targetItem) {\n console.log(\"setSelectedToNextTab\", targetItem);\n const currentIndex = [...this.$tabListItemLinks].findIndex(\n ($tabListItemLink) =>\n $tabListItemLink.getAttribute(\"id\") === targetItem.getAttribute(\"id\"),\n );\n let newIndex;\n if (currentIndex < this.$tabListItemLinks.length - 1) {\n newIndex = currentIndex + 1;\n } else {\n newIndex = 0;\n }\n console.log(currentIndex, newIndex);\n this.switchTab(\n this.$tabListItemLinks[newIndex].getAttribute(\"aria-controls\"),\n );\n }\n\n setSelectedToPreviousTab(targetItem) {\n console.log(\"setSelectedToPreviousTab\", targetItem);\n const currentIndex = [...this.$tabListItemLinks].findIndex(\n ($tabListItemLink) =>\n $tabListItemLink.getAttribute(\"id\") === targetItem.getAttribute(\"id\"),\n );\n let newIndex;\n if (currentIndex >= 1) {\n newIndex = currentIndex - 1;\n } else {\n newIndex = this.$tabListItemLinks.length - 1;\n }\n console.log(currentIndex, newIndex);\n this.switchTab(\n this.$tabListItemLinks[newIndex].getAttribute(\"aria-controls\"),\n );\n }\n\n switchTab(targetId) {\n this.$tabListItemLinks.forEach(($tabListItemLink) => {\n if ($tabListItemLink.getAttribute(\"aria-controls\") === targetId) {\n $tabListItemLink.classList.add(\"tna-tabs__list-item-link--selected\");\n $tabListItemLink.setAttribute(\"aria-selected\", true);\n $tabListItemLink.setAttribute(\"tabindex\", \"0\");\n $tabListItemLink.focus();\n } else {\n $tabListItemLink.classList.remove(\"tna-tabs__list-item-link--selected\");\n $tabListItemLink.setAttribute(\"aria-selected\", false);\n $tabListItemLink.setAttribute(\"tabindex\", \"-1\");\n }\n });\n\n this.$tabItems.forEach(($tabItem) => {\n if ($tabItem.getAttribute(\"id\") === targetId) {\n $tabItem.removeAttribute(\"hidden\");\n $tabItem.setAttribute(\"tabindex\", \"0\");\n } else {\n $tabItem.setAttribute(\"hidden\", true);\n $tabItem.setAttribute(\"tabindex\", \"-1\");\n }\n });\n\n if (this.sticky) {\n if (history.replaceState) {\n history.replaceState(null, null, `#${targetId}`);\n } else {\n location.hash = `#${targetId}`;\n }\n }\n }\n}\n"],"names":["root","factory","exports","module","define","amd","self","__webpack_require__","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","Symbol","toStringTag","value","Tabs","$module","_classCallCheck","this","$tabList","querySelector","$tabListItemLinks","querySelectorAll","$tabItems","_this","length","sticky","classList","contains","startingTarget","window","location","hash","replace","$newTabList","document","createElement","setAttribute","getAttribute","forEach","$tabItem","index","concat","$tabListItemLink","$replacementButton","innerText","appendChild","replaceWith","add","addEventListener","e","handleItemLinkKeyDown","handleItemLinkClick","itemLinkClickEvent","preventDefault","targetItem","currentTarget","switchTab","itemLinkKeyDownEvent","overwriteKeyAction","setSelectedToPreviousTab","setSelectedToNextTab","stopPropagation","console","log","newIndex","currentIndex","_toConsumableArray","findIndex","targetId","focus","remove","removeAttribute","history","replaceState"],"sourceRoot":""}
1	+ {"version":3,"file":"components/tabs/tabs.js","mappings":"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","sources":["webpack://TNAFrontend/webpack/universalModuleDefinition","webpack://TNAFrontend/webpack/bootstrap","webpack://TNAFrontend/webpack/runtime/define property getters","webpack://TNAFrontend/webpack/runtime/hasOwnProperty shorthand","webpack://TNAFrontend/webpack/runtime/make namespace object","webpack://TNAFrontend/./src/nationalarchives/components/tabs/tabs.mjs"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine(\"TNAFrontend\", [], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"TNAFrontend\"] = factory();\n\telse\n\t\troot[\"TNAFrontend\"] = factory();\n})(self, () => {\nreturn ","// The require scope\nvar __webpack_require__ = {};\n\n","// define getter functions for harmony exports\n__webpack_require__.d = (exports, definition) => {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))","// define __esModule on exports\n__webpack_require__.r = (exports) => {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","export class Tabs {\n constructor($module) {\n this.$module = $module;\n this.$tabList = $module && $module.querySelector(\".tna-tabs__list\");\n this.$tabListItemLinks =\n $module &&\n this.$tabList &&\n $module.querySelectorAll(\".tna-tabs__list-item-link\");\n this.$tabItems = $module && $module.querySelectorAll(\".tna-tabs__item\");\n }\n\n init() {\n if (\n !this.$module \|\|\n !this.$tabList \|\|\n !this.$tabListItemLinks \|\|\n !this.$tabItems \|\|\n this.$tabListItemLinks.length !== this.$tabItems.length\n ) {\n return;\n }\n\n this.sticky = this.$module.classList.contains(\"tna-tabs--sticky\");\n\n const startingTarget = window.location.hash.replace(/^#/, \"\");\n\n this.$newTabList = document.createElement(\"div\");\n this.$newTabList.setAttribute(\"role\", \"tablist\");\n this.$newTabList.setAttribute(\"class\", this.$tabList.getAttribute(\"class\"));\n\n this.$tabItems.forEach(($tabItem, index) => {\n $tabItem.setAttribute(\"role\", \"tabpanel\");\n $tabItem.setAttribute(\n \"aria-labelledby\",\n `${$tabItem.getAttribute(\"id\")}-tab`,\n );\n $tabItem.setAttribute(\"tabindex\", \"0\");\n if (\n (startingTarget && $tabItem.getAttribute(\"id\") !== startingTarget) \|\|\n (!startingTarget && index > 0)\n ) {\n $tabItem.setAttribute(\"hidden\", true);\n }\n });\n\n this.$tabListItemLinks.forEach(($tabListItemLink) => {\n const $replacementButton = document.createElement(\"button\");\n $replacementButton.innerText = $tabListItemLink.innerText;\n $replacementButton.setAttribute(\n \"class\",\n $tabListItemLink.getAttribute(\"class\"),\n );\n $replacementButton.setAttribute(\"role\", \"tab\");\n $replacementButton.setAttribute(\n \"id\",\n $tabListItemLink.getAttribute(\"id\"),\n );\n $replacementButton.setAttribute(\n \"aria-controls\",\n $tabListItemLink.getAttribute(\"href\").replace(/^#/, \"\"),\n );\n $replacementButton.setAttribute(\"tabindex\", \"-1\");\n this.$newTabList.appendChild($replacementButton);\n });\n\n this.$tabList.replaceWith(this.$newTabList);\n\n this.$tabListItemLinks = this.$module.querySelectorAll(\n \".tna-tabs__list-item-link\",\n );\n\n this.$tabListItemLinks.forEach(($tabListItemLink, index) => {\n if (\n (startingTarget &&\n $tabListItemLink.getAttribute(\"aria-controls\") ===\n `${startingTarget}`) \|\|\n (!startingTarget && index === 0)\n ) {\n $tabListItemLink.classList.add(\"tna-tabs__list-item-link--selected\");\n $tabListItemLink.setAttribute(\"aria-selected\", true);\n $tabListItemLink.setAttribute(\"tabindex\", \"0\");\n } else {\n $tabListItemLink.setAttribute(\"aria-selected\", false);\n }\n\n $tabListItemLink.addEventListener(\n \"keydown\",\n (e) => this.handleItemLinkKeyDown(e),\n true,\n );\n $tabListItemLink.addEventListener(\n \"click\",\n (e) => this.handleItemLinkClick(e),\n true,\n );\n });\n }\n\n handleItemLinkClick(itemLinkClickEvent) {\n itemLinkClickEvent.preventDefault();\n const targetItem =\n itemLinkClickEvent.currentTarget.getAttribute(\"aria-controls\");\n\n this.switchTab(targetItem);\n }\n\n handleItemLinkKeyDown(itemLinkKeyDownEvent) {\n const targetItem = itemLinkKeyDownEvent.currentTarget;\n let overwriteKeyAction = false;\n\n switch (itemLinkKeyDownEvent.key) {\n case \"ArrowLeft\":\n case \"ArrowUp\":\n this.setSelectedToPreviousTab(targetItem);\n overwriteKeyAction = true;\n break;\n\n case \"ArrowRight\":\n case \"ArrowDown\":\n this.setSelectedToNextTab(targetItem);\n overwriteKeyAction = true;\n break;\n\n case \"Home\":\n this.switchTab(this.$tabListItemLinks[0].getAttribute(\"aria-controls\"));\n overwriteKeyAction = true;\n break;\n\n case \"End\":\n this.switchTab(\n this.$tabListItemLinks[\n this.$tabListItemLinks.length - 1\n ].getAttribute(\"aria-controls\"),\n );\n overwriteKeyAction = true;\n break;\n\n default:\n break;\n }\n\n if (overwriteKeyAction) {\n itemLinkKeyDownEvent.stopPropagation();\n itemLinkKeyDownEvent.preventDefault();\n }\n }\n\n setSelectedToNextTab(targetItem) {\n console.log(\"setSelectedToNextTab\", targetItem);\n const currentIndex = [...this.$tabListItemLinks].findIndex(\n ($tabListItemLink) =>\n $tabListItemLink.getAttribute(\"id\") === targetItem.getAttribute(\"id\"),\n );\n let newIndex;\n if (currentIndex < this.$tabListItemLinks.length - 1) {\n newIndex = currentIndex + 1;\n } else {\n newIndex = 0;\n }\n console.log(currentIndex, newIndex);\n this.switchTab(\n this.$tabListItemLinks[newIndex].getAttribute(\"aria-controls\"),\n );\n }\n\n setSelectedToPreviousTab(targetItem) {\n console.log(\"setSelectedToPreviousTab\", targetItem);\n const currentIndex = [...this.$tabListItemLinks].findIndex(\n ($tabListItemLink) =>\n $tabListItemLink.getAttribute(\"id\") === targetItem.getAttribute(\"id\"),\n );\n let newIndex;\n if (currentIndex >= 1) {\n newIndex = currentIndex - 1;\n } else {\n newIndex = this.$tabListItemLinks.length - 1;\n }\n console.log(currentIndex, newIndex);\n this.switchTab(\n this.$tabListItemLinks[newIndex].getAttribute(\"aria-controls\"),\n );\n }\n\n switchTab(targetId) {\n this.$tabListItemLinks.forEach(($tabListItemLink) => {\n if ($tabListItemLink.getAttribute(\"aria-controls\") === targetId) {\n $tabListItemLink.classList.add(\"tna-tabs__list-item-link--selected\");\n $tabListItemLink.setAttribute(\"aria-selected\", true);\n $tabListItemLink.setAttribute(\"tabindex\", \"0\");\n $tabListItemLink.focus();\n } else {\n $tabListItemLink.classList.remove(\"tna-tabs__list-item-link--selected\");\n $tabListItemLink.setAttribute(\"aria-selected\", false);\n $tabListItemLink.setAttribute(\"tabindex\", \"-1\");\n }\n });\n\n this.$tabItems.forEach(($tabItem) => {\n if ($tabItem.getAttribute(\"id\") === targetId) {\n $tabItem.removeAttribute(\"hidden\");\n $tabItem.setAttribute(\"tabindex\", \"0\");\n } else {\n $tabItem.setAttribute(\"hidden\", true);\n $tabItem.setAttribute(\"tabindex\", \"-1\");\n }\n });\n\n if (this.sticky) {\n if (history.replaceState) {\n history.replaceState(null, null, `#${targetId}`);\n } else {\n location.hash = `#${targetId}`;\n }\n }\n }\n}\n"],"names":["root","factory","exports","module","define","amd","self","__webpack_require__","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","Symbol","toStringTag","value","Tabs","$module","_classCallCheck","this","$tabList","querySelector","$tabListItemLinks","querySelectorAll","$tabItems","_this","length","sticky","classList","contains","startingTarget","window","location","hash","replace","$newTabList","document","createElement","setAttribute","getAttribute","forEach","$tabItem","index","concat","$tabListItemLink","$replacementButton","innerText","appendChild","replaceWith","add","addEventListener","e","handleItemLinkKeyDown","handleItemLinkClick","itemLinkClickEvent","preventDefault","targetItem","currentTarget","switchTab","itemLinkKeyDownEvent","overwriteKeyAction","setSelectedToPreviousTab","setSelectedToNextTab","stopPropagation","console","log","newIndex","currentIndex","_toConsumableArray","findIndex","targetId","focus","remove","removeAttribute","history","replaceState"],"sourceRoot":""}

package/nationalarchives/components/tabs/tabs.mjs CHANGED Viewed

@@ -110,11 +110,13 @@ export class Tabs {
     switch (itemLinkKeyDownEvent.key) {
       case "ArrowLeft":
+      case "ArrowUp":
         this.setSelectedToPreviousTab(targetItem);
         overwriteKeyAction = true;
         break;
       case "ArrowRight":
+      case "ArrowDown":
         this.setSelectedToNextTab(targetItem);
         overwriteKeyAction = true;
         break;

package/nationalarchives/components/tabs/tabs.scss ADDED Viewed

@@ -0,0 +1,143 @@
+@use "../../tools/colour";
+@use "../../tools/typography";
+@use "../../tools/spacing";
+@use "../../utilities";
+.tna-tabs {
+  @include spacing.space-below;
+  &__list {
+    margin: 0 0 1rem;
+    padding: 0;
+    display: flex;
+    align-items: stretch;
+    gap: 1rem;
+    flex-wrap: nowrap;
+    list-style: none;
+  }
+  &__list-item {
+  }
+  &__list-item-link {
+    padding: 0.5rem 0;
+    display: flex;
+    align-items: center;
+    position: relative;
+    @include typography.relative-font-size(20);
+    @include typography.heading-font;
+    text-decoration: none;
+    // line-height: 1.5;
+    text-align: center;
+    background: transparent;
+    border: none;
+    cursor: pointer;
+    &,
+    &:link,
+    &:visited {
+      @include colour.colour-font("font-dark");
+    }
+    &::after {
+      height: 0;
+      position: absolute;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      @include colour.colour-background("keyline-dark");
+      content: "";
+    }
+    &:hover,
+    &--selected,
+    &--selected:hover {
+      text-decoration: none;
+      &::after {
+        height: 0.25rem;
+      }
+    }
+    .tna-template--js-enabled & {
+      @include colour.colour-font("font-light");
+      &:hover {
+        &::after {
+          height: 0.125rem;
+          @include colour.colour-background("font-light");
+        }
+      }
+      &--selected {
+        @include colour.colour-font("font-dark");
+        &::after,
+        &:hover::after {
+          height: 0.25rem;
+          @include colour.colour-background("keyline-dark");
+        }
+      }
+    }
+  }
+  &__items {
+    // &:not(:target-within) {
+    //   .tna-tabs__item:first-child {
+    //     display: block;
+    //   }
+    // }
+  }
+  &__item {
+    display: none;
+    &:first-child {
+      display: block;
+    }
+    &:has(~ :target) {
+      display: none;
+    }
+    &:target {
+      display: block;
+    }
+    .tna-template--js-enabled & {
+      display: block;
+      &[hidden] {
+        display: none;
+      }
+    }
+    .tna-template--clicked &:focus {
+      outline: none;
+    }
+  }
+  @include colour.on-high-contrast {
+    &__list-item-link {
+      padding-right: 1rem;
+      padding-left: 1rem;
+      overflow: hidden;
+      @include colour.colour-border("keyline-dark", 1px);
+    }
+  }
+}

package/nationalarchives/components/tabs/tabs.stories.js CHANGED Viewed

@@ -78,7 +78,6 @@ Test.args = {
   ],
   classes: "tna-tabs--demo",
 };
 Test.play = async ({ args, canvasElement, step }) => {
   await new Promise((r) => setTimeout(r, 100));

package/nationalarchives/lib/_font-awesome.scss ADDED Viewed

@@ -0,0 +1,5 @@
+@import "../variables/assets";
+$fa-font-path: $tna-font-path !default;
+@import "font-awesome/fontawesome";
+@import "font-awesome/solid";
+@import "font-awesome/brands";

package/nationalarchives/lib/_index.scss ADDED Viewed

	@@ -0,0 +1 @@
1	+ @use "font-awesome";

package/nationalarchives/lib/cookies.mjs ADDED Viewed

@@ -0,0 +1,110 @@
+export default class Cookies {
+  #policies = {};
+  constructor(
+    policies = ["analytics", "settings"],
+    cookiesPolicyKey = "cookies_policy",
+    crossDomain = false,
+  ) {
+    this.cookiesPolicyKey = cookiesPolicyKey;
+    this.crossDomain = crossDomain;
+    policies.forEach((policy) => {
+      this.#policies[policy] = false;
+    });
+    this.#getPolicies();
+  }
+  #getPolicies() {
+    if (this.exists(this.cookiesPolicyKey)) {
+      this.#policies = {
+        ...this.#policies,
+        ...this.allPolicies,
+      };
+    }
+  }
+  get data() {
+    return this.#deserialise(document.cookie);
+  }
+  #deserialise(cookieString) {
+    const deserialised = {};
+    cookieString.split(";").forEach((cookie) => {
+      const parts = cookie.trim().split("=");
+      deserialised[parts[0]] = parts[1];
+    });
+    return deserialised;
+  }
+  get all() {
+    return this.data;
+  }
+  get allPolicies() {
+    return JSON.parse(this.get(this.cookiesPolicyKey));
+  }
+  exists(key) {
+    return Object.prototype.hasOwnProperty.call(this.data, key);
+  }
+  hasValue(key, value) {
+    return this.get(key) === value;
+  }
+  get(key) {
+    return decodeURIComponent(this.data[key]);
+  }
+  delete(key, path = "/") {
+    this.set(key, "", 0, path);
+  }
+  acceptPolicy(policy) {
+    this.setPolicy(policy, true);
+  }
+  rejectPolicy(policy) {
+    this.setPolicy(policy, false);
+  }
+  setPolicy(policy, accepted) {
+    this.#policies = {
+      ...this.#policies,
+      [policy]: accepted,
+    };
+    this.set(this.cookiesPolicyKey, JSON.stringify(this.#policies));
+  }
+  acceptAllPolicies() {
+    Object.keys(this.#policies)
+      .filter((policy) => this.#policies[policy] === false)
+      .forEach((policy) => this.acceptPolicy(policy));
+  }
+  rejectAllPolicies() {
+    Object.keys(this.#policies)
+      .filter((policy) => this.#policies[policy] === true)
+      .forEach((policy) => this.rejectPolicy(policy));
+  }
+  isPolicyAccepted(policy) {
+    this.#getPolicies();
+    return Object.prototype.hasOwnProperty.call(this.#policies, policy)
+      ? this.#policies[policy] === true
+      : null;
+  }
+  set(key, value, maxAge = 60 * 60 * 24 * 365, path = "/") {
+    document.cookie = `${encodeURIComponent(key)}=${encodeURIComponent(
+      value,
+    )}; SameSite=${
+      this.crossDomain ? "None" : "Lax"
+    }; path=${path}; max-age=${maxAge}; Secure`;
+    this.#getPolicies();
+  }
+  policy(policy) {
+    return this.#policies[policy];
+  }
+}

package/nationalarchives/lib/font-awesome/brands.css ADDED Viewed

@@ -0,0 +1,5 @@
+/*!
+ * Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ * Copyright 2023 Fonticons, Inc.
+ */:root,:host{--fa-style-family-brands: "Font Awesome 6 Brands";--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands"}@font-face{font-family:"Font Awesome 6 Brands";font-style:normal;font-weight:400;font-display:block;src:url("../webfonts/fa-brands-400.woff2") format("woff2"),url("../webfonts/fa-brands-400.ttf") format("truetype")}.fab,.fa-brands{font-weight:400}.fa-monero:before{content:""}.fa-hooli:before{content:""}.fa-yelp:before{content:""}.fa-cc-visa:before{content:""}.fa-lastfm:before{content:""}.fa-shopware:before{content:""}.fa-creative-commons-nc:before{content:""}.fa-aws:before{content:""}.fa-redhat:before{content:""}.fa-yoast:before{content:""}.fa-cloudflare:before{content:""}.fa-ups:before{content:""}.fa-wpexplorer:before{content:""}.fa-dyalog:before{content:""}.fa-bity:before{content:""}.fa-stackpath:before{content:""}.fa-buysellads:before{content:""}.fa-first-order:before{content:""}.fa-modx:before{content:""}.fa-guilded:before{content:""}.fa-vnv:before{content:""}.fa-square-js:before{content:""}.fa-js-square:before{content:""}.fa-microsoft:before{content:""}.fa-qq:before{content:""}.fa-orcid:before{content:""}.fa-java:before{content:""}.fa-invision:before{content:""}.fa-creative-commons-pd-alt:before{content:""}.fa-centercode:before{content:""}.fa-glide-g:before{content:""}.fa-drupal:before{content:""}.fa-hire-a-helper:before{content:""}.fa-creative-commons-by:before{content:""}.fa-unity:before{content:""}.fa-whmcs:before{content:""}.fa-rocketchat:before{content:""}.fa-vk:before{content:""}.fa-untappd:before{content:""}.fa-mailchimp:before{content:""}.fa-css3-alt:before{content:""}.fa-square-reddit:before{content:""}.fa-reddit-square:before{content:""}.fa-vimeo-v:before{content:""}.fa-contao:before{content:""}.fa-square-font-awesome:before{content:""}.fa-deskpro:before{content:""}.fa-sistrix:before{content:""}.fa-square-instagram:before{content:""}.fa-instagram-square:before{content:""}.fa-battle-net:before{content:""}.fa-the-red-yeti:before{content:""}.fa-square-hacker-news:before{content:""}.fa-hacker-news-square:before{content:""}.fa-edge:before{content:""}.fa-threads:before{content:""}.fa-napster:before{content:""}.fa-square-snapchat:before{content:""}.fa-snapchat-square:before{content:""}.fa-google-plus-g:before{content:""}.fa-artstation:before{content:""}.fa-markdown:before{content:""}.fa-sourcetree:before{content:""}.fa-google-plus:before{content:""}.fa-diaspora:before{content:""}.fa-foursquare:before{content:""}.fa-stack-overflow:before{content:""}.fa-github-alt:before{content:""}.fa-phoenix-squadron:before{content:""}.fa-pagelines:before{content:""}.fa-algolia:before{content:""}.fa-red-river:before{content:""}.fa-creative-commons-sa:before{content:""}.fa-safari:before{content:""}.fa-google:before{content:""}.fa-square-font-awesome-stroke:before{content:""}.fa-font-awesome-alt:before{content:""}.fa-atlassian:before{content:""}.fa-linkedin-in:before{content:""}.fa-digital-ocean:before{content:""}.fa-nimblr:before{content:""}.fa-chromecast:before{content:""}.fa-evernote:before{content:""}.fa-hacker-news:before{content:""}.fa-creative-commons-sampling:before{content:""}.fa-adversal:before{content:""}.fa-creative-commons:before{content:""}.fa-watchman-monitoring:before{content:""}.fa-fonticons:before{content:""}.fa-weixin:before{content:""}.fa-shirtsinbulk:before{content:""}.fa-codepen:before{content:""}.fa-git-alt:before{content:""}.fa-lyft:before{content:""}.fa-rev:before{content:""}.fa-windows:before{content:""}.fa-wizards-of-the-coast:before{content:""}.fa-square-viadeo:before{content:""}.fa-viadeo-square:before{content:""}.fa-meetup:before{content:""}.fa-centos:before{content:""}.fa-adn:before{content:""}.fa-cloudsmith:before{content:""}.fa-pied-piper-alt:before{content:""}.fa-square-dribbble:before{content:""}.fa-dribbble-square:before{content:""}.fa-codiepie:before{content:""}.fa-node:before{content:""}.fa-mix:before{content:""}.fa-steam:before{content:""}.fa-cc-apple-pay:before{content:""}.fa-scribd:before{content:""}.fa-debian:before{content:""}.fa-openid:before{content:""}.fa-instalod:before{content:""}.fa-expeditedssl:before{content:""}.fa-sellcast:before{content:""}.fa-square-twitter:before{content:""}.fa-twitter-square:before{content:""}.fa-r-project:before{content:""}.fa-delicious:before{content:""}.fa-freebsd:before{content:""}.fa-vuejs:before{content:""}.fa-accusoft:before{content:""}.fa-ioxhost:before{content:""}.fa-fonticons-fi:before{content:""}.fa-app-store:before{content:""}.fa-cc-mastercard:before{content:""}.fa-itunes-note:before{content:""}.fa-golang:before{content:""}.fa-kickstarter:before{content:""}.fa-grav:before{content:""}.fa-weibo:before{content:""}.fa-uncharted:before{content:""}.fa-firstdraft:before{content:""}.fa-square-youtube:before{content:""}.fa-youtube-square:before{content:""}.fa-wikipedia-w:before{content:""}.fa-wpressr:before{content:""}.fa-rendact:before{content:""}.fa-angellist:before{content:""}.fa-galactic-republic:before{content:""}.fa-nfc-directional:before{content:""}.fa-skype:before{content:""}.fa-joget:before{content:""}.fa-fedora:before{content:""}.fa-stripe-s:before{content:""}.fa-meta:before{content:""}.fa-laravel:before{content:""}.fa-hotjar:before{content:""}.fa-bluetooth-b:before{content:""}.fa-sticker-mule:before{content:""}.fa-creative-commons-zero:before{content:""}.fa-hips:before{content:""}.fa-behance:before{content:""}.fa-reddit:before{content:""}.fa-discord:before{content:""}.fa-chrome:before{content:""}.fa-app-store-ios:before{content:""}.fa-cc-discover:before{content:""}.fa-wpbeginner:before{content:""}.fa-confluence:before{content:""}.fa-mdb:before{content:""}.fa-dochub:before{content:""}.fa-accessible-icon:before{content:""}.fa-ebay:before{content:""}.fa-amazon:before{content:""}.fa-unsplash:before{content:""}.fa-yarn:before{content:""}.fa-square-steam:before{content:""}.fa-steam-square:before{content:""}.fa-500px:before{content:""}.fa-square-vimeo:before{content:""}.fa-vimeo-square:before{content:""}.fa-asymmetrik:before{content:""}.fa-font-awesome:before{content:""}.fa-font-awesome-flag:before{content:""}.fa-font-awesome-logo-full:before{content:""}.fa-gratipay:before{content:""}.fa-apple:before{content:""}.fa-hive:before{content:""}.fa-gitkraken:before{content:""}.fa-keybase:before{content:""}.fa-apple-pay:before{content:""}.fa-padlet:before{content:""}.fa-amazon-pay:before{content:""}.fa-square-github:before{content:""}.fa-github-square:before{content:""}.fa-stumbleupon:before{content:""}.fa-fedex:before{content:""}.fa-phoenix-framework:before{content:""}.fa-shopify:before{content:""}.fa-neos:before{content:""}.fa-square-threads:before{content:""}.fa-hackerrank:before{content:""}.fa-researchgate:before{content:""}.fa-swift:before{content:""}.fa-angular:before{content:""}.fa-speakap:before{content:""}.fa-angrycreative:before{content:""}.fa-y-combinator:before{content:""}.fa-empire:before{content:""}.fa-envira:before{content:""}.fa-square-gitlab:before{content:""}.fa-gitlab-square:before{content:""}.fa-studiovinari:before{content:""}.fa-pied-piper:before{content:""}.fa-wordpress:before{content:""}.fa-product-hunt:before{content:""}.fa-firefox:before{content:""}.fa-linode:before{content:""}.fa-goodreads:before{content:""}.fa-square-odnoklassniki:before{content:""}.fa-odnoklassniki-square:before{content:""}.fa-jsfiddle:before{content:""}.fa-sith:before{content:""}.fa-themeisle:before{content:""}.fa-page4:before{content:""}.fa-hashnode:before{content:""}.fa-react:before{content:""}.fa-cc-paypal:before{content:""}.fa-squarespace:before{content:""}.fa-cc-stripe:before{content:""}.fa-creative-commons-share:before{content:""}.fa-bitcoin:before{content:""}.fa-keycdn:before{content:""}.fa-opera:before{content:""}.fa-itch-io:before{content:""}.fa-umbraco:before{content:""}.fa-galactic-senate:before{content:""}.fa-ubuntu:before{content:""}.fa-draft2digital:before{content:""}.fa-stripe:before{content:""}.fa-houzz:before{content:""}.fa-gg:before{content:""}.fa-dhl:before{content:""}.fa-square-pinterest:before{content:""}.fa-pinterest-square:before{content:""}.fa-xing:before{content:""}.fa-blackberry:before{content:""}.fa-creative-commons-pd:before{content:""}.fa-playstation:before{content:""}.fa-quinscape:before{content:""}.fa-less:before{content:""}.fa-blogger-b:before{content:""}.fa-opencart:before{content:""}.fa-vine:before{content:""}.fa-paypal:before{content:""}.fa-gitlab:before{content:""}.fa-typo3:before{content:""}.fa-reddit-alien:before{content:""}.fa-yahoo:before{content:""}.fa-dailymotion:before{content:""}.fa-affiliatetheme:before{content:""}.fa-pied-piper-pp:before{content:""}.fa-bootstrap:before{content:""}.fa-odnoklassniki:before{content:""}.fa-nfc-symbol:before{content:""}.fa-ethereum:before{content:""}.fa-speaker-deck:before{content:""}.fa-creative-commons-nc-eu:before{content:""}.fa-patreon:before{content:""}.fa-avianex:before{content:""}.fa-ello:before{content:""}.fa-gofore:before{content:""}.fa-bimobject:before{content:""}.fa-facebook-f:before{content:""}.fa-square-google-plus:before{content:""}.fa-google-plus-square:before{content:""}.fa-mandalorian:before{content:""}.fa-first-order-alt:before{content:""}.fa-osi:before{content:""}.fa-google-wallet:before{content:""}.fa-d-and-d-beyond:before{content:""}.fa-periscope:before{content:""}.fa-fulcrum:before{content:""}.fa-cloudscale:before{content:""}.fa-forumbee:before{content:""}.fa-mizuni:before{content:""}.fa-schlix:before{content:""}.fa-square-xing:before{content:""}.fa-xing-square:before{content:""}.fa-bandcamp:before{content:""}.fa-wpforms:before{content:""}.fa-cloudversify:before{content:""}.fa-usps:before{content:""}.fa-megaport:before{content:""}.fa-magento:before{content:""}.fa-spotify:before{content:""}.fa-optin-monster:before{content:""}.fa-fly:before{content:""}.fa-aviato:before{content:""}.fa-itunes:before{content:""}.fa-cuttlefish:before{content:""}.fa-blogger:before{content:""}.fa-flickr:before{content:""}.fa-viber:before{content:""}.fa-soundcloud:before{content:""}.fa-digg:before{content:""}.fa-tencent-weibo:before{content:""}.fa-symfony:before{content:""}.fa-maxcdn:before{content:""}.fa-etsy:before{content:""}.fa-facebook-messenger:before{content:""}.fa-audible:before{content:""}.fa-think-peaks:before{content:""}.fa-bilibili:before{content:""}.fa-erlang:before{content:""}.fa-x-twitter:before{content:""}.fa-cotton-bureau:before{content:""}.fa-dashcube:before{content:""}.fa-42-group:before{content:""}.fa-innosoft:before{content:""}.fa-stack-exchange:before{content:""}.fa-elementor:before{content:""}.fa-square-pied-piper:before{content:""}.fa-pied-piper-square:before{content:""}.fa-creative-commons-nd:before{content:""}.fa-palfed:before{content:""}.fa-superpowers:before{content:""}.fa-resolving:before{content:""}.fa-xbox:before{content:""}.fa-searchengin:before{content:""}.fa-tiktok:before{content:""}.fa-square-facebook:before{content:""}.fa-facebook-square:before{content:""}.fa-renren:before{content:""}.fa-linux:before{content:""}.fa-glide:before{content:""}.fa-linkedin:before{content:""}.fa-hubspot:before{content:""}.fa-deploydog:before{content:""}.fa-twitch:before{content:""}.fa-ravelry:before{content:""}.fa-mixer:before{content:""}.fa-square-lastfm:before{content:""}.fa-lastfm-square:before{content:""}.fa-vimeo:before{content:""}.fa-mendeley:before{content:""}.fa-uniregistry:before{content:""}.fa-figma:before{content:""}.fa-creative-commons-remix:before{content:""}.fa-cc-amazon-pay:before{content:""}.fa-dropbox:before{content:""}.fa-instagram:before{content:""}.fa-cmplid:before{content:""}.fa-facebook:before{content:""}.fa-gripfire:before{content:""}.fa-jedi-order:before{content:""}.fa-uikit:before{content:""}.fa-fort-awesome-alt:before{content:""}.fa-phabricator:before{content:""}.fa-ussunnah:before{content:""}.fa-earlybirds:before{content:""}.fa-trade-federation:before{content:""}.fa-autoprefixer:before{content:""}.fa-whatsapp:before{content:""}.fa-slideshare:before{content:""}.fa-google-play:before{content:""}.fa-viadeo:before{content:""}.fa-line:before{content:""}.fa-google-drive:before{content:""}.fa-servicestack:before{content:""}.fa-simplybuilt:before{content:""}.fa-bitbucket:before{content:""}.fa-imdb:before{content:""}.fa-deezer:before{content:""}.fa-raspberry-pi:before{content:""}.fa-jira:before{content:""}.fa-docker:before{content:""}.fa-screenpal:before{content:""}.fa-bluetooth:before{content:""}.fa-gitter:before{content:""}.fa-d-and-d:before{content:""}.fa-microblog:before{content:""}.fa-cc-diners-club:before{content:""}.fa-gg-circle:before{content:""}.fa-pied-piper-hat:before{content:""}.fa-kickstarter-k:before{content:""}.fa-yandex:before{content:""}.fa-readme:before{content:""}.fa-html5:before{content:""}.fa-sellsy:before{content:""}.fa-sass:before{content:""}.fa-wirsindhandwerk:before{content:""}.fa-wsh:before{content:""}.fa-buromobelexperte:before{content:""}.fa-salesforce:before{content:""}.fa-octopus-deploy:before{content:""}.fa-medapps:before{content:""}.fa-ns8:before{content:""}.fa-pinterest-p:before{content:""}.fa-apper:before{content:""}.fa-fort-awesome:before{content:""}.fa-waze:before{content:""}.fa-cc-jcb:before{content:""}.fa-snapchat:before{content:""}.fa-snapchat-ghost:before{content:""}.fa-fantasy-flight-games:before{content:""}.fa-rust:before{content:""}.fa-wix:before{content:""}.fa-square-behance:before{content:""}.fa-behance-square:before{content:""}.fa-supple:before{content:""}.fa-rebel:before{content:""}.fa-css3:before{content:""}.fa-staylinked:before{content:""}.fa-kaggle:before{content:""}.fa-space-awesome:before{content:""}.fa-deviantart:before{content:""}.fa-cpanel:before{content:""}.fa-goodreads-g:before{content:""}.fa-square-git:before{content:""}.fa-git-square:before{content:""}.fa-square-tumblr:before{content:""}.fa-tumblr-square:before{content:""}.fa-trello:before{content:""}.fa-creative-commons-nc-jp:before{content:""}.fa-get-pocket:before{content:""}.fa-perbyte:before{content:""}.fa-grunt:before{content:""}.fa-weebly:before{content:""}.fa-connectdevelop:before{content:""}.fa-leanpub:before{content:""}.fa-black-tie:before{content:""}.fa-themeco:before{content:""}.fa-python:before{content:""}.fa-android:before{content:""}.fa-bots:before{content:""}.fa-free-code-camp:before{content:""}.fa-hornbill:before{content:""}.fa-js:before{content:""}.fa-ideal:before{content:""}.fa-git:before{content:""}.fa-dev:before{content:""}.fa-sketch:before{content:""}.fa-yandex-international:before{content:""}.fa-cc-amex:before{content:""}.fa-uber:before{content:""}.fa-github:before{content:""}.fa-php:before{content:""}.fa-alipay:before{content:""}.fa-youtube:before{content:""}.fa-skyatlas:before{content:""}.fa-firefox-browser:before{content:""}.fa-replyd:before{content:""}.fa-suse:before{content:""}.fa-jenkins:before{content:""}.fa-twitter:before{content:""}.fa-rockrms:before{content:""}.fa-pinterest:before{content:""}.fa-buffer:before{content:""}.fa-npm:before{content:""}.fa-yammer:before{content:""}.fa-btc:before{content:""}.fa-dribbble:before{content:""}.fa-stumbleupon-circle:before{content:""}.fa-internet-explorer:before{content:""}.fa-stubber:before{content:""}.fa-telegram:before{content:""}.fa-telegram-plane:before{content:""}.fa-old-republic:before{content:""}.fa-odysee:before{content:""}.fa-square-whatsapp:before{content:""}.fa-whatsapp-square:before{content:""}.fa-node-js:before{content:""}.fa-edge-legacy:before{content:""}.fa-slack:before{content:""}.fa-slack-hash:before{content:""}.fa-medrt:before{content:""}.fa-usb:before{content:""}.fa-tumblr:before{content:""}.fa-vaadin:before{content:""}.fa-quora:before{content:""}.fa-square-x-twitter:before{content:""}.fa-reacteurope:before{content:""}.fa-medium:before{content:""}.fa-medium-m:before{content:""}.fa-amilia:before{content:""}.fa-mixcloud:before{content:""}.fa-flipboard:before{content:""}.fa-viacoin:before{content:""}.fa-critical-role:before{content:""}.fa-sitrox:before{content:""}.fa-discourse:before{content:""}.fa-joomla:before{content:""}.fa-mastodon:before{content:""}.fa-airbnb:before{content:""}.fa-wolf-pack-battalion:before{content:""}.fa-buy-n-large:before{content:""}.fa-gulp:before{content:""}.fa-creative-commons-sampling-plus:before{content:""}.fa-strava:before{content:""}.fa-ember:before{content:""}.fa-canadian-maple-leaf:before{content:""}.fa-teamspeak:before{content:""}.fa-pushed:before{content:""}.fa-wordpress-simple:before{content:""}.fa-nutritionix:before{content:""}.fa-wodu:before{content:""}.fa-google-pay:before{content:""}.fa-intercom:before{content:""}.fa-zhihu:before{content:""}.fa-korvue:before{content:""}.fa-pix:before{content:""}.fa-steam-symbol:before{content:""}/*# sourceMappingURL=brands.css.map */