@focus4/styling 11.8.4 → 11.9.0-rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/focus4.styling.css
CHANGED
|
@@ -329,9 +329,10 @@
|
|
|
329
329
|
|
|
330
330
|
--animation-duration: 0.35s;
|
|
331
331
|
--animation-delay: calc(var(--animation-duration) / 5);
|
|
332
|
+
|
|
332
333
|
--animation-curve-fast-out-slow-in: cubic-bezier(0.4, 0, 0.2, 1);
|
|
333
|
-
--animation-curve-linear-out-slow-in: cubic-bezier(var(--color-black) 0.2, 1);
|
|
334
334
|
--animation-curve-fast-out-linear-in: cubic-bezier(0.4, 0, 1, 1);
|
|
335
|
+
--animation-curve-focus-ring: cubic-bezier(0.2, 0, 0, 1);
|
|
335
336
|
--animation-curve-default: var(--animation-curve-fast-out-slow-in);
|
|
336
337
|
|
|
337
338
|
--z-index-highest: 300;
|
package/lib/focus4.styling.js
CHANGED
|
@@ -43,11 +43,11 @@ function cssTransitionProps({ enter, enterActive, exit, exitActive }) {
|
|
|
43
43
|
};
|
|
44
44
|
}
|
|
45
45
|
function toMs(d) {
|
|
46
|
-
if (d.endsWith("
|
|
47
|
-
return +d.substring(0, d.length -
|
|
46
|
+
if (d.endsWith("ms")) {
|
|
47
|
+
return +d.substring(0, d.length - 2);
|
|
48
48
|
}
|
|
49
49
|
else {
|
|
50
|
-
return +d.substring(0, d.length -
|
|
50
|
+
return +d.substring(0, d.length - 1) * 1000;
|
|
51
51
|
}
|
|
52
52
|
}
|
|
53
53
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"focus4.styling.js","sources":["../src/utils/animation.ts","../src/utils/get-icon.tsx","../src/utils/scroll-contexts.ts","../src/theme/common.ts","../src/theme/to-bem.ts","../src/theme/use-theme.ts","../src/theme/themr.tsx"],"sourcesContent":["function get() {\n const { animationDelay, animationDuration, animationTimingFunction } = window.getComputedStyle(document.body);\n const delay = toMs(animationDelay);\n const duration = toMs(animationDuration);\n const ease = animationTimingFunction.startsWith(\"cubic-bezier\")\n ? animationTimingFunction.substring(13).split(\",\").map(parseFloat)\n : undefined;\n return { delay, duration, ease };\n}\nexport function getDefaultTransition() {\n const { delay, duration, ease } = get();\n return {\n delay: delay / 1000,\n duration: duration / 1000,\n ease\n };\n}\nexport const springTransition = {\n type: \"spring\",\n stiffness: 170,\n damping: 26,\n restDelta: 1,\n restSpeed: 1000\n};\nexport function cssTransitionProps({ enter, enterActive, exit, exitActive }) {\n const { delay, duration } = get();\n return {\n timeout: delay + duration,\n classNames: {\n enter,\n enterActive,\n exit,\n exitActive\n }\n };\n}\nfunction toMs(d) {\n if (d.endsWith(\"
|
|
1
|
+
{"version":3,"file":"focus4.styling.js","sources":["../src/utils/animation.ts","../src/utils/get-icon.tsx","../src/utils/scroll-contexts.ts","../src/theme/common.ts","../src/theme/to-bem.ts","../src/theme/use-theme.ts","../src/theme/themr.tsx"],"sourcesContent":["function get() {\n const { animationDelay, animationDuration, animationTimingFunction } = window.getComputedStyle(document.body);\n const delay = toMs(animationDelay);\n const duration = toMs(animationDuration);\n const ease = animationTimingFunction.startsWith(\"cubic-bezier\")\n ? animationTimingFunction.substring(13).split(\",\").map(parseFloat)\n : undefined;\n return { delay, duration, ease };\n}\nexport function getDefaultTransition() {\n const { delay, duration, ease } = get();\n return {\n delay: delay / 1000,\n duration: duration / 1000,\n ease\n };\n}\nexport const springTransition = {\n type: \"spring\",\n stiffness: 170,\n damping: 26,\n restDelta: 1,\n restSpeed: 1000\n};\nexport function cssTransitionProps({ enter, enterActive, exit, exitActive }) {\n const { delay, duration } = get();\n return {\n timeout: delay + duration,\n classNames: {\n enter,\n enterActive,\n exit,\n exitActive\n }\n };\n}\nfunction toMs(d) {\n if (d.endsWith(\"ms\")) {\n return +d.substring(0, d.length - 2);\n }\n else {\n return +d.substring(0, d.length - 1) * 1000;\n }\n}\n//# sourceMappingURL=animation.js.map","import { jsx as _jsx } from \"react/jsx-runtime\";\nimport i18next from \"i18next\";\nexport function getIcon(name, isCustom) {\n if (isCustom === undefined) {\n isCustom = i18next.t(`${name}.library`) !== \"material\";\n name = i18next.t(`${name}.name`);\n }\n if (isCustom) {\n return _jsx(\"span\", { className: `icon-${name}` });\n }\n else {\n return name;\n }\n}\n//# sourceMappingURL=get-icon.js.map","import { createContext } from \"react\";\n/** Contexte d'un Scrollable, expose les méthodes associées. */\nexport const ScrollableContext = createContext({});\n/** Contexte d'un ScrollspyContainer, expose les méthodes associées. */\nexport const ScrollspyContext = createContext({\n /**\n * Enregistre un panel dans le Scrollspu\n * @param name L'id du panel souhaité.\n * @param panel La description d'un panel\n */\n registerPanel(name, panel) {\n return () => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n name;\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n panel;\n };\n }\n});\n//# sourceMappingURL=scroll-contexts.js.map","import { createContext } from \"react\";\nexport const ThemeContext = createContext({});\n//# sourceMappingURL=common.js.map","import classNames from \"classnames\";\nimport { pick } from \"lodash\";\nexport function toBem(css) {\n const data = {};\n for (const key in css) {\n const [element, modifier] = key.split(\"--\");\n if (data[element] && modifier) {\n data[element].push(modifier);\n }\n else if (!data[element]) {\n data[element] = modifier ? [modifier] : [];\n }\n }\n return Object.keys(data).reduce((bem, key) => ({\n ...bem,\n [key]: (mods = {}) => {\n if (mods !== true) {\n return classNames(css[key], ...data[key].filter(mod => mods[mod]).map(mod => css[`${key}--${mod}`]));\n }\n else {\n return pick(css, key, ...data[key].map(mod => `${key}--${mod}`));\n }\n }\n }), {});\n}\nexport function fromBem(css) {\n const res = {};\n for (const key in css) {\n const value = css[key];\n if (value) {\n if (typeof value === \"string\") {\n res[key] = value;\n }\n else {\n Object.assign(res, value(true));\n }\n }\n }\n return res;\n}\n//# sourceMappingURL=to-bem.js.map","import { useContext } from \"react\";\nimport { themeable } from \"@focus4/core\";\nimport { ThemeContext } from \"./common\";\nimport { fromBem, toBem } from \"./to-bem\";\n/** Hook pour récupérer le theme du contexte et le fusionner avec d'autres. */\nexport function useTheme(name, ...themes) {\n const contextTheme = fromBem(useContext(ThemeContext)[name]) || {};\n return toBem(themeable(contextTheme, ...themes.filter(x => x).map(x => fromBem(x))));\n}\n//# sourceMappingURL=use-theme.js.map","import { upperFirst } from \"lodash\";\nimport { useObserver } from \"mobx-react\";\nimport { useTheme } from \"./use-theme\";\n/**\n * Crée un composant pour injecter le theme souhaité dans un composant, via une render props (à la place du HoC de `react-css-themr`).\n * @param name Le nom de la clé de theme.\n * @param localTheme Le theme local, fourni par le composant.\n */\nexport function themr(name, localTheme) {\n function TC({ children, theme }) {\n const finalTheme = useTheme(name, localTheme, theme);\n return useObserver(() => children(finalTheme));\n }\n TC.displayName = `${upperFirst(name)}ThemeConsumer`;\n return TC;\n}\n//# sourceMappingURL=themr.js.map"],"names":["_jsx"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@focus4/styling",
|
|
3
|
-
"version": "11.
|
|
3
|
+
"version": "11.9.0-rc.0",
|
|
4
4
|
"description": "Focus v4, styling module",
|
|
5
5
|
"main": "lib/focus4.styling.js",
|
|
6
6
|
"repository": {
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"test-ci": "jest --ci --reporters=default --reporters=jest-junit"
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"@focus4/core": "11.
|
|
21
|
+
"@focus4/core": "11.9.0-rc.0",
|
|
22
22
|
"@types/react-dom": "18.2.7",
|
|
23
23
|
"classnames": "2.3.2",
|
|
24
24
|
"mobx-react": "7.6.0",
|
|
@@ -26,10 +26,10 @@
|
|
|
26
26
|
"react-dom": "18.2.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@types/jest": "29.5.
|
|
30
|
-
"jest": "29.
|
|
29
|
+
"@types/jest": "29.5.5",
|
|
30
|
+
"jest": "29.7.0",
|
|
31
31
|
"jest-junit": "16.0.0",
|
|
32
32
|
"ts-jest": "29.1.1"
|
|
33
33
|
},
|
|
34
|
-
"gitHead": "
|
|
34
|
+
"gitHead": "b95cd52e9de679dd908eee838725bf37c1b16251"
|
|
35
35
|
}
|