@progressive-development/pd-content 0.9.1 → 1.0.0

package/LICENSE

@@ -1,2 +1,21 @@
-No License, all rights reserved
-@2021 - PD Progressive Development UG
+MIT License
+
+Copyright (c) 2021-present PD Progressive Development UG
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,76 +1,61 @@
-# \<pd-content>
+# @progressive-development/pd-content
 
-This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.
+[![npm version](https://img.shields.io/npm/v/@progressive-development/pd-content.svg)](https://www.npmjs.com/package/@progressive-development/pd-content)
+[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](LICENSE)
+
+Content layout components for collapsible sections, tabs, panels, and timelines.
+
+## Features
+
+- **Lit 3 & TypeScript** – Modern, type-safe web components
+- **Accessible** – WCAG 2.1 compliant, keyboard navigation, ARIA support
+- **Themeable** – CSS Custom Properties for easy customization
+- **Localized** – Built-in i18n support (EN, DE, BE)
+- **Lightweight** – No heavy dependencies, tree-shakeable
+- **Framework-agnostic** – Works with React, Vue, Angular, or vanilla JS
+- **Touch Gesture Support** – Swipe navigation for panels via HammerJS integration
+- **Smooth Animations** – GPU-accelerated expand/collapse with cubic-bezier easing
+- **Accordion Pattern** – Collapse groups with mutual exclusion (only one open at a time)
+- **Responsive Content Switching** – Auto-switch between inline and popup mode based on viewport
 
 ## Installation
 
 ```bash
-npm i pd-content
+npm install @progressive-development/pd-content
 ```
 
-## Usage
+## Quick Start
 
 ```html
 <script type="module">
-  import 'pd-content/pd-content.js';
+  import '@progressive-development/pd-content';
 </script>
 
-<pd-content></pd-content>
+<pd-collapse title="Section 1">
+  <p>Collapsible content here</p>
+</pd-collapse>
 ```
 
-## Linting and formatting
+## Components
 
-To scan the project for linting and formatting errors, run
+| Component | Description |
+|-----------|-------------|
+| `<pd-collapse>` | Expandable/collapsible content section |
+| `<pd-collapse-group>` | Accordion container for collapse elements |
+| `<pd-tab>` | Tabbed content navigation |
+| `<pd-panel>` | Content panel |
+| `<pd-panel-viewer>` | Swipeable panel carousel |
+| `<pd-box-view>` | Card-style content box |
+| `<pd-more-info>` | Expandable info section |
+| `<pd-edit-content>` | Inline editable content |
+| `<pd-resize-content>` | Responsive content with popup fallback |
+| `<pd-timeline>` | Vertical timeline display |
+| `<pd-timeline-wizard>` | Timeline with step progression |
 
-```bash
-npm run lint
-```
-
-To automatically fix linting and formatting errors, run
-
-```bash
-npm run format
-```
+## Documentation
 
-## Testing with Web Test Runner
-
-To execute a single test run:
-
-```bash
-npm run test
-```
-
-To run the tests in interactive watch mode run:
-
-```bash
-npm run test:watch
-```
+📖 **Full documentation:** [pd-components.web.app](https://pd-components.web.app/)
 
-## Demoing with Storybook
-
-To run a local instance of Storybook for your component, run
-
-```bash
-npm run storybook
-```
-
-To build a production version of Storybook, run
-
-```bash
-npm run storybook:build
-```
-
-
-## Tooling configs
-
-For most of the tools, the configuration is in the `package.json` to minimize the amount of files in your project.
-
-If you customize the configuration a lot, you can consider moving them to individual files.
-
-## Local Demo with `web-dev-server`
-
-```bash
-npm start
-```
+## License
 
-To run a local development server that serves the basic demo located in `demo/index.html`
+MIT © [PD Progressive Development UG](https://progressive-development.com)

package/dist/_virtual/_commonjsHelpers.js

@@ -0,0 +1,7 @@
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+export { commonjsGlobal, getDefaultExportFromCjs };

package/dist/_virtual/prism-java.js

@@ -0,0 +1,3 @@
+import { __require as requirePrismJava } from '../node_modules/.pnpm/prismjs@1.30.0/node_modules/prismjs/components/prism-java.js';
+
+requirePrismJava();

package/dist/_virtual/prism-java2.js

@@ -0,0 +1,3 @@
+var prismJava = {};
+
+export { prismJava as __exports };

package/dist/_virtual/prism-python.js

@@ -0,0 +1,3 @@
+import { __require as requirePrismPython } from '../node_modules/.pnpm/prismjs@1.30.0/node_modules/prismjs/components/prism-python.js';
+
+requirePrismPython();

package/dist/_virtual/prism-python2.js

@@ -0,0 +1,3 @@
+var prismPython = {};
+
+export { prismPython as __exports };

package/dist/_virtual/prism-typescript.js

@@ -0,0 +1,3 @@
+import { __require as requirePrismTypescript } from '../node_modules/.pnpm/prismjs@1.30.0/node_modules/prismjs/components/prism-typescript.js';
+
+requirePrismTypescript();

package/dist/_virtual/prism-typescript2.js

@@ -0,0 +1,3 @@
+var prismTypescript = {};
+
+export { prismTypescript as __exports };

package/dist/_virtual/prism.js

@@ -0,0 +1,7 @@
+import { getDefaultExportFromCjs } from './_commonjsHelpers.js';
+import { __require as requirePrism } from '../node_modules/.pnpm/prismjs@1.30.0/node_modules/prismjs/prism.js';
+
+var prismExports = requirePrism();
+const Prism = /*@__PURE__*/getDefaultExportFromCjs(prismExports);
+
+export { Prism as default };

package/dist/_virtual/prism2.js

@@ -0,0 +1,3 @@
+var prism = {exports: {}};
+
+export { prism as __module };

package/dist/generated/locales/be.d.ts

@@ -1,5 +1,15 @@
 export declare const templates: {
     "pd.moreInfo.less": string;
     "pd.moreInfo.more": string;
+    "pdContent.loadingstate.ariaLabel": string;
+    "pdContent.loadingstate.ariaLoading": string;
+    "pdContent.loadingstate.pleaseWait": string;
+    "pdContent.loadingstate.syncState": string;
+    "pd.edit.content.edit": string;
+    "pd.panel.viewer.aria.label": string;
+    "pd.panel.viewer.prev": string;
+    "pd.panel.viewer.next": string;
+    "pd.panel.viewer.progress": string;
+    "pd.panel.viewer.panel": string;
 };
 //# sourceMappingURL=be.d.ts.map

package/dist/generated/locales/be.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"be.d.ts","sourceRoot":"","sources":["../../../src/generated/locales/be.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,SAAS;;;CAGrB,CAAC"}
+{"version":3,"file":"be.d.ts","sourceRoot":"","sources":["../../../src/generated/locales/be.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,SAAS;;;;;;;;;;;;;CAarB,CAAC"}

package/dist/generated/locales/de.d.ts

@@ -1,5 +1,15 @@
 export declare const templates: {
+    "pd.edit.content.edit": string;
     "pd.moreInfo.more": string;
     "pd.moreInfo.less": string;
+    "pd.panel.viewer.aria.label": string;
+    "pd.panel.viewer.prev": string;
+    "pd.panel.viewer.next": string;
+    "pd.panel.viewer.progress": string;
+    "pd.panel.viewer.panel": string;
+    "pdContent.loadingstate.ariaLabel": string;
+    "pdContent.loadingstate.ariaLoading": string;
+    "pdContent.loadingstate.syncState": string;
+    "pdContent.loadingstate.pleaseWait": string;
 };
 //# sourceMappingURL=de.d.ts.map

package/dist/generated/locales/de.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"de.d.ts","sourceRoot":"","sources":["../../../src/generated/locales/de.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,SAAS;;;CAGrB,CAAC"}
+{"version":3,"file":"de.d.ts","sourceRoot":"","sources":["../../../src/generated/locales/de.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,SAAS;;;;;;;;;;;;;CAarB,CAAC"}

package/dist/generated/locales/en.d.ts

@@ -1,5 +1,15 @@
 export declare const templates: {
     "pd.moreInfo.less": string;
     "pd.moreInfo.more": string;
+    "pdContent.loadingstate.ariaLabel": string;
+    "pdContent.loadingstate.ariaLoading": string;
+    "pdContent.loadingstate.pleaseWait": string;
+    "pdContent.loadingstate.syncState": string;
+    "pd.edit.content.edit": string;
+    "pd.panel.viewer.aria.label": string;
+    "pd.panel.viewer.prev": string;
+    "pd.panel.viewer.next": string;
+    "pd.panel.viewer.progress": string;
+    "pd.panel.viewer.panel": string;
 };
 //# sourceMappingURL=en.d.ts.map

package/dist/generated/locales/en.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"en.d.ts","sourceRoot":"","sources":["../../../src/generated/locales/en.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,SAAS;;;CAGrB,CAAC"}
+{"version":3,"file":"en.d.ts","sourceRoot":"","sources":["../../../src/generated/locales/en.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,SAAS;;;;;;;;;;;;;CAarB,CAAC"}

package/dist/index.d.ts

@@ -7,7 +7,14 @@ export { PdResizeContent } from './pd-resize-content/pd-resize-content.js';
 export { PdTab } from './pd-tab/pd-tab.js';
 export { PdPanel } from './pd-panel-viewer/pd-panel.js';
 export { PdPanelViewer } from './pd-panel-viewer/pd-panel-viewer.js';
-export type { PdCollapseToggleEventDetail, PdEditLink, PdCollapseElement, } from './types.js';
+export { PdTimeline } from './pd-timeline/pd-timeline.js';
+export { PdTimelineWizard } from './pd-timeline-wizard/pd-timeline-wizard.js';
+export { PdLoadingState } from './pd-loading-state/pd-loading-state.js';
+export { PdNoticeBox } from './pd-notice-box/pd-notice-box.js';
+export { PdCodeSnippet } from './pd-code-snippet/pd-code-snippet.js';
+export type { LoadingState, LoadingSubTask, } from './pd-loading-state/pd-loading-state.js';
+export type { CodeLanguage } from './pd-code-snippet/pd-code-snippet.js';
+export type { PdCollapseToggleEventDetail, PdEditLink, PdCollapseElement, NoticeType, NoticeVariant, TabHeader, } from './types.js';
 export { templates as beTemplates } from './generated/locales/be.js';
 export { templates as deTemplates } from './generated/locales/de.js';
 export { templates as enTemplates } from './generated/locales/en.js';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAC3E,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAC3E,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAErE,YAAY,EACV,2BAA2B,EAC3B,UAAU,EACV,iBAAiB,GAClB,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAC3E,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAC3E,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAErE,YAAY,EACV,YAAY,EACZ,cAAc,GACf,MAAM,wCAAwC,CAAC;AAEhD,YAAY,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AAEzE,YAAY,EACV,2BAA2B,EAC3B,UAAU,EACV,iBAAiB,EACjB,UAAU,EACV,aAAa,EACb,SAAS,GACV,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC"}

package/dist/index.js

@@ -7,6 +7,11 @@ import './pd-resize-content.js';
 import './pd-tab.js';
 import './pd-panel.js';
 import './pd-panel-viewer.js';
+import './pd-timeline.js';
+import './pd-timeline-wizard.js';
+export { PdLoadingState } from './pd-loading-state/PdLoadingState.js';
+import './pd-notice-box/pd-notice-box.js';
+import './pd-code-snippet/pd-code-snippet.js';
 export { templates as beTemplates } from './locales/be.js';
 export { templates as deTemplates } from './locales/de.js';
 export { templates as enTemplates } from './locales/en.js';
@@ -19,3 +24,7 @@ export { PdResizeContent } from './pd-resize-content/PdResizeContent.js';
 export { PdTab } from './pd-tab/PdTab.js';
 export { PdPanel } from './pd-panel-viewer/PdPanel.js';
 export { PdPanelViewer } from './pd-panel-viewer/PdPanelViewer.js';
+export { PdTimeline } from './pd-timeline/PdTimeline.js';
+export { PdTimelineWizard } from './pd-timeline-wizard/PdTimelineWizard.js';
+export { PdNoticeBox } from './pd-notice-box/PdNoticeBox.js';
+export { PdCodeSnippet } from './pd-code-snippet/PdCodeSnippet.js';

package/dist/locales/be.js

@@ -1,6 +1,16 @@
 const templates = {
   "pd.moreInfo.less": `Minder informatie`,
-  "pd.moreInfo.more": `Meer informatie`
+  "pd.moreInfo.more": `Meer informatie`,
+  "pdContent.loadingstate.ariaLabel": `Laadproces`,
+  "pdContent.loadingstate.ariaLoading": `Laden`,
+  "pdContent.loadingstate.pleaseWait": `Even geduld, gegevens worden geladen`,
+  "pdContent.loadingstate.syncState": `Gegevens worden gesynchroniseerd`,
+  "pd.edit.content.edit": `Edit`,
+  "pd.panel.viewer.aria.label": `Panel viewer`,
+  "pd.panel.viewer.prev": `Previous panel`,
+  "pd.panel.viewer.next": `Next panel`,
+  "pd.panel.viewer.progress": `Panel navigation`,
+  "pd.panel.viewer.panel": `Panel`
 };
 
 export { templates };

package/dist/locales/de.js

@@ -1,6 +1,16 @@
 const templates = {
+  "pd.edit.content.edit": `Edit`,
   "pd.moreInfo.more": `Mehr Informationen`,
-  "pd.moreInfo.less": `Text ausblenden`
+  "pd.moreInfo.less": `Text ausblenden`,
+  "pd.panel.viewer.aria.label": `Panel viewer`,
+  "pd.panel.viewer.prev": `Previous panel`,
+  "pd.panel.viewer.next": `Next panel`,
+  "pd.panel.viewer.progress": `Panel navigation`,
+  "pd.panel.viewer.panel": `Panel`,
+  "pdContent.loadingstate.ariaLabel": `Ladevorgang`,
+  "pdContent.loadingstate.ariaLoading": `Laden`,
+  "pdContent.loadingstate.syncState": `Daten werden synchronisiert`,
+  "pdContent.loadingstate.pleaseWait": `Bitte warten, Daten werden geladen`
 };
 
 export { templates };

package/dist/locales/en.js

@@ -1,6 +1,16 @@
 const templates = {
   "pd.moreInfo.less": `Less information`,
-  "pd.moreInfo.more": `More information`
+  "pd.moreInfo.more": `More information`,
+  "pdContent.loadingstate.ariaLabel": `Loading process`,
+  "pdContent.loadingstate.ariaLoading": `Loading`,
+  "pdContent.loadingstate.pleaseWait": `Please wait, data is being loaded`,
+  "pdContent.loadingstate.syncState": `Data is being synchronized`,
+  "pd.edit.content.edit": `Edit`,
+  "pd.panel.viewer.aria.label": `Panel viewer`,
+  "pd.panel.viewer.prev": `Previous panel`,
+  "pd.panel.viewer.next": `Next panel`,
+  "pd.panel.viewer.progress": `Panel navigation`,
+  "pd.panel.viewer.panel": `Panel`
 };
 
 export { templates };

package/dist/node_modules/.pnpm/prismjs@1.30.0/node_modules/prismjs/components/prism-bash.js

@@ -0,0 +1,235 @@
+(function (Prism) {
+	// $ set | grep '^[A-Z][^[:space:]]*=' | cut -d= -f1 | tr '\n' '|'
+	// + LC_ALL, RANDOM, REPLY, SECONDS.
+	// + make sure PS1..4 are here as they are not always set,
+	// - some useless things.
+	var envVars = '\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b';
+
+	var commandAfterHeredoc = {
+		pattern: /(^(["']?)\w+\2)[ \t]+\S.*/,
+		lookbehind: true,
+		alias: 'punctuation', // this looks reasonably well in all themes
+		inside: null // see below
+	};
+
+	var insideString = {
+		'bash': commandAfterHeredoc,
+		'environment': {
+			pattern: RegExp('\\$' + envVars),
+			alias: 'constant'
+		},
+		'variable': [
+			// [0]: Arithmetic Environment
+			{
+				pattern: /\$?\(\([\s\S]+?\)\)/,
+				greedy: true,
+				inside: {
+					// If there is a $ sign at the beginning highlight $(( and )) as variable
+					'variable': [
+						{
+							pattern: /(^\$\(\([\s\S]+)\)\)/,
+							lookbehind: true
+						},
+						/^\$\(\(/
+					],
+					'number': /\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,
+					// Operators according to https://www.gnu.org/software/bash/manual/bashref.html#Shell-Arithmetic
+					'operator': /--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,
+					// If there is no $ sign at the beginning highlight (( and )) as punctuation
+					'punctuation': /\(\(?|\)\)?|,|;/
+				}
+			},
+			// [1]: Command Substitution
+			{
+				pattern: /\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,
+				greedy: true,
+				inside: {
+					'variable': /^\$\(|^`|\)$|`$/
+				}
+			},
+			// [2]: Brace expansion
+			{
+				pattern: /\$\{[^}]+\}/,
+				greedy: true,
+				inside: {
+					'operator': /:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,
+					'punctuation': /[\[\]]/,
+					'environment': {
+						pattern: RegExp('(\\{)' + envVars),
+						lookbehind: true,
+						alias: 'constant'
+					}
+				}
+			},
+			/\$(?:\w+|[#?*!@$])/
+		],
+		// Escape sequences from echo and printf's manuals, and escaped quotes.
+		'entity': /\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/
+	};
+
+	Prism.languages.bash = {
+		'shebang': {
+			pattern: /^#!\s*\/.*/,
+			alias: 'important'
+		},
+		'comment': {
+			pattern: /(^|[^"{\\$])#.*/,
+			lookbehind: true
+		},
+		'function-name': [
+			// a) function foo {
+			// b) foo() {
+			// c) function foo() {
+			// but not “foo {”
+			{
+				// a) and c)
+				pattern: /(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,
+				lookbehind: true,
+				alias: 'function'
+			},
+			{
+				// b)
+				pattern: /\b[\w-]+(?=\s*\(\s*\)\s*\{)/,
+				alias: 'function'
+			}
+		],
+		// Highlight variable names as variables in for and select beginnings.
+		'for-or-select': {
+			pattern: /(\b(?:for|select)\s+)\w+(?=\s+in\s)/,
+			alias: 'variable',
+			lookbehind: true
+		},
+		// Highlight variable names as variables in the left-hand part
+		// of assignments (“=” and “+=”).
+		'assign-left': {
+			pattern: /(^|[\s;|&]|[<>]\()\w+(?:\.\w+)*(?=\+?=)/,
+			inside: {
+				'environment': {
+					pattern: RegExp('(^|[\\s;|&]|[<>]\\()' + envVars),
+					lookbehind: true,
+					alias: 'constant'
+				}
+			},
+			alias: 'variable',
+			lookbehind: true
+		},
+		// Highlight parameter names as variables
+		'parameter': {
+			pattern: /(^|\s)-{1,2}(?:\w+:[+-]?)?\w+(?:\.\w+)*(?=[=\s]|$)/,
+			alias: 'variable',
+			lookbehind: true
+		},
+		'string': [
+			// Support for Here-documents https://en.wikipedia.org/wiki/Here_document
+			{
+				pattern: /((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,
+				lookbehind: true,
+				greedy: true,
+				inside: insideString
+			},
+			// Here-document with quotes around the tag
+			// → No expansion (so no “inside”).
+			{
+				pattern: /((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,
+				lookbehind: true,
+				greedy: true,
+				inside: {
+					'bash': commandAfterHeredoc
+				}
+			},
+			// “Normal” string
+			{
+				// https://www.gnu.org/software/bash/manual/html_node/Double-Quotes.html
+				pattern: /(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,
+				lookbehind: true,
+				greedy: true,
+				inside: insideString
+			},
+			{
+				// https://www.gnu.org/software/bash/manual/html_node/Single-Quotes.html
+				pattern: /(^|[^$\\])'[^']*'/,
+				lookbehind: true,
+				greedy: true
+			},
+			{
+				// https://www.gnu.org/software/bash/manual/html_node/ANSI_002dC-Quoting.html
+				pattern: /\$'(?:[^'\\]|\\[\s\S])*'/,
+				greedy: true,
+				inside: {
+					'entity': insideString.entity
+				}
+			}
+		],
+		'environment': {
+			pattern: RegExp('\\$?' + envVars),
+			alias: 'constant'
+		},
+		'variable': insideString.variable,
+		'function': {
+			pattern: /(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cargo|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|java|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|sysctl|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,
+			lookbehind: true
+		},
+		'keyword': {
+			pattern: /(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,
+			lookbehind: true
+		},
+		// https://www.gnu.org/software/bash/manual/html_node/Shell-Builtin-Commands.html
+		'builtin': {
+			pattern: /(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,
+			lookbehind: true,
+			// Alias added to make those easier to distinguish from strings.
+			alias: 'class-name'
+		},
+		'boolean': {
+			pattern: /(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,
+			lookbehind: true
+		},
+		'file-descriptor': {
+			pattern: /\B&\d\b/,
+			alias: 'important'
+		},
+		'operator': {
+			// Lots of redirections here, but not just that.
+			pattern: /\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,
+			inside: {
+				'file-descriptor': {
+					pattern: /^\d/,
+					alias: 'important'
+				}
+			}
+		},
+		'punctuation': /\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,
+		'number': {
+			pattern: /(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,
+			lookbehind: true
+		}
+	};
+
+	commandAfterHeredoc.inside = Prism.languages.bash;
+
+	/* Patterns in command substitution. */
+	var toBeCopied = [
+		'comment',
+		'function-name',
+		'for-or-select',
+		'assign-left',
+		'parameter',
+		'string',
+		'environment',
+		'function',
+		'keyword',
+		'builtin',
+		'boolean',
+		'file-descriptor',
+		'operator',
+		'punctuation',
+		'number'
+	];
+	var inside = insideString.variable[1].inside;
+	for (var i = 0; i < toBeCopied.length; i++) {
+		inside[toBeCopied[i]] = Prism.languages.bash[toBeCopied[i]];
+	}
+
+	Prism.languages.sh = Prism.languages.bash;
+	Prism.languages.shell = Prism.languages.bash;
+}(Prism));