@ndla/ui 56.0.123-alpha.0 → 56.0.124-alpha.0
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.
- package/es/Article/Article.js +122 -194
- package/es/Article/Article.js.map +1 -0
- package/es/Article/ArticleByline.js +121 -170
- package/es/Article/ArticleByline.js.map +1 -0
- package/es/Article/ArticleFootNotes.js +38 -58
- package/es/Article/ArticleFootNotes.js.map +1 -0
- package/es/AudioPlayer/AudioPlayer.js +151 -212
- package/es/AudioPlayer/AudioPlayer.js.map +1 -0
- package/es/AudioPlayer/Controls.js +246 -324
- package/es/AudioPlayer/Controls.js.map +1 -0
- package/es/AudioPlayer/SpeechControl.js +36 -52
- package/es/AudioPlayer/SpeechControl.js.map +1 -0
- package/es/AudioPlayer/index.js +7 -9
- package/es/AudioPlayer/index.js.map +1 -0
- package/es/Breadcrumb/Breadcrumb.js +42 -58
- package/es/Breadcrumb/Breadcrumb.js.map +1 -0
- package/es/Breadcrumb/BreadcrumbItem.js +33 -59
- package/es/Breadcrumb/BreadcrumbItem.js.map +1 -0
- package/es/Breadcrumb/HomeBreadcrumb.js +41 -74
- package/es/Breadcrumb/HomeBreadcrumb.js.map +1 -0
- package/es/Breadcrumb/index.js +8 -10
- package/es/Breadcrumb/index.js.map +1 -0
- package/es/CampaignBlock/CampaignBlock.js +124 -173
- package/es/CampaignBlock/CampaignBlock.js.map +1 -0
- package/es/CodeBlock/CodeBlock.js +21 -31
- package/es/CodeBlock/CodeBlock.js.map +1 -0
- package/es/CodeBlock/codeLanguageOptions.js +112 -82
- package/es/CodeBlock/codeLanguageOptions.js.map +1 -0
- package/es/Concept/Concept.js +46 -68
- package/es/Concept/Concept.js.map +1 -0
- package/es/ContactBlock/ContactBlock.js +137 -191
- package/es/ContactBlock/ContactBlock.js.map +1 -0
- package/es/ContentTypeBadge/ContentTypeBadge.js +38 -47
- package/es/ContentTypeBadge/ContentTypeBadge.js.map +1 -0
- package/es/ContentTypeBlockQuote/ContentTypeBlockQuote.js +21 -28
- package/es/ContentTypeBlockQuote/ContentTypeBlockQuote.js.map +1 -0
- package/es/ContentTypeFramedContent/ContentTypeFramedContent.js +21 -28
- package/es/ContentTypeFramedContent/ContentTypeFramedContent.js.map +1 -0
- package/es/ContentTypeHero/ContentTypeHero.js +36 -47
- package/es/ContentTypeHero/ContentTypeHero.js.map +1 -0
- package/es/CopyParagraphButton/CopyParagraphButton.js +57 -78
- package/es/CopyParagraphButton/CopyParagraphButton.js.map +1 -0
- package/es/CopyParagraphButton/index.js +7 -10
- package/es/CopyParagraphButton/index.js.map +1 -0
- package/es/Embed/AudioEmbed.js +49 -73
- package/es/Embed/AudioEmbed.js.map +1 -0
- package/es/Embed/BrightcoveEmbed.js +90 -127
- package/es/Embed/BrightcoveEmbed.js.map +1 -0
- package/es/Embed/CodeEmbed.js +55 -73
- package/es/Embed/CodeEmbed.js.map +1 -0
- package/es/Embed/ConceptEmbed.js +72 -117
- package/es/Embed/ConceptEmbed.js.map +1 -0
- package/es/Embed/ConceptInlineTriggerButton.js +39 -44
- package/es/Embed/ConceptInlineTriggerButton.js.map +1 -0
- package/es/Embed/ContentLinkEmbed.js +29 -49
- package/es/Embed/ContentLinkEmbed.js.map +1 -0
- package/es/Embed/CopyrightEmbed.js +21 -31
- package/es/Embed/CopyrightEmbed.js.map +1 -0
- package/es/Embed/EmbedErrorPlaceholder.js +40 -55
- package/es/Embed/EmbedErrorPlaceholder.js.map +1 -0
- package/es/Embed/EmbedWrapper.js +21 -46
- package/es/Embed/EmbedWrapper.js.map +1 -0
- package/es/Embed/ExternalEmbed.js +50 -70
- package/es/Embed/ExternalEmbed.js.map +1 -0
- package/es/Embed/FootnoteEmbed.js +25 -42
- package/es/Embed/FootnoteEmbed.js.map +1 -0
- package/es/Embed/GlossEmbed.js +49 -77
- package/es/Embed/GlossEmbed.js.map +1 -0
- package/es/Embed/H5pEmbed.js +35 -58
- package/es/Embed/H5pEmbed.js.map +1 -0
- package/es/Embed/IframeEmbed.js +65 -89
- package/es/Embed/IframeEmbed.js.map +1 -0
- package/es/Embed/ImageEmbed.js +167 -225
- package/es/Embed/ImageEmbed.js.map +1 -0
- package/es/Embed/InlineTriggerButton.js +20 -32
- package/es/Embed/InlineTriggerButton.js.map +1 -0
- package/es/Embed/RelatedContentEmbed.js +36 -53
- package/es/Embed/RelatedContentEmbed.js.map +1 -0
- package/es/Embed/UnknownEmbed.js +18 -29
- package/es/Embed/UnknownEmbed.js.map +1 -0
- package/es/Embed/UuDisclaimerEmbed.js +51 -85
- package/es/Embed/UuDisclaimerEmbed.js.map +1 -0
- package/es/ErrorMessage/ErrorMessage.js +51 -92
- package/es/ErrorMessage/ErrorMessage.js.map +1 -0
- package/es/ErrorMessage/index.js +7 -9
- package/es/ErrorMessage/index.js.map +1 -0
- package/es/FactBox/FactBox.js +114 -170
- package/es/FactBox/FactBox.js.map +1 -0
- package/es/FactBox/index.js +7 -9
- package/es/FactBox/index.js.map +1 -0
- package/es/FileList/File.js +70 -95
- package/es/FileList/File.js.map +1 -0
- package/es/FileList/FileList.js +31 -46
- package/es/FileList/FileList.js.map +1 -0
- package/es/FileList/PdfFile.js +27 -49
- package/es/FileList/PdfFile.js.map +1 -0
- package/es/Gloss/Gloss.js +133 -166
- package/es/Gloss/Gloss.js.map +1 -0
- package/es/Gloss/GlossExample.js +42 -60
- package/es/Gloss/GlossExample.js.map +1 -0
- package/es/Grid/Grid.js +63 -91
- package/es/Grid/Grid.js.map +1 -0
- package/es/Grid/GridParallaxItem.js +19 -30
- package/es/Grid/GridParallaxItem.js.map +1 -0
- package/es/KeyFigure/KeyFigure.js +44 -61
- package/es/KeyFigure/KeyFigure.js.map +1 -0
- package/es/LicenseByline/EmbedByline.js +126 -206
- package/es/LicenseByline/EmbedByline.js.map +1 -0
- package/es/LicenseByline/LicenseLink.js +28 -53
- package/es/LicenseByline/LicenseLink.js.map +1 -0
- package/es/LinkBlock/LinkBlock.js +70 -99
- package/es/LinkBlock/LinkBlock.js.map +1 -0
- package/es/LinkBlock/LinkBlockSection.js +20 -32
- package/es/LinkBlock/LinkBlockSection.js.map +1 -0
- package/es/Pitch/Pitch.js +59 -80
- package/es/Pitch/Pitch.js.map +1 -0
- package/es/RelatedArticleList/RelatedArticleList.js +91 -129
- package/es/RelatedArticleList/RelatedArticleList.js.map +1 -0
- package/es/RelatedArticleList/index.js +7 -10
- package/es/RelatedArticleList/index.js.map +1 -0
- package/es/ResourceBox/ResourceBox.js +71 -96
- package/es/ResourceBox/ResourceBox.js.map +1 -0
- package/es/TagSelector/TagSelector.js +93 -136
- package/es/TagSelector/TagSelector.js.map +1 -0
- package/es/ZendeskButton/ZendeskButton.js +38 -52
- package/es/ZendeskButton/ZendeskButton.js.map +1 -0
- package/es/_virtual/rolldown_runtime.js +11 -0
- package/es/i18n/formatNestedMessages.js +16 -24
- package/es/i18n/formatNestedMessages.js.map +1 -0
- package/es/i18n/i18n.js +25 -31
- package/es/i18n/i18n.js.map +1 -0
- package/es/i18n/useComponentTranslations.js +147 -203
- package/es/i18n/useComponentTranslations.js.map +1 -0
- package/es/index.js +64 -44
- package/es/locale/messages-en.js +435 -459
- package/es/locale/messages-en.js.map +1 -0
- package/es/locale/messages-nb.js +435 -459
- package/es/locale/messages-nb.js.map +1 -0
- package/es/locale/messages-nn.js +435 -459
- package/es/locale/messages-nn.js.map +1 -0
- package/es/locale/messages-se.js +435 -459
- package/es/locale/messages-se.js.map +1 -0
- package/es/model/ContentType.js +69 -65
- package/es/model/ContentType.js.map +1 -0
- package/es/model/SubjectCategories.js +23 -10
- package/es/model/SubjectCategories.js.map +1 -0
- package/es/model/SubjectTypes.js +21 -9
- package/es/model/SubjectTypes.js.map +1 -0
- package/es/model/WordClass.js +51 -43
- package/es/model/WordClass.js.map +1 -0
- package/es/model/index.js +16 -18
- package/es/model/index.js.map +1 -0
- package/es/utils/licenseAttributes.js +15 -17
- package/es/utils/licenseAttributes.js.map +1 -0
- package/es/utils/relativeUrl.js +21 -32
- package/es/utils/relativeUrl.js.map +1 -0
- package/lib/Article/Article.js +130 -203
- package/lib/Article/Article.js.map +1 -0
- package/lib/Article/ArticleByline.js +125 -179
- package/lib/Article/ArticleByline.js.map +1 -0
- package/lib/Article/ArticleFootNotes.js +39 -65
- package/lib/Article/ArticleFootNotes.js.map +1 -0
- package/lib/AudioPlayer/AudioPlayer.js +155 -221
- package/lib/AudioPlayer/AudioPlayer.js.map +1 -0
- package/lib/AudioPlayer/Controls.js +249 -332
- package/lib/AudioPlayer/Controls.js.map +1 -0
- package/lib/AudioPlayer/SpeechControl.js +39 -60
- package/lib/AudioPlayer/SpeechControl.js.map +1 -0
- package/lib/AudioPlayer/index.js +7 -15
- package/lib/AudioPlayer/index.js.map +1 -0
- package/lib/Breadcrumb/Breadcrumb.js +43 -65
- package/lib/Breadcrumb/Breadcrumb.js.map +1 -0
- package/lib/Breadcrumb/BreadcrumbItem.js +34 -65
- package/lib/Breadcrumb/BreadcrumbItem.js.map +1 -0
- package/lib/Breadcrumb/HomeBreadcrumb.js +43 -82
- package/lib/Breadcrumb/HomeBreadcrumb.js.map +1 -0
- package/lib/Breadcrumb/index.js +8 -22
- package/lib/Breadcrumb/index.js.map +1 -0
- package/lib/CampaignBlock/CampaignBlock.js +128 -183
- package/lib/CampaignBlock/CampaignBlock.js.map +1 -0
- package/lib/CodeBlock/CodeBlock.js +23 -38
- package/lib/CodeBlock/CodeBlock.js.map +1 -0
- package/lib/CodeBlock/codeLanguageOptions.js +112 -87
- package/lib/CodeBlock/codeLanguageOptions.js.map +1 -0
- package/lib/Concept/Concept.js +48 -75
- package/lib/Concept/Concept.js.map +1 -0
- package/lib/ContactBlock/ContactBlock.js +141 -200
- package/lib/ContactBlock/ContactBlock.js.map +1 -0
- package/lib/ContentTypeBadge/ContentTypeBadge.js +40 -54
- package/lib/ContentTypeBadge/ContentTypeBadge.js.map +1 -0
- package/lib/ContentTypeBlockQuote/ContentTypeBlockQuote.js +23 -35
- package/lib/ContentTypeBlockQuote/ContentTypeBlockQuote.js.map +1 -0
- package/lib/ContentTypeFramedContent/ContentTypeFramedContent.js +23 -35
- package/lib/ContentTypeFramedContent/ContentTypeFramedContent.js.map +1 -0
- package/lib/ContentTypeHero/ContentTypeHero.js +37 -54
- package/lib/ContentTypeHero/ContentTypeHero.js.map +1 -0
- package/lib/CopyParagraphButton/CopyParagraphButton.js +61 -87
- package/lib/CopyParagraphButton/CopyParagraphButton.js.map +1 -0
- package/lib/CopyParagraphButton/index.js +7 -21
- package/lib/CopyParagraphButton/index.js.map +1 -0
- package/lib/Embed/AudioEmbed.js +51 -82
- package/lib/Embed/AudioEmbed.js.map +1 -0
- package/lib/Embed/BrightcoveEmbed.js +93 -138
- package/lib/Embed/BrightcoveEmbed.js.map +1 -0
- package/lib/Embed/CodeEmbed.js +59 -83
- package/lib/Embed/CodeEmbed.js.map +1 -0
- package/lib/Embed/ConceptEmbed.js +77 -127
- package/lib/Embed/ConceptEmbed.js.map +1 -0
- package/lib/Embed/ConceptInlineTriggerButton.js +39 -49
- package/lib/Embed/ConceptInlineTriggerButton.js.map +1 -0
- package/lib/Embed/ContentLinkEmbed.js +30 -55
- package/lib/Embed/ContentLinkEmbed.js.map +1 -0
- package/lib/Embed/CopyrightEmbed.js +22 -37
- package/lib/Embed/CopyrightEmbed.js.map +1 -0
- package/lib/Embed/EmbedErrorPlaceholder.js +42 -62
- package/lib/Embed/EmbedErrorPlaceholder.js.map +1 -0
- package/lib/Embed/EmbedWrapper.js +24 -54
- package/lib/Embed/EmbedWrapper.js.map +1 -0
- package/lib/Embed/ExternalEmbed.js +53 -79
- package/lib/Embed/ExternalEmbed.js.map +1 -0
- package/lib/Embed/FootnoteEmbed.js +26 -48
- package/lib/Embed/FootnoteEmbed.js.map +1 -0
- package/lib/Embed/GlossEmbed.js +51 -86
- package/lib/Embed/GlossEmbed.js.map +1 -0
- package/lib/Embed/H5pEmbed.js +37 -66
- package/lib/Embed/H5pEmbed.js.map +1 -0
- package/lib/Embed/IframeEmbed.js +68 -98
- package/lib/Embed/IframeEmbed.js.map +1 -0
- package/lib/Embed/ImageEmbed.js +173 -238
- package/lib/Embed/ImageEmbed.js.map +1 -0
- package/lib/Embed/InlineTriggerButton.js +23 -40
- package/lib/Embed/InlineTriggerButton.js.map +1 -0
- package/lib/Embed/RelatedContentEmbed.js +37 -59
- package/lib/Embed/RelatedContentEmbed.js.map +1 -0
- package/lib/Embed/UnknownEmbed.js +19 -35
- package/lib/Embed/UnknownEmbed.js.map +1 -0
- package/lib/Embed/UuDisclaimerEmbed.js +53 -92
- package/lib/Embed/UuDisclaimerEmbed.js.map +1 -0
- package/lib/ErrorMessage/ErrorMessage.js +53 -99
- package/lib/ErrorMessage/ErrorMessage.js.map +1 -0
- package/lib/ErrorMessage/index.js +7 -15
- package/lib/ErrorMessage/index.js.map +1 -0
- package/lib/FactBox/FactBox.js +118 -180
- package/lib/FactBox/FactBox.js.map +1 -0
- package/lib/FactBox/index.js +7 -15
- package/lib/FactBox/index.js.map +1 -0
- package/lib/FileList/File.js +75 -105
- package/lib/FileList/File.js.map +1 -0
- package/lib/FileList/FileList.js +33 -52
- package/lib/FileList/FileList.js.map +1 -0
- package/lib/FileList/PdfFile.js +27 -55
- package/lib/FileList/PdfFile.js.map +1 -0
- package/lib/Gloss/Gloss.js +138 -176
- package/lib/Gloss/Gloss.js.map +1 -0
- package/lib/Gloss/GlossExample.js +45 -68
- package/lib/Gloss/GlossExample.js.map +1 -0
- package/lib/Grid/Grid.js +64 -98
- package/lib/Grid/Grid.js.map +1 -0
- package/lib/Grid/GridParallaxItem.js +19 -36
- package/lib/Grid/GridParallaxItem.js.map +1 -0
- package/lib/KeyFigure/KeyFigure.js +45 -68
- package/lib/KeyFigure/KeyFigure.js.map +1 -0
- package/lib/LicenseByline/EmbedByline.js +130 -216
- package/lib/LicenseByline/EmbedByline.js.map +1 -0
- package/lib/LicenseByline/LicenseLink.js +29 -59
- package/lib/LicenseByline/LicenseLink.js.map +1 -0
- package/lib/LinkBlock/LinkBlock.js +73 -108
- package/lib/LinkBlock/LinkBlock.js.map +1 -0
- package/lib/LinkBlock/LinkBlockSection.js +22 -39
- package/lib/LinkBlock/LinkBlockSection.js.map +1 -0
- package/lib/Pitch/Pitch.js +61 -89
- package/lib/Pitch/Pitch.js.map +1 -0
- package/lib/RelatedArticleList/RelatedArticleList.js +96 -140
- package/lib/RelatedArticleList/RelatedArticleList.js.map +1 -0
- package/lib/RelatedArticleList/index.js +7 -20
- package/lib/RelatedArticleList/index.js.map +1 -0
- package/lib/ResourceBox/ResourceBox.js +73 -104
- package/lib/ResourceBox/ResourceBox.js.map +1 -0
- package/lib/TagSelector/TagSelector.js +103 -145
- package/lib/TagSelector/TagSelector.js.map +1 -0
- package/lib/ZendeskButton/ZendeskButton.js +39 -58
- package/lib/ZendeskButton/ZendeskButton.js.map +1 -0
- package/lib/_virtual/rolldown_runtime.js +42 -0
- package/lib/i18n/formatNestedMessages.js +16 -30
- package/lib/i18n/formatNestedMessages.js.map +1 -0
- package/lib/i18n/i18n.js +28 -38
- package/lib/i18n/i18n.js.map +1 -0
- package/lib/i18n/useComponentTranslations.js +154 -215
- package/lib/i18n/useComponentTranslations.js.map +1 -0
- package/lib/index.js +156 -598
- package/lib/locale/messages-en.js +436 -466
- package/lib/locale/messages-en.js.map +1 -0
- package/lib/locale/messages-nb.js +436 -466
- package/lib/locale/messages-nb.js.map +1 -0
- package/lib/locale/messages-nn.js +436 -466
- package/lib/locale/messages-nn.js.map +1 -0
- package/lib/locale/messages-se.js +436 -466
- package/lib/locale/messages-se.js.map +1 -0
- package/lib/model/ContentType.js +90 -70
- package/lib/model/ContentType.js.map +1 -0
- package/lib/model/SubjectCategories.js +26 -14
- package/lib/model/SubjectCategories.js.map +1 -0
- package/lib/model/SubjectTypes.js +24 -13
- package/lib/model/SubjectTypes.js.map +1 -0
- package/lib/model/WordClass.js +55 -48
- package/lib/model/WordClass.js.map +1 -0
- package/lib/model/index.js +16 -25
- package/lib/model/index.js.map +1 -0
- package/lib/utils/licenseAttributes.js +14 -22
- package/lib/utils/licenseAttributes.js.map +1 -0
- package/lib/utils/relativeUrl.js +20 -38
- package/lib/utils/relativeUrl.js.map +1 -0
- package/package.json +12 -11
- package/es/Article/index.js +0 -11
- package/es/CampaignBlock/index.js +0 -9
- package/es/CodeBlock/index.js +0 -10
- package/es/ContactBlock/index.js +0 -9
- package/es/ContentTypeHero/index.js +0 -9
- package/es/Embed/index.js +0 -25
- package/es/Embed/types.js +0 -1
- package/es/FileList/index.js +0 -11
- package/es/Gloss/index.js +0 -10
- package/es/Grid/index.js +0 -10
- package/es/KeyFigure/index.js +0 -9
- package/es/LicenseByline/index.js +0 -10
- package/es/LinkBlock/index.js +0 -10
- package/es/Pitch/index.js +0 -9
- package/es/ResourceBox/index.js +0 -10
- package/es/i18n/index.js +0 -11
- package/es/types.js +0 -1
- package/lib/Article/index.js +0 -68
- package/lib/CampaignBlock/index.js +0 -13
- package/lib/CodeBlock/index.js +0 -20
- package/lib/ContactBlock/index.js +0 -18
- package/lib/ContentTypeHero/index.js +0 -12
- package/lib/Embed/index.js +0 -150
- package/lib/Embed/types.js +0 -5
- package/lib/FileList/index.js +0 -44
- package/lib/Gloss/index.js +0 -20
- package/lib/Grid/index.js +0 -19
- package/lib/KeyFigure/index.js +0 -13
- package/lib/LicenseByline/index.js +0 -19
- package/lib/LinkBlock/index.js +0 -20
- package/lib/Pitch/index.js +0 -12
- package/lib/ResourceBox/index.js +0 -13
- package/lib/i18n/index.js +0 -68
- package/lib/types.js +0 -5
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Controls.js","names":["IconButton","Text","Button","SelectRoot","SliderControl","PopoverContent","seconds: number","currentTime","details: SliderValueChangeDetails","Replay15Line","PauseLine","PlayFill","Forward15Line","SliderRoot","SliderLabel","SliderTrack","SliderRange","SliderThumb","SliderHiddenInput","FieldRoot","SelectLabel","SelectControl","SelectTrigger","SelectContent","SelectItem","SelectItemText","SelectItemIndicator","CheckLine","PopoverRoot","PopoverTrigger","VolumeUpFill"],"sources":["../../src/AudioPlayer/Controls.tsx"],"sourcesContent":["/**\n * Copyright (c) 2021-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { useEffect, useRef, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { type SliderValueChangeDetails, createListCollection } from \"@ark-ui/react\";\nimport { Replay15Line, Forward15Line, PlayFill, PauseLine, VolumeUpFill, CheckLine } from \"@ndla/icons\";\nimport {\n Button,\n FieldRoot,\n IconButton,\n PopoverContent,\n PopoverRoot,\n PopoverTrigger,\n SelectContent,\n SelectControl,\n SelectItem,\n SelectItemIndicator,\n SelectItemText,\n SelectLabel,\n SelectRoot,\n SelectTrigger,\n SliderControl,\n SliderHiddenInput,\n SliderLabel,\n SliderRange,\n SliderRoot,\n SliderThumb,\n SliderTrack,\n Text,\n} from \"@ndla/primitives\";\nimport { styled } from \"@ndla/styled-system/jsx\";\n\nconst ControlsWrapper = styled(\"div\", {\n base: {\n borderBlockStart: \"1px solid\",\n borderColor: \"stroke.default\",\n borderBottomRadius: \"xsmall\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n background: \"background.default\",\n gap: \"xsmall\",\n paddingBlock: \"xsmall\",\n paddingInline: \"medium\",\n tabletWideDown: {\n display: \"grid\",\n paddingBlock: \"xsmall\",\n paddingInline: \"xsmall\",\n gridTemplateColumns: \"1fr repeat(5, auto) 1fr\",\n gridTemplateAreas: `\n \"track track track track track track track\"\n \". speed backwards play forwards volume .\"\n`,\n },\n mobileWideDown: {\n columnGap: \"3xsmall\",\n },\n },\n});\n\nconst PlayButton = styled(IconButton, {\n base: {\n gridArea: \"play\",\n },\n});\n\nconst Forward15SecButton = styled(IconButton, {\n base: {\n gridArea: \"forwards\",\n },\n});\n\nconst Back15SecButton = styled(IconButton, {\n base: {\n gridArea: \"backwards\",\n },\n});\n\nconst ProgressWrapper = styled(\"div\", {\n base: {\n flex: \"1\",\n display: \"flex\",\n alignItems: \"center\",\n gap: \"xxsmall\",\n gridArea: \"track\",\n paddingBlock: \"xsmall\",\n mobileDown: {\n paddingInline: \"xsmall\",\n },\n },\n});\n\nconst StyledText = styled(Text, {\n base: {\n minWidth: \"xxlarge\",\n flexShrink: \"0\",\n textAlign: \"center\",\n },\n});\n\nconst VolumeButton = styled(IconButton, {\n base: {\n gridArea: \"volume\",\n },\n});\n\nconst SpeedButton = styled(Button, {\n base: {\n paddingBlock: \"auto\",\n paddingInline: \"auto\",\n maxWidth: \"xxlarge\",\n maxHeight: \"xxlarge\",\n minWidth: \"xxlarge\",\n minHeight: \"xxlarge\",\n \"& span\": {\n flex: \"1\",\n },\n },\n});\n\nconst StyledSelectRoot = styled(SelectRoot<string>, {\n base: {\n gridArea: \"speed\",\n },\n});\n\nconst StyledSliderControl = styled(SliderControl, {\n base: {\n height: \"surface.3xsmall\",\n minWidth: \"small\",\n },\n});\n\nconst StyledPopoverContent = styled(PopoverContent, {\n base: {\n paddingInline: \"small\",\n },\n});\n\nconst formatTime = (seconds: number) => {\n const minutes = Math.floor(seconds / 60);\n const currentSeconds = seconds % 60;\n\n const formattedSeconds = currentSeconds < 10 ? `0${currentSeconds}` : currentSeconds;\n return `${minutes}:${formattedSeconds}`;\n};\n\nconst speedValues = createListCollection({ items: [\"0.5\", \"0.75\", \"1\", \"1.25\", \"1.5\", \"1.75\", \"2\"] });\n\ninterface Props {\n src: string;\n title: string;\n}\n\nconst Controls = ({ src, title }: Props) => {\n const { t } = useTranslation();\n const [speedValue, setSpeedValue] = useState(1);\n const [volumeValue, setVolumeValue] = useState(100);\n const [currentTime, setCurrentTime] = useState(0);\n const [remainingTime, setRemainingTime] = useState(0);\n const [playing, setPlaying] = useState(false);\n const audioRef = useRef<HTMLAudioElement>(null);\n\n useEffect(() => {\n if (audioRef.current) {\n audioRef.current.playbackRate = speedValue;\n }\n }, [speedValue]);\n\n useEffect(() => {\n if (audioRef.current) {\n const audioElement = audioRef.current;\n const handleTimeUpdate = () => {\n const { currentTime, duration } = audioElement;\n setCurrentTime(Math.round(currentTime));\n setRemainingTime(Math.round(duration - currentTime));\n };\n\n const handleLoadedMetaData = () => {\n const { currentTime, duration } = audioElement;\n setCurrentTime(Math.round(currentTime));\n setRemainingTime(Math.round(duration - currentTime));\n };\n\n const handleTimeEnded = () => {\n setPlaying(false);\n };\n\n audioElement.addEventListener(\"timeupdate\", handleTimeUpdate);\n audioElement.addEventListener(\"loadedmetadata\", handleLoadedMetaData);\n audioElement.addEventListener(\"ended\", handleTimeEnded);\n return () => {\n audioElement.removeEventListener(\"timeupdate\", handleTimeUpdate);\n audioElement.removeEventListener(\"loadedmetadata\", handleLoadedMetaData);\n audioElement.removeEventListener(\"ended\", handleTimeEnded);\n };\n }\n }, []);\n\n const togglePlay = () => {\n if (audioRef.current) {\n const audioElement = audioRef.current;\n if (!playing) {\n audioElement.play();\n } else {\n audioElement.pause();\n }\n setPlaying(!playing);\n }\n };\n\n const onSeekSeconds = (seconds: number) => {\n if (audioRef.current) {\n audioRef.current.currentTime += seconds;\n }\n };\n\n const handleSliderChange = (details: SliderValueChangeDetails) => {\n const newValue = details.value[0];\n if (audioRef.current && newValue != null && !isNaN(newValue)) {\n audioRef.current.currentTime = details.value[0];\n }\n };\n\n const handleVolumeSliderChange = (details: SliderValueChangeDetails) => {\n if (audioRef.current) {\n audioRef.current.volume = details.value[0] / 100;\n setVolumeValue(details.value[0]);\n }\n };\n\n return (\n <div>\n {/* TODO: We should tie this up to the textual description somehow */}\n {/* eslint-disable-next-line jsx-a11y/media-has-caption */}\n <audio ref={audioRef} src={src} title={title} preload=\"metadata\" />\n <ControlsWrapper>\n <Back15SecButton\n variant=\"tertiary\"\n title={t(\"audio.controls.rewind15sec\")}\n aria-label={t(\"audio.controls.rewind15sec\")}\n onClick={() => onSeekSeconds(-15)}\n >\n <Replay15Line />\n </Back15SecButton>\n <PlayButton aria-label={t(playing ? t(\"audio.pause\") : t(\"audio.play\"))} variant=\"primary\" onClick={togglePlay}>\n {playing ? <PauseLine /> : <PlayFill />}\n </PlayButton>\n <Forward15SecButton\n variant=\"tertiary\"\n title={t(\"audio.controls.forward15sec\")}\n aria-label={t(\"audio.controls.forward15sec\")}\n onClick={() => onSeekSeconds(15)}\n >\n <Forward15Line />\n </Forward15SecButton>\n <ProgressWrapper>\n <StyledText textStyle=\"label.medium\" asChild consumeCss>\n <div>{formatTime(currentTime)}</div>\n </StyledText>\n <SliderRoot\n value={[audioRef.current?.currentTime ?? 0]}\n defaultValue={[0]}\n step={1}\n max={Math.round(audioRef.current?.duration ?? 0)}\n onValueChange={handleSliderChange}\n getAriaValueText={(value) =>\n t(\"audio.valueText\", {\n start: formatTime(Math.round(value.value)),\n end: formatTime(Math.round(audioRef.current?.duration ?? 0)),\n })\n }\n >\n <SliderLabel srOnly>{t(\"audio.progressBar\")}</SliderLabel>\n <SliderControl>\n <SliderTrack>\n <SliderRange />\n </SliderTrack>\n <SliderThumb index={0}>\n <SliderHiddenInput />\n </SliderThumb>\n </SliderControl>\n </SliderRoot>\n <StyledText textStyle=\"label.medium\" asChild consumeCss>\n <div>-{formatTime(remainingTime)}</div>\n </StyledText>\n </ProgressWrapper>\n <FieldRoot>\n <StyledSelectRoot\n collection={speedValues}\n value={[speedValue.toString()]}\n onValueChange={(details) => setSpeedValue(parseFloat(details.value[0]))}\n positioning={{ placement: \"top\" }}\n >\n <SelectLabel srOnly>{t(\"audio.controls.selectSpeed\")}</SelectLabel>\n <SelectControl>\n <SelectTrigger asChild>\n <SpeedButton\n variant=\"tertiary\"\n title={t(\"audio.controls.selectSpeed\")}\n aria-label={t(\"audio.controls.selectSpeed\")}\n >\n <span>{`${speedValue}x`}</span>\n </SpeedButton>\n </SelectTrigger>\n </SelectControl>\n <SelectContent>\n {speedValues.items.map((speed) => (\n <SelectItem key={speed} item={speed}>\n <SelectItemText>{speed}x</SelectItemText>\n <SelectItemIndicator>\n <CheckLine />\n </SelectItemIndicator>\n </SelectItem>\n ))}\n </SelectContent>\n </StyledSelectRoot>\n </FieldRoot>\n <PopoverRoot positioning={{ placement: \"top\" }}>\n <PopoverTrigger asChild>\n <VolumeButton variant=\"tertiary\" aria-label={t(\"audio.controls.adjustVolume\")}>\n <VolumeUpFill />\n </VolumeButton>\n </PopoverTrigger>\n <StyledPopoverContent>\n <SliderRoot\n orientation=\"vertical\"\n value={[volumeValue]}\n min={0}\n max={100}\n defaultValue={[100]}\n step={1}\n onValueChange={handleVolumeSliderChange}\n >\n <SliderLabel srOnly>{t(\"audio.controls.adjustVolume\")}</SliderLabel>\n <StyledSliderControl>\n <SliderTrack>\n <SliderRange />\n </SliderTrack>\n <SliderThumb index={0}>\n <SliderHiddenInput />\n </SliderThumb>\n </StyledSliderControl>\n </SliderRoot>\n </StyledPopoverContent>\n </PopoverRoot>\n </ControlsWrapper>\n </div>\n );\n};\n\nexport default Controls;\n"],"mappings":"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"}
|
|
@@ -1,62 +1,41 @@
|
|
|
1
|
-
|
|
1
|
+
const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
|
|
2
|
+
const react = require_rolldown_runtime.__toESM(require("react"));
|
|
3
|
+
const __ndla_primitives = require_rolldown_runtime.__toESM(require("@ndla/primitives"));
|
|
4
|
+
const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
|
|
5
|
+
const __ndla_icons = require_rolldown_runtime.__toESM(require("@ndla/icons"));
|
|
6
|
+
const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
|
|
2
7
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
});
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
if (audioRef.current) {
|
|
32
|
-
const audioElement = audioRef.current;
|
|
33
|
-
if (audioElement.paused) {
|
|
34
|
-
audioElement.play();
|
|
35
|
-
} else {
|
|
36
|
-
audioElement.pause();
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
};
|
|
40
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
41
|
-
"data-embed-type": "speech",
|
|
42
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("audio", {
|
|
43
|
-
ref: audioRef,
|
|
44
|
-
src: src,
|
|
45
|
-
title: title,
|
|
46
|
-
preload: "metadata"
|
|
47
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.TooltipRoot, {
|
|
48
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.TooltipTrigger, {
|
|
49
|
-
asChild: true,
|
|
50
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.IconButton, {
|
|
51
|
-
variant: "tertiary",
|
|
52
|
-
"aria-label": t(`${type}.play`),
|
|
53
|
-
onClick: togglePlay,
|
|
54
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.VolumeUpFill, {})
|
|
55
|
-
})
|
|
56
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.TooltipContent, {
|
|
57
|
-
children: t(`${type}.play`)
|
|
58
|
-
})]
|
|
59
|
-
})]
|
|
60
|
-
});
|
|
8
|
+
//#region src/AudioPlayer/SpeechControl.tsx
|
|
9
|
+
const SpeechControl = ({ src, title, type = "audio" }) => {
|
|
10
|
+
const { t } = (0, react_i18next.useTranslation)();
|
|
11
|
+
const audioRef = (0, react.useRef)(null);
|
|
12
|
+
const togglePlay = () => {
|
|
13
|
+
if (audioRef.current) {
|
|
14
|
+
const audioElement = audioRef.current;
|
|
15
|
+
if (audioElement.paused) audioElement.play();
|
|
16
|
+
else audioElement.pause();
|
|
17
|
+
}
|
|
18
|
+
};
|
|
19
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
20
|
+
"data-embed-type": "speech",
|
|
21
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("audio", {
|
|
22
|
+
ref: audioRef,
|
|
23
|
+
src,
|
|
24
|
+
title,
|
|
25
|
+
preload: "metadata"
|
|
26
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ndla_primitives.TooltipRoot, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_primitives.TooltipTrigger, {
|
|
27
|
+
asChild: true,
|
|
28
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_primitives.IconButton, {
|
|
29
|
+
variant: "tertiary",
|
|
30
|
+
"aria-label": t(`${type}.play`),
|
|
31
|
+
onClick: togglePlay,
|
|
32
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_icons.VolumeUpFill, {})
|
|
33
|
+
})
|
|
34
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_primitives.TooltipContent, { children: t(`${type}.play`) })] })]
|
|
35
|
+
});
|
|
61
36
|
};
|
|
62
|
-
var
|
|
37
|
+
var SpeechControl_default = SpeechControl;
|
|
38
|
+
|
|
39
|
+
//#endregion
|
|
40
|
+
exports.SpeechControl_default = SpeechControl_default;
|
|
41
|
+
//# sourceMappingURL=SpeechControl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SpeechControl.js","names":["TooltipRoot","TooltipTrigger","IconButton","VolumeUpFill","TooltipContent"],"sources":["../../src/AudioPlayer/SpeechControl.tsx"],"sourcesContent":["/**\n * Copyright (c) 2021-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { useRef } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { VolumeUpFill } from \"@ndla/icons\";\nimport { TooltipRoot, TooltipTrigger, TooltipContent, IconButton } from \"@ndla/primitives\";\n\ntype Props = {\n src: string;\n title: string;\n type?: \"gloss\" | \"audio\";\n};\n\nconst SpeechControl = ({ src, title, type = \"audio\" }: Props) => {\n const { t } = useTranslation();\n const audioRef = useRef<HTMLAudioElement>(null);\n\n const togglePlay = () => {\n if (audioRef.current) {\n const audioElement = audioRef.current;\n if (audioElement.paused) {\n audioElement.play();\n } else {\n audioElement.pause();\n }\n }\n };\n return (\n <div data-embed-type=\"speech\">\n {/* eslint-disable-next-line jsx-a11y/media-has-caption */}\n <audio ref={audioRef} src={src} title={title} preload=\"metadata\" />\n <TooltipRoot>\n <TooltipTrigger asChild>\n <IconButton variant=\"tertiary\" aria-label={t(`${type}.play`)} onClick={togglePlay}>\n <VolumeUpFill />\n </IconButton>\n </TooltipTrigger>\n <TooltipContent>{t(`${type}.play`)}</TooltipContent>\n </TooltipRoot>\n </div>\n );\n};\n\nexport default SpeechControl;\n"],"mappings":";;;;;;;;AAmBA,MAAM,gBAAgB,CAAC,EAAE,KAAK,OAAO,OAAO,SAAgB,KAAK;CAC/D,MAAM,EAAE,GAAG,GAAG,mCAAgB;CAC9B,MAAM,WAAW,kBAAyB,KAAK;CAE/C,MAAM,aAAa,MAAM;AACvB,MAAI,SAAS,SAAS;GACpB,MAAM,eAAe,SAAS;AAC9B,OAAI,aAAa,OACf,cAAa,MAAM;OAEnB,cAAa,OAAO;EAEvB;CACF;AACD,wBACE,4BAAC;EAAI,mBAAgB;6BAEnB,2BAAC;GAAM,KAAK;GAAe;GAAY;GAAO,SAAQ;IAAa,kBACnE,4BAACA,4DACC,2BAACC;GAAe;6BACd,2BAACC;IAAW,SAAQ;IAAW,cAAY,GAAG,EAAE,KAAK,OAAO;IAAE,SAAS;8BACrE,2BAACC,8BAAe;KACL;IACE,kBACjB,2BAACC,8CAAgB,GAAG,EAAE,KAAK,OAAO,GAAkB,IACxC;GACV;AAET;AAED,4BAAe"}
|
package/lib/AudioPlayer/index.js
CHANGED
|
@@ -1,16 +1,8 @@
|
|
|
1
|
-
|
|
1
|
+
const require_AudioPlayer = require('./AudioPlayer.js');
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
/**
|
|
10
|
-
* Copyright (c) 2021-present, NDLA.
|
|
11
|
-
*
|
|
12
|
-
* This source code is licensed under the GPLv3 license found in the
|
|
13
|
-
* LICENSE file in the root directory of this source tree.
|
|
14
|
-
*
|
|
15
|
-
*/
|
|
16
|
-
var _default = exports.default = _AudioPlayer.default;
|
|
3
|
+
//#region src/AudioPlayer/index.ts
|
|
4
|
+
var AudioPlayer_default$1 = require_AudioPlayer.AudioPlayer_default;
|
|
5
|
+
|
|
6
|
+
//#endregion
|
|
7
|
+
exports.AudioPlayer_default = AudioPlayer_default$1;
|
|
8
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["AudioPlayer"],"sources":["../../src/AudioPlayer/index.ts"],"sourcesContent":["/**\n * Copyright (c) 2021-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport AudioPlayer from \"./AudioPlayer\";\n\nexport default AudioPlayer;\n"],"mappings":";;;AAUA,4BAAeA"}
|
|
@@ -1,67 +1,45 @@
|
|
|
1
|
-
|
|
1
|
+
const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
|
|
2
|
+
const require_BreadcrumbItem = require('./BreadcrumbItem.js');
|
|
3
|
+
const react = require_rolldown_runtime.__toESM(require("react"));
|
|
4
|
+
const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
|
|
5
|
+
const react_i18next = require_rolldown_runtime.__toESM(require("react-i18next"));
|
|
6
|
+
const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
|
|
2
7
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
*/
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
})
|
|
34
|
-
|
|
35
|
-
let {
|
|
36
|
-
items,
|
|
37
|
-
renderItem,
|
|
38
|
-
renderSeparator,
|
|
39
|
-
collapseFirst,
|
|
40
|
-
collapseLast = true
|
|
41
|
-
} = _ref;
|
|
42
|
-
const {
|
|
43
|
-
t
|
|
44
|
-
} = (0, _reactI18next.useTranslation)();
|
|
45
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("nav", {
|
|
46
|
-
"aria-label": t("breadcrumb.breadcrumb"),
|
|
47
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledList, {
|
|
48
|
-
children: items.map((item, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_BreadcrumbItem.default, {
|
|
49
|
-
renderItem: renderItem,
|
|
50
|
-
renderSeparator: renderSeparator,
|
|
51
|
-
ref: element => {
|
|
52
|
-
if (element === null || !collapseFirst && index === 0 || !collapseLast && index === items.length - 1) {
|
|
53
|
-
if (element) {
|
|
54
|
-
element.setMaxWidth("none");
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
},
|
|
58
|
-
totalCount: items.length,
|
|
59
|
-
item: {
|
|
60
|
-
...item,
|
|
61
|
-
index
|
|
62
|
-
}
|
|
63
|
-
}, typeof item.to === "string" ? item.to : item.to.pathname))
|
|
64
|
-
})
|
|
65
|
-
});
|
|
8
|
+
//#region src/Breadcrumb/Breadcrumb.tsx
|
|
9
|
+
const StyledList = (0, __ndla_styled_system_jsx.styled)("ol", { base: {
|
|
10
|
+
display: "flex",
|
|
11
|
+
flexWrap: "wrap",
|
|
12
|
+
alignItems: "center",
|
|
13
|
+
listStyle: "none",
|
|
14
|
+
gap: "xxsmall",
|
|
15
|
+
mobileDown: {
|
|
16
|
+
alignItems: "flex-start",
|
|
17
|
+
justifyContent: "center",
|
|
18
|
+
flexDirection: "column"
|
|
19
|
+
}
|
|
20
|
+
} });
|
|
21
|
+
const Breadcrumb = ({ items, renderItem, renderSeparator, collapseFirst, collapseLast = true }) => {
|
|
22
|
+
const { t } = (0, react_i18next.useTranslation)();
|
|
23
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("nav", {
|
|
24
|
+
"aria-label": t("breadcrumb.breadcrumb"),
|
|
25
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledList, { children: items.map((item, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BreadcrumbItem.BreadcrumbItem_default, {
|
|
26
|
+
renderItem,
|
|
27
|
+
renderSeparator,
|
|
28
|
+
ref: (element) => {
|
|
29
|
+
if (element === null || !collapseFirst && index === 0 || !collapseLast && index === items.length - 1) {
|
|
30
|
+
if (element) element.setMaxWidth("none");
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
totalCount: items.length,
|
|
34
|
+
item: {
|
|
35
|
+
...item,
|
|
36
|
+
index
|
|
37
|
+
}
|
|
38
|
+
}, typeof item.to === "string" ? item.to : item.to.pathname)) })
|
|
39
|
+
});
|
|
66
40
|
};
|
|
67
|
-
var
|
|
41
|
+
var Breadcrumb_default = Breadcrumb;
|
|
42
|
+
|
|
43
|
+
//#endregion
|
|
44
|
+
exports.Breadcrumb_default = Breadcrumb_default;
|
|
45
|
+
//# sourceMappingURL=Breadcrumb.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Breadcrumb.js","names":["BreadcrumbItem"],"sources":["../../src/Breadcrumb/Breadcrumb.tsx"],"sourcesContent":["/**\n * Copyright (c) 2016-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ReactNode } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport BreadcrumbItem, { type IndexedBreadcrumbItem, type SimpleBreadcrumbItem } from \"./BreadcrumbItem\";\n\ninterface Props {\n items: SimpleBreadcrumbItem[];\n collapseFirst?: boolean;\n collapseLast?: boolean;\n renderItem?: (item: IndexedBreadcrumbItem, totalCount: number) => ReactNode;\n renderSeparator?: (item: IndexedBreadcrumbItem, totalCount: number) => ReactNode;\n}\n\nconst StyledList = styled(\"ol\", {\n base: {\n display: \"flex\",\n flexWrap: \"wrap\",\n alignItems: \"center\",\n listStyle: \"none\",\n gap: \"xxsmall\",\n mobileDown: {\n alignItems: \"flex-start\",\n justifyContent: \"center\",\n flexDirection: \"column\",\n },\n },\n});\n\nconst Breadcrumb = ({ items, renderItem, renderSeparator, collapseFirst, collapseLast = true }: Props) => {\n const { t } = useTranslation();\n\n return (\n <nav aria-label={t(\"breadcrumb.breadcrumb\")}>\n <StyledList>\n {items.map((item, index) => (\n <BreadcrumbItem\n renderItem={renderItem}\n renderSeparator={renderSeparator}\n ref={(element) => {\n if (\n element === null ||\n (!collapseFirst && index === 0) ||\n (!collapseLast && index === items.length - 1)\n ) {\n if (element) {\n element.setMaxWidth(\"none\");\n }\n }\n }}\n key={typeof item.to === \"string\" ? item.to : item.to.pathname}\n totalCount={items.length}\n item={{ ...item, index }}\n />\n ))}\n </StyledList>\n </nav>\n );\n};\n\nexport default Breadcrumb;\n"],"mappings":";;;;;;;;AAqBA,MAAM,aAAa,qCAAO,MAAM,EAC9B,MAAM;CACJ,SAAS;CACT,UAAU;CACV,YAAY;CACZ,WAAW;CACX,KAAK;CACL,YAAY;EACV,YAAY;EACZ,gBAAgB;EAChB,eAAe;CAChB;AACF,EACF,EAAC;AAEF,MAAM,aAAa,CAAC,EAAE,OAAO,YAAY,iBAAiB,eAAe,eAAe,MAAa,KAAK;CACxG,MAAM,EAAE,GAAG,GAAG,mCAAgB;AAE9B,wBACE,2BAAC;EAAI,cAAY,EAAE,wBAAwB;4BACzC,2BAAC,wBACE,MAAM,IAAI,CAAC,MAAM,0BAChB,2BAACA;GACa;GACK;GACjB,KAAK,CAAC,YAAY;AAChB,QACE,YAAY,SACV,iBAAiB,UAAU,MAC3B,gBAAgB,UAAU,MAAM,SAAS,GAE3C;SAAI,QACF,SAAQ,YAAY,OAAO;IAC5B;GAEJ;GAED,YAAY,MAAM;GAClB,MAAM;IAAE,GAAG;IAAM;GAAO;YAFZ,KAAK,OAAO,WAAW,KAAK,KAAK,KAAK,GAAG,SAGrD,CACF,GACS;GACT;AAET;AAED,yBAAe"}
|
|
@@ -1,68 +1,37 @@
|
|
|
1
|
-
|
|
1
|
+
const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
|
|
2
|
+
const react = require_rolldown_runtime.__toESM(require("react"));
|
|
3
|
+
const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
|
|
4
|
+
const __ndla_icons = require_rolldown_runtime.__toESM(require("@ndla/icons"));
|
|
5
|
+
const __ndla_safelink = require_rolldown_runtime.__toESM(require("@ndla/safelink"));
|
|
6
|
+
const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
|
|
2
7
|
|
|
3
|
-
|
|
4
|
-
|
|
8
|
+
//#region src/Breadcrumb/BreadcrumbItem.tsx
|
|
9
|
+
const StyledListItem = (0, __ndla_styled_system_jsx.styled)("li", { base: {
|
|
10
|
+
display: "flex",
|
|
11
|
+
color: "inherit",
|
|
12
|
+
gap: "3xsmall",
|
|
13
|
+
alignItems: "flex-end",
|
|
14
|
+
tabletDown: { display: "block" },
|
|
15
|
+
"& a": { _visited: { color: "inherit" } }
|
|
16
|
+
} });
|
|
17
|
+
const BreadcrumbItem = (0, react.forwardRef)(({ renderItem, renderSeparator, item, totalCount }, ref) => {
|
|
18
|
+
const liRef = (0, react.useRef)(null);
|
|
19
|
+
(0, react.useImperativeHandle)(ref, () => ({ setMaxWidth: (maxWidth) => {
|
|
20
|
+
liRef.current.children[0].style.maxWidth = maxWidth;
|
|
21
|
+
} }));
|
|
22
|
+
const { to, name, index } = item;
|
|
23
|
+
const isLast = index === totalCount - 1;
|
|
24
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(StyledListItem, {
|
|
25
|
+
ref: liRef,
|
|
26
|
+
"aria-current": isLast ? "page" : void 0,
|
|
27
|
+
children: [renderItem ? renderItem(item, totalCount) : isLast ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: name }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_safelink.SafeLink, {
|
|
28
|
+
to,
|
|
29
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: name })
|
|
30
|
+
}), renderSeparator ? renderSeparator(item, totalCount) : !isLast && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_icons.ArrowRightShortLine, {})]
|
|
31
|
+
});
|
|
5
32
|
});
|
|
6
|
-
|
|
7
|
-
var _react = require("react");
|
|
8
|
-
var _icons = require("@ndla/icons");
|
|
9
|
-
var _safelink = require("@ndla/safelink");
|
|
10
|
-
var _jsx2 = require("@ndla/styled-system/jsx");
|
|
11
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
-
/**
|
|
13
|
-
* Copyright (c) 2016-present, NDLA.
|
|
14
|
-
*
|
|
15
|
-
* This source code is licensed under the GPLv3 license found in the
|
|
16
|
-
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*
|
|
18
|
-
*/
|
|
33
|
+
var BreadcrumbItem_default = BreadcrumbItem;
|
|
19
34
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
color: "inherit",
|
|
24
|
-
gap: "3xsmall",
|
|
25
|
-
alignItems: "flex-end",
|
|
26
|
-
tabletDown: {
|
|
27
|
-
display: "block"
|
|
28
|
-
},
|
|
29
|
-
"& a": {
|
|
30
|
-
_visited: {
|
|
31
|
-
color: "inherit"
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
const BreadcrumbItem = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
|
|
37
|
-
let {
|
|
38
|
-
renderItem,
|
|
39
|
-
renderSeparator,
|
|
40
|
-
item,
|
|
41
|
-
totalCount
|
|
42
|
-
} = _ref;
|
|
43
|
-
const liRef = (0, _react.useRef)(null);
|
|
44
|
-
(0, _react.useImperativeHandle)(ref, () => ({
|
|
45
|
-
setMaxWidth: maxWidth => {
|
|
46
|
-
liRef.current.children[0].style.maxWidth = maxWidth;
|
|
47
|
-
}
|
|
48
|
-
}));
|
|
49
|
-
const {
|
|
50
|
-
to,
|
|
51
|
-
name,
|
|
52
|
-
index
|
|
53
|
-
} = item;
|
|
54
|
-
const isLast = index === totalCount - 1;
|
|
55
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledListItem, {
|
|
56
|
-
ref: liRef,
|
|
57
|
-
"aria-current": isLast ? "page" : undefined,
|
|
58
|
-
children: [renderItem ? renderItem(item, totalCount) : isLast ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
59
|
-
children: name
|
|
60
|
-
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_safelink.SafeLink, {
|
|
61
|
-
to: to,
|
|
62
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
63
|
-
children: name
|
|
64
|
-
})
|
|
65
|
-
}), renderSeparator ? renderSeparator(item, totalCount) : !isLast && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ArrowRightShortLine, {})]
|
|
66
|
-
});
|
|
67
|
-
});
|
|
68
|
-
var _default = exports.default = BreadcrumbItem;
|
|
35
|
+
//#endregion
|
|
36
|
+
exports.BreadcrumbItem_default = BreadcrumbItem_default;
|
|
37
|
+
//# sourceMappingURL=BreadcrumbItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BreadcrumbItem.js","names":["maxWidth: number","SafeLink","ArrowRightShortLine"],"sources":["../../src/Breadcrumb/BreadcrumbItem.tsx"],"sourcesContent":["/**\n * Copyright (c) 2016-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { useRef, useImperativeHandle, type ReactNode, forwardRef } from \"react\";\nimport { ArrowRightShortLine } from \"@ndla/icons\";\nimport { SafeLink } from \"@ndla/safelink\";\nimport { styled } from \"@ndla/styled-system/jsx\";\n\nexport interface SimpleBreadcrumbItem {\n to: string | Partial<Location>;\n name: ReactNode;\n}\n\nexport interface IndexedBreadcrumbItem extends SimpleBreadcrumbItem {\n index: number;\n}\n\nexport interface BreadcrumbRenderProps {\n item: IndexedBreadcrumbItem;\n totalCount: number;\n}\n\nconst StyledListItem = styled(\"li\", {\n base: {\n display: \"flex\",\n color: \"inherit\",\n gap: \"3xsmall\",\n alignItems: \"flex-end\",\n tabletDown: {\n display: \"block\",\n },\n \"& a\": {\n _visited: {\n color: \"inherit\",\n },\n },\n },\n});\n\ninterface Props {\n item: IndexedBreadcrumbItem;\n autoCollapse?: boolean;\n totalCount: number;\n renderItem?: (item: IndexedBreadcrumbItem, totalCount: number) => ReactNode;\n renderSeparator?: (item: IndexedBreadcrumbItem, totalCount: number) => ReactNode;\n}\n\nconst BreadcrumbItem = forwardRef<any, Props>(({ renderItem, renderSeparator, item, totalCount }, ref) => {\n const liRef = useRef<any>(null);\n\n useImperativeHandle(ref, () => ({\n setMaxWidth: (maxWidth: number) => {\n liRef.current.children[0].style.maxWidth = maxWidth;\n },\n }));\n\n const { to, name, index } = item;\n const isLast = index === totalCount - 1;\n return (\n <StyledListItem ref={liRef} aria-current={isLast ? \"page\" : undefined}>\n {renderItem ? (\n renderItem(item, totalCount)\n ) : isLast ? (\n <span>{name}</span>\n ) : (\n <SafeLink to={to}>\n <span>{name}</span>\n </SafeLink>\n )}\n {renderSeparator ? renderSeparator(item, totalCount) : !isLast && <ArrowRightShortLine />}\n </StyledListItem>\n );\n});\n\nexport default BreadcrumbItem;\n"],"mappings":";;;;;;;;AA2BA,MAAM,iBAAiB,qCAAO,MAAM,EAClC,MAAM;CACJ,SAAS;CACT,OAAO;CACP,KAAK;CACL,YAAY;CACZ,YAAY,EACV,SAAS,QACV;CACD,OAAO,EACL,UAAU,EACR,OAAO,UACR,EACF;AACF,EACF,EAAC;AAUF,MAAM,iBAAiB,sBAAuB,CAAC,EAAE,YAAY,iBAAiB,MAAM,YAAY,EAAE,QAAQ;CACxG,MAAM,QAAQ,kBAAY,KAAK;AAE/B,gCAAoB,KAAK,OAAO,EAC9B,aAAa,CAACA,aAAqB;AACjC,QAAM,QAAQ,SAAS,GAAG,MAAM,WAAW;CAC5C,EACF,GAAE;CAEH,MAAM,EAAE,IAAI,MAAM,OAAO,GAAG;CAC5B,MAAM,SAAS,UAAU,aAAa;AACtC,wBACE,4BAAC;EAAe,KAAK;EAAO,gBAAc,SAAS;aAChD,aACC,WAAW,MAAM,WAAW,GAC1B,yBACF,2BAAC,oBAAM,OAAY,mBAEnB,2BAACC;GAAa;6BACZ,2BAAC,oBAAM,OAAY;IACV,EAEZ,kBAAkB,gBAAgB,MAAM,WAAW,IAAI,0BAAU,2BAACC,qCAAsB;GAC1E;AAEpB,EAAC;AAEF,6BAAe"}
|
|
@@ -1,84 +1,45 @@
|
|
|
1
|
-
|
|
1
|
+
const require_rolldown_runtime = require('../_virtual/rolldown_runtime.js');
|
|
2
|
+
const require_Breadcrumb = require('./Breadcrumb.js');
|
|
3
|
+
const __ndla_styled_system_jsx = require_rolldown_runtime.__toESM(require("@ndla/styled-system/jsx"));
|
|
4
|
+
const __ndla_icons = require_rolldown_runtime.__toESM(require("@ndla/icons"));
|
|
5
|
+
const __ndla_safelink = require_rolldown_runtime.__toESM(require("@ndla/safelink"));
|
|
6
|
+
const react_jsx_runtime = require_rolldown_runtime.__toESM(require("react/jsx-runtime"));
|
|
2
7
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
tabletDown: {
|
|
36
|
-
display: "none"
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
});
|
|
40
|
-
const IconSafeLink = (0, _jsx2.styled)(_safelink.SafeLink, {
|
|
41
|
-
base: {
|
|
42
|
-
color: "inherit"
|
|
43
|
-
}
|
|
44
|
-
});
|
|
45
|
-
const HomeBreadcrumb = _ref => {
|
|
46
|
-
let {
|
|
47
|
-
items
|
|
48
|
-
} = _ref;
|
|
49
|
-
const renderItem = (item, totalCount) => {
|
|
50
|
-
if (item.index === totalCount - 1) {
|
|
51
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
52
|
-
children: item.name
|
|
53
|
-
});
|
|
54
|
-
}
|
|
55
|
-
if (item.index === 0 && typeof item.name === "string") {
|
|
56
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(IconSafeLink, {
|
|
57
|
-
"aria-label": item.name,
|
|
58
|
-
to: item.to,
|
|
59
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.HomeLine, {
|
|
60
|
-
title: item.name
|
|
61
|
-
})
|
|
62
|
-
});
|
|
63
|
-
}
|
|
64
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledSafeLink, {
|
|
65
|
-
to: item.to,
|
|
66
|
-
children: item.name
|
|
67
|
-
});
|
|
68
|
-
};
|
|
69
|
-
const renderSeparator = (item, totalCount) => {
|
|
70
|
-
if (item.index === totalCount - 1) {
|
|
71
|
-
return null;
|
|
72
|
-
}
|
|
73
|
-
if (item.index === 0) {
|
|
74
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledArrowRight, {});
|
|
75
|
-
}
|
|
76
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ArrowRightShortLine, {});
|
|
77
|
-
};
|
|
78
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Breadcrumb.default, {
|
|
79
|
-
items: items,
|
|
80
|
-
renderItem: renderItem,
|
|
81
|
-
renderSeparator: renderSeparator
|
|
82
|
-
});
|
|
8
|
+
//#region src/Breadcrumb/HomeBreadcrumb.tsx
|
|
9
|
+
const StyledSafeLink = (0, __ndla_styled_system_jsx.styled)(__ndla_safelink.SafeLink, { base: {
|
|
10
|
+
color: "inherit",
|
|
11
|
+
textDecoration: "underline",
|
|
12
|
+
_hover: { textDecoration: "none" },
|
|
13
|
+
_focusVisible: { textDecoration: "none" }
|
|
14
|
+
} });
|
|
15
|
+
const StyledArrowRight = (0, __ndla_styled_system_jsx.styled)(__ndla_icons.ArrowRightShortLine, { base: { tabletDown: { display: "none" } } });
|
|
16
|
+
const IconSafeLink = (0, __ndla_styled_system_jsx.styled)(__ndla_safelink.SafeLink, { base: { color: "inherit" } });
|
|
17
|
+
const HomeBreadcrumb = ({ items }) => {
|
|
18
|
+
const renderItem = (item, totalCount) => {
|
|
19
|
+
if (item.index === totalCount - 1) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: item.name });
|
|
20
|
+
if (item.index === 0 && typeof item.name === "string") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconSafeLink, {
|
|
21
|
+
"aria-label": item.name,
|
|
22
|
+
to: item.to,
|
|
23
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_icons.HomeLine, { title: item.name })
|
|
24
|
+
});
|
|
25
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledSafeLink, {
|
|
26
|
+
to: item.to,
|
|
27
|
+
children: item.name
|
|
28
|
+
});
|
|
29
|
+
};
|
|
30
|
+
const renderSeparator = (item, totalCount) => {
|
|
31
|
+
if (item.index === totalCount - 1) return null;
|
|
32
|
+
if (item.index === 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledArrowRight, {});
|
|
33
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ndla_icons.ArrowRightShortLine, {});
|
|
34
|
+
};
|
|
35
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Breadcrumb.Breadcrumb_default, {
|
|
36
|
+
items,
|
|
37
|
+
renderItem,
|
|
38
|
+
renderSeparator
|
|
39
|
+
});
|
|
83
40
|
};
|
|
84
|
-
var
|
|
41
|
+
var HomeBreadcrumb_default = HomeBreadcrumb;
|
|
42
|
+
|
|
43
|
+
//#endregion
|
|
44
|
+
exports.HomeBreadcrumb_default = HomeBreadcrumb_default;
|
|
45
|
+
//# sourceMappingURL=HomeBreadcrumb.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HomeBreadcrumb.js","names":["SafeLink","ArrowRightShortLine","item: IndexedBreadcrumbItem","totalCount: number","HomeLine","Breadcrumb"],"sources":["../../src/Breadcrumb/HomeBreadcrumb.tsx"],"sourcesContent":["/**\n * Copyright (c) 2022-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { ArrowRightShortLine, HomeLine } from \"@ndla/icons\";\nimport { SafeLink } from \"@ndla/safelink\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport Breadcrumb from \"./Breadcrumb\";\nimport type { IndexedBreadcrumbItem, SimpleBreadcrumbItem } from \"./BreadcrumbItem\";\n\nconst StyledSafeLink = styled(SafeLink, {\n base: {\n color: \"inherit\",\n textDecoration: \"underline\",\n _hover: {\n textDecoration: \"none\",\n },\n _focusVisible: {\n textDecoration: \"none\",\n },\n },\n});\n\nconst StyledArrowRight = styled(ArrowRightShortLine, {\n base: {\n tabletDown: {\n display: \"none\",\n },\n },\n});\n\nconst IconSafeLink = styled(SafeLink, {\n base: {\n color: \"inherit\",\n },\n});\n\ninterface Props {\n items: SimpleBreadcrumbItem[];\n}\n\nconst HomeBreadcrumb = ({ items }: Props) => {\n const renderItem = (item: IndexedBreadcrumbItem, totalCount: number) => {\n if (item.index === totalCount - 1) {\n return <span>{item.name}</span>;\n }\n if (item.index === 0 && typeof item.name === \"string\") {\n return (\n <IconSafeLink aria-label={item.name} to={item.to}>\n <HomeLine title={item.name} />\n </IconSafeLink>\n );\n }\n return <StyledSafeLink to={item.to}>{item.name}</StyledSafeLink>;\n };\n\n const renderSeparator = (item: IndexedBreadcrumbItem, totalCount: number) => {\n if (item.index === totalCount - 1) {\n return null;\n }\n if (item.index === 0) {\n return <StyledArrowRight />;\n }\n return <ArrowRightShortLine />;\n };\n\n return <Breadcrumb items={items} renderItem={renderItem} renderSeparator={renderSeparator} />;\n};\n\nexport default HomeBreadcrumb;\n"],"mappings":";;;;;;;;AAcA,MAAM,iBAAiB,qCAAOA,0BAAU,EACtC,MAAM;CACJ,OAAO;CACP,gBAAgB;CAChB,QAAQ,EACN,gBAAgB,OACjB;CACD,eAAe,EACb,gBAAgB,OACjB;AACF,EACF,EAAC;AAEF,MAAM,mBAAmB,qCAAOC,kCAAqB,EACnD,MAAM,EACJ,YAAY,EACV,SAAS,OACV,EACF,EACF,EAAC;AAEF,MAAM,eAAe,qCAAOD,0BAAU,EACpC,MAAM,EACJ,OAAO,UACR,EACF,EAAC;AAMF,MAAM,iBAAiB,CAAC,EAAE,OAAc,KAAK;CAC3C,MAAM,aAAa,CAACE,MAA6BC,eAAuB;AACtE,MAAI,KAAK,UAAU,aAAa,EAC9B,wBAAO,2BAAC,oBAAM,KAAK,OAAY;AAEjC,MAAI,KAAK,UAAU,YAAY,KAAK,SAAS,SAC3C,wBACE,2BAAC;GAAa,cAAY,KAAK;GAAM,IAAI,KAAK;6BAC5C,2BAACC,yBAAS,OAAO,KAAK,OAAQ;IACjB;AAGnB,yBAAO,2BAAC;GAAe,IAAI,KAAK;aAAK,KAAK;IAAsB;CACjE;CAED,MAAM,kBAAkB,CAACF,MAA6BC,eAAuB;AAC3E,MAAI,KAAK,UAAU,aAAa,EAC9B,QAAO;AAET,MAAI,KAAK,UAAU,EACjB,wBAAO,2BAAC,qBAAmB;AAE7B,yBAAO,2BAACF,qCAAsB;CAC/B;AAED,wBAAO,2BAACI;EAAkB;EAAmB;EAA6B;GAAmB;AAC9F;AAED,6BAAe"}
|
package/lib/Breadcrumb/index.js
CHANGED
|
@@ -1,23 +1,9 @@
|
|
|
1
|
-
|
|
1
|
+
const require_Breadcrumb = require('./Breadcrumb.js');
|
|
2
|
+
const require_HomeBreadcrumb = require('./HomeBreadcrumb.js');
|
|
2
3
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
return _HomeBreadcrumb.default;
|
|
10
|
-
}
|
|
11
|
-
});
|
|
12
|
-
exports.default = void 0;
|
|
13
|
-
var _Breadcrumb = _interopRequireDefault(require("./Breadcrumb"));
|
|
14
|
-
var _HomeBreadcrumb = _interopRequireDefault(require("./HomeBreadcrumb"));
|
|
15
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
|
-
/**
|
|
17
|
-
* Copyright (c) 2016-present, NDLA.
|
|
18
|
-
*
|
|
19
|
-
* This source code is licensed under the GPLv3 license found in the
|
|
20
|
-
* LICENSE file in the root directory of this source tree.
|
|
21
|
-
*
|
|
22
|
-
*/
|
|
23
|
-
var _default = exports.default = _Breadcrumb.default;
|
|
4
|
+
//#region src/Breadcrumb/index.ts
|
|
5
|
+
var Breadcrumb_default$1 = require_Breadcrumb.Breadcrumb_default;
|
|
6
|
+
|
|
7
|
+
//#endregion
|
|
8
|
+
exports.Breadcrumb_default = Breadcrumb_default$1;
|
|
9
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["Breadcrumb"],"sources":["../../src/Breadcrumb/index.ts"],"sourcesContent":["/**\n * Copyright (c) 2016-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport Breadcrumb from \"./Breadcrumb\";\n\nexport type { SimpleBreadcrumbItem, IndexedBreadcrumbItem } from \"./BreadcrumbItem\";\n\nexport { default as HomeBreadcrumb } from \"./HomeBreadcrumb\";\n\nexport default Breadcrumb;\n"],"mappings":";;;;AAcA,2BAAeA"}
|