@frontify/guideline-blocks-settings 3.0.2 → 4.0.0-alpha.0

package/dist/utilities/color/getReadableColor.es.js

@@ -1,14 +1,16 @@
-import { TinyColor as n, readability as d } from "@ctrl/tinycolor";
-import { toShortRgba as i } from "./toShortRgba.es.js";
-const s = (e) => typeof e == "object" && ["red", "green", "blue"].every((t) => e?.hasOwnProperty(t)), y = (e, r) => {
-  const t = s(e) ? i(e) : e, a = s(r) ? i(r) : r;
-  let o = new n(t);
-  const p = new n(a);
-  for (; d(o, p) < 4.5; )
-    o = o.darken(1);
-  return o.toRgbString();
+import { toShortRgba as e } from "./toShortRgba.es.js";
+import { TinyColor as t, readability as n } from "@ctrl/tinycolor";
+//#region src/utilities/color/getReadableColor.ts
+var r = (e) => typeof e == "object" && [
+	"red",
+	"green",
+	"blue"
+].every((t) => e?.hasOwnProperty(t)), i = (i, a) => {
+	let o = r(i) ? e(i) : i, s = r(a) ? e(a) : a, c = new t(o), l = new t(s);
+	for (; n(c, l) < 4.5;) c = c.darken(1);
+	return c.toRgbString();
 };
-export {
-  y as getReadableColor
-};
-//# sourceMappingURL=getReadableColor.es.js.map
+//#endregion
+export { i as getReadableColor };
+
+//# sourceMappingURL=getReadableColor.es.js.map

package/dist/utilities/color/getReadableColor.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"getReadableColor.es.js","sources":["../../../src/utilities/color/getReadableColor.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ColorInput, TinyColor, readability } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Returns darkened text color for a given background color, so that it is readable and has enough contrast (above 4.5)\n *\n * @param {Object} textColor Object of RGBA values\n * @param {Object} backgroundColor Object of RGBA values\n * @returns {string} To be used as css value\n */\n\nconst isRgbaLongFormat = (value: unknown): value is Color => {\n    const requiredKeys = ['red', 'green', 'blue'];\n    return typeof value === 'object' && requiredKeys.every((i) => value?.hasOwnProperty(i));\n};\n\nexport const getReadableColor = (textColor: unknown, backgroundColor: unknown): string => {\n    const inputTextColor = isRgbaLongFormat(textColor) ? toShortRgba(textColor) : (textColor as ColorInput);\n    const inputBackgroundColor = isRgbaLongFormat(backgroundColor)\n        ? toShortRgba(backgroundColor)\n        : (backgroundColor as ColorInput);\n    let parsedTextColor = new TinyColor(inputTextColor);\n    const parsedBackgroundColor = new TinyColor(inputBackgroundColor);\n\n    // darken the text color until readability is good\n    while (readability(parsedTextColor, parsedBackgroundColor) < 4.5) {\n        parsedTextColor = parsedTextColor.darken(1);\n    }\n\n    return parsedTextColor.toRgbString();\n};\n"],"names":["isRgbaLongFormat","value","i","getReadableColor","textColor","backgroundColor","inputTextColor","toShortRgba","inputBackgroundColor","parsedTextColor","TinyColor","parsedBackgroundColor","readability"],"mappings":";;AAeA,MAAMA,IAAmB,CAACC,MAEf,OAAOA,KAAU,YADH,CAAC,OAAO,SAAS,MAAM,EACK,MAAM,CAACC,MAAMD,GAAO,eAAeC,CAAC,CAAC,GAG7EC,IAAmB,CAACC,GAAoBC,MAAqC;AACtF,QAAMC,IAAiBN,EAAiBI,CAAS,IAAIG,EAAYH,CAAS,IAAKA,GACzEI,IAAuBR,EAAiBK,CAAe,IACvDE,EAAYF,CAAe,IAC1BA;AACP,MAAII,IAAkB,IAAIC,EAAUJ,CAAc;AAClD,QAAMK,IAAwB,IAAID,EAAUF,CAAoB;AAGhE,SAAOI,EAAYH,GAAiBE,CAAqB,IAAI;AACzD,IAAAF,IAAkBA,EAAgB,OAAO,CAAC;AAG9C,SAAOA,EAAgB,YAAA;AAC3B;"}
+{"version":3,"file":"getReadableColor.es.js","names":[],"sources":["../../../src/utilities/color/getReadableColor.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ColorInput, TinyColor, readability } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Returns darkened text color for a given background color, so that it is readable and has enough contrast (above 4.5)\n *\n * @param {Object} textColor Object of RGBA values\n * @param {Object} backgroundColor Object of RGBA values\n * @returns {string} To be used as css value\n */\n\nconst isRgbaLongFormat = (value: unknown): value is Color => {\n    const requiredKeys = ['red', 'green', 'blue'];\n    return typeof value === 'object' && requiredKeys.every((i) => value?.hasOwnProperty(i));\n};\n\nexport const getReadableColor = (textColor: unknown, backgroundColor: unknown): string => {\n    const inputTextColor = isRgbaLongFormat(textColor) ? toShortRgba(textColor) : (textColor as ColorInput);\n    const inputBackgroundColor = isRgbaLongFormat(backgroundColor)\n        ? toShortRgba(backgroundColor)\n        : (backgroundColor as ColorInput);\n    let parsedTextColor = new TinyColor(inputTextColor);\n    const parsedBackgroundColor = new TinyColor(inputBackgroundColor);\n\n    // darken the text color until readability is good\n    while (readability(parsedTextColor, parsedBackgroundColor) < 4.5) {\n        parsedTextColor = parsedTextColor.darken(1);\n    }\n\n    return parsedTextColor.toRgbString();\n};\n"],"mappings":";;;AAeA,IAAM,KAAoB,MAEf,OAAO,KAAU,YAAY;CADd;CAAO;CAAS;AACF,CAAA,CAAa,OAAO,MAAM,GAAO,eAAe,CAAC,CAAC,GAG7E,KAAoB,GAAoB,MAAqC;CACtF,IAAM,IAAiB,EAAiB,CAAS,IAAI,EAAY,CAAS,IAAK,GACzE,IAAuB,EAAiB,CAAe,IACvD,EAAY,CAAe,IAC1B,GACH,IAAkB,IAAI,EAAU,CAAc,GAC5C,IAAwB,IAAI,EAAU,CAAoB;CAGhE,OAAO,EAAY,GAAiB,CAAqB,IAAI,MACzD,IAAkB,EAAgB,OAAO,CAAC;CAG9C,OAAO,EAAgB,YAAY;AACvC"}

package/dist/utilities/color/isDark.es.js

@@ -1,10 +1,15 @@
-import { TinyColor as n } from "@ctrl/tinycolor";
-import { toShortRgba as s } from "./toShortRgba.es.js";
-const i = (r) => typeof r == "object" && ["red", "green", "blue"].every((o) => r?.hasOwnProperty(o)), g = (r, t) => {
-  const o = i(r) ? s(r) : r, e = new n(o);
-  return t ? e.getBrightness() < t : e.isDark() || e.getAlpha() > 0.25 && e.getAlpha() < 1;
+import { toShortRgba as e } from "./toShortRgba.es.js";
+import { TinyColor as t } from "@ctrl/tinycolor";
+//#region src/utilities/color/isDark.ts
+var n = (e) => typeof e == "object" && [
+	"red",
+	"green",
+	"blue"
+].every((t) => e?.hasOwnProperty(t)), r = (r, i) => {
+	let a = n(r) ? e(r) : r, o = new t(a);
+	return i ? o.getBrightness() < i : o.isDark() || o.getAlpha() > .25 && o.getAlpha() < 1;
 };
-export {
-  g as isDark
-};
-//# sourceMappingURL=isDark.es.js.map
+//#endregion
+export { r as isDark };
+
+//# sourceMappingURL=isDark.es.js.map

package/dist/utilities/color/isDark.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"isDark.es.js","sources":["../../../src/utilities/color/isDark.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ColorInput, TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Calculates if text should be in a light color depending on color (e.g. background-color)\n *\n * @param {Object} value Object of RGBA values\n * @param {Number|undefined} threshold Threshold for the brightness\n * @returns {Boolean} Return if the color is dark\n */\n\nconst isRgbaLongFormat = (value: unknown): value is Color => {\n    const requiredKeys = ['red', 'green', 'blue'];\n    return typeof value === 'object' && requiredKeys.every((i) => value?.hasOwnProperty(i));\n};\n\nexport const isDark = (color: unknown, threshold?: number): boolean => {\n    const inputColor = isRgbaLongFormat(color) ? toShortRgba(color) : (color as ColorInput);\n    const parsedColor = new TinyColor(inputColor);\n\n    if (threshold) {\n        return parsedColor.getBrightness() < threshold;\n    }\n\n    return parsedColor.isDark() || (parsedColor.getAlpha() > 0.25 && parsedColor.getAlpha() < 1);\n};\n"],"names":["isRgbaLongFormat","value","i","isDark","color","threshold","inputColor","toShortRgba","parsedColor","TinyColor"],"mappings":";;AAeA,MAAMA,IAAmB,CAACC,MAEf,OAAOA,KAAU,YADH,CAAC,OAAO,SAAS,MAAM,EACK,MAAM,CAACC,MAAMD,GAAO,eAAeC,CAAC,CAAC,GAG7EC,IAAS,CAACC,GAAgBC,MAAgC;AACnE,QAAMC,IAAaN,EAAiBI,CAAK,IAAIG,EAAYH,CAAK,IAAKA,GAC7DI,IAAc,IAAIC,EAAUH,CAAU;AAE5C,SAAID,IACOG,EAAY,kBAAkBH,IAGlCG,EAAY,YAAaA,EAAY,aAAa,QAAQA,EAAY,SAAA,IAAa;AAC9F;"}
+{"version":3,"file":"isDark.es.js","names":[],"sources":["../../../src/utilities/color/isDark.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ColorInput, TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Calculates if text should be in a light color depending on color (e.g. background-color)\n *\n * @param {Object} value Object of RGBA values\n * @param {Number|undefined} threshold Threshold for the brightness\n * @returns {Boolean} Return if the color is dark\n */\n\nconst isRgbaLongFormat = (value: unknown): value is Color => {\n    const requiredKeys = ['red', 'green', 'blue'];\n    return typeof value === 'object' && requiredKeys.every((i) => value?.hasOwnProperty(i));\n};\n\nexport const isDark = (color: unknown, threshold?: number): boolean => {\n    const inputColor = isRgbaLongFormat(color) ? toShortRgba(color) : (color as ColorInput);\n    const parsedColor = new TinyColor(inputColor);\n\n    if (threshold) {\n        return parsedColor.getBrightness() < threshold;\n    }\n\n    return parsedColor.isDark() || (parsedColor.getAlpha() > 0.25 && parsedColor.getAlpha() < 1);\n};\n"],"mappings":";;;AAeA,IAAM,KAAoB,MAEf,OAAO,KAAU,YAAY;CADd;CAAO;CAAS;AACF,CAAA,CAAa,OAAO,MAAM,GAAO,eAAe,CAAC,CAAC,GAG7E,KAAU,GAAgB,MAAgC;CACnE,IAAM,IAAa,EAAiB,CAAK,IAAI,EAAY,CAAK,IAAK,GAC7D,IAAc,IAAI,EAAU,CAAU;CAM5C,OAJI,IACO,EAAY,cAAc,IAAI,IAGlC,EAAY,OAAO,KAAM,EAAY,SAAS,IAAI,OAAQ,EAAY,SAAS,IAAI;AAC9F"}

package/dist/utilities/color/setAlpha.es.js

@@ -1,6 +1,7 @@
-import { TinyColor as r } from "@ctrl/tinycolor";
-const n = (t, o) => new r(o).setAlpha(t).toRgbString();
-export {
-  n as setAlpha
-};
-//# sourceMappingURL=setAlpha.es.js.map
+import { TinyColor as e } from "@ctrl/tinycolor";
+//#region src/utilities/color/setAlpha.ts
+var t = (t, n) => new e(n).setAlpha(t).toRgbString();
+//#endregion
+export { t as setAlpha };
+
+//# sourceMappingURL=setAlpha.es.js.map

package/dist/utilities/color/setAlpha.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"setAlpha.es.js","sources":["../../../src/utilities/color/setAlpha.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\n\n/**\n * Sets alpha value and returns rgba string.\n *\n * @param {string} color Rgb or hex string.\n * @returns {String} To be used as css value.\n */\n\nexport const setAlpha = (alpha: number, color?: string): string => {\n    return new TinyColor(color).setAlpha(alpha).toRgbString();\n};\n"],"names":["setAlpha","alpha","color","TinyColor"],"mappings":";AAWO,MAAMA,IAAW,CAACC,GAAeC,MAC7B,IAAIC,EAAUD,CAAK,EAAE,SAASD,CAAK,EAAE,YAAA;"}
+{"version":3,"file":"setAlpha.es.js","names":[],"sources":["../../../src/utilities/color/setAlpha.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\n\n/**\n * Sets alpha value and returns rgba string.\n *\n * @param {string} color Rgb or hex string.\n * @returns {String} To be used as css value.\n */\n\nexport const setAlpha = (alpha: number, color?: string): string => {\n    return new TinyColor(color).setAlpha(alpha).toRgbString();\n};\n"],"mappings":";;AAWA,IAAa,KAAY,GAAe,MAC7B,IAAI,EAAU,CAAK,CAAC,CAAC,SAAS,CAAK,CAAC,CAAC,YAAY"}

package/dist/utilities/color/toColorObject.es.js

@@ -1,9 +1,15 @@
-import { TinyColor as l } from "@ctrl/tinycolor";
-const b = (o) => {
-  const { r, g: e, b: t, a: n } = new l(o);
-  return { red: r, green: e, blue: t, alpha: n };
+import { TinyColor as e } from "@ctrl/tinycolor";
+//#region src/utilities/color/toColorObject.ts
+var t = (t) => {
+	let { r: n, g: r, b: i, a } = new e(t);
+	return {
+		red: n,
+		green: r,
+		blue: i,
+		alpha: a
+	};
 };
-export {
-  b as toColorObject
-};
-//# sourceMappingURL=toColorObject.es.js.map
+//#endregion
+export { t as toColorObject };
+
+//# sourceMappingURL=toColorObject.es.js.map

package/dist/utilities/color/toColorObject.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"toColorObject.es.js","sources":["../../../src/utilities/color/toColorObject.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\n/**\n * Maps color strings to color objects.\n *\n * @param {String} String representing color\n * @returns {Color} Color object\n */\n\nexport const toColorObject = (colorString: string): Color => {\n    const { r, g, b, a } = new TinyColor(colorString);\n    return { red: r, green: g, blue: b, alpha: a };\n};\n"],"names":["toColorObject","colorString","g","b","a","TinyColor"],"mappings":";AAYO,MAAMA,IAAgB,CAACC,MAA+B;AACzD,QAAM,EAAE,GAAG,GAAAC,GAAG,GAAAC,GAAG,GAAAC,MAAM,IAAIC,EAAUJ,CAAW;AAChD,SAAO,EAAE,KAAK,GAAG,OAAOC,GAAG,MAAMC,GAAG,OAAOC,EAAA;AAC/C;"}
+{"version":3,"file":"toColorObject.es.js","names":[],"sources":["../../../src/utilities/color/toColorObject.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\n/**\n * Maps color strings to color objects.\n *\n * @param {String} String representing color\n * @returns {Color} Color object\n */\n\nexport const toColorObject = (colorString: string): Color => {\n    const { r, g, b, a } = new TinyColor(colorString);\n    return { red: r, green: g, blue: b, alpha: a };\n};\n"],"mappings":";;AAYA,IAAa,KAAiB,MAA+B;CACzD,IAAM,EAAE,MAAG,MAAG,MAAG,MAAM,IAAI,EAAU,CAAW;CAChD,OAAO;EAAE,KAAK;EAAG,OAAO;EAAG,MAAM;EAAG,OAAO;CAAE;AACjD"}

package/dist/utilities/color/toHex8String.es.js

@@ -1,7 +1,8 @@
+import { toShortRgba as e } from "./toShortRgba.es.js";
 import { TinyColor as t } from "@ctrl/tinycolor";
-import { toShortRgba as r } from "./toShortRgba.es.js";
-const e = (o) => new t(r(o)).toHex8String();
-export {
-  e as toHex8String
-};
-//# sourceMappingURL=toHex8String.es.js.map
+//#region src/utilities/color/toHex8String.ts
+var n = (n) => new t(e(n)).toHex8String();
+//#endregion
+export { n as toHex8String };
+
+//# sourceMappingURL=toHex8String.es.js.map

package/dist/utilities/color/toHex8String.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"toHex8String.es.js","sources":["../../../src/utilities/color/toHex8String.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Maps color object of rgba values to hex alpha string.\n *\n * @param {Object} Color object\n * @returns {String} To be used as css value.\n */\n\nexport const toHex8String = (color: Color): string => new TinyColor(toShortRgba(color)).toHex8String();\n"],"names":["toHex8String","color","TinyColor","toShortRgba"],"mappings":";;AAcO,MAAMA,IAAe,CAACC,MAAyB,IAAIC,EAAUC,EAAYF,CAAK,CAAC,EAAE,aAAA;"}
+{"version":3,"file":"toHex8String.es.js","names":[],"sources":["../../../src/utilities/color/toHex8String.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Maps color object of rgba values to hex alpha string.\n *\n * @param {Object} Color object\n * @returns {String} To be used as css value.\n */\n\nexport const toHex8String = (color: Color): string => new TinyColor(toShortRgba(color)).toHex8String();\n"],"mappings":";;;AAcA,IAAa,KAAgB,MAAyB,IAAI,EAAU,EAAY,CAAK,CAAC,CAAC,CAAC,aAAa"}

package/dist/utilities/color/toHexString.es.js

@@ -1,7 +1,8 @@
+import { toShortRgba as e } from "./toShortRgba.es.js";
 import { TinyColor as t } from "@ctrl/tinycolor";
-import { toShortRgba as r } from "./toShortRgba.es.js";
-const e = (o) => new t(r(o)).toHexString();
-export {
-  e as toHexString
-};
-//# sourceMappingURL=toHexString.es.js.map
+//#region src/utilities/color/toHexString.ts
+var n = (n) => new t(e(n)).toHexString();
+//#endregion
+export { n as toHexString };
+
+//# sourceMappingURL=toHexString.es.js.map

package/dist/utilities/color/toHexString.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"toHexString.es.js","sources":["../../../src/utilities/color/toHexString.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Maps color object of rgba values to hex alpha string.\n */\nexport const toHexString = (color: Color): string => new TinyColor(toShortRgba(color)).toHexString();\n"],"names":["toHexString","color","TinyColor","toShortRgba"],"mappings":";;AAUO,MAAMA,IAAc,CAACC,MAAyB,IAAIC,EAAUC,EAAYF,CAAK,CAAC,EAAE,YAAA;"}
+{"version":3,"file":"toHexString.es.js","names":[],"sources":["../../../src/utilities/color/toHexString.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Maps color object of rgba values to hex alpha string.\n */\nexport const toHexString = (color: Color): string => new TinyColor(toShortRgba(color)).toHexString();\n"],"mappings":";;;AAUA,IAAa,KAAe,MAAyB,IAAI,EAAU,EAAY,CAAK,CAAC,CAAC,CAAC,YAAY"}

package/dist/utilities/color/toRgbaString.es.js

@@ -1,7 +1,8 @@
+import { toShortRgba as e } from "./toShortRgba.es.js";
 import { TinyColor as t } from "@ctrl/tinycolor";
-import { toShortRgba as r } from "./toShortRgba.es.js";
-const n = (o) => new t(r(o)).toRgbString();
-export {
-  n as toRgbaString
-};
-//# sourceMappingURL=toRgbaString.es.js.map
+//#region src/utilities/color/toRgbaString.ts
+var n = (n) => new t(e(n)).toRgbString();
+//#endregion
+export { n as toRgbaString };
+
+//# sourceMappingURL=toRgbaString.es.js.map

package/dist/utilities/color/toRgbaString.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"toRgbaString.es.js","sources":["../../../src/utilities/color/toRgbaString.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Maps color object of rgba values to rgba string.\n *\n * @param {Object} Color object\n * @returns {String} To be used as css value.\n */\n\nexport const toRgbaString = (color: Color): string => new TinyColor(toShortRgba(color)).toRgbString();\n"],"names":["toRgbaString","color","TinyColor","toShortRgba"],"mappings":";;AAcO,MAAMA,IAAe,CAACC,MAAyB,IAAIC,EAAUC,EAAYF,CAAK,CAAC,EAAE,YAAA;"}
+{"version":3,"file":"toRgbaString.es.js","names":[],"sources":["../../../src/utilities/color/toRgbaString.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TinyColor } from '@ctrl/tinycolor';\nimport { type Color } from '@frontify/sidebar-settings';\n\nimport { toShortRgba } from './toShortRgba';\n\n/**\n * Maps color object of rgba values to rgba string.\n *\n * @param {Object} Color object\n * @returns {String} To be used as css value.\n */\n\nexport const toRgbaString = (color: Color): string => new TinyColor(toShortRgba(color)).toRgbString();\n"],"mappings":";;;AAcA,IAAa,KAAgB,MAAyB,IAAI,EAAU,EAAY,CAAK,CAAC,CAAC,CAAC,YAAY"}

package/dist/utilities/color/toShortRgba.es.js

@@ -1,11 +1,18 @@
-const a = (e) => {
-  const n = (r) => typeof r == "object" && ["red", "green", "blue"].every((s) => r.hasOwnProperty(s)), o = (r) => {
-    const t = typeof r.alpha == "number" ? r.alpha : 1;
-    return { r: r.red, g: r.green, b: r.blue, a: t };
-  };
-  return n(e) ? o(e) : e;
-};
-export {
-  a as toShortRgba
-};
-//# sourceMappingURL=toShortRgba.es.js.map
+//#region src/utilities/color/toShortRgba.ts
+var e = (e) => ((e) => typeof e == "object" && [
+	"red",
+	"green",
+	"blue"
+].every((t) => e.hasOwnProperty(t)))(e) ? ((e) => {
+	let t = typeof e.alpha == "number" ? e.alpha : 1;
+	return {
+		r: e.red,
+		g: e.green,
+		b: e.blue,
+		a: t
+	};
+})(e) : e;
+//#endregion
+export { e as toShortRgba };
+
+//# sourceMappingURL=toShortRgba.es.js.map

package/dist/utilities/color/toShortRgba.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"toShortRgba.es.js","sources":["../../../src/utilities/color/toShortRgba.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Color } from '@frontify/sidebar-settings';\n\ntype ShortNotationColor = {\n    r: number;\n    g: number;\n    b: number;\n    a?: number;\n};\n\n/**\n * Maps color object from long to short rgba notation.\n *\n * @param {Object} Color object\n * @returns {Object} ShortNotationColor object\n */\n\nexport const toShortRgba = (color: unknown): ShortNotationColor => {\n    const isRgbaLongFormat = (value: Color) => {\n        const requiredKeys = ['red', 'green', 'blue'];\n        return typeof value === 'object' && requiredKeys.every((i) => value.hasOwnProperty(i));\n    };\n\n    const mapToShortFormat = (value: Color): ShortNotationColor => {\n        const alpha = typeof value.alpha === 'number' ? value.alpha : 1;\n        return { r: value.red, g: value.green, b: value.blue, a: alpha };\n    };\n\n    if (isRgbaLongFormat(color as Color)) {\n        return mapToShortFormat(color as Color);\n    }\n\n    return color as ShortNotationColor;\n};\n"],"names":["toShortRgba","color","isRgbaLongFormat","value","i","mapToShortFormat","alpha"],"mappings":"AAkBO,MAAMA,IAAc,CAACC,MAAuC;AAC/D,QAAMC,IAAmB,CAACC,MAEf,OAAOA,KAAU,YADH,CAAC,OAAO,SAAS,MAAM,EACK,MAAM,CAACC,MAAMD,EAAM,eAAeC,CAAC,CAAC,GAGnFC,IAAmB,CAACF,MAAqC;AAC3D,UAAMG,IAAQ,OAAOH,EAAM,SAAU,WAAWA,EAAM,QAAQ;AAC9D,WAAO,EAAE,GAAGA,EAAM,KAAK,GAAGA,EAAM,OAAO,GAAGA,EAAM,MAAM,GAAGG,EAAA;AAAA,EAC7D;AAEA,SAAIJ,EAAiBD,CAAc,IACxBI,EAAiBJ,CAAc,IAGnCA;AACX;"}
+{"version":3,"file":"toShortRgba.es.js","names":[],"sources":["../../../src/utilities/color/toShortRgba.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Color } from '@frontify/sidebar-settings';\n\ntype ShortNotationColor = {\n    r: number;\n    g: number;\n    b: number;\n    a?: number;\n};\n\n/**\n * Maps color object from long to short rgba notation.\n *\n * @param {Object} Color object\n * @returns {Object} ShortNotationColor object\n */\n\nexport const toShortRgba = (color: unknown): ShortNotationColor => {\n    const isRgbaLongFormat = (value: Color) => {\n        const requiredKeys = ['red', 'green', 'blue'];\n        return typeof value === 'object' && requiredKeys.every((i) => value.hasOwnProperty(i));\n    };\n\n    const mapToShortFormat = (value: Color): ShortNotationColor => {\n        const alpha = typeof value.alpha === 'number' ? value.alpha : 1;\n        return { r: value.red, g: value.green, b: value.blue, a: alpha };\n    };\n\n    if (isRgbaLongFormat(color as Color)) {\n        return mapToShortFormat(color as Color);\n    }\n\n    return color as ShortNotationColor;\n};\n"],"mappings":";AAkBA,IAAa,KAAe,QACE,MAEf,OAAO,KAAU,YAAY;CADd;CAAO;CAAS;AACF,CAAA,CAAa,OAAO,MAAM,EAAM,eAAe,CAAC,CAAC,EAQrF,CAAiB,CAAc,MALT,MAAqC;CAC3D,IAAM,IAAQ,OAAO,EAAM,SAAU,WAAW,EAAM,QAAQ;CAC9D,OAAO;EAAE,GAAG,EAAM;EAAK,GAAG,EAAM;EAAO,GAAG,EAAM;EAAM,GAAG;CAAM;AACnE,EAGW,CAAiB,CAAc,IAGnC"}

package/dist/utilities/react/getBackgroundColorStyles.es.js

@@ -1,8 +1,7 @@
-import { toRgbaString as r } from "../color/toRgbaString.es.js";
-const g = (o) => ({
-  backgroundColor: r(o)
-});
-export {
-  g as getBackgroundColorStyles
-};
-//# sourceMappingURL=getBackgroundColorStyles.es.js.map
+import { toRgbaString as e } from "../color/toRgbaString.es.js";
+//#region src/utilities/react/getBackgroundColorStyles.ts
+var t = (t) => ({ backgroundColor: e(t) });
+//#endregion
+export { t as getBackgroundColorStyles };
+
+//# sourceMappingURL=getBackgroundColorStyles.es.js.map

package/dist/utilities/react/getBackgroundColorStyles.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"getBackgroundColorStyles.es.js","sources":["../../../src/utilities/react/getBackgroundColorStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Color } from '@frontify/sidebar-settings';\nimport { type CSSProperties } from 'react';\n\nimport { toRgbaString } from '../color';\n\nexport const getBackgroundColorStyles = (backgroundColor: Color): CSSProperties => ({\n    backgroundColor: toRgbaString(backgroundColor),\n});\n"],"names":["getBackgroundColorStyles","backgroundColor","toRgbaString"],"mappings":";AAOO,MAAMA,IAA2B,CAACC,OAA2C;AAAA,EAChF,iBAAiBC,EAAaD,CAAe;AACjD;"}
+{"version":3,"file":"getBackgroundColorStyles.es.js","names":[],"sources":["../../../src/utilities/react/getBackgroundColorStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Color } from '@frontify/sidebar-settings';\nimport { type CSSProperties } from 'react';\n\nimport { toRgbaString } from '../color';\n\nexport const getBackgroundColorStyles = (backgroundColor: Color): CSSProperties => ({\n    backgroundColor: toRgbaString(backgroundColor),\n});\n"],"mappings":";;AAOA,IAAa,KAA4B,OAA2C,EAChF,iBAAiB,EAAa,CAAe,EACjD"}

package/dist/utilities/react/getBorderStyles.es.js

@@ -1,12 +1,13 @@
-import { BORDER_COLOR_DEFAULT_VALUE as e } from "../../settings/defaultValues.es.js";
-import { BorderStyle as d, borderStyleMap as l } from "../../settings/types.es.js";
-import { toRgbaString as m } from "../color/toRgbaString.es.js";
-const b = (r = d.Solid, o = "1px", t = e) => ({
-  borderStyle: l[r],
-  borderWidth: o,
-  borderColor: m(t)
+import { toRgbaString as e } from "../color/toRgbaString.es.js";
+import { BORDER_COLOR_DEFAULT_VALUE as t } from "../../settings/defaultValues.es.js";
+import { BorderStyle as n, borderStyleMap as r } from "../../settings/types.es.js";
+//#region src/utilities/react/getBorderStyles.ts
+var i = (i = n.Solid, a = "1px", o = t) => ({
+	borderStyle: r[i],
+	borderWidth: a,
+	borderColor: e(o)
 });
-export {
-  b as getBorderStyles
-};
-//# sourceMappingURL=getBorderStyles.es.js.map
+//#endregion
+export { i as getBorderStyles };
+
+//# sourceMappingURL=getBorderStyles.es.js.map

package/dist/utilities/react/getBorderStyles.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"getBorderStyles.es.js","sources":["../../../src/utilities/react/getBorderStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Color } from '@frontify/sidebar-settings';\nimport { type CSSProperties } from 'react';\n\nimport { BORDER_COLOR_DEFAULT_VALUE } from '../../settings/defaultValues';\nimport { BorderStyle, borderStyleMap } from '../../settings/types';\nimport { toRgbaString } from '../color';\n\nexport const getBorderStyles = (\n    style = BorderStyle.Solid,\n    borderWidth = '1px',\n    color = BORDER_COLOR_DEFAULT_VALUE as Color,\n): CSSProperties => {\n    return {\n        borderStyle: borderStyleMap[style],\n        borderWidth,\n        borderColor: toRgbaString(color),\n    };\n};\n"],"names":["getBorderStyles","style","BorderStyle","borderWidth","color","BORDER_COLOR_DEFAULT_VALUE","borderStyleMap","toRgbaString"],"mappings":";;;AASO,MAAMA,IAAkB,CAC3BC,IAAQC,EAAY,OACpBC,IAAc,OACdC,IAAQC,OAED;AAAA,EACH,aAAaC,EAAeL,CAAK;AAAA,EACjC,aAAAE;AAAA,EACA,aAAaI,EAAaH,CAAK;AAAA;"}
+{"version":3,"file":"getBorderStyles.es.js","names":[],"sources":["../../../src/utilities/react/getBorderStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Color } from '@frontify/sidebar-settings';\nimport { type CSSProperties } from 'react';\n\nimport { BORDER_COLOR_DEFAULT_VALUE } from '../../settings/defaultValues';\nimport { BorderStyle, borderStyleMap } from '../../settings/types';\nimport { toRgbaString } from '../color';\n\nexport const getBorderStyles = (\n    style = BorderStyle.Solid,\n    borderWidth = '1px',\n    color = BORDER_COLOR_DEFAULT_VALUE as Color,\n): CSSProperties => {\n    return {\n        borderStyle: borderStyleMap[style],\n        borderWidth,\n        borderColor: toRgbaString(color),\n    };\n};\n"],"mappings":";;;;AASA,IAAa,KACT,IAAQ,EAAY,OACpB,IAAc,OACd,IAAQ,OAED;CACH,aAAa,EAAe;CAC5B;CACA,aAAa,EAAa,CAAK;AACnC"}

package/dist/utilities/react/getRadiusStyles.es.js

@@ -1,8 +1,7 @@
-import { radiusStyleMap as t } from "../../settings/types.es.js";
-const o = (e, r = !1, s) => ({
-  borderRadius: r ? s : t[e]
-});
-export {
-  o as getRadiusStyles
-};
-//# sourceMappingURL=getRadiusStyles.es.js.map
+import { radiusStyleMap as e } from "../../settings/types.es.js";
+//#region src/utilities/react/getRadiusStyles.ts
+var t = (t, n = !1, r) => ({ borderRadius: n ? r : e[t] });
+//#endregion
+export { t as getRadiusStyles };
+
+//# sourceMappingURL=getRadiusStyles.es.js.map

package/dist/utilities/react/getRadiusStyles.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"getRadiusStyles.es.js","sources":["../../../src/utilities/react/getRadiusStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type CSSProperties } from 'react';\n\nimport { type Radius, radiusStyleMap } from '../../settings/types';\n\nexport const getRadiusStyles = (radiusChoice: Radius, hasRadius = false, radiusValue?: number): CSSProperties => ({\n    borderRadius: hasRadius ? radiusValue : radiusStyleMap[radiusChoice],\n});\n"],"names":["getRadiusStyles","radiusChoice","hasRadius","radiusValue","radiusStyleMap"],"mappings":";AAMO,MAAMA,IAAkB,CAACC,GAAsBC,IAAY,IAAOC,OAAyC;AAAA,EAC9G,cAAcD,IAAYC,IAAcC,EAAeH,CAAY;AACvE;"}
+{"version":3,"file":"getRadiusStyles.es.js","names":[],"sources":["../../../src/utilities/react/getRadiusStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type CSSProperties } from 'react';\n\nimport { type Radius, radiusStyleMap } from '../../settings/types';\n\nexport const getRadiusStyles = (radiusChoice: Radius, hasRadius = false, radiusValue?: number): CSSProperties => ({\n    borderRadius: hasRadius ? radiusValue : radiusStyleMap[radiusChoice],\n});\n"],"mappings":";;AAMA,IAAa,KAAmB,GAAsB,IAAY,IAAO,OAAyC,EAC9G,cAAc,IAAY,IAAc,EAAe,GAC3D"}

package/dist/utilities/react/joinClassNames.es.js

@@ -1,5 +1,6 @@
-const e = (o) => o.filter(Boolean).join(" ");
-export {
-  e as joinClassNames
-};
-//# sourceMappingURL=joinClassNames.es.js.map
+//#region src/utilities/react/joinClassNames.ts
+var e = (e) => e.filter(Boolean).join(" ");
+//#endregion
+export { e as joinClassNames };
+
+//# sourceMappingURL=joinClassNames.es.js.map

package/dist/utilities/react/joinClassNames.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"joinClassNames.es.js","sources":["../../../src/utilities/react/joinClassNames.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\n/**\n * Cleans and joins an array of inputs with possible undefined or boolean values.\n *\n * @param {Array} classNames Array of class names\n * @returns Clean string to be used for class name.\n */\nexport const joinClassNames = (classNames: (string | undefined | boolean)[]): string =>\n    classNames.filter(Boolean).join(' ');\n"],"names":["joinClassNames","classNames"],"mappings":"AAQO,MAAMA,IAAiB,CAACC,MAC3BA,EAAW,OAAO,OAAO,EAAE,KAAK,GAAG;"}
+{"version":3,"file":"joinClassNames.es.js","names":[],"sources":["../../../src/utilities/react/joinClassNames.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\n/**\n * Cleans and joins an array of inputs with possible undefined or boolean values.\n *\n * @param {Array} classNames Array of class names\n * @returns Clean string to be used for class name.\n */\nexport const joinClassNames = (classNames: (string | undefined | boolean)[]): string =>\n    classNames.filter(Boolean).join(' ');\n"],"mappings":";AAQA,IAAa,KAAkB,MAC3B,EAAW,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@frontify/guideline-blocks-settings",
   "type": "module",
-  "version": "3.0.2",
+  "version": "4.0.0-alpha.0",
   "description": "Provides types and helpers for the guideline block development",
   "author": "Frontify Developers <developers@frontify.com>",
   "repository": {
@@ -29,7 +29,7 @@
     "tailwind.config.ts"
   ],
   "peerDependencies": {
-    "@frontify/app-bridge": "^3.0.0 || ^4.0.0-alpha.0",
+    "@frontify/app-bridge": "^4.0.0-alpha.0",
     "react": "^18",
     "react-dom": "^18"
   },
@@ -46,19 +46,18 @@
     "@babel/core": "^7.29.0",
     "@frontify/oxfmt-config": "^0.0.2",
     "@frontify/oxlint-config-react": "^0.0.2",
+    "@microsoft/api-extractor": "^7.58.12",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
-    "@testing-library/user-event": "14.6.1",
+    "@testing-library/user-event": "14.6.6",
     "@tony.ganchev/eslint-plugin-header": "^3.4.4",
     "@types/node": "^24.11.0",
     "@types/react": "^18.3.27",
     "@types/react-dom": "^18.3.7",
     "@types/sinon": "^21.0.0",
     "@vitejs/plugin-react": "^5.2.0",
-    "@vitest/ui": "^4.1.5",
+    "@vitest/ui": "^4.1.10",
     "autoprefixer": "^10.4.27",
-    "cypress": "^15.13.0",
-    "cypress-real-events": "^1.15.0",
     "eslint-plugin-tailwindcss": "^3.18.3",
     "happy-dom": "^20.9.0",
     "mitt": "^3.0.1",
@@ -73,9 +72,8 @@
     "sinon": "21.0.3",
     "tailwindcss": "^3.4.18",
     "typescript": "^5.9.3",
-    "vite": "^7.3.2",
-    "vite-plugin-dts": "^4.5.4",
-    "vite-plugin-externalize-deps": "^0.10.0",
+    "vite": "^8.2.1",
+    "vite-plugin-dts": "^5.0.3",
     "vite-plugin-externals": "^0.6.2",
     "vitest": "^4.1.10"
   },

package/dist/components/Link/LinkSelector/DocumentLink.es.js

@@ -1,64 +0,0 @@
-import { jsxs as a, Fragment as d, jsx as e } from "react/jsx-runtime";
-import { IconColorFan as g } from "@frontify/fondue/icons";
-import { useState as p, useEffect as m } from "react";
-import { PageLinks as b } from "./PageLinks.es.js";
-const v = ({
-  document: t,
-  selectedUrl: o,
-  onSelectUrl: i,
-  itemsToExpandInitially: r,
-  getDocumentSectionsByDocumentPageId: h,
-  getDocumentPagesByDocumentId: l
-}) => {
-  const [n, s] = p(t.id === r.documentId), c = t.permanentLink === o;
-  return m(() => {
-    t.id === r.documentId && s(!0);
-  }, [r, t.id]), /* @__PURE__ */ a(d, { children: [
-    /* @__PURE__ */ a(
-      "button",
-      {
-        type: "button",
-        "data-test-id": "internal-link-selector-document-link",
-        className: `tw-flex tw-flex-1 tw-space-x-2 tw-items-center tw-py-2 tw-pr-2.5 tw-leading-5 tw-cursor-pointer tw-w-full ${c ? "tw-bg-highlight tw-text-highlight-on-highlight hover:tw-bg-highlight-hover:hover hover:tw-text-highlight-on-highlight:hover" : "hover:tw-bg-container-secondary-hover hover:tw-text-container-secondary-on-secondary-container"}`,
-        onClick: () => i(t.permanentLink),
-        children: [
-          /* @__PURE__ */ e(
-            "button",
-            {
-              type: "button",
-              tabIndex: 0,
-              "data-test-id": "tree-item-toggle",
-              className: "tw-flex tw-items-center tw-justify-center -tw-mr-2 tw-pr-3.5 tw-pt-1.5 tw-pb-1.5 tw-pl-3.5 tw-cursor-pointer",
-              onClick: () => s(!n),
-              onKeyDown: (w) => w.key === "Enter" && w.stopPropagation(),
-              children: /* @__PURE__ */ e(
-                "div",
-                {
-                  className: `tw-transition-transform tw-w-0 tw-h-0 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong ${n ? "tw-rotate-90" : ""}`
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ e(g, { size: 16 }),
-          /* @__PURE__ */ e("span", { className: "tw-text-small", children: t.title }),
-          /* @__PURE__ */ e("span", { className: "tw-flex-auto tw-font-sans tw-text-x-small tw-text-right", children: "Document" })
-        ]
-      }
-    ),
-    n && /* @__PURE__ */ e(
-      b,
-      {
-        documentId: t.id,
-        selectedUrl: o,
-        onSelectUrl: i,
-        itemsToExpandInitially: r,
-        getDocumentSectionsByDocumentPageId: h,
-        getDocumentPagesByDocumentId: l
-      }
-    )
-  ] });
-};
-export {
-  v as DocumentLink
-};
-//# sourceMappingURL=DocumentLink.es.js.map

package/dist/components/Link/LinkSelector/DocumentLink.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DocumentLink.es.js","sources":["../../../../src/components/Link/LinkSelector/DocumentLink.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { IconColorFan } from '@frontify/fondue/icons';\nimport { useEffect, useState } from 'react';\n\nimport { type InitiallyExpandedItems } from '../types';\n\nimport { PageLinks } from './PageLinks';\n\ntype DocumentLinkProps = {\n    document: {\n        id: number;\n        title: string;\n        permanentLink: string;\n    };\n    selectedUrl: string;\n    onSelectUrl: (url: string) => void;\n    itemsToExpandInitially: InitiallyExpandedItems;\n    getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n    getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const DocumentLink = ({\n    document,\n    selectedUrl,\n    onSelectUrl,\n    itemsToExpandInitially,\n    getDocumentSectionsByDocumentPageId,\n    getDocumentPagesByDocumentId,\n}: DocumentLinkProps) => {\n    const [isExpanded, setIsExpanded] = useState(document.id === itemsToExpandInitially.documentId);\n    const isActive = document.permanentLink === selectedUrl;\n\n    useEffect(() => {\n        if (document.id === itemsToExpandInitially.documentId) {\n            // oxlint-disable-next-line @eslint-react/set-state-in-effect\n            setIsExpanded(true);\n        }\n    }, [itemsToExpandInitially, document.id]);\n\n    return (\n        <>\n            <button\n                type=\"button\"\n                data-test-id=\"internal-link-selector-document-link\"\n                className={`tw-flex tw-flex-1 tw-space-x-2 tw-items-center tw-py-2 tw-pr-2.5 tw-leading-5 tw-cursor-pointer tw-w-full ${\n                    isActive\n                        ? 'tw-bg-highlight tw-text-highlight-on-highlight hover:tw-bg-highlight-hover:hover hover:tw-text-highlight-on-highlight:hover'\n                        : 'hover:tw-bg-container-secondary-hover hover:tw-text-container-secondary-on-secondary-container'\n                }`}\n                onClick={() => onSelectUrl(document.permanentLink)}\n            >\n                <button\n                    type=\"button\"\n                    tabIndex={0}\n                    data-test-id=\"tree-item-toggle\"\n                    className=\"tw-flex tw-items-center tw-justify-center -tw-mr-2 tw-pr-3.5 tw-pt-1.5 tw-pb-1.5 tw-pl-3.5 tw-cursor-pointer\"\n                    onClick={() => setIsExpanded(!isExpanded)}\n                    onKeyDown={(event) => event.key === 'Enter' && event.stopPropagation()}\n                >\n                    <div\n                        className={`tw-transition-transform tw-w-0 tw-h-0 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong ${isExpanded ? 'tw-rotate-90' : ''}`}\n                    ></div>\n                </button>\n                <IconColorFan size={16} />\n                <span className=\"tw-text-small\">{document.title}</span>\n                <span className=\"tw-flex-auto tw-font-sans tw-text-x-small tw-text-right\">Document</span>\n            </button>\n            {isExpanded && (\n                <PageLinks\n                    documentId={document.id}\n                    selectedUrl={selectedUrl}\n                    onSelectUrl={onSelectUrl}\n                    itemsToExpandInitially={itemsToExpandInitially}\n                    getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n                    getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n                />\n            )}\n        </>\n    );\n};\n"],"names":["DocumentLink","document","selectedUrl","onSelectUrl","itemsToExpandInitially","getDocumentSectionsByDocumentPageId","getDocumentPagesByDocumentId","isExpanded","setIsExpanded","useState","isActive","useEffect","jsxs","Fragment","jsx","event","IconColorFan","PageLinks"],"mappings":";;;;AAuBO,MAAMA,IAAe,CAAC;AAAA,EACzB,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,qCAAAC;AAAA,EACA,8BAAAC;AACJ,MAAyB;AACrB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASR,EAAS,OAAOG,EAAuB,UAAU,GACxFM,IAAWT,EAAS,kBAAkBC;AAE5C,SAAAS,EAAU,MAAM;AACZ,IAAIV,EAAS,OAAOG,EAAuB,cAEvCI,EAAc,EAAI;AAAA,EAE1B,GAAG,CAACJ,GAAwBH,EAAS,EAAE,CAAC,GAGpC,gBAAAW,EAAAC,GAAA,EACI,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,gBAAa;AAAA,QACb,WAAW,6GACPF,IACM,gIACA,gGACV;AAAA,QACA,SAAS,MAAMP,EAAYF,EAAS,aAAa;AAAA,QAEjD,UAAA;AAAA,UAAA,gBAAAa;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,MAAK;AAAA,cACL,UAAU;AAAA,cACV,gBAAa;AAAA,cACb,WAAU;AAAA,cACV,SAAS,MAAMN,EAAc,CAACD,CAAU;AAAA,cACxC,WAAW,CAACQ,MAAUA,EAAM,QAAQ,WAAWA,EAAM,gBAAA;AAAA,cAErD,UAAA,gBAAAD;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,WAAW,uKAAuKP,IAAa,iBAAiB,EAAE;AAAA,gBAAA;AAAA,cAAA;AAAA,YACrN;AAAA,UAAA;AAAA,UAEL,gBAAAO,EAACE,GAAA,EAAa,MAAM,GAAA,CAAI;AAAA,UACxB,gBAAAF,EAAC,QAAA,EAAK,WAAU,iBAAiB,YAAS,OAAM;AAAA,UAChD,gBAAAA,EAAC,QAAA,EAAK,WAAU,2DAA0D,UAAA,WAAA,CAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAErFP,KACG,gBAAAO;AAAA,MAACG;AAAA,MAAA;AAAA,QACG,YAAYhB,EAAS;AAAA,QACrB,aAAAC;AAAA,QACA,aAAAC;AAAA,QACA,wBAAAC;AAAA,QACA,qCAAAC;AAAA,QACA,8BAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACJ,GAER;AAER;"}

package/dist/components/Link/LinkSelector/DocumentLinks.es.js

@@ -1,65 +0,0 @@
-import { jsx as s, Fragment as x } from "react/jsx-runtime";
-import { useState as d, useEffect as m } from "react";
-import { filterDocumentSectionsWithUnreadableTitles as v } from "../helpers/filterDocumentSectionsWithUnreadableTitles.es.js";
-import { DocumentLink as E } from "./DocumentLink.es.js";
-import { LoadingIndicator as S } from "./LoadingIndicator.es.js";
-const O = ({
-  selectedUrl: n,
-  onSelectUrl: f,
-  getAllDocuments: l,
-  getDocumentPagesByDocumentId: r,
-  getDocumentSectionsByDocumentPageId: a
-}) => {
-  const [p, u] = d(!0), [e, I] = d([]), [g, L] = d({
-    documentId: void 0,
-    pageId: void 0
-  });
-  m(() => {
-    n && e.length > 0 && h().then((t) => {
-      L(t);
-    });
-  }, [e.length]), m(() => {
-    l().then((t) => {
-      I(t);
-    }).finally(() => {
-      u(!1);
-    });
-  }, []);
-  const h = async () => {
-    const t = {
-      documentId: void 0,
-      pageId: void 0
-    };
-    if (e.find((i) => i.permanentLink === n))
-      return t;
-    for (const i of e) {
-      const c = await r(i.id);
-      if (!!c.find((o) => o.permanentLink === n))
-        return t.documentId = i.id, t;
-      for (const o of c) {
-        const T = await a(o.id);
-        if (!!v(T).find(
-          (k) => k.permanentLink === n
-        ))
-          return t.documentId = i.id, t.pageId = o.id, t;
-      }
-    }
-    return t;
-  };
-  return p ? /* @__PURE__ */ s(S, {}) : /* @__PURE__ */ s(x, { children: e.map((t) => /* @__PURE__ */ s(
-    E,
-    {
-      document: t,
-      selectedUrl: n,
-      onSelectUrl: f,
-      itemsToExpandInitially: g,
-      getDocumentSectionsByDocumentPageId: a,
-      getDocumentPagesByDocumentId: r
-    },
-    t.id
-  )) });
-};
-export {
-  O as DocumentLinks
-};
-//# sourceMappingURL=DocumentLinks.es.js.map

package/dist/components/Link/LinkSelector/DocumentLinks.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DocumentLinks.es.js","sources":["../../../../src/components/Link/LinkSelector/DocumentLinks.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type Document, type DocumentPage, type DocumentSection } from '@frontify/app-bridge';\nimport { type ReactElement, useEffect, useState } from 'react';\n\nimport { filterDocumentSectionsWithUnreadableTitles } from '../helpers/filterDocumentSectionsWithUnreadableTitles';\nimport { type InitiallyExpandedItems } from '../types';\n\nimport { DocumentLink } from './DocumentLink';\nimport { LoadingIndicator } from './LoadingIndicator';\n\ntype DocumentLinksProps = {\n    selectedUrl: string;\n    onSelectUrl: (url: string) => void;\n    getAllDocuments: () => Promise<Document[]>;\n    getDocumentSectionsByDocumentPageId: (documentPageId: number) => Promise<DocumentSection[]>;\n    getDocumentPagesByDocumentId: (documentId: number) => Promise<DocumentPage[]>;\n};\n\nexport const DocumentLinks = ({\n    selectedUrl,\n    onSelectUrl,\n    getAllDocuments,\n    getDocumentPagesByDocumentId,\n    getDocumentSectionsByDocumentPageId,\n}: DocumentLinksProps): ReactElement => {\n    const [isLoading, setIsLoading] = useState(true);\n    const [documents, setDocuments] = useState<Document[]>([]);\n    const [itemsToExpandInitially, setItemsToExpandInitially] = useState<InitiallyExpandedItems>({\n        documentId: undefined,\n        pageId: undefined,\n    });\n\n    useEffect(() => {\n        if (selectedUrl && documents.length > 0) {\n            findLocationOfSelectedUrl().then((items) => {\n                setItemsToExpandInitially(items);\n            });\n        }\n        // oxlint-disable-next-line @eslint-react/exhaustive-deps\n    }, [documents.length]);\n\n    useEffect(() => {\n        getAllDocuments()\n            .then((_documents) => {\n                setDocuments(_documents);\n            })\n            .finally(() => {\n                setIsLoading(false);\n            });\n        // oxlint-disable-next-line @eslint-react/exhaustive-deps\n    }, []);\n\n    const findLocationOfSelectedUrl = async () => {\n        const itemsToExpand: InitiallyExpandedItems = {\n            documentId: undefined,\n            pageId: undefined,\n        };\n        const selectedUrlIsDocument = documents.find((document) => document.permanentLink === selectedUrl);\n        if (selectedUrlIsDocument) {\n            return itemsToExpand;\n        }\n        for (const document of documents) {\n            const pages = await getDocumentPagesByDocumentId(document.id);\n            const selectedUrlIsPage = !!pages.find((page) => page.permanentLink === selectedUrl);\n            if (selectedUrlIsPage) {\n                itemsToExpand.documentId = document.id;\n                return itemsToExpand;\n            }\n            for (const page of pages) {\n                const sections = await getDocumentSectionsByDocumentPageId(page.id);\n                const sectionsWithReadableTitles = filterDocumentSectionsWithUnreadableTitles(sections);\n                const selectedUrlIsSection = !!sectionsWithReadableTitles.find(\n                    (section) => section.permanentLink === selectedUrl,\n                );\n                if (selectedUrlIsSection) {\n                    itemsToExpand.documentId = document.id;\n                    itemsToExpand.pageId = page.id;\n                    return itemsToExpand;\n                }\n            }\n        }\n        return itemsToExpand;\n    };\n\n    return isLoading ? (\n        <LoadingIndicator />\n    ) : (\n        <>\n            {documents.map((document) => {\n                return (\n                    <DocumentLink\n                        key={document.id}\n                        document={document}\n                        selectedUrl={selectedUrl}\n                        onSelectUrl={onSelectUrl}\n                        itemsToExpandInitially={itemsToExpandInitially}\n                        getDocumentSectionsByDocumentPageId={getDocumentSectionsByDocumentPageId}\n                        getDocumentPagesByDocumentId={getDocumentPagesByDocumentId}\n                    />\n                );\n            })}\n        </>\n    );\n};\n"],"names":["DocumentLinks","selectedUrl","onSelectUrl","getAllDocuments","getDocumentPagesByDocumentId","getDocumentSectionsByDocumentPageId","isLoading","setIsLoading","useState","documents","setDocuments","itemsToExpandInitially","setItemsToExpandInitially","useEffect","findLocationOfSelectedUrl","items","_documents","itemsToExpand","document","pages","page","sections","filterDocumentSectionsWithUnreadableTitles","section","LoadingIndicator","jsx","DocumentLink"],"mappings":";;;;;AAmBO,MAAMA,IAAgB,CAAC;AAAA,EAC1B,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,8BAAAC;AAAA,EACA,qCAAAC;AACJ,MAAwC;AACpC,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAI,GACzC,CAACC,GAAWC,CAAY,IAAIF,EAAqB,CAAA,CAAE,GACnD,CAACG,GAAwBC,CAAyB,IAAIJ,EAAiC;AAAA,IACzF,YAAY;AAAA,IACZ,QAAQ;AAAA,EAAA,CACX;AAED,EAAAK,EAAU,MAAM;AACZ,IAAIZ,KAAeQ,EAAU,SAAS,KAClCK,EAAA,EAA4B,KAAK,CAACC,MAAU;AACxC,MAAAH,EAA0BG,CAAK;AAAA,IACnC,CAAC;AAAA,EAGT,GAAG,CAACN,EAAU,MAAM,CAAC,GAErBI,EAAU,MAAM;AACZ,IAAAV,EAAA,EACK,KAAK,CAACa,MAAe;AAClB,MAAAN,EAAaM,CAAU;AAAA,IAC3B,CAAC,EACA,QAAQ,MAAM;AACX,MAAAT,EAAa,EAAK;AAAA,IACtB,CAAC;AAAA,EAET,GAAG,CAAA,CAAE;AAEL,QAAMO,IAA4B,YAAY;AAC1C,UAAMG,IAAwC;AAAA,MAC1C,YAAY;AAAA,MACZ,QAAQ;AAAA,IAAA;AAGZ,QAD8BR,EAAU,KAAK,CAACS,MAAaA,EAAS,kBAAkBjB,CAAW;AAE7F,aAAOgB;AAEX,eAAWC,KAAYT,GAAW;AAC9B,YAAMU,IAAQ,MAAMf,EAA6Bc,EAAS,EAAE;AAE5D,UAD0B,CAAC,CAACC,EAAM,KAAK,CAACC,MAASA,EAAK,kBAAkBnB,CAAW;AAE/E,eAAAgB,EAAc,aAAaC,EAAS,IAC7BD;AAEX,iBAAWG,KAAQD,GAAO;AACtB,cAAME,IAAW,MAAMhB,EAAoCe,EAAK,EAAE;AAKlE,YAH6B,CAAC,CADKE,EAA2CD,CAAQ,EAC5B;AAAA,UACtD,CAACE,MAAYA,EAAQ,kBAAkBtB;AAAA,QAAA;AAGvC,iBAAAgB,EAAc,aAAaC,EAAS,IACpCD,EAAc,SAASG,EAAK,IACrBH;AAAA,MAEf;AAAA,IACJ;AACA,WAAOA;AAAA,EACX;AAEA,SAAOX,sBACFkB,GAAA,CAAA,CAAiB,2BAGb,UAAAf,EAAU,IAAI,CAACS,MAER,gBAAAO;AAAA,IAACC;AAAA,IAAA;AAAA,MAEG,UAAAR;AAAA,MACA,aAAAjB;AAAA,MACA,aAAAC;AAAA,MACA,wBAAAS;AAAA,MACA,qCAAAN;AAAA,MACA,8BAAAD;AAAA,IAAA;AAAA,IANKc,EAAS;AAAA,EAAA,CASzB,EAAA,CACL;AAER;"}