@shohojdhara/atomix 0.4.0 → 0.4.1
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/dist/atomix.css +9231 -9337
- package/dist/atomix.css.map +1 -1
- package/dist/atomix.min.css +2 -2
- package/dist/atomix.min.css.map +1 -1
- package/dist/charts.js +4 -5
- package/dist/charts.js.map +1 -1
- package/dist/core.d.ts +87 -10
- package/dist/core.js +673 -480
- package/dist/core.js.map +1 -1
- package/dist/forms.d.ts +15 -3
- package/dist/forms.js +530 -97
- package/dist/forms.js.map +1 -1
- package/dist/heavy.js +5 -6
- package/dist/heavy.js.map +1 -1
- package/dist/index.d.ts +495 -254
- package/dist/index.esm.js +1269 -723
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +1273 -723
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +2 -2
- package/scripts/atomix-cli.js +10 -1
- package/scripts/cli/__tests__/utils.test.js +6 -2
- package/scripts/cli/migration-tools.js +2 -2
- package/scripts/cli/theme-bridge.js +7 -9
- package/scripts/cli/utils.js +2 -1
- package/src/components/Accordion/Accordion.stories.tsx +40 -0
- package/src/components/Accordion/Accordion.tsx +174 -56
- package/src/components/Accordion/AccordionCompound.test.tsx +70 -0
- package/src/components/Breadcrumb/Breadcrumb.tsx +156 -50
- package/src/components/Breadcrumb/BreadcrumbCompound.test.tsx +84 -0
- package/src/components/Callout/Callout.stories.tsx +166 -1011
- package/src/components/Callout/Callout.tsx +196 -84
- package/src/components/Callout/CalloutCompound.test.tsx +72 -0
- package/src/components/Dropdown/Dropdown.tsx +133 -20
- package/src/components/Dropdown/DropdownCompound.test.tsx +64 -0
- package/src/components/EdgePanel/EdgePanel.tsx +164 -112
- package/src/components/EdgePanel/EdgePanelCompound.test.tsx +53 -0
- package/src/components/Form/Select.stories.tsx +23 -0
- package/src/components/Form/Select.test.tsx +99 -0
- package/src/components/Form/Select.tsx +144 -93
- package/src/components/Form/SelectOption.tsx +88 -0
- package/src/components/Hero/Hero.stories.tsx +37 -0
- package/src/components/Hero/Hero.test.tsx +142 -0
- package/src/components/Hero/Hero.tsx +142 -3
- package/src/components/List/List.test.tsx +62 -0
- package/src/components/List/List.tsx +16 -5
- package/src/components/List/ListItem.tsx +20 -0
- package/src/components/Modal/Modal.stories.tsx +65 -1
- package/src/components/Modal/Modal.tsx +115 -35
- package/src/components/Modal/ModalCompound.test.tsx +94 -0
- package/src/components/Steps/Steps.tsx +124 -21
- package/src/components/Steps/StepsCompound.test.tsx +81 -0
- package/src/components/Tabs/Tabs.tsx +197 -44
- package/src/components/Tabs/TabsCompound.test.tsx +64 -0
- package/src/lib/composables/index.ts +0 -4
- package/src/lib/composables/useAtomixGlass.ts +0 -15
- package/src/lib/theme/devtools/CLI.ts +2 -10
- package/src/lib/types/components.ts +8 -2
- package/src/lib/utils/__tests__/componentUtils.test.ts +57 -2
- package/src/lib/utils/__tests__/themeNaming.test.ts +117 -0
- package/src/lib/utils/themeNaming.ts +1 -1
- package/src/styles/02-tools/_tools.breakpoints.scss +1 -1
- package/src/styles/02-tools/_tools.utility-api.scss +6 -6
- package/src/styles/99-utilities/_utilities.text.scss +0 -1
package/dist/forms.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
2
2
|
|
|
3
|
-
import React, { memo, forwardRef, useMemo, useState, useRef, useEffect, useCallback, useImperativeHandle } from "react";
|
|
3
|
+
import React, { memo, forwardRef, useMemo, useState, useRef, useEffect, useCallback, useImperativeHandle, useContext, createContext } from "react";
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* Default theme colors for components
|
|
@@ -809,7 +809,7 @@ class {
|
|
|
809
809
|
* Composable hook for AtomixGlass component logic
|
|
810
810
|
* Manages all state, calculations, and event handlers
|
|
811
811
|
*/
|
|
812
|
-
function useAtomixGlass({glassRef: glassRef, contentRef: contentRef, cornerRadius: cornerRadius, globalMousePosition: externalGlobalMousePosition, mouseOffset: externalMouseOffset, mouseContainer: mouseContainer, overLight: overLight = ATOMIX_GLASS.DEFAULTS.OVER_LIGHT, reducedMotion: reducedMotion = !1, highContrast: highContrast = !1, disableEffects: disableEffects = !1, elasticity: elasticity = .05, onClick: onClick, debugCornerRadius: debugCornerRadius = !1, debugOverLight: debugOverLight = !1,
|
|
812
|
+
function useAtomixGlass({glassRef: glassRef, contentRef: contentRef, cornerRadius: cornerRadius, globalMousePosition: externalGlobalMousePosition, mouseOffset: externalMouseOffset, mouseContainer: mouseContainer, overLight: overLight = ATOMIX_GLASS.DEFAULTS.OVER_LIGHT, reducedMotion: reducedMotion = !1, highContrast: highContrast = !1, disableEffects: disableEffects = !1, elasticity: elasticity = .05, onClick: onClick, debugCornerRadius: debugCornerRadius = !1, debugOverLight: debugOverLight = !1, children: children}) {
|
|
813
813
|
// State
|
|
814
814
|
const [isHovered, setIsHovered] = useState(!1), [isActive, setIsActive] = useState(!1), [glassSize, setGlassSize] = useState({
|
|
815
815
|
width: 270,
|
|
@@ -1010,9 +1010,8 @@ function useAtomixGlass({glassRef: glassRef, contentRef: contentRef, cornerRadiu
|
|
|
1010
1010
|
if (effectiveDisableEffects) return;
|
|
1011
1011
|
const container = mouseContainer?.current || glassRef.current;
|
|
1012
1012
|
if (!container) return;
|
|
1013
|
-
enablePerformanceMonitoring && performance.now();
|
|
1014
1013
|
// Use cached rect if available, otherwise get new one
|
|
1015
|
-
|
|
1014
|
+
let rect = cachedRectRef.current;
|
|
1016
1015
|
if (rect && 0 !== rect.width && 0 !== rect.height || (rect = container.getBoundingClientRect(),
|
|
1017
1016
|
cachedRectRef.current = rect), 0 === rect.width || 0 === rect.height) return;
|
|
1018
1017
|
const center = calculateElementCenter(rect), newOffset = {
|
|
@@ -1021,8 +1020,8 @@ function useAtomixGlass({glassRef: glassRef, contentRef: contentRef, cornerRadiu
|
|
|
1021
1020
|
};
|
|
1022
1021
|
// Calculate offset relative to this container
|
|
1023
1022
|
// React 18 automatically batches these updates
|
|
1024
|
-
setInternalMouseOffset(newOffset), setInternalGlobalMousePosition(globalPos)
|
|
1025
|
-
}), [ mouseContainer, glassRef, externalGlobalMousePosition, externalMouseOffset, effectiveDisableEffects
|
|
1023
|
+
setInternalMouseOffset(newOffset), setInternalGlobalMousePosition(globalPos);
|
|
1024
|
+
}), [ mouseContainer, glassRef, externalGlobalMousePosition, externalMouseOffset, effectiveDisableEffects ]);
|
|
1026
1025
|
// Subscribe to shared mouse tracker
|
|
1027
1026
|
useEffect((() => {
|
|
1028
1027
|
if (externalGlobalMousePosition && externalMouseOffset)
|
|
@@ -1843,10 +1842,427 @@ const Radio = memo((({label: label, checked: checked = !1, onChange: onChange,
|
|
|
1843
1842
|
|
|
1844
1843
|
Radio.displayName = "Radio";
|
|
1845
1844
|
|
|
1845
|
+
var commonjsGlobal = "undefined" != typeof globalThis ? globalThis : "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof self ? self : {};
|
|
1846
|
+
|
|
1847
|
+
function getDefaultExportFromCjs(x) {
|
|
1848
|
+
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x.default : x;
|
|
1849
|
+
}
|
|
1850
|
+
|
|
1851
|
+
var fails$8 = function(exec) {
|
|
1852
|
+
try {
|
|
1853
|
+
return !!exec();
|
|
1854
|
+
} catch (error) {
|
|
1855
|
+
return !0;
|
|
1856
|
+
}
|
|
1857
|
+
}, functionBindNative = !fails$8((function() {
|
|
1858
|
+
// eslint-disable-next-line es/no-function-prototype-bind -- safe
|
|
1859
|
+
var test = function() {/* empty */}.bind();
|
|
1860
|
+
// eslint-disable-next-line no-prototype-builtins -- safe
|
|
1861
|
+
return "function" != typeof test || test.hasOwnProperty("prototype");
|
|
1862
|
+
})), NATIVE_BIND$3 = functionBindNative, FunctionPrototype$1 = Function.prototype, call$5 = FunctionPrototype$1.call, uncurryThisWithBind = NATIVE_BIND$3 && FunctionPrototype$1.bind.bind(call$5, call$5), functionUncurryThis = NATIVE_BIND$3 ? uncurryThisWithBind : function(fn) {
|
|
1863
|
+
return function() {
|
|
1864
|
+
return call$5.apply(fn, arguments);
|
|
1865
|
+
};
|
|
1866
|
+
}, objectIsPrototypeOf = functionUncurryThis({}.isPrototypeOf), check = function(it) {
|
|
1867
|
+
return it && it.Math === Math && it;
|
|
1868
|
+
}, globalThis_1 =
|
|
1869
|
+
// eslint-disable-next-line es/no-global-this -- safe
|
|
1870
|
+
check("object" == typeof globalThis && globalThis) || check("object" == typeof window && window) ||
|
|
1871
|
+
// eslint-disable-next-line no-restricted-globals -- safe
|
|
1872
|
+
check("object" == typeof self && self) || check("object" == typeof commonjsGlobal && commonjsGlobal) || check("object" == typeof commonjsGlobal && commonjsGlobal) ||
|
|
1873
|
+
// eslint-disable-next-line no-new-func -- fallback
|
|
1874
|
+
function() {
|
|
1875
|
+
return this;
|
|
1876
|
+
}() || Function("return this")(), NATIVE_BIND$2 = functionBindNative, FunctionPrototype = Function.prototype, apply$1 = FunctionPrototype.apply, call$4 = FunctionPrototype.call, functionApply = "object" == typeof Reflect && Reflect.apply || (NATIVE_BIND$2 ? call$4.bind(apply$1) : function() {
|
|
1877
|
+
return call$4.apply(apply$1, arguments);
|
|
1878
|
+
}), uncurryThis$7 = functionUncurryThis, toString$3 = uncurryThis$7({}.toString), stringSlice = uncurryThis$7("".slice), classofRaw$2 = function(it) {
|
|
1879
|
+
return stringSlice(toString$3(it), 8, -1);
|
|
1880
|
+
}, classofRaw$1 = classofRaw$2, uncurryThis$6 = functionUncurryThis, functionUncurryThisClause = function(fn) {
|
|
1881
|
+
// Nashorn bug:
|
|
1882
|
+
// https://github.com/zloirock/core-js/issues/1128
|
|
1883
|
+
// https://github.com/zloirock/core-js/issues/1130
|
|
1884
|
+
if ("Function" === classofRaw$1(fn)) return uncurryThis$6(fn);
|
|
1885
|
+
}, documentAll = "object" == typeof document && document.all, isCallable$8 = void 0 === documentAll && void 0 !== documentAll ? function(argument) {
|
|
1886
|
+
return "function" == typeof argument || argument === documentAll;
|
|
1887
|
+
} : function(argument) {
|
|
1888
|
+
return "function" == typeof argument;
|
|
1889
|
+
}, objectGetOwnPropertyDescriptor = {}, descriptors = !fails$8((function() {
|
|
1890
|
+
// eslint-disable-next-line es/no-object-defineproperty -- required for testing
|
|
1891
|
+
return 7 !== Object.defineProperty({}, 1, {
|
|
1892
|
+
get: function() {
|
|
1893
|
+
return 7;
|
|
1894
|
+
}
|
|
1895
|
+
})[1];
|
|
1896
|
+
})), NATIVE_BIND$1 = functionBindNative, call$3 = Function.prototype.call, functionCall = NATIVE_BIND$1 ? call$3.bind(call$3) : function() {
|
|
1897
|
+
return call$3.apply(call$3, arguments);
|
|
1898
|
+
}, objectPropertyIsEnumerable = {}, $propertyIsEnumerable = {}.propertyIsEnumerable, getOwnPropertyDescriptor$1 = Object.getOwnPropertyDescriptor, NASHORN_BUG = getOwnPropertyDescriptor$1 && !$propertyIsEnumerable.call({
|
|
1899
|
+
1: 2
|
|
1900
|
+
}, 1);
|
|
1901
|
+
|
|
1902
|
+
// `Object.prototype.propertyIsEnumerable` method implementation
|
|
1903
|
+
// https://tc39.es/ecma262/#sec-object.prototype.propertyisenumerable
|
|
1904
|
+
objectPropertyIsEnumerable.f = NASHORN_BUG ? function(V) {
|
|
1905
|
+
var descriptor = getOwnPropertyDescriptor$1(this, V);
|
|
1906
|
+
return !!descriptor && descriptor.enumerable;
|
|
1907
|
+
} : $propertyIsEnumerable;
|
|
1908
|
+
|
|
1909
|
+
var match, version, createPropertyDescriptor$2 = function(bitmap, value) {
|
|
1910
|
+
return {
|
|
1911
|
+
enumerable: !(1 & bitmap),
|
|
1912
|
+
configurable: !(2 & bitmap),
|
|
1913
|
+
writable: !(4 & bitmap),
|
|
1914
|
+
value: value
|
|
1915
|
+
};
|
|
1916
|
+
}, fails$5 = fails$8, classof$3 = classofRaw$2, $Object$3 = Object, split = functionUncurryThis("".split), indexedObject = fails$5((function() {
|
|
1917
|
+
// throws an error in rhino, see https://github.com/mozilla/rhino/issues/346
|
|
1918
|
+
// eslint-disable-next-line no-prototype-builtins -- safe
|
|
1919
|
+
return !$Object$3("z").propertyIsEnumerable(0);
|
|
1920
|
+
})) ? function(it) {
|
|
1921
|
+
return "String" === classof$3(it) ? split(it, "") : $Object$3(it);
|
|
1922
|
+
} : $Object$3, isNullOrUndefined$2 = function(it) {
|
|
1923
|
+
return null == it;
|
|
1924
|
+
}, isNullOrUndefined$1 = isNullOrUndefined$2, $TypeError$6 = TypeError, requireObjectCoercible$3 = function(it) {
|
|
1925
|
+
if (isNullOrUndefined$1(it)) throw new $TypeError$6("Can't call method on " + it);
|
|
1926
|
+
return it;
|
|
1927
|
+
}, IndexedObject = indexedObject, requireObjectCoercible$2 = requireObjectCoercible$3, toIndexedObject$2 = function(it) {
|
|
1928
|
+
return IndexedObject(requireObjectCoercible$2(it));
|
|
1929
|
+
}, isCallable$7 = isCallable$8, isObject$5 = function(it) {
|
|
1930
|
+
return "object" == typeof it ? null !== it : isCallable$7(it);
|
|
1931
|
+
}, path$3 = {}, path$2 = path$3, globalThis$a = globalThis_1, isCallable$6 = isCallable$8, aFunction = function(variable) {
|
|
1932
|
+
return isCallable$6(variable) ? variable : void 0;
|
|
1933
|
+
}, navigator = globalThis_1.navigator, userAgent$1 = navigator && navigator.userAgent, globalThis$8 = globalThis_1, userAgent = userAgent$1 ? String(userAgent$1) : "", process$1 = globalThis$8.process, Deno = globalThis$8.Deno, versions = process$1 && process$1.versions || Deno && Deno.version, v8 = versions && versions.v8;
|
|
1934
|
+
|
|
1935
|
+
v8 && (
|
|
1936
|
+
// in old Chrome, versions of V8 isn't V8 = Chrome / 10
|
|
1937
|
+
// but their correct versions are not interesting for us
|
|
1938
|
+
version = (match = v8.split("."))[0] > 0 && match[0] < 4 ? 1 : +(match[0] + match[1])),
|
|
1939
|
+
// BrowserFS NodeJS `process` polyfill incorrectly set `.v8` to `0.0`
|
|
1940
|
+
// so check `userAgent` even if `.v8` exists, but 0
|
|
1941
|
+
!version && userAgent && (!(match = userAgent.match(/Edge\/(\d+)/)) || match[1] >= 74) && (match = userAgent.match(/Chrome\/(\d+)/)) && (version = +match[1]);
|
|
1942
|
+
|
|
1943
|
+
var V8_VERSION = version, fails$4 = fails$8, $String$3 = globalThis_1.String, symbolConstructorDetection = !!Object.getOwnPropertySymbols && !fails$4((function() {
|
|
1944
|
+
var symbol = Symbol("symbol detection");
|
|
1945
|
+
// Chrome 38 Symbol has incorrect toString conversion
|
|
1946
|
+
// `get-own-property-symbols` polyfill symbols converted to object are not Symbol instances
|
|
1947
|
+
// nb: Do not call `String` directly to avoid this being optimized out to `symbol+''` which will,
|
|
1948
|
+
// of course, fail.
|
|
1949
|
+
return !$String$3(symbol) || !(Object(symbol) instanceof Symbol) ||
|
|
1950
|
+
// Chrome 38-40 symbols are not inherited from DOM collections prototypes to instances
|
|
1951
|
+
!Symbol.sham && V8_VERSION && V8_VERSION < 41;
|
|
1952
|
+
})), useSymbolAsUid = symbolConstructorDetection && !Symbol.sham && "symbol" == typeof Symbol.iterator, isCallable$5 = isCallable$8, isPrototypeOf$1 = objectIsPrototypeOf, $Object$2 = Object, isSymbol$2 = useSymbolAsUid ? function(it) {
|
|
1953
|
+
return "symbol" == typeof it;
|
|
1954
|
+
} : function(it) {
|
|
1955
|
+
var $Symbol = function(namespace, method) {
|
|
1956
|
+
return arguments.length < 2 ? aFunction(path$2[namespace]) || aFunction(globalThis$a[namespace]) : path$2[namespace] && path$2[namespace][method] || globalThis$a[namespace] && globalThis$a[namespace][method];
|
|
1957
|
+
}("Symbol");
|
|
1958
|
+
return isCallable$5($Symbol) && isPrototypeOf$1($Symbol.prototype, $Object$2(it));
|
|
1959
|
+
}, $String$2 = String, isCallable$4 = isCallable$8, $TypeError$5 = TypeError, aCallable$2 = function(argument) {
|
|
1960
|
+
if (isCallable$4(argument)) return argument;
|
|
1961
|
+
throw new $TypeError$5(function(argument) {
|
|
1962
|
+
try {
|
|
1963
|
+
return $String$2(argument);
|
|
1964
|
+
} catch (error) {
|
|
1965
|
+
return "Object";
|
|
1966
|
+
}
|
|
1967
|
+
}(argument) + " is not a function");
|
|
1968
|
+
}, aCallable$1 = aCallable$2, isNullOrUndefined = isNullOrUndefined$2, call$2 = functionCall, isCallable$3 = isCallable$8, isObject$4 = isObject$5, $TypeError$4 = TypeError, sharedStore = {
|
|
1969
|
+
exports: {}
|
|
1970
|
+
}, globalThis$6 = globalThis_1, defineProperty = Object.defineProperty, globalThis$5 = globalThis_1, store$1 = sharedStore.exports = globalThis$5["__core-js_shared__"] || function(key, value) {
|
|
1971
|
+
try {
|
|
1972
|
+
defineProperty(globalThis$6, key, {
|
|
1973
|
+
value: value,
|
|
1974
|
+
configurable: !0,
|
|
1975
|
+
writable: !0
|
|
1976
|
+
});
|
|
1977
|
+
} catch (error) {
|
|
1978
|
+
globalThis$6[key] = value;
|
|
1979
|
+
}
|
|
1980
|
+
return value;
|
|
1981
|
+
}("__core-js_shared__", {});
|
|
1982
|
+
|
|
1983
|
+
/* eslint-disable es/no-symbol -- required for testing */ (store$1.versions || (store$1.versions = [])).push({
|
|
1984
|
+
version: "3.43.0",
|
|
1985
|
+
mode: "pure",
|
|
1986
|
+
copyright: "© 2014-2025 Denis Pushkarev (zloirock.ru)",
|
|
1987
|
+
license: "https://github.com/zloirock/core-js/blob/v3.43.0/LICENSE",
|
|
1988
|
+
source: "https://github.com/zloirock/core-js"
|
|
1989
|
+
});
|
|
1990
|
+
|
|
1991
|
+
var key, value, store = sharedStore.exports, requireObjectCoercible$1 = requireObjectCoercible$3, $Object$1 = Object, hasOwnProperty = functionUncurryThis({}.hasOwnProperty), hasOwnProperty_1 = Object.hasOwn || function(it, key) {
|
|
1992
|
+
return hasOwnProperty($Object$1(requireObjectCoercible$1(it)), key);
|
|
1993
|
+
}, uncurryThis$3 = functionUncurryThis, id = 0, postfix = Math.random(), toString$2 = uncurryThis$3(1.1.toString), hasOwn$2 = hasOwnProperty_1, NATIVE_SYMBOL = symbolConstructorDetection, USE_SYMBOL_AS_UID = useSymbolAsUid, Symbol$1 = globalThis_1.Symbol, WellKnownSymbolsStore = store[key = "wks"] || (store[key] = value || {}), createWellKnownSymbol = USE_SYMBOL_AS_UID ? Symbol$1.for || Symbol$1 : Symbol$1 && Symbol$1.withoutSetter || function(key) {
|
|
1994
|
+
return "Symbol(" + (void 0 === key ? "" : key) + ")_" + toString$2(++id + postfix, 36);
|
|
1995
|
+
}, wellKnownSymbol$5 = function(name) {
|
|
1996
|
+
return hasOwn$2(WellKnownSymbolsStore, name) || (WellKnownSymbolsStore[name] = NATIVE_SYMBOL && hasOwn$2(Symbol$1, name) ? Symbol$1[name] : createWellKnownSymbol("Symbol." + name)),
|
|
1997
|
+
WellKnownSymbolsStore[name];
|
|
1998
|
+
}, call$1 = functionCall, isObject$3 = isObject$5, isSymbol$1 = isSymbol$2, $TypeError$3 = TypeError, TO_PRIMITIVE = wellKnownSymbol$5("toPrimitive"), toPrimitive = function(input, pref) {
|
|
1999
|
+
if (!isObject$3(input) || isSymbol$1(input)) return input;
|
|
2000
|
+
var result, func, exoticToPrim = (func = input[TO_PRIMITIVE], isNullOrUndefined(func) ? void 0 : aCallable$1(func));
|
|
2001
|
+
if (exoticToPrim) {
|
|
2002
|
+
if (void 0 === pref && (pref = "default"), result = call$1(exoticToPrim, input, pref),
|
|
2003
|
+
!isObject$3(result) || isSymbol$1(result)) return result;
|
|
2004
|
+
throw new $TypeError$3("Can't convert object to primitive value");
|
|
2005
|
+
}
|
|
2006
|
+
return void 0 === pref && (pref = "number"), function(input, pref) {
|
|
2007
|
+
var fn, val;
|
|
2008
|
+
if ("string" === pref && isCallable$3(fn = input.toString) && !isObject$4(val = call$2(fn, input))) return val;
|
|
2009
|
+
if (isCallable$3(fn = input.valueOf) && !isObject$4(val = call$2(fn, input))) return val;
|
|
2010
|
+
if ("string" !== pref && isCallable$3(fn = input.toString) && !isObject$4(val = call$2(fn, input))) return val;
|
|
2011
|
+
throw new $TypeError$4("Can't convert object to primitive value");
|
|
2012
|
+
}(input, pref);
|
|
2013
|
+
}, isSymbol = isSymbol$2, toPropertyKey$2 = function(argument) {
|
|
2014
|
+
var key = toPrimitive(argument, "string");
|
|
2015
|
+
return isSymbol(key) ? key : key + "";
|
|
2016
|
+
}, isObject$2 = isObject$5, document$1 = globalThis_1.document, EXISTS = isObject$2(document$1) && isObject$2(document$1.createElement), ie8DomDefine = !descriptors && !fails$8((function() {
|
|
2017
|
+
// eslint-disable-next-line es/no-object-defineproperty -- required for testing
|
|
2018
|
+
return 7 !== Object.defineProperty((it = "div", EXISTS ? document$1.createElement(it) : {}), "a", {
|
|
2019
|
+
get: function() {
|
|
2020
|
+
return 7;
|
|
2021
|
+
}
|
|
2022
|
+
}).a;
|
|
2023
|
+
var it;
|
|
2024
|
+
})), DESCRIPTORS$3 = descriptors, call = functionCall, propertyIsEnumerableModule = objectPropertyIsEnumerable, createPropertyDescriptor$1 = createPropertyDescriptor$2, toIndexedObject$1 = toIndexedObject$2, toPropertyKey$1 = toPropertyKey$2, hasOwn$1 = hasOwnProperty_1, IE8_DOM_DEFINE$1 = ie8DomDefine, $getOwnPropertyDescriptor$1 = Object.getOwnPropertyDescriptor;
|
|
2025
|
+
|
|
2026
|
+
// `Object.getOwnPropertyDescriptor` method
|
|
2027
|
+
// https://tc39.es/ecma262/#sec-object.getownpropertydescriptor
|
|
2028
|
+
objectGetOwnPropertyDescriptor.f = DESCRIPTORS$3 ? $getOwnPropertyDescriptor$1 : function(O, P) {
|
|
2029
|
+
if (O = toIndexedObject$1(O), P = toPropertyKey$1(P), IE8_DOM_DEFINE$1) try {
|
|
2030
|
+
return $getOwnPropertyDescriptor$1(O, P);
|
|
2031
|
+
} catch (error) {/* empty */}
|
|
2032
|
+
if (hasOwn$1(O, P)) return createPropertyDescriptor$1(!call(propertyIsEnumerableModule.f, O, P), O[P]);
|
|
2033
|
+
};
|
|
2034
|
+
|
|
2035
|
+
var fails$2 = fails$8, isCallable$2 = isCallable$8, replacement = /#|\.prototype\./, isForced$1 = function(feature, detection) {
|
|
2036
|
+
var value = data[normalize(feature)];
|
|
2037
|
+
return value === POLYFILL || value !== NATIVE && (isCallable$2(detection) ? fails$2(detection) : !!detection);
|
|
2038
|
+
}, normalize = isForced$1.normalize = function(string) {
|
|
2039
|
+
return String(string).replace(replacement, ".").toLowerCase();
|
|
2040
|
+
}, data = isForced$1.data = {}, NATIVE = isForced$1.NATIVE = "N", POLYFILL = isForced$1.POLYFILL = "P", isForced_1 = isForced$1, aCallable = aCallable$2, NATIVE_BIND = functionBindNative, bind$1 = functionUncurryThisClause(functionUncurryThisClause.bind), objectDefineProperty = {}, v8PrototypeDefineBug = descriptors && fails$8((function() {
|
|
2041
|
+
// eslint-disable-next-line es/no-object-defineproperty -- required for testing
|
|
2042
|
+
return 42 !== Object.defineProperty((function() {/* empty */}), "prototype", {
|
|
2043
|
+
value: 42,
|
|
2044
|
+
writable: !1
|
|
2045
|
+
}).prototype;
|
|
2046
|
+
})), isObject$1 = isObject$5, $String$1 = String, $TypeError$2 = TypeError, DESCRIPTORS$1 = descriptors, IE8_DOM_DEFINE = ie8DomDefine, V8_PROTOTYPE_DEFINE_BUG = v8PrototypeDefineBug, anObject = function(argument) {
|
|
2047
|
+
if (isObject$1(argument)) return argument;
|
|
2048
|
+
throw new $TypeError$2($String$1(argument) + " is not an object");
|
|
2049
|
+
}, toPropertyKey = toPropertyKey$2, $TypeError$1 = TypeError, $defineProperty = Object.defineProperty, $getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
|
|
2050
|
+
|
|
2051
|
+
// `Object.defineProperty` method
|
|
2052
|
+
// https://tc39.es/ecma262/#sec-object.defineproperty
|
|
2053
|
+
objectDefineProperty.f = DESCRIPTORS$1 ? V8_PROTOTYPE_DEFINE_BUG ? function(O, P, Attributes) {
|
|
2054
|
+
if (anObject(O), P = toPropertyKey(P), anObject(Attributes), "function" == typeof O && "prototype" === P && "value" in Attributes && "writable" in Attributes && !Attributes.writable) {
|
|
2055
|
+
var current = $getOwnPropertyDescriptor(O, P);
|
|
2056
|
+
current && current.writable && (O[P] = Attributes.value, Attributes = {
|
|
2057
|
+
configurable: "configurable" in Attributes ? Attributes.configurable : current.configurable,
|
|
2058
|
+
enumerable: "enumerable" in Attributes ? Attributes.enumerable : current.enumerable,
|
|
2059
|
+
writable: !1
|
|
2060
|
+
});
|
|
2061
|
+
}
|
|
2062
|
+
return $defineProperty(O, P, Attributes);
|
|
2063
|
+
} : $defineProperty : function(O, P, Attributes) {
|
|
2064
|
+
if (anObject(O), P = toPropertyKey(P), anObject(Attributes), IE8_DOM_DEFINE) try {
|
|
2065
|
+
return $defineProperty(O, P, Attributes);
|
|
2066
|
+
} catch (error) {/* empty */}
|
|
2067
|
+
if ("get" in Attributes || "set" in Attributes) throw new $TypeError$1("Accessors not supported");
|
|
2068
|
+
return "value" in Attributes && (O[P] = Attributes.value), O;
|
|
2069
|
+
};
|
|
2070
|
+
|
|
2071
|
+
var definePropertyModule = objectDefineProperty, createPropertyDescriptor = createPropertyDescriptor$2, createNonEnumerableProperty$1 = descriptors ? function(object, key, value) {
|
|
2072
|
+
return definePropertyModule.f(object, key, createPropertyDescriptor(1, value));
|
|
2073
|
+
} : function(object, key, value) {
|
|
2074
|
+
return object[key] = value, object;
|
|
2075
|
+
}, globalThis$2 = globalThis_1, apply = functionApply, uncurryThis$1 = functionUncurryThisClause, isCallable$1 = isCallable$8, getOwnPropertyDescriptor = objectGetOwnPropertyDescriptor.f, isForced = isForced_1, path$1 = path$3, bind = function(fn, that) {
|
|
2076
|
+
return aCallable(fn), void 0 === that ? fn : NATIVE_BIND ? bind$1(fn, that) : function() {
|
|
2077
|
+
return fn.apply(that, arguments);
|
|
2078
|
+
};
|
|
2079
|
+
}, createNonEnumerableProperty = createNonEnumerableProperty$1, hasOwn = hasOwnProperty_1, wrapConstructor = function(NativeConstructor) {
|
|
2080
|
+
var Wrapper = function(a, b, c) {
|
|
2081
|
+
if (this instanceof Wrapper) {
|
|
2082
|
+
switch (arguments.length) {
|
|
2083
|
+
case 0:
|
|
2084
|
+
return new NativeConstructor;
|
|
2085
|
+
|
|
2086
|
+
case 1:
|
|
2087
|
+
return new NativeConstructor(a);
|
|
2088
|
+
|
|
2089
|
+
case 2:
|
|
2090
|
+
return new NativeConstructor(a, b);
|
|
2091
|
+
}
|
|
2092
|
+
return new NativeConstructor(a, b, c);
|
|
2093
|
+
}
|
|
2094
|
+
return apply(NativeConstructor, this, arguments);
|
|
2095
|
+
};
|
|
2096
|
+
return Wrapper.prototype = NativeConstructor.prototype, Wrapper;
|
|
2097
|
+
}, _export = function(options, source) {
|
|
2098
|
+
var FORCED, USE_NATIVE, VIRTUAL_PROTOTYPE, key, sourceProperty, targetProperty, nativeProperty, resultProperty, descriptor, TARGET = options.target, GLOBAL = options.global, STATIC = options.stat, PROTO = options.proto, nativeSource = GLOBAL ? globalThis$2 : STATIC ? globalThis$2[TARGET] : globalThis$2[TARGET] && globalThis$2[TARGET].prototype, target = GLOBAL ? path$1 : path$1[TARGET] || createNonEnumerableProperty(path$1, TARGET, {})[TARGET], targetPrototype = target.prototype;
|
|
2099
|
+
for (key in source)
|
|
2100
|
+
// contains in native
|
|
2101
|
+
USE_NATIVE = !(FORCED = isForced(GLOBAL ? key : TARGET + (STATIC ? "." : "#") + key, options.forced)) && nativeSource && hasOwn(nativeSource, key),
|
|
2102
|
+
targetProperty = target[key], USE_NATIVE && (nativeProperty = options.dontCallGetSet ? (descriptor = getOwnPropertyDescriptor(nativeSource, key)) && descriptor.value : nativeSource[key]),
|
|
2103
|
+
// export native or implementation
|
|
2104
|
+
sourceProperty = USE_NATIVE && nativeProperty ? nativeProperty : source[key], (FORCED || PROTO || typeof targetProperty != typeof sourceProperty) && (
|
|
2105
|
+
// bind methods to global for calling from export context
|
|
2106
|
+
resultProperty = options.bind && USE_NATIVE ? bind(sourceProperty, globalThis$2) : options.wrap && USE_NATIVE ? wrapConstructor(sourceProperty) : PROTO && isCallable$1(sourceProperty) ? uncurryThis$1(sourceProperty) : sourceProperty,
|
|
2107
|
+
// add a flag to not completely full polyfills
|
|
2108
|
+
(options.sham || sourceProperty && sourceProperty.sham || targetProperty && targetProperty.sham) && createNonEnumerableProperty(resultProperty, "sham", !0),
|
|
2109
|
+
createNonEnumerableProperty(target, key, resultProperty), PROTO && (hasOwn(path$1, VIRTUAL_PROTOTYPE = TARGET + "Prototype") || createNonEnumerableProperty(path$1, VIRTUAL_PROTOTYPE, {}),
|
|
2110
|
+
// export virtual prototype methods
|
|
2111
|
+
createNonEnumerableProperty(path$1[VIRTUAL_PROTOTYPE], key, sourceProperty),
|
|
2112
|
+
// export real prototype methods
|
|
2113
|
+
options.real && targetPrototype && (FORCED || !targetPrototype[key]) && createNonEnumerableProperty(targetPrototype, key, sourceProperty)));
|
|
2114
|
+
}, ceil = Math.ceil, floor = Math.floor, trunc = Math.trunc || function(x) {
|
|
2115
|
+
var n = +x;
|
|
2116
|
+
return (n > 0 ? floor : ceil)(n);
|
|
2117
|
+
}, toIntegerOrInfinity$2 = function(argument) {
|
|
2118
|
+
var number = +argument;
|
|
2119
|
+
// eslint-disable-next-line no-self-compare -- NaN check
|
|
2120
|
+
return number != number || 0 === number ? 0 : trunc(number);
|
|
2121
|
+
}, toIntegerOrInfinity$1 = toIntegerOrInfinity$2, min$1 = Math.min, globalThis$1 = globalThis_1, path = path$3, getBuiltInPrototypeMethod$2 = function(CONSTRUCTOR, METHOD) {
|
|
2122
|
+
var Namespace = path[CONSTRUCTOR + "Prototype"], pureMethod = Namespace && Namespace[METHOD];
|
|
2123
|
+
if (pureMethod) return pureMethod;
|
|
2124
|
+
var NativeConstructor = globalThis$1[CONSTRUCTOR], NativePrototype = NativeConstructor && NativeConstructor.prototype;
|
|
2125
|
+
return NativePrototype && NativePrototype[METHOD];
|
|
2126
|
+
}, toIntegerOrInfinity = toIntegerOrInfinity$2, max = Math.max, min = Math.min, toIndexedObject = toIndexedObject$2, lengthOfArrayLike = function(obj) {
|
|
2127
|
+
return argument = obj.length, (len = toIntegerOrInfinity$1(argument)) > 0 ? min$1(len, 9007199254740991) : 0;
|
|
2128
|
+
var argument, len;
|
|
2129
|
+
}, createMethod = function(IS_INCLUDES) {
|
|
2130
|
+
return function($this, el, fromIndex) {
|
|
2131
|
+
var O = toIndexedObject($this), length = lengthOfArrayLike(O);
|
|
2132
|
+
if (0 === length) return !IS_INCLUDES && -1;
|
|
2133
|
+
var value, index = function(index, length) {
|
|
2134
|
+
var integer = toIntegerOrInfinity(index);
|
|
2135
|
+
return integer < 0 ? max(integer + length, 0) : min(integer, length);
|
|
2136
|
+
}(fromIndex, length);
|
|
2137
|
+
// Array#includes uses SameValueZero equality algorithm
|
|
2138
|
+
// eslint-disable-next-line no-self-compare -- NaN check
|
|
2139
|
+
if (IS_INCLUDES && el != el) {
|
|
2140
|
+
for (;length > index; )
|
|
2141
|
+
// eslint-disable-next-line no-self-compare -- NaN check
|
|
2142
|
+
if ((value = O[index++]) != value) return !0;
|
|
2143
|
+
// Array#indexOf ignores holes, Array#includes - not
|
|
2144
|
+
} else for (;length > index; index++) if ((IS_INCLUDES || index in O) && O[index] === el) return IS_INCLUDES || index || 0;
|
|
2145
|
+
return !IS_INCLUDES && -1;
|
|
2146
|
+
};
|
|
2147
|
+
}, $includes = [ createMethod(!0), createMethod(!1) ][0];
|
|
2148
|
+
|
|
2149
|
+
// `Array.prototype.includes` method
|
|
2150
|
+
// https://tc39.es/ecma262/#sec-array.prototype.includes
|
|
2151
|
+
_export({
|
|
2152
|
+
target: "Array",
|
|
2153
|
+
proto: !0,
|
|
2154
|
+
forced: fails$8((function() {
|
|
2155
|
+
// eslint-disable-next-line es/no-array-prototype-includes -- detection
|
|
2156
|
+
return !Array(1).includes();
|
|
2157
|
+
}))
|
|
2158
|
+
}, {
|
|
2159
|
+
includes: function(el /* , fromIndex = 0 */) {
|
|
2160
|
+
return $includes(this, el, arguments.length > 1 ? arguments[1] : void 0);
|
|
2161
|
+
}
|
|
2162
|
+
});
|
|
2163
|
+
|
|
2164
|
+
var includes$4 = getBuiltInPrototypeMethod$2("Array", "includes"), isObject = isObject$5, classof$2 = classofRaw$2, MATCH$1 = wellKnownSymbol$5("match"), $TypeError = TypeError, test = {};
|
|
2165
|
+
|
|
2166
|
+
test[wellKnownSymbol$5("toStringTag")] = "z";
|
|
2167
|
+
|
|
2168
|
+
var TO_STRING_TAG_SUPPORT = "[object z]" === String(test), isCallable = isCallable$8, classofRaw = classofRaw$2, TO_STRING_TAG = wellKnownSymbol$5("toStringTag"), $Object = Object, CORRECT_ARGUMENTS = "Arguments" === classofRaw(function() {
|
|
2169
|
+
return arguments;
|
|
2170
|
+
}()), classof = TO_STRING_TAG_SUPPORT ? classofRaw : function(it) {
|
|
2171
|
+
var O, tag, result;
|
|
2172
|
+
return void 0 === it ? "Undefined" : null === it ? "Null" : "string" == typeof (tag = function(it, key) {
|
|
2173
|
+
try {
|
|
2174
|
+
return it[key];
|
|
2175
|
+
} catch (error) {/* empty */}
|
|
2176
|
+
}(O = $Object(it), TO_STRING_TAG)) ? tag : CORRECT_ARGUMENTS ? classofRaw(O) : "Object" === (result = classofRaw(O)) && isCallable(O.callee) ? "Arguments" : result;
|
|
2177
|
+
}, $String = String, MATCH = wellKnownSymbol$5("match"), $ = _export, notARegExp = function(it) {
|
|
2178
|
+
if (function(it) {
|
|
2179
|
+
var isRegExp;
|
|
2180
|
+
return isObject(it) && (void 0 !== (isRegExp = it[MATCH$1]) ? !!isRegExp : "RegExp" === classof$2(it));
|
|
2181
|
+
}(it)) throw new $TypeError("The method doesn't accept regular expressions");
|
|
2182
|
+
return it;
|
|
2183
|
+
}, requireObjectCoercible = requireObjectCoercible$3, toString = function(argument) {
|
|
2184
|
+
if ("Symbol" === classof(argument)) throw new TypeError("Cannot convert a Symbol value to a string");
|
|
2185
|
+
return $String(argument);
|
|
2186
|
+
}, stringIndexOf = functionUncurryThis("".indexOf);
|
|
2187
|
+
|
|
2188
|
+
// `String.prototype.includes` method
|
|
2189
|
+
// https://tc39.es/ecma262/#sec-string.prototype.includes
|
|
2190
|
+
$({
|
|
2191
|
+
target: "String",
|
|
2192
|
+
proto: !0,
|
|
2193
|
+
forced: !function(METHOD_NAME) {
|
|
2194
|
+
var regexp = /./;
|
|
2195
|
+
try {
|
|
2196
|
+
"/./"[METHOD_NAME](regexp);
|
|
2197
|
+
} catch (error1) {
|
|
2198
|
+
try {
|
|
2199
|
+
return regexp[MATCH] = !1, "/./"[METHOD_NAME](regexp);
|
|
2200
|
+
} catch (error2) {/* empty */}
|
|
2201
|
+
}
|
|
2202
|
+
return !1;
|
|
2203
|
+
}("includes")
|
|
2204
|
+
}, {
|
|
2205
|
+
includes: function(searchString /* , position = 0 */) {
|
|
2206
|
+
return !!~stringIndexOf(toString(requireObjectCoercible(this)), toString(notARegExp(searchString)), arguments.length > 1 ? arguments[1] : void 0);
|
|
2207
|
+
}
|
|
2208
|
+
});
|
|
2209
|
+
|
|
2210
|
+
var includes$3 = getBuiltInPrototypeMethod$2("String", "includes"), isPrototypeOf = objectIsPrototypeOf, arrayMethod = includes$4, stringMethod = includes$3, ArrayPrototype = Array.prototype, StringPrototype = String.prototype;
|
|
2211
|
+
|
|
2212
|
+
const _includesInstanceProperty = getDefaultExportFromCjs((function(it) {
|
|
2213
|
+
var own = it.includes;
|
|
2214
|
+
return it === ArrayPrototype || isPrototypeOf(ArrayPrototype, it) && own === ArrayPrototype.includes ? arrayMethod : "string" == typeof it || it === StringPrototype || isPrototypeOf(StringPrototype, it) && own === StringPrototype.includes ? stringMethod : own;
|
|
2215
|
+
})), SelectContext = createContext(null), SelectOption = memo((({value: value, children: children, disabled: disabled = !1, className: className = "", style: style}) => {
|
|
2216
|
+
const context = useContext(SelectContext), label = "string" == typeof children ? children : value;
|
|
2217
|
+
// We assume children is the label if it's a string, or we need a way to get label.
|
|
2218
|
+
// For simplicity, we use children as label for registration if it's a string.
|
|
2219
|
+
if (useEffect((() => {
|
|
2220
|
+
if (context) return context.registerOption({
|
|
2221
|
+
value: value,
|
|
2222
|
+
label: label,
|
|
2223
|
+
disabled: disabled
|
|
2224
|
+
}), () => {
|
|
2225
|
+
context.unregisterOption(value);
|
|
2226
|
+
};
|
|
2227
|
+
}), [ context, value, label, disabled ]), !context) return console.warn("SelectOption must be used within a Select component"),
|
|
2228
|
+
null;
|
|
2229
|
+
const {selectedValue: selectedValue, onSelect: onSelect} = context, isSelected = Array.isArray(selectedValue) ? _includesInstanceProperty(selectedValue).call(selectedValue, value) : selectedValue === value;
|
|
2230
|
+
return jsx("li", {
|
|
2231
|
+
className: `${SELECT_CLASSES_SELECT_ITEM} ${className}`.trim(),
|
|
2232
|
+
"data-value": value,
|
|
2233
|
+
onClick: e => {
|
|
2234
|
+
e.preventDefault(), e.stopPropagation(), disabled || onSelect(value, label);
|
|
2235
|
+
},
|
|
2236
|
+
style: style,
|
|
2237
|
+
role: "option",
|
|
2238
|
+
"aria-selected": isSelected,
|
|
2239
|
+
"aria-disabled": disabled,
|
|
2240
|
+
children: jsxs("label", {
|
|
2241
|
+
className: "c-checkbox",
|
|
2242
|
+
style: {
|
|
2243
|
+
pointerEvents: "none"
|
|
2244
|
+
},
|
|
2245
|
+
children: [ jsx("input", {
|
|
2246
|
+
type: "checkbox",
|
|
2247
|
+
className: "c-checkbox__input c-select__item-input",
|
|
2248
|
+
checked: isSelected,
|
|
2249
|
+
readOnly: !0,
|
|
2250
|
+
disabled: disabled,
|
|
2251
|
+
tabIndex: -1
|
|
2252
|
+
}), jsx("div", {
|
|
2253
|
+
className: "c-select__item-label",
|
|
2254
|
+
children: children
|
|
2255
|
+
}) ]
|
|
2256
|
+
})
|
|
2257
|
+
});
|
|
2258
|
+
}));
|
|
2259
|
+
|
|
2260
|
+
SelectOption.displayName = "SelectOption";
|
|
2261
|
+
|
|
1846
2262
|
/**
|
|
1847
2263
|
* Select - A component for dropdown selection
|
|
1848
2264
|
*/
|
|
1849
|
-
const Select = memo((({options: options
|
|
2265
|
+
const Select = memo((({options: options, value: value, onChange: onChange, onBlur: onBlur, onFocus: onFocus, placeholder: placeholder = "Select an option", className: className = "", style: style, disabled: disabled = !1, required: required = !1, id: id, name: name, size: size = "md", invalid: invalid = !1, valid: valid = !1, multiple: multiple = !1, "aria-label": ariaLabel, "aria-describedby": ariaDescribedBy, glass: glass, children: children}) => {
|
|
1850
2266
|
const {generateSelectClass: generateSelectClass} =
|
|
1851
2267
|
/**
|
|
1852
2268
|
* Select state and functionality
|
|
@@ -1891,14 +2307,18 @@ const Select = memo((({options: options = [], value: value, onChange: onChange,
|
|
|
1891
2307
|
disabled: disabled,
|
|
1892
2308
|
invalid: invalid,
|
|
1893
2309
|
valid: valid
|
|
1894
|
-
}), [isOpen, setIsOpen] = useState(!1), [selectedLabel, setSelectedLabel] = useState(placeholder), dropdownRef = useRef(null), panelRef = useRef(null), bodyRef = useRef(null), nativeSelectRef = useRef(null)
|
|
2310
|
+
}), [isOpen, setIsOpen] = useState(!1), [selectedLabel, setSelectedLabel] = useState(placeholder), dropdownRef = useRef(null), panelRef = useRef(null), bodyRef = useRef(null), nativeSelectRef = useRef(null), [registeredOptions, setRegisteredOptions] = useState([]), registerOption = useCallback((option => {
|
|
2311
|
+
setRegisteredOptions((prev => prev.some((o => o.value === option.value)) ? prev : [ ...prev, option ]));
|
|
2312
|
+
}), []), unregisterOption = useCallback((value => {
|
|
2313
|
+
setRegisteredOptions((prev => prev.filter((o => o.value !== value))));
|
|
2314
|
+
}), []), hasOptionsProp = options && options.length > 0, activeOptions = hasOptionsProp ? options : registeredOptions;
|
|
1895
2315
|
// Update selected label when value changes
|
|
1896
2316
|
useEffect((() => {
|
|
1897
2317
|
if (value) {
|
|
1898
|
-
const selectedOption =
|
|
2318
|
+
const selectedOption = activeOptions.find((opt => opt.value === value));
|
|
1899
2319
|
selectedOption && setSelectedLabel(selectedOption.label);
|
|
1900
2320
|
} else setSelectedLabel(placeholder);
|
|
1901
|
-
}), [ value,
|
|
2321
|
+
}), [ value, activeOptions, placeholder ]),
|
|
1902
2322
|
// Handle click outside to close dropdown
|
|
1903
2323
|
useEffect((() => {
|
|
1904
2324
|
const handleClickOutside = event => {
|
|
@@ -1910,93 +2330,106 @@ const Select = memo((({options: options = [], value: value, onChange: onChange,
|
|
|
1910
2330
|
};
|
|
1911
2331
|
}), []);
|
|
1912
2332
|
// Toggle dropdown
|
|
1913
|
-
const
|
|
1914
|
-
|
|
1915
|
-
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
|
|
1920
|
-
|
|
1921
|
-
|
|
1922
|
-
|
|
1923
|
-
|
|
1924
|
-
|
|
1925
|
-
|
|
1926
|
-
|
|
1927
|
-
|
|
1928
|
-
|
|
1929
|
-
|
|
1930
|
-
|
|
1931
|
-
|
|
1932
|
-
|
|
1933
|
-
|
|
1934
|
-
|
|
1935
|
-
|
|
1936
|
-
|
|
1937
|
-
|
|
1938
|
-
|
|
1939
|
-
|
|
1940
|
-
|
|
1941
|
-
|
|
1942
|
-
|
|
1943
|
-
|
|
1944
|
-
|
|
1945
|
-
|
|
1946
|
-
|
|
1947
|
-
|
|
1948
|
-
|
|
1949
|
-
|
|
1950
|
-
|
|
1951
|
-
|
|
1952
|
-
|
|
1953
|
-
|
|
1954
|
-
|
|
1955
|
-
|
|
1956
|
-
|
|
1957
|
-
|
|
1958
|
-
|
|
1959
|
-
|
|
1960
|
-
|
|
1961
|
-
|
|
1962
|
-
|
|
1963
|
-
|
|
1964
|
-
|
|
1965
|
-
|
|
1966
|
-
|
|
1967
|
-
|
|
1968
|
-
|
|
1969
|
-
|
|
1970
|
-
|
|
1971
|
-
|
|
1972
|
-
|
|
1973
|
-
|
|
1974
|
-
|
|
1975
|
-
|
|
1976
|
-
|
|
1977
|
-
|
|
1978
|
-
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
-
|
|
1983
|
-
|
|
1984
|
-
|
|
1985
|
-
|
|
1986
|
-
|
|
1987
|
-
|
|
1988
|
-
|
|
1989
|
-
|
|
1990
|
-
|
|
1991
|
-
|
|
1992
|
-
|
|
1993
|
-
|
|
1994
|
-
|
|
1995
|
-
|
|
1996
|
-
|
|
2333
|
+
const handleItemClick = useCallback((option => {
|
|
2334
|
+
if (setSelectedLabel(option.label), setIsOpen(!1), bodyRef.current && (bodyRef.current.style.height = "0px"),
|
|
2335
|
+
nativeSelectRef.current && (nativeSelectRef.current.value = option.value), onChange) {
|
|
2336
|
+
// Create a synthetic event
|
|
2337
|
+
const event = {
|
|
2338
|
+
target: {
|
|
2339
|
+
name: name,
|
|
2340
|
+
value: option.value
|
|
2341
|
+
}
|
|
2342
|
+
};
|
|
2343
|
+
onChange(event);
|
|
2344
|
+
}
|
|
2345
|
+
}), [ onChange, name ]), onSelect = useCallback(((val, label) => {
|
|
2346
|
+
handleItemClick({
|
|
2347
|
+
value: val,
|
|
2348
|
+
label: label
|
|
2349
|
+
});
|
|
2350
|
+
}), [ handleItemClick ]), contextValue = React.useMemo((() => ({
|
|
2351
|
+
registerOption: registerOption,
|
|
2352
|
+
unregisterOption: unregisterOption,
|
|
2353
|
+
selectedValue: value,
|
|
2354
|
+
onSelect: onSelect
|
|
2355
|
+
})), [ registerOption, unregisterOption, value, onSelect ]), selectContent = jsx(SelectContext.Provider, {
|
|
2356
|
+
value: contextValue,
|
|
2357
|
+
children: jsxs("div", {
|
|
2358
|
+
className: `${selectClass} ${isOpen ? SELECT_CLASSES_IS_OPEN : ""}`,
|
|
2359
|
+
ref: dropdownRef,
|
|
2360
|
+
style: style,
|
|
2361
|
+
"aria-expanded": isOpen,
|
|
2362
|
+
children: [ jsxs("select", {
|
|
2363
|
+
ref: nativeSelectRef,
|
|
2364
|
+
value: value,
|
|
2365
|
+
onChange: onChange,
|
|
2366
|
+
onBlur: onBlur,
|
|
2367
|
+
onFocus: onFocus,
|
|
2368
|
+
disabled: disabled,
|
|
2369
|
+
required: required,
|
|
2370
|
+
id: id,
|
|
2371
|
+
name: name,
|
|
2372
|
+
multiple: multiple,
|
|
2373
|
+
"aria-label": ariaLabel,
|
|
2374
|
+
"aria-describedby": ariaDescribedBy,
|
|
2375
|
+
"aria-invalid": invalid,
|
|
2376
|
+
style: {
|
|
2377
|
+
display: "none"
|
|
2378
|
+
},
|
|
2379
|
+
children: [ placeholder && jsx("option", {
|
|
2380
|
+
value: "",
|
|
2381
|
+
disabled: !0,
|
|
2382
|
+
children: placeholder
|
|
2383
|
+
}), activeOptions.map((option => jsx("option", {
|
|
2384
|
+
value: option.value,
|
|
2385
|
+
disabled: option.disabled,
|
|
2386
|
+
children: option.label
|
|
2387
|
+
}, option.value))) ]
|
|
2388
|
+
}), jsx("div", {
|
|
2389
|
+
className: SELECT_CLASSES_SELECTED,
|
|
2390
|
+
onClick: () => {
|
|
2391
|
+
disabled || (!isOpen && bodyRef.current && panelRef.current ? bodyRef.current.style.height = `${panelRef.current.clientHeight}px` : bodyRef.current && (bodyRef.current.style.height = "0px"),
|
|
2392
|
+
setIsOpen(!isOpen));
|
|
2393
|
+
},
|
|
2394
|
+
"aria-disabled": disabled,
|
|
2395
|
+
children: selectedLabel
|
|
2396
|
+
}), jsx("i", {
|
|
2397
|
+
className: `${SELECT_CLASSES_ICON_CARET} ${SELECT_CLASSES_TOGGLE_ICON}`
|
|
2398
|
+
}), jsx("div", {
|
|
2399
|
+
className: SELECT_CLASSES_SELECT_BODY,
|
|
2400
|
+
ref: bodyRef,
|
|
2401
|
+
style: {
|
|
2402
|
+
height: 0
|
|
2403
|
+
},
|
|
2404
|
+
children: jsx("div", {
|
|
2405
|
+
className: SELECT_CLASSES_SELECT_PANEL,
|
|
2406
|
+
ref: panelRef,
|
|
2407
|
+
children: jsx("ul", {
|
|
2408
|
+
className: SELECT_CLASSES_SELECT_ITEMS,
|
|
2409
|
+
children: hasOptionsProp ? options.map(((option, index) => jsx("li", {
|
|
2410
|
+
className: SELECT_CLASSES_SELECT_ITEM,
|
|
2411
|
+
"data-value": option.value,
|
|
2412
|
+
onClick: () => !option.disabled && handleItemClick(option),
|
|
2413
|
+
children: jsxs("label", {
|
|
2414
|
+
htmlFor: `SelectItem${index}`,
|
|
2415
|
+
className: "c-checkbox",
|
|
2416
|
+
children: [ jsx("input", {
|
|
2417
|
+
type: "checkbox",
|
|
2418
|
+
id: `SelectItem${index}`,
|
|
2419
|
+
className: "c-checkbox__input c-select__item-input",
|
|
2420
|
+
checked: value === option.value,
|
|
2421
|
+
readOnly: !0,
|
|
2422
|
+
disabled: option.disabled
|
|
2423
|
+
}), jsx("div", {
|
|
2424
|
+
className: "c-select__item-label",
|
|
2425
|
+
children: option.label
|
|
2426
|
+
}) ]
|
|
2427
|
+
})
|
|
2428
|
+
}, option.value))) : children
|
|
2429
|
+
})
|
|
1997
2430
|
})
|
|
1998
|
-
})
|
|
1999
|
-
})
|
|
2431
|
+
}) ]
|
|
2432
|
+
})
|
|
2000
2433
|
});
|
|
2001
2434
|
// Handle item selection
|
|
2002
2435
|
if (glass) {
|
|
@@ -2020,7 +2453,7 @@ const Select = memo((({options: options = [], value: value, onChange: onChange,
|
|
|
2020
2453
|
return selectContent;
|
|
2021
2454
|
}));
|
|
2022
2455
|
|
|
2023
|
-
Select.displayName = "Select";
|
|
2456
|
+
Select.displayName = "Select", Select.Option = SelectOption;
|
|
2024
2457
|
|
|
2025
2458
|
/**
|
|
2026
2459
|
* Textarea - A component for multiline text input
|