@chayns-components/core 5.0.57 → 5.0.58
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.
|
@@ -13,9 +13,10 @@ let ContainerAnchor = exports.ContainerAnchor = /*#__PURE__*/function (Container
|
|
|
13
13
|
ContainerAnchor["ROOT"] = "#root";
|
|
14
14
|
ContainerAnchor["TAPP"] = ".tapp";
|
|
15
15
|
ContainerAnchor["WALLET"] = ".wallet";
|
|
16
|
+
ContainerAnchor["COLOR_SCHEME"] = ".color-scheme-provider";
|
|
16
17
|
return ContainerAnchor;
|
|
17
18
|
}({});
|
|
18
|
-
const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.BODY, ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.ROOT, ContainerAnchor.TAPP];
|
|
19
|
+
const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.BODY, ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.ROOT, ContainerAnchor.TAPP, ContainerAnchor.COLOR_SCHEME];
|
|
19
20
|
const useContainer = ({
|
|
20
21
|
ref,
|
|
21
22
|
anchorElement,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"container.js","names":["_react","require","ContainerAnchor","exports","DEFAULT_CONTAINER_ANCHORS","BODY","DIALOG","PAGE","ROOT","TAPP","useContainer","ref","anchorElement","container","anchors","newContainer","setNewContainer","useState","undefined","useEffect","el","current","reservationWrapperContainer","document","querySelector","RESERVATION_WRAPPER","rootContainer","walletContainer","WALLET","isInWallet","contains","element","closest","join","Element"],"sources":["../../../src/hooks/container.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useState } from 'react';\n\nexport enum ContainerAnchor {\n BODY = 'body',\n DIALOG = '.dialog-inner',\n PAGE = '.page-provider',\n RESERVATION_WRAPPER = '.reservation-wrapper',\n ROOT = '#root',\n TAPP = '.tapp',\n WALLET = '.wallet',\n}\n\nconst DEFAULT_CONTAINER_ANCHORS = [\n ContainerAnchor.BODY,\n ContainerAnchor.DIALOG,\n ContainerAnchor.PAGE,\n ContainerAnchor.ROOT,\n ContainerAnchor.TAPP,\n];\n\ninterface UseContainerProps {\n ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;\n anchorElement?: Element;\n container?: Element | null;\n anchors?: ContainerAnchor[];\n}\n\nexport const useContainer = ({\n ref,\n anchorElement,\n container,\n anchors = DEFAULT_CONTAINER_ANCHORS,\n}: UseContainerProps) => {\n const [newContainer, setNewContainer] = useState<Element | undefined>(container ?? undefined);\n\n // Get the closest container if none is set\n useEffect(() => {\n let el = anchorElement as HTMLElement;\n\n if (ref?.current) {\n el = ref.current as HTMLElement;\n }\n\n if (!container) {\n const reservationWrapperContainer = document.querySelector(\n ContainerAnchor.RESERVATION_WRAPPER,\n );\n\n const rootContainer = document.querySelector(ContainerAnchor.ROOT);\n const walletContainer = document.querySelector(ContainerAnchor.WALLET);\n\n const isInWallet =\n (reservationWrapperContainer && reservationWrapperContainer.contains(el)) ||\n (walletContainer && walletContainer.contains(el));\n\n if (isInWallet && rootContainer && rootContainer.contains(el)) {\n setNewContainer(rootContainer);\n\n return;\n }\n\n const element = el.closest(anchors?.join(', '));\n\n setNewContainer(element ?? undefined);\n }\n }, [anchors, container, anchorElement, ref]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n return newContainer;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAA8D,IAElDC,eAAe,GAAAC,OAAA,CAAAD,eAAA,0BAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;
|
|
1
|
+
{"version":3,"file":"container.js","names":["_react","require","ContainerAnchor","exports","DEFAULT_CONTAINER_ANCHORS","BODY","DIALOG","PAGE","ROOT","TAPP","COLOR_SCHEME","useContainer","ref","anchorElement","container","anchors","newContainer","setNewContainer","useState","undefined","useEffect","el","current","reservationWrapperContainer","document","querySelector","RESERVATION_WRAPPER","rootContainer","walletContainer","WALLET","isInWallet","contains","element","closest","join","Element"],"sources":["../../../src/hooks/container.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useState } from 'react';\n\nexport enum ContainerAnchor {\n BODY = 'body',\n DIALOG = '.dialog-inner',\n PAGE = '.page-provider',\n RESERVATION_WRAPPER = '.reservation-wrapper',\n ROOT = '#root',\n TAPP = '.tapp',\n WALLET = '.wallet',\n COLOR_SCHEME = '.color-scheme-provider',\n}\n\nconst DEFAULT_CONTAINER_ANCHORS = [\n ContainerAnchor.BODY,\n ContainerAnchor.DIALOG,\n ContainerAnchor.PAGE,\n ContainerAnchor.ROOT,\n ContainerAnchor.TAPP,\n ContainerAnchor.COLOR_SCHEME,\n];\n\ninterface UseContainerProps {\n ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;\n anchorElement?: Element;\n container?: Element | null;\n anchors?: ContainerAnchor[];\n}\n\nexport const useContainer = ({\n ref,\n anchorElement,\n container,\n anchors = DEFAULT_CONTAINER_ANCHORS,\n}: UseContainerProps) => {\n const [newContainer, setNewContainer] = useState<Element | undefined>(container ?? undefined);\n\n // Get the closest container if none is set\n useEffect(() => {\n let el = anchorElement as HTMLElement;\n\n if (ref?.current) {\n el = ref.current as HTMLElement;\n }\n\n if (!container) {\n const reservationWrapperContainer = document.querySelector(\n ContainerAnchor.RESERVATION_WRAPPER,\n );\n\n const rootContainer = document.querySelector(ContainerAnchor.ROOT);\n const walletContainer = document.querySelector(ContainerAnchor.WALLET);\n\n const isInWallet =\n (reservationWrapperContainer && reservationWrapperContainer.contains(el)) ||\n (walletContainer && walletContainer.contains(el));\n\n if (isInWallet && rootContainer && rootContainer.contains(el)) {\n setNewContainer(rootContainer);\n\n return;\n }\n\n const element = el.closest(anchors?.join(', '));\n\n setNewContainer(element ?? undefined);\n }\n }, [anchors, container, anchorElement, ref]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n return newContainer;\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAA8D,IAElDC,eAAe,GAAAC,OAAA,CAAAD,eAAA,0BAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAW3B,MAAME,yBAAyB,GAAG,CAC9BF,eAAe,CAACG,IAAI,EACpBH,eAAe,CAACI,MAAM,EACtBJ,eAAe,CAACK,IAAI,EACpBL,eAAe,CAACM,IAAI,EACpBN,eAAe,CAACO,IAAI,EACpBP,eAAe,CAACQ,YAAY,CAC/B;AASM,MAAMC,YAAY,GAAGA,CAAC;EACzBC,GAAG;EACHC,aAAa;EACbC,SAAS;EACTC,OAAO,GAAGX;AACK,CAAC,KAAK;EACrB,MAAM,CAACY,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAC,eAAQ,EAAsBJ,SAAS,IAAIK,SAAS,CAAC;;EAE7F;EACA,IAAAC,gBAAS,EAAC,MAAM;IACZ,IAAIC,EAAE,GAAGR,aAA4B;IAErC,IAAID,GAAG,aAAHA,GAAG,eAAHA,GAAG,CAAEU,OAAO,EAAE;MACdD,EAAE,GAAGT,GAAG,CAACU,OAAsB;IACnC;IAEA,IAAI,CAACR,SAAS,EAAE;MACZ,MAAMS,2BAA2B,GAAGC,QAAQ,CAACC,aAAa,CACtDvB,eAAe,CAACwB,mBACpB,CAAC;MAED,MAAMC,aAAa,GAAGH,QAAQ,CAACC,aAAa,CAACvB,eAAe,CAACM,IAAI,CAAC;MAClE,MAAMoB,eAAe,GAAGJ,QAAQ,CAACC,aAAa,CAACvB,eAAe,CAAC2B,MAAM,CAAC;MAEtE,MAAMC,UAAU,GACXP,2BAA2B,IAAIA,2BAA2B,CAACQ,QAAQ,CAACV,EAAE,CAAC,IACvEO,eAAe,IAAIA,eAAe,CAACG,QAAQ,CAACV,EAAE,CAAE;MAErD,IAAIS,UAAU,IAAIH,aAAa,IAAIA,aAAa,CAACI,QAAQ,CAACV,EAAE,CAAC,EAAE;QAC3DJ,eAAe,CAACU,aAAa,CAAC;QAE9B;MACJ;MAEA,MAAMK,OAAO,GAAGX,EAAE,CAACY,OAAO,CAAClB,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEmB,IAAI,CAAC,IAAI,CAAC,CAAC;MAE/CjB,eAAe,CAACe,OAAO,IAAIb,SAAS,CAAC;IACzC;EACJ,CAAC,EAAE,CAACJ,OAAO,EAAED,SAAS,EAAED,aAAa,EAAED,GAAG,CAAC,CAAC;EAE5C,IAAAQ,gBAAS,EAAC,MAAM;IACZ,IAAIN,SAAS,YAAYqB,OAAO,EAAE;MAC9BlB,eAAe,CAACH,SAAS,CAAC;IAC9B;EACJ,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EAEf,OAAOE,YAAY;AACvB,CAAC;AAACb,OAAA,CAAAQ,YAAA,GAAAA,YAAA","ignoreList":[]}
|
|
@@ -7,9 +7,10 @@ export let ContainerAnchor = /*#__PURE__*/function (ContainerAnchor) {
|
|
|
7
7
|
ContainerAnchor["ROOT"] = "#root";
|
|
8
8
|
ContainerAnchor["TAPP"] = ".tapp";
|
|
9
9
|
ContainerAnchor["WALLET"] = ".wallet";
|
|
10
|
+
ContainerAnchor["COLOR_SCHEME"] = ".color-scheme-provider";
|
|
10
11
|
return ContainerAnchor;
|
|
11
12
|
}({});
|
|
12
|
-
const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.BODY, ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.ROOT, ContainerAnchor.TAPP];
|
|
13
|
+
const DEFAULT_CONTAINER_ANCHORS = [ContainerAnchor.BODY, ContainerAnchor.DIALOG, ContainerAnchor.PAGE, ContainerAnchor.ROOT, ContainerAnchor.TAPP, ContainerAnchor.COLOR_SCHEME];
|
|
13
14
|
export const useContainer = ({
|
|
14
15
|
ref,
|
|
15
16
|
anchorElement,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"container.js","names":["useEffect","useState","ContainerAnchor","DEFAULT_CONTAINER_ANCHORS","BODY","DIALOG","PAGE","ROOT","TAPP","useContainer","ref","anchorElement","container","anchors","newContainer","setNewContainer","undefined","el","current","reservationWrapperContainer","document","querySelector","RESERVATION_WRAPPER","rootContainer","walletContainer","WALLET","isInWallet","contains","element","closest","join","Element"],"sources":["../../../src/hooks/container.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useState } from 'react';\n\nexport enum ContainerAnchor {\n BODY = 'body',\n DIALOG = '.dialog-inner',\n PAGE = '.page-provider',\n RESERVATION_WRAPPER = '.reservation-wrapper',\n ROOT = '#root',\n TAPP = '.tapp',\n WALLET = '.wallet',\n}\n\nconst DEFAULT_CONTAINER_ANCHORS = [\n ContainerAnchor.BODY,\n ContainerAnchor.DIALOG,\n ContainerAnchor.PAGE,\n ContainerAnchor.ROOT,\n ContainerAnchor.TAPP,\n];\n\ninterface UseContainerProps {\n ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;\n anchorElement?: Element;\n container?: Element | null;\n anchors?: ContainerAnchor[];\n}\n\nexport const useContainer = ({\n ref,\n anchorElement,\n container,\n anchors = DEFAULT_CONTAINER_ANCHORS,\n}: UseContainerProps) => {\n const [newContainer, setNewContainer] = useState<Element | undefined>(container ?? undefined);\n\n // Get the closest container if none is set\n useEffect(() => {\n let el = anchorElement as HTMLElement;\n\n if (ref?.current) {\n el = ref.current as HTMLElement;\n }\n\n if (!container) {\n const reservationWrapperContainer = document.querySelector(\n ContainerAnchor.RESERVATION_WRAPPER,\n );\n\n const rootContainer = document.querySelector(ContainerAnchor.ROOT);\n const walletContainer = document.querySelector(ContainerAnchor.WALLET);\n\n const isInWallet =\n (reservationWrapperContainer && reservationWrapperContainer.contains(el)) ||\n (walletContainer && walletContainer.contains(el));\n\n if (isInWallet && rootContainer && rootContainer.contains(el)) {\n setNewContainer(rootContainer);\n\n return;\n }\n\n const element = el.closest(anchors?.join(', '));\n\n setNewContainer(element ?? undefined);\n }\n }, [anchors, container, anchorElement, ref]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n return newContainer;\n};\n"],"mappings":"AAAA,SAA2BA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE7D,WAAYC,eAAe,0BAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;
|
|
1
|
+
{"version":3,"file":"container.js","names":["useEffect","useState","ContainerAnchor","DEFAULT_CONTAINER_ANCHORS","BODY","DIALOG","PAGE","ROOT","TAPP","COLOR_SCHEME","useContainer","ref","anchorElement","container","anchors","newContainer","setNewContainer","undefined","el","current","reservationWrapperContainer","document","querySelector","RESERVATION_WRAPPER","rootContainer","walletContainer","WALLET","isInWallet","contains","element","closest","join","Element"],"sources":["../../../src/hooks/container.ts"],"sourcesContent":["import { MutableRefObject, useEffect, useState } from 'react';\n\nexport enum ContainerAnchor {\n BODY = 'body',\n DIALOG = '.dialog-inner',\n PAGE = '.page-provider',\n RESERVATION_WRAPPER = '.reservation-wrapper',\n ROOT = '#root',\n TAPP = '.tapp',\n WALLET = '.wallet',\n COLOR_SCHEME = '.color-scheme-provider',\n}\n\nconst DEFAULT_CONTAINER_ANCHORS = [\n ContainerAnchor.BODY,\n ContainerAnchor.DIALOG,\n ContainerAnchor.PAGE,\n ContainerAnchor.ROOT,\n ContainerAnchor.TAPP,\n ContainerAnchor.COLOR_SCHEME,\n];\n\ninterface UseContainerProps {\n ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;\n anchorElement?: Element;\n container?: Element | null;\n anchors?: ContainerAnchor[];\n}\n\nexport const useContainer = ({\n ref,\n anchorElement,\n container,\n anchors = DEFAULT_CONTAINER_ANCHORS,\n}: UseContainerProps) => {\n const [newContainer, setNewContainer] = useState<Element | undefined>(container ?? undefined);\n\n // Get the closest container if none is set\n useEffect(() => {\n let el = anchorElement as HTMLElement;\n\n if (ref?.current) {\n el = ref.current as HTMLElement;\n }\n\n if (!container) {\n const reservationWrapperContainer = document.querySelector(\n ContainerAnchor.RESERVATION_WRAPPER,\n );\n\n const rootContainer = document.querySelector(ContainerAnchor.ROOT);\n const walletContainer = document.querySelector(ContainerAnchor.WALLET);\n\n const isInWallet =\n (reservationWrapperContainer && reservationWrapperContainer.contains(el)) ||\n (walletContainer && walletContainer.contains(el));\n\n if (isInWallet && rootContainer && rootContainer.contains(el)) {\n setNewContainer(rootContainer);\n\n return;\n }\n\n const element = el.closest(anchors?.join(', '));\n\n setNewContainer(element ?? undefined);\n }\n }, [anchors, container, anchorElement, ref]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n return newContainer;\n};\n"],"mappings":"AAAA,SAA2BA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE7D,WAAYC,eAAe,0BAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAfA,eAAe;EAAA,OAAfA,eAAe;AAAA;AAW3B,MAAMC,yBAAyB,GAAG,CAC9BD,eAAe,CAACE,IAAI,EACpBF,eAAe,CAACG,MAAM,EACtBH,eAAe,CAACI,IAAI,EACpBJ,eAAe,CAACK,IAAI,EACpBL,eAAe,CAACM,IAAI,EACpBN,eAAe,CAACO,YAAY,CAC/B;AASD,OAAO,MAAMC,YAAY,GAAGA,CAAC;EACzBC,GAAG;EACHC,aAAa;EACbC,SAAS;EACTC,OAAO,GAAGX;AACK,CAAC,KAAK;EACrB,MAAM,CAACY,YAAY,EAAEC,eAAe,CAAC,GAAGf,QAAQ,CAAsBY,SAAS,IAAII,SAAS,CAAC;;EAE7F;EACAjB,SAAS,CAAC,MAAM;IACZ,IAAIkB,EAAE,GAAGN,aAA4B;IAErC,IAAID,GAAG,EAAEQ,OAAO,EAAE;MACdD,EAAE,GAAGP,GAAG,CAACQ,OAAsB;IACnC;IAEA,IAAI,CAACN,SAAS,EAAE;MACZ,MAAMO,2BAA2B,GAAGC,QAAQ,CAACC,aAAa,CACtDpB,eAAe,CAACqB,mBACpB,CAAC;MAED,MAAMC,aAAa,GAAGH,QAAQ,CAACC,aAAa,CAACpB,eAAe,CAACK,IAAI,CAAC;MAClE,MAAMkB,eAAe,GAAGJ,QAAQ,CAACC,aAAa,CAACpB,eAAe,CAACwB,MAAM,CAAC;MAEtE,MAAMC,UAAU,GACXP,2BAA2B,IAAIA,2BAA2B,CAACQ,QAAQ,CAACV,EAAE,CAAC,IACvEO,eAAe,IAAIA,eAAe,CAACG,QAAQ,CAACV,EAAE,CAAE;MAErD,IAAIS,UAAU,IAAIH,aAAa,IAAIA,aAAa,CAACI,QAAQ,CAACV,EAAE,CAAC,EAAE;QAC3DF,eAAe,CAACQ,aAAa,CAAC;QAE9B;MACJ;MAEA,MAAMK,OAAO,GAAGX,EAAE,CAACY,OAAO,CAAChB,OAAO,EAAEiB,IAAI,CAAC,IAAI,CAAC,CAAC;MAE/Cf,eAAe,CAACa,OAAO,IAAIZ,SAAS,CAAC;IACzC;EACJ,CAAC,EAAE,CAACH,OAAO,EAAED,SAAS,EAAED,aAAa,EAAED,GAAG,CAAC,CAAC;EAE5CX,SAAS,CAAC,MAAM;IACZ,IAAIa,SAAS,YAAYmB,OAAO,EAAE;MAC9BhB,eAAe,CAACH,SAAS,CAAC;IAC9B;EACJ,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EAEf,OAAOE,YAAY;AACvB,CAAC","ignoreList":[]}
|
|
@@ -6,7 +6,8 @@ export declare enum ContainerAnchor {
|
|
|
6
6
|
RESERVATION_WRAPPER = ".reservation-wrapper",
|
|
7
7
|
ROOT = "#root",
|
|
8
8
|
TAPP = ".tapp",
|
|
9
|
-
WALLET = ".wallet"
|
|
9
|
+
WALLET = ".wallet",
|
|
10
|
+
COLOR_SCHEME = ".color-scheme-provider"
|
|
10
11
|
}
|
|
11
12
|
interface UseContainerProps {
|
|
12
13
|
ref?: MutableRefObject<HTMLDivElement | HTMLLabelElement | HTMLSpanElement | null>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/core",
|
|
3
|
-
"version": "5.0.
|
|
3
|
+
"version": "5.0.58",
|
|
4
4
|
"description": "A set of beautiful React components for developing your own applications with chayns.",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"browserslist": [
|
|
@@ -87,5 +87,5 @@
|
|
|
87
87
|
"publishConfig": {
|
|
88
88
|
"access": "public"
|
|
89
89
|
},
|
|
90
|
-
"gitHead": "
|
|
90
|
+
"gitHead": "03da47d802e7cfc6d035237fdd8d21dafe1cae7e"
|
|
91
91
|
}
|