@cck-ui/core 0.4.8 → 0.4.10

package/cjs/components/transition/transition.cjs

@@ -1,6 +1,6 @@
 "use client";
-const require_export_helper = require("../../_virtual/_/plugin-vue/export-helper.cjs");
 const require_config_provider_context = require("../../core/config-provider/config-provider.context.cjs");
+const require_export_helper = require("../../_virtual/_/plugin-vue/export-helper.cjs");
 const require_use_transition = require("./use-transition.cjs");
 const require_get_transition_styles = require("./get-transition-styles/get-transition-styles.cjs");
 let vue = require("vue");

package/cjs/core/box/box.cjs

@@ -1,8 +1,8 @@
 "use client";
 const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
 const require_is_number_like = require("../utils/is-number-like/is-number-like.cjs");
-const require_export_helper = require("../../_virtual/_/plugin-vue/export-helper.cjs");
 const require_config_provider_context = require("../config-provider/config-provider.context.cjs");
+const require_export_helper = require("../../_virtual/_/plugin-vue/export-helper.cjs");
 const require_extract_style_props = require("./style-props/extract-style-props/extract-style-props.cjs");
 const require_parse_style_props = require("./style-props/parse-style-props/parse-style-props.cjs");
 const require_style_props_data = require("./style-props/style-props-data.cjs");

package/cjs/core/config-provider/cck-classes-style/cck-classes-style.cjs

@@ -0,0 +1,58 @@
+"use client";
+const require_px = require("../../utils/units-converters/px.cjs");
+const require_rem = require("../../utils/units-converters/rem.cjs");
+const require_keys = require("../../utils/keys/keys.cjs");
+const require_config_provider_context = require("../config-provider.context.cjs");
+const require_export_helper = require("../../../_virtual/_/plugin-vue/export-helper.cjs");
+let vue = require("vue");
+//#region packages/@cck-ui/core/src/core/config-provider/cck-classes-style/cck-classes-style.vue
+const _sfc_main = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "cck-classes-style",
+	setup(__props, { expose: __expose }) {
+		__expose();
+		const theme = require_config_provider_context.useCckTheme().value;
+		const nonce = require_config_provider_context.useCckStyleNonce();
+		const styleEl = (0, vue.ref)(null);
+		const generateClasses = () => {
+			return require_keys.keys(theme.breakpoints).reduce((acc, breakpoint) => {
+				const isPxBreakpoint = theme.breakpoints[breakpoint].includes("px");
+				const pxValue = require_px.px(theme.breakpoints[breakpoint]);
+				return `${acc}$media (max-width: ${isPxBreakpoint ? `${pxValue - .1}px` : require_rem.em(pxValue - .1)}) {.c-visible-from-${breakpoint} {display:none !important;}}@media (min-width: ${isPxBreakpoint ? `${pxValue}px` : require_rem.em(pxValue)}) {.c-hidden-from-${breakpoint} {display:none !important;}}`;
+			}, "");
+		};
+		const updateStyles = () => {
+			if (!styleEl.value) {
+				const el = document.createElement("style");
+				el.dataset.cStyles = "classes";
+				const nonceVal = nonce?.();
+				if (nonceVal) el.nonce = nonceVal;
+				document.head.appendChild(el);
+				styleEl.value = el;
+			}
+			styleEl.value.innerHTML = generateClasses();
+		};
+		(0, vue.onMounted)(() => {
+			updateStyles();
+		});
+		const __returned__ = {
+			theme,
+			nonce,
+			styleEl,
+			generateClasses,
+			updateStyles
+		};
+		Object.defineProperty(__returned__, "__isScriptSetup", {
+			enumerable: false,
+			value: true
+		});
+		return __returned__;
+	}
+});
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+	return null;
+}
+var cck_classes_style_default = /*#__PURE__*/ require_export_helper.default(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/cck-ui/cck-ui/packages/@cck-ui/core/src/core/config-provider/cck-classes-style/cck-classes-style.vue"]]);
+//#endregion
+exports.default = cck_classes_style_default;
+
+//# sourceMappingURL=cck-classes-style.cjs.map

package/cjs/core/config-provider/cck-classes-style/cck-classes-style.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"cck-classes-style.cjs","names":[],"sources":["../../../../src/core/config-provider/cck-classes-style/cck-classes-style.vue"],"sourcesContent":["<template></template>\n\n<script setup lang=\"ts\">\nimport { onMounted, ref } from 'vue'\nimport { useCckStyleNonce, useCckTheme } from '../config-provider.context'\nimport { em, keys, px } from '../../utils'\n\nconst theme = useCckTheme().value\nconst nonce = useCckStyleNonce()\n\nconst styleEl = ref<HTMLStyleElement | null>(null)\n\nconst generateClasses = () => {\n  return keys(theme.breakpoints).reduce<string>((acc, breakpoint) => {\n    const isPxBreakpoint = theme.breakpoints[breakpoint].includes('px')\n    const pxValue = px(theme.breakpoints[breakpoint]) as number\n    const maxWidthBreakpoint = isPxBreakpoint ? `${pxValue - 0.1}px` : em(pxValue - 0.1)\n    const minWidthBreakpoint = isPxBreakpoint ? `${pxValue}px` : em(pxValue)\n\n    return `${acc}$media (max-width: ${maxWidthBreakpoint}) {.c-visible-from-${breakpoint} {display:none !important;}}@media (min-width: ${minWidthBreakpoint}) {.c-hidden-from-${breakpoint} {display:none !important;}}`\n  }, '')\n}\n\nconst updateStyles = () => {\n  if (!styleEl.value) {\n    const el = document.createElement('style')\n    el.dataset.cStyles = 'classes'\n    const nonceVal = nonce?.()\n    if (nonceVal) {\n      el.nonce = nonceVal\n    }\n    document.head.appendChild(el)\n    styleEl.value = el\n  }\n  styleEl.value.innerHTML = generateClasses()\n}\n\nonMounted(() => {\n  updateStyles()\n})\n</script>\n"],"mappings":";;;;;;;;;;;;EAOA,MAAM,QAAQ,gCAAA,YAAY,CAAC,CAAC;EAC5B,MAAM,QAAQ,gCAAA,iBAAiB;EAE/B,MAAM,WAAA,GAAA,IAAA,IAAA,CAAuC,IAAI;EAEjD,MAAM,wBAAwB;GAC5B,OAAO,aAAA,KAAK,MAAM,WAAW,CAAC,CAAC,QAAgB,KAAK,eAAe;IACjE,MAAM,iBAAiB,MAAM,YAAY,WAAW,CAAC,SAAS,IAAI;IAClE,MAAM,UAAU,WAAA,GAAG,MAAM,YAAY,WAAW;IAIhD,OAAO,GAAG,IAAI,qBAHa,iBAAiB,GAAG,UAAU,GAAI,MAAM,YAAA,GAAG,UAAU,EAAG,EAG7B,qBAAqB,WAAW,iDAF3D,iBAAiB,GAAG,QAAQ,MAAM,YAAA,GAAG,OAAO,EAEmF,oBAAoB,WAAW;GAC3L,GAAG,EAAE;EACP;EAEA,MAAM,qBAAqB;GACzB,IAAI,CAAC,QAAQ,OAAO;IAClB,MAAM,KAAK,SAAS,cAAc,OAAO;IACzC,GAAG,QAAQ,UAAU;IACrB,MAAM,WAAW,QAAQ;IACzB,IAAI,UACF,GAAG,QAAQ;IAEb,SAAS,KAAK,YAAY,EAAE;IAC5B,QAAQ,QAAQ;GAClB;GACA,QAAQ,MAAM,YAAY,gBAAgB;EAC5C;EAEA,CAAA,GAAA,IAAA,UAAA,OAAgB;GACd,aAAa;EACf,CAAC"}

package/cjs/core/config-provider/config-provider.cjs

@@ -4,11 +4,12 @@ const require_use_provider_color_scheme = require("./use-cck-color-scheme/use-pr
 const require_local_storage_manager = require("./color-scheme-managers/local-storage-manager.cjs");
 const require_use_respect_reduce_motion = require("./use-respect-reduce-motion/use-respect-reduce-motion.cjs");
 const require_default_theme = require("./default-theme.cjs");
+const require_export_helper = require("../../_virtual/_/plugin-vue/export-helper.cjs");
+const require_cck_classes_style = require("./cck-classes-style/cck-classes-style.cjs");
 const require_merge_cck_theme = require("./merge-cck-theme/merge-cck-theme.cjs");
 require("./baseline.cjs");
 require("./global.cjs");
 require("./default-css-variables.cjs");
-const require_export_helper = require("../../_virtual/_/plugin-vue/export-helper.cjs");
 let vue = require("vue");
 //#region packages/@cck-ui/core/src/core/config-provider/config-provider.vue
 const _sfc_main = /*@__PURE__*/ (0, vue.defineComponent)({
@@ -110,7 +111,10 @@ const _sfc_main = /*@__PURE__*/ (0, vue.defineComponent)({
 			setColorScheme,
 			clearColorScheme,
 			_excludedTheme,
-			configWithoutTheme
+			configWithoutTheme,
+			get CckClassesStyle() {
+				return require_cck_classes_style.default;
+			}
 		};
 		Object.defineProperty(__returned__, "__isScriptSetup", {
 			enumerable: false,
@@ -120,7 +124,7 @@ const _sfc_main = /*@__PURE__*/ (0, vue.defineComponent)({
 	}
 });
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-	return (0, vue.renderSlot)(_ctx.$slots, "default");
+	return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [$props.withGlobalClasses ? ((0, vue.openBlock)(), (0, vue.createBlock)($setup["CckClassesStyle"], { key: 0 })) : (0, vue.createCommentVNode)("v-if", true), (0, vue.renderSlot)(_ctx.$slots, "default")], 64);
 }
 var config_provider_default = /*#__PURE__*/ require_export_helper.default(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/cck-ui/cck-ui/packages/@cck-ui/core/src/core/config-provider/config-provider.vue"]]);
 //#endregion

package/cjs/core/config-provider/config-provider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"config-provider.cjs","names":[],"sources":["../../../src/core/config-provider/config-provider.vue"],"sourcesContent":["<template>\n  <slot />\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, provide } from 'vue'\nimport { CONFIG_KEY, type ConfigProviderProps, THEME_KEY } from './config-provider.types'\nimport { useProviderColorScheme } from './use-cck-color-scheme/use-provider-color-scheme'\nimport { localStorageColorSchemeManager } from './color-scheme-managers'\nimport { useRespectReduceMotion } from './use-respect-reduce-motion/use-respect-reduce-motion'\nimport { DEFAULT_THEME } from './default-theme'\nimport { mergeCckTheme } from './merge-cck-theme'\nimport { CContextValue } from './config-provider.context'\nimport './baseline.css'\nimport './global.css'\nimport './default-css-variables.css'\n\ndefineOptions({\n  name: 'CckConfigProvider',\n})\n\nconst config = withDefaults(defineProps<ConfigProviderProps>(), {\n  withStaticClasses: true,\n  withGlobalClasses: true,\n  withCssVariables: true,\n  classNamesPrefix: 'c',\n  defaultColorScheme: 'light',\n  cssVariablesSelector: ':root',\n  colorSchemeManager: () => localStorageColorSchemeManager(),\n  getRootElement: () => document.documentElement,\n})\n\nconst {\n  defaultColorScheme,\n  forceColorScheme,\n  colorSchemeManager,\n  getRootElement,\n  theme: userTheme,\n} = config\n\nconst finalTheme = computed(() => {\n  if (userTheme) {\n    return mergeCckTheme(DEFAULT_THEME, userTheme)\n  }\n\n  return DEFAULT_THEME\n})\n\nconst { colorScheme, setColorScheme, clearColorScheme } = useProviderColorScheme({\n  defaultColorScheme,\n  forceColorScheme,\n  manager: colorSchemeManager,\n  getRootElement,\n})\n\nuseRespectReduceMotion({\n  respectReduceMotion: config.theme?.respectReducedMotion || false,\n  getRootElement,\n})\n\nconst { theme: _excludedTheme, ...configWithoutTheme } = config\nprovide<CContextValue>(CONFIG_KEY, {\n  ...configWithoutTheme,\n  colorScheme,\n  setColorScheme,\n  clearColorScheme,\n})\nprovide(THEME_KEY, finalTheme)\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBA,MAAM,SAAS;EAWf,MAAM,EACJ,oBACA,kBACA,oBACA,gBACA,OAAO,cACL;EAEJ,MAAM,cAAA,GAAA,IAAA,SAAA,OAA4B;GAChC,IAAI,WACF,OAAO,wBAAA,cAAc,sBAAA,eAAe,SAAS;GAG/C,OAAO,sBAAA;EACT,CAAC;EAED,MAAM,EAAE,aAAa,gBAAgB,qBAAqB,kCAAA,uBAAuB;GAC/E;GACA;GACA,SAAS;GACT;EACF,CAAC;EAED,kCAAA,uBAAuB;GACrB,qBAAqB,OAAO,OAAO,wBAAwB;GAC3D;EACF,CAAC;EAED,MAAM,EAAE,OAAO,gBAAgB,GAAG,uBAAuB;EACzD,CAAA,GAAA,IAAA,QAAA,CAAuB,8BAAA,YAAY;GACjC,GAAG;GACH;GACA;GACA;EACF,CAAC;EACD,CAAA,GAAA,IAAA,QAAA,CAAQ,8BAAA,WAAW,UAAU;;;;;;;;;;;;;;;;;;;;;;;4BAlEnB,KAAA,QAAA,SAAA"}
+{"version":3,"file":"config-provider.cjs","names":[],"sources":["../../../src/core/config-provider/config-provider.vue"],"sourcesContent":["<template>\n  <cck-classes-style v-if=\"withGlobalClasses\" />\n  <slot />\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, provide } from 'vue'\nimport { CONFIG_KEY, type ConfigProviderProps, THEME_KEY } from './config-provider.types'\nimport { useProviderColorScheme } from './use-cck-color-scheme/use-provider-color-scheme'\nimport { localStorageColorSchemeManager } from './color-scheme-managers'\nimport { useRespectReduceMotion } from './use-respect-reduce-motion/use-respect-reduce-motion'\nimport { CckClassesStyle } from './cck-classes-style'\nimport { DEFAULT_THEME } from './default-theme'\nimport { mergeCckTheme } from './merge-cck-theme'\nimport { CContextValue } from './config-provider.context'\nimport './baseline.css'\nimport './global.css'\nimport './default-css-variables.css'\n\ndefineOptions({\n  name: 'CckConfigProvider',\n})\n\nconst config = withDefaults(defineProps<ConfigProviderProps>(), {\n  withStaticClasses: true,\n  withGlobalClasses: true,\n  withCssVariables: true,\n  classNamesPrefix: 'c',\n  defaultColorScheme: 'light',\n  cssVariablesSelector: ':root',\n  colorSchemeManager: () => localStorageColorSchemeManager(),\n  getRootElement: () => document.documentElement,\n})\n\nconst {\n  defaultColorScheme,\n  forceColorScheme,\n  colorSchemeManager,\n  getRootElement,\n  theme: userTheme,\n} = config\n\nconst finalTheme = computed(() => {\n  if (userTheme) {\n    return mergeCckTheme(DEFAULT_THEME, userTheme)\n  }\n\n  return DEFAULT_THEME\n})\n\nconst { colorScheme, setColorScheme, clearColorScheme } = useProviderColorScheme({\n  defaultColorScheme,\n  forceColorScheme,\n  manager: colorSchemeManager,\n  getRootElement,\n})\n\nuseRespectReduceMotion({\n  respectReduceMotion: config.theme?.respectReducedMotion || false,\n  getRootElement,\n})\n\nconst { theme: _excludedTheme, ...configWithoutTheme } = config\nprovide<CContextValue>(CONFIG_KEY, {\n  ...configWithoutTheme,\n  colorScheme,\n  setColorScheme,\n  clearColorScheme,\n})\nprovide(THEME_KEY, finalTheme)\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuBA,MAAM,SAAS;EAWf,MAAM,EACJ,oBACA,kBACA,oBACA,gBACA,OAAO,cACL;EAEJ,MAAM,cAAA,GAAA,IAAA,SAAA,OAA4B;GAChC,IAAI,WACF,OAAO,wBAAA,cAAc,sBAAA,eAAe,SAAS;GAG/C,OAAO,sBAAA;EACT,CAAC;EAED,MAAM,EAAE,aAAa,gBAAgB,qBAAqB,kCAAA,uBAAuB;GAC/E;GACA;GACA,SAAS;GACT;EACF,CAAC;EAED,kCAAA,uBAAuB;GACrB,qBAAqB,OAAO,OAAO,wBAAwB;GAC3D;EACF,CAAC;EAED,MAAM,EAAE,OAAO,gBAAgB,GAAG,uBAAuB;EACzD,CAAA,GAAA,IAAA,QAAA,CAAuB,8BAAA,YAAY;GACjC,GAAG;GACH;GACA;GACA;EACF,CAAC;EACD,CAAA,GAAA,IAAA,QAAA,CAAQ,8BAAA,WAAW,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;+EApEF,OAAA,sBAAA,GAAA,IAAA,UAAA,CAAA,IAAA,GAAA,IAAA,YAAA,CAAqB,OAAA,oBAAA,EAAA,KAAA,EAAA,CAAA,MAAA,GAAA,IAAA,mBAAA,CAAA,QAAA,IAAA,IAAA,GAAA,IAAA,WAAA,CACtC,KAAA,QAAA,SAAA,CAAA,GAAA,EAAA"}

package/cjs/core/config-provider/index.cjs

@@ -13,11 +13,11 @@ const require_get_theme_color = require("./color-functions/get-theme-color/get-t
 const require_get_gradient = require("./color-functions/get-gradient/get-gradient.cjs");
 const require_default_variant_colors_resolver = require("./color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs");
 const require_default_theme = require("./default-theme.cjs");
+const require_config_provider_context = require("./config-provider.context.cjs");
 const require_config_provider = require("./config-provider.cjs");
 const require_virtual_color = require("./cck-css-variables/virtual-color/virtual-color.cjs");
 const require_get_css_color_variables = require("./cck-css-variables/get-css-color-variables.cjs");
 const require_default_css_variables_resolver = require("./cck-css-variables/default-css-variables-resolver.cjs");
-const require_config_provider_context = require("./config-provider.context.cjs");
 const require_create_theme = require("./create-theme/create-theme.cjs");
 const require_use_cck_color_scheme = require("./use-cck-color-scheme/use-cck-color-scheme.cjs");
 //#region packages/@cck-ui/core/src/core/config-provider/index.ts

package/cjs/index.cjs

@@ -31,10 +31,10 @@ const require_get_theme_color = require("./core/config-provider/color-functions/
 const require_get_gradient = require("./core/config-provider/color-functions/get-gradient/get-gradient.cjs");
 const require_default_variant_colors_resolver = require("./core/config-provider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.cjs");
 const require_default_theme = require("./core/config-provider/default-theme.cjs");
+const require_config_provider_context = require("./core/config-provider/config-provider.context.cjs");
 const require_virtual_color = require("./core/config-provider/cck-css-variables/virtual-color/virtual-color.cjs");
 const require_get_css_color_variables = require("./core/config-provider/cck-css-variables/get-css-color-variables.cjs");
 const require_default_css_variables_resolver = require("./core/config-provider/cck-css-variables/default-css-variables-resolver.cjs");
-const require_config_provider_context = require("./core/config-provider/config-provider.context.cjs");
 const require_create_theme = require("./core/config-provider/create-theme/create-theme.cjs");
 const require_use_cck_color_scheme = require("./core/config-provider/use-cck-color-scheme/use-cck-color-scheme.cjs");
 const require_index$1 = require("./core/config-provider/index.cjs");

package/esm/components/transition/transition.mjs

@@ -1,6 +1,6 @@
 "use client";
-import export_helper_default from "../../_virtual/_/plugin-vue/export-helper.mjs";
 import { useCckEnv } from "../../core/config-provider/config-provider.context.mjs";
+import export_helper_default from "../../_virtual/_/plugin-vue/export-helper.mjs";
 import { useTransition } from "./use-transition.mjs";
 import { getTransitionStyles } from "./get-transition-styles/get-transition-styles.mjs";
 import { computed, createCommentVNode, defineComponent, renderSlot, toRef } from "vue";

package/esm/core/box/box.mjs

@@ -1,7 +1,7 @@
 "use client";
 import { isNumberLike } from "../utils/is-number-like/is-number-like.mjs";
-import export_helper_default from "../../_virtual/_/plugin-vue/export-helper.mjs";
 import { useCckTheme } from "../config-provider/config-provider.context.mjs";
+import export_helper_default from "../../_virtual/_/plugin-vue/export-helper.mjs";
 import { extractStyleProps } from "./style-props/extract-style-props/extract-style-props.mjs";
 import { parseStyleProps } from "./style-props/parse-style-props/parse-style-props.mjs";
 import { STYLE_PROPS_DATA } from "./style-props/style-props-data.mjs";

package/esm/core/config-provider/cck-classes-style/cck-classes-style.mjs

@@ -0,0 +1,58 @@
+"use client";
+import { px } from "../../utils/units-converters/px.mjs";
+import { em } from "../../utils/units-converters/rem.mjs";
+import { keys } from "../../utils/keys/keys.mjs";
+import { useCckStyleNonce, useCckTheme } from "../config-provider.context.mjs";
+import export_helper_default from "../../../_virtual/_/plugin-vue/export-helper.mjs";
+import { defineComponent, onMounted, ref } from "vue";
+//#region packages/@cck-ui/core/src/core/config-provider/cck-classes-style/cck-classes-style.vue
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	__name: "cck-classes-style",
+	setup(__props, { expose: __expose }) {
+		__expose();
+		const theme = useCckTheme().value;
+		const nonce = useCckStyleNonce();
+		const styleEl = ref(null);
+		const generateClasses = () => {
+			return keys(theme.breakpoints).reduce((acc, breakpoint) => {
+				const isPxBreakpoint = theme.breakpoints[breakpoint].includes("px");
+				const pxValue = px(theme.breakpoints[breakpoint]);
+				return `${acc}$media (max-width: ${isPxBreakpoint ? `${pxValue - .1}px` : em(pxValue - .1)}) {.c-visible-from-${breakpoint} {display:none !important;}}@media (min-width: ${isPxBreakpoint ? `${pxValue}px` : em(pxValue)}) {.c-hidden-from-${breakpoint} {display:none !important;}}`;
+			}, "");
+		};
+		const updateStyles = () => {
+			if (!styleEl.value) {
+				const el = document.createElement("style");
+				el.dataset.cStyles = "classes";
+				const nonceVal = nonce?.();
+				if (nonceVal) el.nonce = nonceVal;
+				document.head.appendChild(el);
+				styleEl.value = el;
+			}
+			styleEl.value.innerHTML = generateClasses();
+		};
+		onMounted(() => {
+			updateStyles();
+		});
+		const __returned__ = {
+			theme,
+			nonce,
+			styleEl,
+			generateClasses,
+			updateStyles
+		};
+		Object.defineProperty(__returned__, "__isScriptSetup", {
+			enumerable: false,
+			value: true
+		});
+		return __returned__;
+	}
+});
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+	return null;
+}
+var cck_classes_style_default = /*#__PURE__*/ export_helper_default(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/cck-ui/cck-ui/packages/@cck-ui/core/src/core/config-provider/cck-classes-style/cck-classes-style.vue"]]);
+//#endregion
+export { cck_classes_style_default as default };
+
+//# sourceMappingURL=cck-classes-style.mjs.map

package/esm/core/config-provider/cck-classes-style/cck-classes-style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"cck-classes-style.mjs","names":[],"sources":["../../../../src/core/config-provider/cck-classes-style/cck-classes-style.vue"],"sourcesContent":["<template></template>\n\n<script setup lang=\"ts\">\nimport { onMounted, ref } from 'vue'\nimport { useCckStyleNonce, useCckTheme } from '../config-provider.context'\nimport { em, keys, px } from '../../utils'\n\nconst theme = useCckTheme().value\nconst nonce = useCckStyleNonce()\n\nconst styleEl = ref<HTMLStyleElement | null>(null)\n\nconst generateClasses = () => {\n  return keys(theme.breakpoints).reduce<string>((acc, breakpoint) => {\n    const isPxBreakpoint = theme.breakpoints[breakpoint].includes('px')\n    const pxValue = px(theme.breakpoints[breakpoint]) as number\n    const maxWidthBreakpoint = isPxBreakpoint ? `${pxValue - 0.1}px` : em(pxValue - 0.1)\n    const minWidthBreakpoint = isPxBreakpoint ? `${pxValue}px` : em(pxValue)\n\n    return `${acc}$media (max-width: ${maxWidthBreakpoint}) {.c-visible-from-${breakpoint} {display:none !important;}}@media (min-width: ${minWidthBreakpoint}) {.c-hidden-from-${breakpoint} {display:none !important;}}`\n  }, '')\n}\n\nconst updateStyles = () => {\n  if (!styleEl.value) {\n    const el = document.createElement('style')\n    el.dataset.cStyles = 'classes'\n    const nonceVal = nonce?.()\n    if (nonceVal) {\n      el.nonce = nonceVal\n    }\n    document.head.appendChild(el)\n    styleEl.value = el\n  }\n  styleEl.value.innerHTML = generateClasses()\n}\n\nonMounted(() => {\n  updateStyles()\n})\n</script>\n"],"mappings":";;;;;;;;;;;;EAOA,MAAM,QAAQ,YAAY,CAAC,CAAC;EAC5B,MAAM,QAAQ,iBAAiB;EAE/B,MAAM,UAAU,IAA6B,IAAI;EAEjD,MAAM,wBAAwB;GAC5B,OAAO,KAAK,MAAM,WAAW,CAAC,CAAC,QAAgB,KAAK,eAAe;IACjE,MAAM,iBAAiB,MAAM,YAAY,WAAW,CAAC,SAAS,IAAI;IAClE,MAAM,UAAU,GAAG,MAAM,YAAY,WAAW;IAIhD,OAAO,GAAG,IAAI,qBAHa,iBAAiB,GAAG,UAAU,GAAI,MAAM,GAAG,UAAU,EAAG,EAG7B,qBAAqB,WAAW,iDAF3D,iBAAiB,GAAG,QAAQ,MAAM,GAAG,OAAO,EAEmF,oBAAoB,WAAW;GAC3L,GAAG,EAAE;EACP;EAEA,MAAM,qBAAqB;GACzB,IAAI,CAAC,QAAQ,OAAO;IAClB,MAAM,KAAK,SAAS,cAAc,OAAO;IACzC,GAAG,QAAQ,UAAU;IACrB,MAAM,WAAW,QAAQ;IACzB,IAAI,UACF,GAAG,QAAQ;IAEb,SAAS,KAAK,YAAY,EAAE;IAC5B,QAAQ,QAAQ;GAClB;GACA,QAAQ,MAAM,YAAY,gBAAgB;EAC5C;EAEA,gBAAgB;GACd,aAAa;EACf,CAAC"}

package/esm/core/config-provider/config-provider.mjs

@@ -4,12 +4,13 @@ import { useProviderColorScheme } from "./use-cck-color-scheme/use-provider-colo
 import { localStorageColorSchemeManager } from "./color-scheme-managers/local-storage-manager.mjs";
 import { useRespectReduceMotion } from "./use-respect-reduce-motion/use-respect-reduce-motion.mjs";
 import { DEFAULT_THEME } from "./default-theme.mjs";
+import export_helper_default from "../../_virtual/_/plugin-vue/export-helper.mjs";
+import cck_classes_style_default from "./cck-classes-style/cck-classes-style.mjs";
 import { mergeCckTheme } from "./merge-cck-theme/merge-cck-theme.mjs";
 import "./baseline.mjs";
 import "./global.mjs";
 import "./default-css-variables.mjs";
-import export_helper_default from "../../_virtual/_/plugin-vue/export-helper.mjs";
-import { computed, defineComponent, provide, renderSlot } from "vue";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, defineComponent, openBlock, provide, renderSlot } from "vue";
 //#region packages/@cck-ui/core/src/core/config-provider/config-provider.vue
 const _sfc_main = /*@__PURE__*/ defineComponent({
 	name: "CckConfigProvider",
@@ -110,7 +111,10 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			setColorScheme,
 			clearColorScheme,
 			_excludedTheme,
-			configWithoutTheme
+			configWithoutTheme,
+			get CckClassesStyle() {
+				return cck_classes_style_default;
+			}
 		};
 		Object.defineProperty(__returned__, "__isScriptSetup", {
 			enumerable: false,
@@ -120,7 +124,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 	}
 });
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-	return renderSlot(_ctx.$slots, "default");
+	return openBlock(), createElementBlock(Fragment, null, [$props.withGlobalClasses ? (openBlock(), createBlock($setup["CckClassesStyle"], { key: 0 })) : createCommentVNode("v-if", true), renderSlot(_ctx.$slots, "default")], 64);
 }
 var config_provider_default = /*#__PURE__*/ export_helper_default(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/cck-ui/cck-ui/packages/@cck-ui/core/src/core/config-provider/config-provider.vue"]]);
 //#endregion

package/esm/core/config-provider/config-provider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"config-provider.mjs","names":[],"sources":["../../../src/core/config-provider/config-provider.vue"],"sourcesContent":["<template>\n  <slot />\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, provide } from 'vue'\nimport { CONFIG_KEY, type ConfigProviderProps, THEME_KEY } from './config-provider.types'\nimport { useProviderColorScheme } from './use-cck-color-scheme/use-provider-color-scheme'\nimport { localStorageColorSchemeManager } from './color-scheme-managers'\nimport { useRespectReduceMotion } from './use-respect-reduce-motion/use-respect-reduce-motion'\nimport { DEFAULT_THEME } from './default-theme'\nimport { mergeCckTheme } from './merge-cck-theme'\nimport { CContextValue } from './config-provider.context'\nimport './baseline.css'\nimport './global.css'\nimport './default-css-variables.css'\n\ndefineOptions({\n  name: 'CckConfigProvider',\n})\n\nconst config = withDefaults(defineProps<ConfigProviderProps>(), {\n  withStaticClasses: true,\n  withGlobalClasses: true,\n  withCssVariables: true,\n  classNamesPrefix: 'c',\n  defaultColorScheme: 'light',\n  cssVariablesSelector: ':root',\n  colorSchemeManager: () => localStorageColorSchemeManager(),\n  getRootElement: () => document.documentElement,\n})\n\nconst {\n  defaultColorScheme,\n  forceColorScheme,\n  colorSchemeManager,\n  getRootElement,\n  theme: userTheme,\n} = config\n\nconst finalTheme = computed(() => {\n  if (userTheme) {\n    return mergeCckTheme(DEFAULT_THEME, userTheme)\n  }\n\n  return DEFAULT_THEME\n})\n\nconst { colorScheme, setColorScheme, clearColorScheme } = useProviderColorScheme({\n  defaultColorScheme,\n  forceColorScheme,\n  manager: colorSchemeManager,\n  getRootElement,\n})\n\nuseRespectReduceMotion({\n  respectReduceMotion: config.theme?.respectReducedMotion || false,\n  getRootElement,\n})\n\nconst { theme: _excludedTheme, ...configWithoutTheme } = config\nprovide<CContextValue>(CONFIG_KEY, {\n  ...configWithoutTheme,\n  colorScheme,\n  setColorScheme,\n  clearColorScheme,\n})\nprovide(THEME_KEY, finalTheme)\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBA,MAAM,SAAS;EAWf,MAAM,EACJ,oBACA,kBACA,oBACA,gBACA,OAAO,cACL;EAEJ,MAAM,aAAa,eAAe;GAChC,IAAI,WACF,OAAO,cAAc,eAAe,SAAS;GAG/C,OAAO;EACT,CAAC;EAED,MAAM,EAAE,aAAa,gBAAgB,qBAAqB,uBAAuB;GAC/E;GACA;GACA,SAAS;GACT;EACF,CAAC;EAED,uBAAuB;GACrB,qBAAqB,OAAO,OAAO,wBAAwB;GAC3D;EACF,CAAC;EAED,MAAM,EAAE,OAAO,gBAAgB,GAAG,uBAAuB;EACzD,QAAuB,YAAY;GACjC,GAAG;GACH;GACA;GACA;EACF,CAAC;EACD,QAAQ,WAAW,UAAU;;;;;;;;;;;;;;;;;;;;;;;QAlE3B,WAAQ,KAAA,QAAA,SAAA"}
+{"version":3,"file":"config-provider.mjs","names":[],"sources":["../../../src/core/config-provider/config-provider.vue"],"sourcesContent":["<template>\n  <cck-classes-style v-if=\"withGlobalClasses\" />\n  <slot />\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, provide } from 'vue'\nimport { CONFIG_KEY, type ConfigProviderProps, THEME_KEY } from './config-provider.types'\nimport { useProviderColorScheme } from './use-cck-color-scheme/use-provider-color-scheme'\nimport { localStorageColorSchemeManager } from './color-scheme-managers'\nimport { useRespectReduceMotion } from './use-respect-reduce-motion/use-respect-reduce-motion'\nimport { CckClassesStyle } from './cck-classes-style'\nimport { DEFAULT_THEME } from './default-theme'\nimport { mergeCckTheme } from './merge-cck-theme'\nimport { CContextValue } from './config-provider.context'\nimport './baseline.css'\nimport './global.css'\nimport './default-css-variables.css'\n\ndefineOptions({\n  name: 'CckConfigProvider',\n})\n\nconst config = withDefaults(defineProps<ConfigProviderProps>(), {\n  withStaticClasses: true,\n  withGlobalClasses: true,\n  withCssVariables: true,\n  classNamesPrefix: 'c',\n  defaultColorScheme: 'light',\n  cssVariablesSelector: ':root',\n  colorSchemeManager: () => localStorageColorSchemeManager(),\n  getRootElement: () => document.documentElement,\n})\n\nconst {\n  defaultColorScheme,\n  forceColorScheme,\n  colorSchemeManager,\n  getRootElement,\n  theme: userTheme,\n} = config\n\nconst finalTheme = computed(() => {\n  if (userTheme) {\n    return mergeCckTheme(DEFAULT_THEME, userTheme)\n  }\n\n  return DEFAULT_THEME\n})\n\nconst { colorScheme, setColorScheme, clearColorScheme } = useProviderColorScheme({\n  defaultColorScheme,\n  forceColorScheme,\n  manager: colorSchemeManager,\n  getRootElement,\n})\n\nuseRespectReduceMotion({\n  respectReduceMotion: config.theme?.respectReducedMotion || false,\n  getRootElement,\n})\n\nconst { theme: _excludedTheme, ...configWithoutTheme } = config\nprovide<CContextValue>(CONFIG_KEY, {\n  ...configWithoutTheme,\n  colorScheme,\n  setColorScheme,\n  clearColorScheme,\n})\nprovide(THEME_KEY, finalTheme)\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuBA,MAAM,SAAS;EAWf,MAAM,EACJ,oBACA,kBACA,oBACA,gBACA,OAAO,cACL;EAEJ,MAAM,aAAa,eAAe;GAChC,IAAI,WACF,OAAO,cAAc,eAAe,SAAS;GAG/C,OAAO;EACT,CAAC;EAED,MAAM,EAAE,aAAa,gBAAgB,qBAAqB,uBAAuB;GAC/E;GACA;GACA,SAAS;GACT;EACF,CAAC;EAED,uBAAuB;GACrB,qBAAqB,OAAO,OAAO,wBAAwB;GAC3D;EACF,CAAC;EAED,MAAM,EAAE,OAAO,gBAAgB,GAAG,uBAAuB;EACzD,QAAuB,YAAY;GACjC,GAAG;GACH;GACA;GACA;EACF,CAAC;EACD,QAAQ,WAAW,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;yDApEF,OAAA,qBAAA,UAAA,GAAzB,YAA8C,OAAA,oBAAA,EAAA,KAAA,EAAA,CAAA,KAAA,mBAAA,QAAA,IAAA,GAC9C,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,EAAA"}

package/esm/core/config-provider/index.mjs

@@ -13,11 +13,11 @@ import { getThemeColor } from "./color-functions/get-theme-color/get-theme-color
 import { getGradient } from "./color-functions/get-gradient/get-gradient.mjs";
 import { defaultVariantColorsResolver } from "./color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs";
 import { DEFAULT_THEME } from "./default-theme.mjs";
+import { useCckClassNamesPrefix, useCckCssVariablesResolver, useCckEnv, useCckIsHeadless, useCckStyleNonce, useCckStylesTransform, useCckSxTransform, useCckTheme, useCckWithStaticClasses, useConfigContext } from "./config-provider.context.mjs";
 import config_provider_default from "./config-provider.mjs";
 import { isVirtualColor, virtualColor } from "./cck-css-variables/virtual-color/virtual-color.mjs";
 import { getCSSColorVariables } from "./cck-css-variables/get-css-color-variables.mjs";
 import { defaultCssVariablesResolver } from "./cck-css-variables/default-css-variables-resolver.mjs";
-import { useCckClassNamesPrefix, useCckCssVariablesResolver, useCckEnv, useCckIsHeadless, useCckStyleNonce, useCckStylesTransform, useCckSxTransform, useCckTheme, useCckWithStaticClasses, useConfigContext } from "./config-provider.context.mjs";
 import { createTheme } from "./create-theme/create-theme.mjs";
 import { useCckColorScheme } from "./use-cck-color-scheme/use-cck-color-scheme.mjs";
 //#region packages/@cck-ui/core/src/core/config-provider/index.ts

package/esm/index.mjs

@@ -27,10 +27,10 @@ import { getThemeColor } from "./core/config-provider/color-functions/get-theme-
 import { getGradient } from "./core/config-provider/color-functions/get-gradient/get-gradient.mjs";
 import { defaultVariantColorsResolver } from "./core/config-provider/color-functions/default-variant-colors-resolver/default-variant-colors-resolver.mjs";
 import { DEFAULT_THEME } from "./core/config-provider/default-theme.mjs";
+import { useCckClassNamesPrefix, useCckCssVariablesResolver, useCckEnv, useCckIsHeadless, useCckStyleNonce, useCckStylesTransform, useCckSxTransform, useCckTheme, useCckWithStaticClasses, useConfigContext } from "./core/config-provider/config-provider.context.mjs";
 import { isVirtualColor, virtualColor } from "./core/config-provider/cck-css-variables/virtual-color/virtual-color.mjs";
 import { getCSSColorVariables } from "./core/config-provider/cck-css-variables/get-css-color-variables.mjs";
 import { defaultCssVariablesResolver } from "./core/config-provider/cck-css-variables/default-css-variables-resolver.mjs";
-import { useCckClassNamesPrefix, useCckCssVariablesResolver, useCckEnv, useCckIsHeadless, useCckStyleNonce, useCckStylesTransform, useCckSxTransform, useCckTheme, useCckWithStaticClasses, useConfigContext } from "./core/config-provider/config-provider.context.mjs";
 import { createTheme } from "./core/config-provider/create-theme/create-theme.mjs";
 import { useCckColorScheme } from "./core/config-provider/use-cck-color-scheme/use-cck-color-scheme.mjs";
 import { CckConfigProvider } from "./core/config-provider/index.mjs";

package/lib/core/config-provider/cck-classes-style/index.d.ts

@@ -0,0 +1,2 @@
+import CckClassesStyle from './cck-classes-style.vue';
+export { CckClassesStyle };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cck-ui/core",
-  "version": "0.4.8",
+  "version": "0.4.10",
   "description": "Vue component library focused on usability, accessibility and developer experience",
   "homepage": "https://cck-ui.jackatlas.xyz",
   "license": "ISC",

package/styles/baseline.css

@@ -32,8 +32,12 @@ body,
 
   -webkit-font-smoothing: var(--c-webkit-font-smoothing);
   -moz-osx-font-smoothing: var(--c-moz-font-smoothing);
+}
 
-  @media screen and (max-device-width: em(500px)) {
-    -webkit-text-size-adjust: 100%;
-  }
+@media screen and (max-device-width: 31.25em) {
+
+body,
+:host {
+    -webkit-text-size-adjust: 100%
 }
+  }

package/styles/baseline.layer.css

@@ -32,9 +32,13 @@ body,
 
   -webkit-font-smoothing: var(--c-webkit-font-smoothing);
   -moz-osx-font-smoothing: var(--c-moz-font-smoothing);
+}
 
-  @media screen and (max-device-width: em(500px)) {
-    -webkit-text-size-adjust: 100%;
-  }
+@media screen and (max-device-width: 31.25em) {
+
+body,
+:host {
+    -webkit-text-size-adjust: 100%
 }
+  }
 }