mirror of
https://github.com/tabler/tabler.git
synced 2026-08-14 15:22:22 +04:00
update core to v1.0.0-beta19
This commit is contained in:
+55
-44
@@ -1,5 +1,5 @@
|
||||
/*!
|
||||
* Bootstrap v5.3.0-alpha3 (https://getbootstrap.com/)
|
||||
* Bootstrap v5.3.0 (https://getbootstrap.com/)
|
||||
* Copyright 2011-2023 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
*/
|
||||
@@ -311,6 +311,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -589,6 +590,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Class definition
|
||||
*/
|
||||
@@ -641,11 +643,12 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
|
||||
const VERSION = '5.3.0-alpha2';
|
||||
const VERSION = '5.3.0';
|
||||
|
||||
/**
|
||||
* Class definition
|
||||
@@ -708,6 +711,7 @@
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const getSelector = element => {
|
||||
let selector = element.getAttribute('data-bs-target');
|
||||
if (!selector || selector === '#') {
|
||||
@@ -796,6 +800,7 @@
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const enableDismissTrigger = (component, method = 'hide') => {
|
||||
const clickEvent = `click.dismiss${component.EVENT_KEY}`;
|
||||
const name = component.NAME;
|
||||
@@ -821,6 +826,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -895,6 +901,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -958,6 +965,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -1077,6 +1085,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -1449,6 +1458,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2126,7 +2136,6 @@
|
||||
}
|
||||
|
||||
if (!contains(state.elements.popper, arrowElement)) {
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -2268,7 +2277,6 @@
|
||||
adaptive = _options$adaptive === void 0 ? true : _options$adaptive,
|
||||
_options$roundOffsets = options.roundOffsets,
|
||||
roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
|
||||
|
||||
var commonStyles = {
|
||||
placement: getBasePlacement(state.placement),
|
||||
variation: getVariation(state.placement),
|
||||
@@ -3336,8 +3344,7 @@
|
||||
|
||||
state.orderedModifiers = orderedModifiers.filter(function (m) {
|
||||
return m.enabled;
|
||||
}); // Validate the provided modifiers so that the consumer will get warned
|
||||
|
||||
});
|
||||
runModifierEffects();
|
||||
return instance.update();
|
||||
},
|
||||
@@ -3357,7 +3364,6 @@
|
||||
// anymore
|
||||
|
||||
if (!areValidElements(reference, popper)) {
|
||||
|
||||
return;
|
||||
} // Store the reference and popper rects to be read by modifiers
|
||||
|
||||
@@ -3382,7 +3388,6 @@
|
||||
});
|
||||
|
||||
for (var index = 0; index < state.orderedModifiers.length; index++) {
|
||||
|
||||
if (state.reset === true) {
|
||||
state.reset = false;
|
||||
index = -1;
|
||||
@@ -3420,7 +3425,6 @@
|
||||
};
|
||||
|
||||
if (!areValidElements(reference, popper)) {
|
||||
|
||||
return instance;
|
||||
}
|
||||
|
||||
@@ -3435,11 +3439,11 @@
|
||||
// one.
|
||||
|
||||
function runModifierEffects() {
|
||||
state.orderedModifiers.forEach(function (_ref3) {
|
||||
var name = _ref3.name,
|
||||
_ref3$options = _ref3.options,
|
||||
options = _ref3$options === void 0 ? {} : _ref3$options,
|
||||
effect = _ref3.effect;
|
||||
state.orderedModifiers.forEach(function (_ref) {
|
||||
var name = _ref.name,
|
||||
_ref$options = _ref.options,
|
||||
options = _ref$options === void 0 ? {} : _ref$options,
|
||||
effect = _ref.effect;
|
||||
|
||||
if (typeof effect === 'function') {
|
||||
var cleanupFn = effect({
|
||||
@@ -3527,6 +3531,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -3894,6 +3899,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -4018,6 +4024,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -4116,6 +4123,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -4213,6 +4221,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -4517,6 +4526,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -4747,34 +4757,6 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const uriAttributes = new Set(['background', 'cite', 'href', 'itemtype', 'longdesc', 'poster', 'src', 'xlink:href']);
|
||||
|
||||
/**
|
||||
* A pattern that recognizes a commonly useful subset of URLs that are safe.
|
||||
*
|
||||
* Shout-out to Angular https://github.com/angular/angular/blob/12.2.x/packages/core/src/sanitization/url_sanitizer.ts
|
||||
*/
|
||||
const SAFE_URL_PATTERN = /^(?:(?:https?|mailto|ftp|tel|file|sms):|[^#&/:?]*(?:[#/?]|$))/i;
|
||||
|
||||
/**
|
||||
* A pattern that matches safe data URLs. Only matches image, video and audio types.
|
||||
*
|
||||
* Shout-out to Angular https://github.com/angular/angular/blob/12.2.x/packages/core/src/sanitization/url_sanitizer.ts
|
||||
*/
|
||||
const DATA_URL_PATTERN = /^data:(?:image\/(?:bmp|gif|jpeg|jpg|png|tiff|webp)|video\/(?:mpeg|mp4|ogg|webm)|audio\/(?:mp3|oga|ogg|opus));base64,[\d+/a-z]+=*$/i;
|
||||
const allowedAttribute = (attribute, allowedAttributeList) => {
|
||||
const attributeName = attribute.nodeName.toLowerCase();
|
||||
if (allowedAttributeList.includes(attributeName)) {
|
||||
if (uriAttributes.has(attributeName)) {
|
||||
return Boolean(SAFE_URL_PATTERN.test(attribute.nodeValue) || DATA_URL_PATTERN.test(attribute.nodeValue));
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
// Check if a regular expression validates the attribute.
|
||||
return allowedAttributeList.filter(attributeRegex => attributeRegex instanceof RegExp).some(regex => regex.test(attributeName));
|
||||
};
|
||||
|
||||
// js-docs-start allow-list
|
||||
const ARIA_ATTRIBUTE_PATTERN = /^aria-[\w-]*$/i;
|
||||
const DefaultAllowlist = {
|
||||
@@ -4812,6 +4794,28 @@
|
||||
};
|
||||
// js-docs-end allow-list
|
||||
|
||||
const uriAttributes = new Set(['background', 'cite', 'href', 'itemtype', 'longdesc', 'poster', 'src', 'xlink:href']);
|
||||
|
||||
/**
|
||||
* A pattern that recognizes URLs that are safe wrt. XSS in URL navigation
|
||||
* contexts.
|
||||
*
|
||||
* Shout-out to Angular https://github.com/angular/angular/blob/15.2.8/packages/core/src/sanitization/url_sanitizer.ts#L38
|
||||
*/
|
||||
// eslint-disable-next-line unicorn/better-regex
|
||||
const SAFE_URL_PATTERN = /^(?!javascript:)(?:[a-z0-9+.-]+:|[^&:/?#]*(?:[/?#]|$))/i;
|
||||
const allowedAttribute = (attribute, allowedAttributeList) => {
|
||||
const attributeName = attribute.nodeName.toLowerCase();
|
||||
if (allowedAttributeList.includes(attributeName)) {
|
||||
if (uriAttributes.has(attributeName)) {
|
||||
return Boolean(SAFE_URL_PATTERN.test(attribute.nodeValue));
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
// Check if a regular expression validates the attribute.
|
||||
return allowedAttributeList.filter(attributeRegex => attributeRegex instanceof RegExp).some(regex => regex.test(attributeName));
|
||||
};
|
||||
function sanitizeHtml(unsafeHtml, allowList, sanitizeFunction) {
|
||||
if (!unsafeHtml.length) {
|
||||
return unsafeHtml;
|
||||
@@ -4846,6 +4850,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -4981,6 +4986,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -5492,6 +5498,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -5572,6 +5579,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -5750,11 +5758,11 @@
|
||||
if (!anchor.hash || isDisabled(anchor)) {
|
||||
continue;
|
||||
}
|
||||
const observableSection = SelectorEngine.findOne(anchor.hash, this._element);
|
||||
const observableSection = SelectorEngine.findOne(decodeURI(anchor.hash), this._element);
|
||||
|
||||
// ensure that the observableSection exists & is visible
|
||||
if (isVisible(observableSection)) {
|
||||
this._targetLinks.set(anchor.hash, anchor);
|
||||
this._targetLinks.set(decodeURI(anchor.hash), anchor);
|
||||
this._observableSections.set(anchor.hash, observableSection);
|
||||
}
|
||||
}
|
||||
@@ -5831,6 +5839,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -6092,6 +6101,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -6274,6 +6284,7 @@
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const index_umd = {
|
||||
Alert,
|
||||
Button,
|
||||
|
||||
+1
-1
File diff suppressed because one or more lines are too long
+2
-2
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
+48
-32
@@ -1,5 +1,5 @@
|
||||
/*!
|
||||
* Bootstrap v5.3.0-alpha3 (https://getbootstrap.com/)
|
||||
* Bootstrap v5.3.0 (https://getbootstrap.com/)
|
||||
* Copyright 2011-2023 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
*/
|
||||
@@ -307,6 +307,7 @@ const getNextActiveElement = (list, activeElement, shouldGetNext, isCycleAllowed
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -585,6 +586,7 @@ const Manipulator = {
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Class definition
|
||||
*/
|
||||
@@ -637,11 +639,12 @@ class Config {
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
|
||||
const VERSION = '5.3.0-alpha2';
|
||||
const VERSION = '5.3.0';
|
||||
|
||||
/**
|
||||
* Class definition
|
||||
@@ -704,6 +707,7 @@ class BaseComponent extends Config {
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const getSelector = element => {
|
||||
let selector = element.getAttribute('data-bs-target');
|
||||
if (!selector || selector === '#') {
|
||||
@@ -792,6 +796,7 @@ const SelectorEngine = {
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const enableDismissTrigger = (component, method = 'hide') => {
|
||||
const clickEvent = `click.dismiss${component.EVENT_KEY}`;
|
||||
const name = component.NAME;
|
||||
@@ -817,6 +822,7 @@ const enableDismissTrigger = (component, method = 'hide') => {
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -891,6 +897,7 @@ defineJQueryPlugin(Alert);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -954,6 +961,7 @@ defineJQueryPlugin(Button);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -1073,6 +1081,7 @@ class Swipe extends Config {
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -1445,6 +1454,7 @@ defineJQueryPlugin(Carousel);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -1678,6 +1688,7 @@ defineJQueryPlugin(Collapse);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2045,6 +2056,7 @@ defineJQueryPlugin(Dropdown);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2169,6 +2181,7 @@ class Backdrop extends Config {
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2267,6 +2280,7 @@ class FocusTrap extends Config {
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2364,6 +2378,7 @@ class ScrollBarHelper {
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2668,6 +2683,7 @@ defineJQueryPlugin(Modal);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2898,34 +2914,6 @@ defineJQueryPlugin(Offcanvas);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const uriAttributes = new Set(['background', 'cite', 'href', 'itemtype', 'longdesc', 'poster', 'src', 'xlink:href']);
|
||||
|
||||
/**
|
||||
* A pattern that recognizes a commonly useful subset of URLs that are safe.
|
||||
*
|
||||
* Shout-out to Angular https://github.com/angular/angular/blob/12.2.x/packages/core/src/sanitization/url_sanitizer.ts
|
||||
*/
|
||||
const SAFE_URL_PATTERN = /^(?:(?:https?|mailto|ftp|tel|file|sms):|[^#&/:?]*(?:[#/?]|$))/i;
|
||||
|
||||
/**
|
||||
* A pattern that matches safe data URLs. Only matches image, video and audio types.
|
||||
*
|
||||
* Shout-out to Angular https://github.com/angular/angular/blob/12.2.x/packages/core/src/sanitization/url_sanitizer.ts
|
||||
*/
|
||||
const DATA_URL_PATTERN = /^data:(?:image\/(?:bmp|gif|jpeg|jpg|png|tiff|webp)|video\/(?:mpeg|mp4|ogg|webm)|audio\/(?:mp3|oga|ogg|opus));base64,[\d+/a-z]+=*$/i;
|
||||
const allowedAttribute = (attribute, allowedAttributeList) => {
|
||||
const attributeName = attribute.nodeName.toLowerCase();
|
||||
if (allowedAttributeList.includes(attributeName)) {
|
||||
if (uriAttributes.has(attributeName)) {
|
||||
return Boolean(SAFE_URL_PATTERN.test(attribute.nodeValue) || DATA_URL_PATTERN.test(attribute.nodeValue));
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
// Check if a regular expression validates the attribute.
|
||||
return allowedAttributeList.filter(attributeRegex => attributeRegex instanceof RegExp).some(regex => regex.test(attributeName));
|
||||
};
|
||||
|
||||
// js-docs-start allow-list
|
||||
const ARIA_ATTRIBUTE_PATTERN = /^aria-[\w-]*$/i;
|
||||
const DefaultAllowlist = {
|
||||
@@ -2963,6 +2951,28 @@ const DefaultAllowlist = {
|
||||
};
|
||||
// js-docs-end allow-list
|
||||
|
||||
const uriAttributes = new Set(['background', 'cite', 'href', 'itemtype', 'longdesc', 'poster', 'src', 'xlink:href']);
|
||||
|
||||
/**
|
||||
* A pattern that recognizes URLs that are safe wrt. XSS in URL navigation
|
||||
* contexts.
|
||||
*
|
||||
* Shout-out to Angular https://github.com/angular/angular/blob/15.2.8/packages/core/src/sanitization/url_sanitizer.ts#L38
|
||||
*/
|
||||
// eslint-disable-next-line unicorn/better-regex
|
||||
const SAFE_URL_PATTERN = /^(?!javascript:)(?:[a-z0-9+.-]+:|[^&:/?#]*(?:[/?#]|$))/i;
|
||||
const allowedAttribute = (attribute, allowedAttributeList) => {
|
||||
const attributeName = attribute.nodeName.toLowerCase();
|
||||
if (allowedAttributeList.includes(attributeName)) {
|
||||
if (uriAttributes.has(attributeName)) {
|
||||
return Boolean(SAFE_URL_PATTERN.test(attribute.nodeValue));
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
// Check if a regular expression validates the attribute.
|
||||
return allowedAttributeList.filter(attributeRegex => attributeRegex instanceof RegExp).some(regex => regex.test(attributeName));
|
||||
};
|
||||
function sanitizeHtml(unsafeHtml, allowList, sanitizeFunction) {
|
||||
if (!unsafeHtml.length) {
|
||||
return unsafeHtml;
|
||||
@@ -2997,6 +3007,7 @@ function sanitizeHtml(unsafeHtml, allowList, sanitizeFunction) {
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -3132,6 +3143,7 @@ class TemplateFactory extends Config {
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -3643,6 +3655,7 @@ defineJQueryPlugin(Tooltip);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -3723,6 +3736,7 @@ defineJQueryPlugin(Popover);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -3901,11 +3915,11 @@ class ScrollSpy extends BaseComponent {
|
||||
if (!anchor.hash || isDisabled(anchor)) {
|
||||
continue;
|
||||
}
|
||||
const observableSection = SelectorEngine.findOne(anchor.hash, this._element);
|
||||
const observableSection = SelectorEngine.findOne(decodeURI(anchor.hash), this._element);
|
||||
|
||||
// ensure that the observableSection exists & is visible
|
||||
if (isVisible(observableSection)) {
|
||||
this._targetLinks.set(anchor.hash, anchor);
|
||||
this._targetLinks.set(decodeURI(anchor.hash), anchor);
|
||||
this._observableSections.set(anchor.hash, observableSection);
|
||||
}
|
||||
}
|
||||
@@ -3982,6 +3996,7 @@ defineJQueryPlugin(ScrollSpy);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -4243,6 +4258,7 @@ defineJQueryPlugin(Tab);
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
|
||||
+1
-1
File diff suppressed because one or more lines are too long
+2
-2
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
+49
-32
@@ -1,5 +1,5 @@
|
||||
/*!
|
||||
* Bootstrap v5.3.0-alpha3 (https://getbootstrap.com/)
|
||||
* Bootstrap v5.3.0 (https://getbootstrap.com/)
|
||||
* Copyright 2011-2023 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
*/
|
||||
@@ -330,6 +330,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -608,6 +609,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Class definition
|
||||
*/
|
||||
@@ -660,11 +662,12 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
|
||||
const VERSION = '5.3.0-alpha2';
|
||||
const VERSION = '5.3.0';
|
||||
|
||||
/**
|
||||
* Class definition
|
||||
@@ -727,6 +730,7 @@
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const getSelector = element => {
|
||||
let selector = element.getAttribute('data-bs-target');
|
||||
if (!selector || selector === '#') {
|
||||
@@ -815,6 +819,7 @@
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const enableDismissTrigger = (component, method = 'hide') => {
|
||||
const clickEvent = `click.dismiss${component.EVENT_KEY}`;
|
||||
const name = component.NAME;
|
||||
@@ -840,6 +845,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -914,6 +920,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -977,6 +984,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -1096,6 +1104,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -1468,6 +1477,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -1701,6 +1711,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2068,6 +2079,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2192,6 +2204,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2290,6 +2303,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2387,6 +2401,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2691,6 +2706,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -2921,34 +2937,6 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const uriAttributes = new Set(['background', 'cite', 'href', 'itemtype', 'longdesc', 'poster', 'src', 'xlink:href']);
|
||||
|
||||
/**
|
||||
* A pattern that recognizes a commonly useful subset of URLs that are safe.
|
||||
*
|
||||
* Shout-out to Angular https://github.com/angular/angular/blob/12.2.x/packages/core/src/sanitization/url_sanitizer.ts
|
||||
*/
|
||||
const SAFE_URL_PATTERN = /^(?:(?:https?|mailto|ftp|tel|file|sms):|[^#&/:?]*(?:[#/?]|$))/i;
|
||||
|
||||
/**
|
||||
* A pattern that matches safe data URLs. Only matches image, video and audio types.
|
||||
*
|
||||
* Shout-out to Angular https://github.com/angular/angular/blob/12.2.x/packages/core/src/sanitization/url_sanitizer.ts
|
||||
*/
|
||||
const DATA_URL_PATTERN = /^data:(?:image\/(?:bmp|gif|jpeg|jpg|png|tiff|webp)|video\/(?:mpeg|mp4|ogg|webm)|audio\/(?:mp3|oga|ogg|opus));base64,[\d+/a-z]+=*$/i;
|
||||
const allowedAttribute = (attribute, allowedAttributeList) => {
|
||||
const attributeName = attribute.nodeName.toLowerCase();
|
||||
if (allowedAttributeList.includes(attributeName)) {
|
||||
if (uriAttributes.has(attributeName)) {
|
||||
return Boolean(SAFE_URL_PATTERN.test(attribute.nodeValue) || DATA_URL_PATTERN.test(attribute.nodeValue));
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
// Check if a regular expression validates the attribute.
|
||||
return allowedAttributeList.filter(attributeRegex => attributeRegex instanceof RegExp).some(regex => regex.test(attributeName));
|
||||
};
|
||||
|
||||
// js-docs-start allow-list
|
||||
const ARIA_ATTRIBUTE_PATTERN = /^aria-[\w-]*$/i;
|
||||
const DefaultAllowlist = {
|
||||
@@ -2986,6 +2974,28 @@
|
||||
};
|
||||
// js-docs-end allow-list
|
||||
|
||||
const uriAttributes = new Set(['background', 'cite', 'href', 'itemtype', 'longdesc', 'poster', 'src', 'xlink:href']);
|
||||
|
||||
/**
|
||||
* A pattern that recognizes URLs that are safe wrt. XSS in URL navigation
|
||||
* contexts.
|
||||
*
|
||||
* Shout-out to Angular https://github.com/angular/angular/blob/15.2.8/packages/core/src/sanitization/url_sanitizer.ts#L38
|
||||
*/
|
||||
// eslint-disable-next-line unicorn/better-regex
|
||||
const SAFE_URL_PATTERN = /^(?!javascript:)(?:[a-z0-9+.-]+:|[^&:/?#]*(?:[/?#]|$))/i;
|
||||
const allowedAttribute = (attribute, allowedAttributeList) => {
|
||||
const attributeName = attribute.nodeName.toLowerCase();
|
||||
if (allowedAttributeList.includes(attributeName)) {
|
||||
if (uriAttributes.has(attributeName)) {
|
||||
return Boolean(SAFE_URL_PATTERN.test(attribute.nodeValue));
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
// Check if a regular expression validates the attribute.
|
||||
return allowedAttributeList.filter(attributeRegex => attributeRegex instanceof RegExp).some(regex => regex.test(attributeName));
|
||||
};
|
||||
function sanitizeHtml(unsafeHtml, allowList, sanitizeFunction) {
|
||||
if (!unsafeHtml.length) {
|
||||
return unsafeHtml;
|
||||
@@ -3020,6 +3030,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -3155,6 +3166,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -3666,6 +3678,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -3746,6 +3759,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -3924,11 +3938,11 @@
|
||||
if (!anchor.hash || isDisabled(anchor)) {
|
||||
continue;
|
||||
}
|
||||
const observableSection = SelectorEngine.findOne(anchor.hash, this._element);
|
||||
const observableSection = SelectorEngine.findOne(decodeURI(anchor.hash), this._element);
|
||||
|
||||
// ensure that the observableSection exists & is visible
|
||||
if (isVisible(observableSection)) {
|
||||
this._targetLinks.set(anchor.hash, anchor);
|
||||
this._targetLinks.set(decodeURI(anchor.hash), anchor);
|
||||
this._observableSections.set(anchor.hash, observableSection);
|
||||
}
|
||||
}
|
||||
@@ -4005,6 +4019,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -4266,6 +4281,7 @@
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* Constants
|
||||
*/
|
||||
@@ -4448,6 +4464,7 @@
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||
* --------------------------------------------------------------------------
|
||||
*/
|
||||
|
||||
const index_umd = {
|
||||
Alert,
|
||||
Button,
|
||||
|
||||
+1
-1
File diff suppressed because one or more lines are too long
+2
-2
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
+577
@@ -0,0 +1,577 @@
|
||||
.clr-picker {
|
||||
display: none;
|
||||
flex-wrap: wrap;
|
||||
position: absolute;
|
||||
width: 200px;
|
||||
z-index: 1000;
|
||||
border-radius: 10px;
|
||||
background-color: #fff;
|
||||
justify-content: flex-end;
|
||||
direction: ltr;
|
||||
box-shadow: 0 0 5px rgba(0,0,0,.05), 0 5px 20px rgba(0,0,0,.1);
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.clr-picker.clr-open,
|
||||
.clr-picker[data-inline="true"] {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.clr-picker[data-inline="true"] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.clr-gradient {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 3px 3px 0 0;
|
||||
background-image: linear-gradient(rgba(0,0,0,0), #000), linear-gradient(90deg, #fff, currentColor);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.clr-marker {
|
||||
position: absolute;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
margin: -6px 0 0 -6px;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 50%;
|
||||
background-color: currentColor;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.clr-picker input[type="range"]::-webkit-slider-runnable-track {
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
.clr-picker input[type="range"]::-webkit-slider-thumb {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
.clr-picker input[type="range"]::-moz-range-track {
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.clr-picker input[type="range"]::-moz-range-thumb {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.clr-hue {
|
||||
background-image: linear-gradient(to right, #f00 0%, #ff0 16.66%, #0f0 33.33%, #0ff 50%, #00f 66.66%, #f0f 83.33%, #f00 100%);
|
||||
}
|
||||
|
||||
.clr-hue,
|
||||
.clr-alpha {
|
||||
position: relative;
|
||||
width: calc(100% - 40px);
|
||||
height: 8px;
|
||||
margin: 5px 20px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.clr-alpha span {
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
border-radius: inherit;
|
||||
background-image: linear-gradient(90deg, rgba(0,0,0,0), currentColor);
|
||||
}
|
||||
|
||||
.clr-hue input,
|
||||
.clr-alpha input {
|
||||
position: absolute;
|
||||
width: calc(100% + 16px);
|
||||
height: 16px;
|
||||
left: -8px;
|
||||
top: -4px;
|
||||
margin: 0;
|
||||
background-color: transparent;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
.clr-hue div,
|
||||
.clr-alpha div {
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
margin-left: -8px;
|
||||
transform: translateY(-50%);
|
||||
border: 2px solid #fff;
|
||||
border-radius: 50%;
|
||||
background-color: currentColor;
|
||||
box-shadow: 0 0 1px #888;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.clr-alpha div:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-radius: 50%;
|
||||
background-color: currentColor;
|
||||
}
|
||||
|
||||
.clr-format {
|
||||
display: none;
|
||||
order: 1;
|
||||
width: calc(100% - 40px);
|
||||
margin: 0 20px 20px;
|
||||
}
|
||||
|
||||
.clr-segmented {
|
||||
display: flex;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 15px;
|
||||
box-sizing: border-box;
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.clr-segmented input,
|
||||
.clr-segmented legend {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.clr-segmented label {
|
||||
flex-grow: 1;
|
||||
margin: 0;
|
||||
padding: 4px 0;
|
||||
font-size: inherit;
|
||||
font-weight: normal;
|
||||
line-height: initial;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.clr-segmented label:first-of-type {
|
||||
border-radius: 10px 0 0 10px;
|
||||
}
|
||||
|
||||
.clr-segmented label:last-of-type {
|
||||
border-radius: 0 10px 10px 0;
|
||||
}
|
||||
|
||||
.clr-segmented input:checked + label {
|
||||
color: #fff;
|
||||
background-color: #666;
|
||||
}
|
||||
|
||||
.clr-swatches {
|
||||
order: 2;
|
||||
width: calc(100% - 32px);
|
||||
margin: 0 16px;
|
||||
}
|
||||
|
||||
.clr-swatches div {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding-bottom: 12px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.clr-swatches button {
|
||||
position: relative;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 0 4px 6px 4px;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
color: inherit;
|
||||
text-indent: -1000px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.clr-swatches button:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-radius: inherit;
|
||||
background-color: currentColor;
|
||||
box-shadow: inset 0 0 0 1px rgba(0,0,0,.1);
|
||||
}
|
||||
|
||||
input.clr-color {
|
||||
order: 1;
|
||||
width: calc(100% - 80px);
|
||||
height: 32px;
|
||||
margin: 15px 20px 20px auto;
|
||||
padding: 0 10px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 16px;
|
||||
color: #444;
|
||||
background-color: #fff;
|
||||
font-family: sans-serif;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
input.clr-color:focus {
|
||||
outline: none;
|
||||
border: 1px solid #1e90ff;
|
||||
}
|
||||
|
||||
.clr-close,
|
||||
.clr-clear {
|
||||
display: none;
|
||||
order: 2;
|
||||
height: 24px;
|
||||
margin: 0 20px 20px;
|
||||
padding: 0 20px;
|
||||
border: 0;
|
||||
border-radius: 12px;
|
||||
color: #fff;
|
||||
background-color: #666;
|
||||
font-family: inherit;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.clr-close {
|
||||
display: block;
|
||||
margin: 0 20px 20px auto;
|
||||
}
|
||||
|
||||
.clr-preview {
|
||||
position: relative;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
margin: 15px 0 20px 20px;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.clr-preview:before,
|
||||
.clr-preview:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.clr-preview:after {
|
||||
border: 0;
|
||||
background-color: currentColor;
|
||||
box-shadow: inset 0 0 0 1px rgba(0,0,0,.1);
|
||||
}
|
||||
|
||||
.clr-preview button {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
outline-offset: -2px;
|
||||
background-color: transparent;
|
||||
text-indent: -9999px;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.clr-marker,
|
||||
.clr-hue div,
|
||||
.clr-alpha div,
|
||||
.clr-color {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.clr-field {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
.clr-field input {
|
||||
margin: 0;
|
||||
direction: ltr;
|
||||
}
|
||||
|
||||
.clr-field.clr-rtl input {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.clr-field button {
|
||||
position: absolute;
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
color: inherit;
|
||||
text-indent: -1000px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.clr-field.clr-rtl button {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.clr-field button:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-radius: inherit;
|
||||
background-color: currentColor;
|
||||
box-shadow: inset 0 0 1px rgba(0,0,0,.5);
|
||||
}
|
||||
|
||||
.clr-alpha,
|
||||
.clr-alpha div,
|
||||
.clr-swatches button,
|
||||
.clr-preview:before,
|
||||
.clr-field button {
|
||||
background-image: repeating-linear-gradient(45deg, #aaa 25%, transparent 25%, transparent 75%, #aaa 75%, #aaa), repeating-linear-gradient(45deg, #aaa 25%, #fff 25%, #fff 75%, #aaa 75%, #aaa);
|
||||
background-position: 0 0, 4px 4px;
|
||||
background-size: 8px 8px;
|
||||
}
|
||||
|
||||
.clr-marker:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.clr-keyboard-nav .clr-marker:focus,
|
||||
.clr-keyboard-nav .clr-hue input:focus + div,
|
||||
.clr-keyboard-nav .clr-alpha input:focus + div,
|
||||
.clr-keyboard-nav .clr-segmented input:focus + label {
|
||||
outline: none;
|
||||
box-shadow: 0 0 0 2px #1e90ff, 0 0 2px 2px #fff;
|
||||
}
|
||||
|
||||
.clr-picker[data-alpha="false"] .clr-alpha {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.clr-picker[data-minimal="true"] {
|
||||
padding-top: 16px;
|
||||
}
|
||||
|
||||
.clr-picker[data-minimal="true"] .clr-gradient,
|
||||
.clr-picker[data-minimal="true"] .clr-hue,
|
||||
.clr-picker[data-minimal="true"] .clr-alpha,
|
||||
.clr-picker[data-minimal="true"] .clr-color,
|
||||
.clr-picker[data-minimal="true"] .clr-preview {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/** Dark theme **/
|
||||
|
||||
.clr-dark {
|
||||
background-color: #444;
|
||||
}
|
||||
|
||||
.clr-dark .clr-segmented {
|
||||
border-color: #777;
|
||||
}
|
||||
|
||||
.clr-dark .clr-swatches button:after {
|
||||
box-shadow: inset 0 0 0 1px rgba(255,255,255,.3);
|
||||
}
|
||||
|
||||
.clr-dark input.clr-color {
|
||||
color: #fff;
|
||||
border-color: #777;
|
||||
background-color: #555;
|
||||
}
|
||||
|
||||
.clr-dark input.clr-color:focus {
|
||||
border-color: #1e90ff;
|
||||
}
|
||||
|
||||
.clr-dark .clr-preview:after {
|
||||
box-shadow: inset 0 0 0 1px rgba(255,255,255,.5);
|
||||
}
|
||||
|
||||
.clr-dark .clr-alpha,
|
||||
.clr-dark .clr-alpha div,
|
||||
.clr-dark .clr-swatches button,
|
||||
.clr-dark .clr-preview:before {
|
||||
background-image: repeating-linear-gradient(45deg, #666 25%, transparent 25%, transparent 75%, #888 75%, #888), repeating-linear-gradient(45deg, #888 25%, #444 25%, #444 75%, #888 75%, #888);
|
||||
}
|
||||
|
||||
/** Polaroid theme **/
|
||||
|
||||
.clr-picker.clr-polaroid {
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 0 5px rgba(0,0,0,.1), 0 5px 30px rgba(0,0,0,.2);
|
||||
}
|
||||
|
||||
.clr-picker.clr-polaroid:before {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 10px;
|
||||
left: 20px;
|
||||
top: -10px;
|
||||
border: solid transparent;
|
||||
border-width: 0 8px 10px 8px;
|
||||
border-bottom-color: currentColor;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
filter: drop-shadow(0 -4px 3px rgba(0,0,0,.1));
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.clr-picker.clr-polaroid.clr-dark:before {
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.clr-picker.clr-polaroid.clr-left:before {
|
||||
left: auto;
|
||||
right: 20px;
|
||||
}
|
||||
|
||||
.clr-picker.clr-polaroid.clr-top:before {
|
||||
top: auto;
|
||||
bottom: -10px;
|
||||
transform: rotateZ(180deg);
|
||||
}
|
||||
|
||||
.clr-polaroid .clr-gradient {
|
||||
width: calc(100% - 20px);
|
||||
height: 120px;
|
||||
margin: 10px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.clr-polaroid .clr-hue,
|
||||
.clr-polaroid .clr-alpha {
|
||||
width: calc(100% - 30px);
|
||||
height: 10px;
|
||||
margin: 6px 15px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.clr-polaroid .clr-hue div,
|
||||
.clr-polaroid .clr-alpha div {
|
||||
box-shadow: 0 0 5px rgba(0,0,0,.2);
|
||||
}
|
||||
|
||||
.clr-polaroid .clr-format {
|
||||
width: calc(100% - 20px);
|
||||
margin: 0 10px 15px;
|
||||
}
|
||||
|
||||
.clr-polaroid .clr-swatches {
|
||||
width: calc(100% - 12px);
|
||||
margin: 0 6px;
|
||||
}
|
||||
.clr-polaroid .clr-swatches div {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.clr-polaroid .clr-swatches button {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.clr-polaroid input.clr-color {
|
||||
width: calc(100% - 60px);
|
||||
margin: 10px 10px 15px auto;
|
||||
}
|
||||
|
||||
.clr-polaroid .clr-clear {
|
||||
margin: 0 10px 15px 10px;
|
||||
}
|
||||
|
||||
.clr-polaroid .clr-close {
|
||||
margin: 0 10px 15px auto;
|
||||
}
|
||||
|
||||
.clr-polaroid .clr-preview {
|
||||
margin: 10px 0 15px 10px;
|
||||
}
|
||||
|
||||
/** Large theme **/
|
||||
|
||||
.clr-picker.clr-large {
|
||||
width: 275px;
|
||||
}
|
||||
|
||||
.clr-large .clr-gradient {
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.clr-large .clr-swatches button {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
/** Pill (horizontal) theme **/
|
||||
|
||||
.clr-picker.clr-pill {
|
||||
width: 380px;
|
||||
padding-left: 180px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.clr-pill .clr-gradient {
|
||||
position: absolute;
|
||||
width: 180px;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
margin-bottom: 0;
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
.clr-pill .clr-hue {
|
||||
margin-top: 20px;
|
||||
}
|
||||
+475
@@ -0,0 +1,475 @@
|
||||
/**
|
||||
* Converts an input field to a color picker input.
|
||||
*/
|
||||
declare function Coloris(opts: Coloris.ColorisOptions): void;
|
||||
|
||||
declare global {
|
||||
interface GlobalEventHandlersEventMap {
|
||||
"coloris:pick": CustomEvent<Coloris.PickEventData>;
|
||||
}
|
||||
}
|
||||
|
||||
declare namespace Coloris {
|
||||
/**
|
||||
* All color themes supported by the color picker. More themes might be added
|
||||
* in the future.
|
||||
*/
|
||||
type Theme =
|
||||
| "default"
|
||||
| "large"
|
||||
| "polaroid"
|
||||
| "pill";
|
||||
|
||||
/**
|
||||
* All theme modes.
|
||||
*/
|
||||
type ThemeMode =
|
||||
| "light"
|
||||
| "dark"
|
||||
| "auto";
|
||||
|
||||
/**
|
||||
* Color format used by the color picker. The format affects which value is
|
||||
* shown in the input field.
|
||||
* - `hex` outputs `#RRGGBB` or `#RRGGBBAA`.
|
||||
* - `rgb` outputs `rgb(R, G, B)` or `rgba(R, G, B, A)`.
|
||||
* - `hsl` outputs `hsl(H, S, L)` or `hsla(H, S, L, A)`.
|
||||
* - `auto` guesses the format from the active input field. Defaults to `hex` if
|
||||
* it fails.
|
||||
* - `mixed` outputs `#RRGGBB` when alpha is 1; otherwise `rgba(R, G, B, A)`.
|
||||
*/
|
||||
type ColorFormat =
|
||||
| "hex"
|
||||
| "rgb"
|
||||
| "hsl"
|
||||
| "auto"
|
||||
| "mixed";
|
||||
|
||||
/**
|
||||
* A function that is called whenever a new color is picked.
|
||||
*
|
||||
* @param color The newly selected color, as a CSS color string.
|
||||
* @since 0.18.0
|
||||
*/
|
||||
type OnChangeCallback = (color: string) => void;
|
||||
|
||||
interface Accessibility {
|
||||
/**
|
||||
* @default "Open color picker"
|
||||
*/
|
||||
open: string;
|
||||
|
||||
/**
|
||||
* @default "Close color picker"
|
||||
*/
|
||||
close: string;
|
||||
|
||||
/**
|
||||
* @default "Clear the selected color"
|
||||
*/
|
||||
clear: string;
|
||||
|
||||
/**
|
||||
* @default "Saturation: {s}. Brightness: {v}."
|
||||
*/
|
||||
marker: string;
|
||||
|
||||
/**
|
||||
* @default "Hue slider"
|
||||
*/
|
||||
hueSlider: string;
|
||||
|
||||
/**
|
||||
* @default "Opacity slider"
|
||||
*/
|
||||
alphaSlider: string;
|
||||
|
||||
/**
|
||||
* @default "Color swatch"
|
||||
*/
|
||||
input: string;
|
||||
|
||||
/**
|
||||
* @default "Color format"
|
||||
*/
|
||||
format: string;
|
||||
|
||||
/**
|
||||
* @default "Color swatch"
|
||||
*/
|
||||
swatch: string;
|
||||
|
||||
/**
|
||||
* @default "Saturation and brightness selector. Use up, down, left and right arrow keys to select."
|
||||
*/
|
||||
instruction: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* Configuration for the optional clear button on the color picker.
|
||||
* @deprecated Use the `clearLabel` setting to specify the label.
|
||||
*/
|
||||
interface ClearButtonOptions {
|
||||
/**
|
||||
* Whether the clear button is displayed when the color picker is opened.
|
||||
*/
|
||||
show: boolean;
|
||||
|
||||
/**
|
||||
* The label text shown on the clear button.
|
||||
*/
|
||||
label: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* Configuration for the optional close button on the color picker.
|
||||
* @deprecated Use the `closeLabel` setting to specify the label.
|
||||
*/
|
||||
interface CloseButtonOptions {
|
||||
/**
|
||||
* Whether the close button is displayed when the color picker is opened.
|
||||
*/
|
||||
show: boolean;
|
||||
|
||||
/**
|
||||
* The label text shown on the close button.
|
||||
*/
|
||||
label: string;
|
||||
}
|
||||
|
||||
interface PickEventData {
|
||||
/**
|
||||
* The newly selected color which was picked.
|
||||
*/
|
||||
color: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* Settings that can be configured for each color picker instance separately.
|
||||
* @since 0.15.0
|
||||
*/
|
||||
interface ColorisVirtualInstanceOptions {
|
||||
/**
|
||||
* CSS selector for the parent.
|
||||
*
|
||||
* The default behavior is to append the color picker's dialog to the end of the document's
|
||||
* body. but it is possible to append it to a custom parent instead. This is especially useful
|
||||
* if the color fields are in a scrollable container and you want color picker' dialog to stay
|
||||
* anchored to them. You will need to set the position of the container to relative or absolute.
|
||||
* Note: This should be a scrollable container with enough space to display the picker.
|
||||
*
|
||||
* @default null
|
||||
*/
|
||||
parent?: null | string;
|
||||
|
||||
/**
|
||||
* The color theme to use for the color picker. More themes might be added
|
||||
* in the future. Available themes: default, large, polaroid.
|
||||
*
|
||||
* @default "default"
|
||||
*/
|
||||
theme?: Theme;
|
||||
|
||||
/**
|
||||
* Set the theme to light or dark mode:
|
||||
* - light: light mode.
|
||||
* - dark: dark mode.
|
||||
* - auto: automatically enables dark mode when the user prefers a dark color scheme.
|
||||
*
|
||||
* @default "light"
|
||||
*/
|
||||
themeMode?: ThemeMode,
|
||||
|
||||
/**
|
||||
* The margin in pixels between the input fields and the color picker's
|
||||
* dialog.
|
||||
*
|
||||
* @default 2
|
||||
*/
|
||||
margin?: number;
|
||||
|
||||
/**
|
||||
* Sets the preferred color string format. The format affects which value is
|
||||
* shown in the input field. See {@link ColorFormat} for more details.
|
||||
*
|
||||
* @default "hex"
|
||||
*/
|
||||
format?: ColorFormat;
|
||||
|
||||
/**
|
||||
* Set to true to enable format toggle buttons in the color picker dialog.
|
||||
*
|
||||
* This will also force the format to auto.
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
formatToggle?: boolean;
|
||||
|
||||
/**
|
||||
* Focus the color value input when the color picker dialog is opened.
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
focusInput?: boolean;
|
||||
|
||||
/**
|
||||
* Select and focus the color value input when the color picker dialog is opened.
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
selectInput?: boolean;
|
||||
|
||||
/**
|
||||
* Set to true to hide all the color picker widgets (spectrum, hue, ...) except the swatches.
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
swatchesOnly?: boolean;
|
||||
|
||||
/**
|
||||
* Enable or disable alpha support.
|
||||
*
|
||||
* When disabled, it will strip the alpha value from the existing color
|
||||
* value in all formats.
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
alpha?: boolean;
|
||||
|
||||
/**
|
||||
* Set to true to always include the alpha value in the color value even if the opacity is 100%.
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
forceAlpha?: boolean,
|
||||
|
||||
/**
|
||||
* Whether to show an optional clear button. Use `clearLabel` to set the label.
|
||||
*
|
||||
* Note that this should be a boolean, a `ClearButtonOptions` object is still
|
||||
* supported for backwards compatibility, but it is deprecated.
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
clearButton?: boolean | ClearButtonOptions;
|
||||
|
||||
/**
|
||||
* Set the label of the clear button.
|
||||
* @default Clear
|
||||
* @since 0.17.0
|
||||
*/
|
||||
clearLabel?: string,
|
||||
|
||||
/**
|
||||
* Whether to show an optional close button. Use `closeLabel` to set the label.
|
||||
*
|
||||
* Note that this should be a boolean, a `CloseButtonOptions` object is still
|
||||
* supported for backwards compatibility, but it is deprecated.
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
closeButton?: boolean | CloseButtonOptions;
|
||||
|
||||
/**
|
||||
* Set the label of the close button.
|
||||
*
|
||||
* @default Close
|
||||
* @since 0.17.0
|
||||
*/
|
||||
closeLabel?: string;
|
||||
|
||||
/**
|
||||
* An array of the desired color swatches to display. If omitted or the
|
||||
* array is empty, the color swatches will be disabled.
|
||||
*
|
||||
* @default []
|
||||
*/
|
||||
swatches?: string[];
|
||||
|
||||
/**
|
||||
* A function that is called whenever a new color is picked.
|
||||
* @since 0.18.0
|
||||
*/
|
||||
onChange?: OnChangeCallback;
|
||||
}
|
||||
|
||||
interface ColorisOptions extends ColorisVirtualInstanceOptions {
|
||||
/**
|
||||
* Accessibility messages for various aria attribute etc.
|
||||
*/
|
||||
a11y?: Accessibility;
|
||||
|
||||
/**
|
||||
* In inline mode, this is the default color that is set when the picker is initialized.
|
||||
*/
|
||||
defaultColor?: string;
|
||||
|
||||
/**
|
||||
* A custom CSS selector to bind the color picker to. This must point to
|
||||
* one or more {@link HTMLInputElement}s.
|
||||
*/
|
||||
el: string;
|
||||
|
||||
/**
|
||||
* Set to `true` to use the color picker as an inline widget. In this mode the color picker is
|
||||
* always visible and positioned statically within its container, which is by default the body
|
||||
* of the document. Use the "parent" option to set a custom container.
|
||||
*
|
||||
* Note: In this mode, the best way to get the picked color is by listening to the `coloris:pick`
|
||||
* event and reading the value from the event detail (see the example below). The other way is
|
||||
* to read the value of the input field with the ID `clr-color-value`.
|
||||
*
|
||||
* @example
|
||||
* ```js
|
||||
* document.addEventListener("coloris:pick", event => {
|
||||
* console.log("New color", event.detail.color);
|
||||
* });
|
||||
* ```
|
||||
*/
|
||||
inline?: boolean;
|
||||
|
||||
/**
|
||||
* Set to true to activate basic right-to-left support.
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
rtl?: boolean;
|
||||
|
||||
/**
|
||||
* The bound input fields are wrapped in a div that adds a thumbnail
|
||||
* showing the current color and a button to open the color picker (for
|
||||
* accessibility only).
|
||||
*
|
||||
* If you wish to keep your fields unaltered, set this to `false`, in which
|
||||
* case you will lose the color thumbnail and the accessible button (not
|
||||
* recommended).
|
||||
*
|
||||
* @default true
|
||||
*/
|
||||
wrap?: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* The color picker dialog can be closed by clicking anywhere on the
|
||||
* page or by pressing the ESC on the keyboard. The later will also
|
||||
* revert the color to its original value.
|
||||
*
|
||||
* If you would like to close the dialog programmatically, you can do so
|
||||
* by calling this method.
|
||||
*
|
||||
* @param {boolean} revert When `true`, resets the color to its original
|
||||
* value. Defaults to `false`.
|
||||
*/
|
||||
function close(revert?: boolean): void;
|
||||
|
||||
/**
|
||||
* Update the color picker's position and the color gradient's offset.
|
||||
*/
|
||||
function updatePosition(): void;
|
||||
|
||||
/**
|
||||
* Converts an input field to a color picker input.
|
||||
*/
|
||||
function coloris(opts: ColorisOptions): void;
|
||||
|
||||
/**
|
||||
* Adds a virtual instance with separate options.
|
||||
*
|
||||
* Although there is only one physical instance of the color picker in the document, it is possible
|
||||
* to simulate multiple instances, each with its own appearance and behavior, by updating the
|
||||
* configuration at runtime, when the color picker is opened.
|
||||
*
|
||||
* Here is an example of how to do it by manually setting configuration options in response to click events:
|
||||
*
|
||||
* ```js
|
||||
* // Regular color fields use the default light theme
|
||||
* document.querySelectorAll('.color-fields').forEach(input => {
|
||||
* input.addEventListener('click', e => {
|
||||
* Coloris({
|
||||
* theme: 'default',
|
||||
* themeMode: 'light',
|
||||
* });
|
||||
* });
|
||||
* });
|
||||
*
|
||||
* // But the special color fields use the polaroid dark theme
|
||||
* document.querySelectorAll('.special-color-fields').forEach(input => {
|
||||
* input.addEventListener('click', e => {
|
||||
* Coloris({
|
||||
* theme: 'polaroid',
|
||||
* themeMode: 'dark',
|
||||
* });
|
||||
* });
|
||||
* });
|
||||
* ```
|
||||
*
|
||||
* This works well and is quite versatile, but it can get a little hard to keep track of each
|
||||
* change every "instance" makes and revert them to the default values.
|
||||
*
|
||||
* So as of version 0.15.0, there is a new way to automatically manage virtual instances. This works
|
||||
* by assigning configuration overrides to a CSS selector representing one or more color fields.
|
||||
*
|
||||
* @example
|
||||
* ```js
|
||||
* // Color fields that have the class "instance1" have a format toggle,
|
||||
* // no alpha slider, a dark theme and custom swatches
|
||||
* Coloris.setInstance('.instance1', {
|
||||
* theme: 'polaroid',
|
||||
* themeMode: 'dark',
|
||||
* alpha: false,
|
||||
* formatToggle: true,
|
||||
* swatches: [
|
||||
* '#264653',
|
||||
* '#2a9d8f',
|
||||
* '#e9c46a'
|
||||
* ]
|
||||
* });
|
||||
*
|
||||
* // Fields matching the class "instance2" show color swatches only
|
||||
* Coloris.setInstance('.instance2', {
|
||||
* swatchesOnly: true,
|
||||
* swatches: [
|
||||
* '#264653',
|
||||
* '#2a9d8f',
|
||||
* '#e9c46a'
|
||||
* ]
|
||||
* });
|
||||
* ```
|
||||
* @param selector CSS selector for the input fields to which the options should apply.
|
||||
* @param opts Options to apply to all color picker input fields matching the given selector.
|
||||
* @since 0.15.0
|
||||
*/
|
||||
function setInstance(selector: string, opts: Partial<ColorisVirtualInstanceOptions>): void;
|
||||
|
||||
/**
|
||||
* Removes a virtual instance that was added by {@link setInstance}. Note that
|
||||
* to remove an instance, the selector must be exactly equal to what was passed
|
||||
* to `setInstance`, it cannot merely be a different selector that happens to
|
||||
* match the same elements.
|
||||
* @param selector CSS selector to remove from the set of virtual instances.
|
||||
*/
|
||||
function removeInstance(selector: string): void;
|
||||
|
||||
/**
|
||||
* Initializes the Coloris color picker and binds the color picker to all
|
||||
* input fields with the `data-coloris` attribute.
|
||||
*
|
||||
* When the script file is loaded directly in a browser, this method is
|
||||
* called automatically. When called in a module environment (e.g.
|
||||
* browserify, rollup, or webpack), you need to call this method once before
|
||||
* any other calls to any {@link Coloris} methods. This method checks for
|
||||
* when the document is ready, so you do not have to call this method inside
|
||||
* some document ready block.
|
||||
*/
|
||||
function init(): void;
|
||||
}
|
||||
|
||||
export as namespace Coloris;
|
||||
|
||||
/**
|
||||
* The main entry point or namespace for Coloris. This object is callable and
|
||||
* can be used to initialize Coloris. It also contains several utility
|
||||
* methods.
|
||||
*/
|
||||
export = Coloris;
|
||||
|
||||
File diff suppressed because one or more lines are too long
+1266
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"type": "module"
|
||||
}
|
||||
+1288
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"type": "commonjs"
|
||||
}
|
||||
Reference in New Issue
Block a user