diff --git a/dist/buenTypeTailwind.d.ts b/dist/buenTypeTailwind.d.ts deleted file mode 100644 index 00fb4e8..0000000 --- a/dist/buenTypeTailwind.d.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { CustomTypeDefinitions } from "./types"; -type AddUtilities = { - (utilities: Record, options?: any): void; -}; -/** - * A module that converts an object of headlines and text definitions into Tailwind CSS utilities. - * - * @todo Explore making minScreenSize and maxScreenSize configurable in createRemClamp - * @todo Make addUtilities a named parameter, importing @tailwindcss/types - * @todo Make return type more specific to what tailwind plugins expect - */ -export declare function buenTypeTailwind({ addUtilities }: { - addUtilities: AddUtilities; -}, options?: CustomTypeDefinitions): void; -export {}; diff --git a/dist/buenTypeTailwind.js b/dist/buenTypeTailwind.js deleted file mode 100644 index 5b9f60e..0000000 --- a/dist/buenTypeTailwind.js +++ /dev/null @@ -1,75 +0,0 @@ -import { DEFAULT_HEADLINE, DEFAULT_TEXT } from "./defaults"; -import { createRemClamp } from "./utils/createRemClamp"; -import { typedKeys } from "./utils/typedKeys"; -/** - * A module that converts an object of headlines and text definitions into Tailwind CSS utilities. - * - * @todo Explore making minScreenSize and maxScreenSize configurable in createRemClamp - * @todo Make addUtilities a named parameter, importing @tailwindcss/types - * @todo Make return type more specific to what tailwind plugins expect - */ -export function buenTypeTailwind({ addUtilities }, options) { - const generateStyles = (definition) => { - let styles = { - fontFamily: definition.fontFamily, - fontWeight: definition.fontWeight, - lineHeight: definition.lineHeight, - letterSpacing: definition.letterSpacing, - textTransform: definition.textTransform, - fontSize: definition.fontSize, - fontStyle: definition.fontStyle, - textDecoration: definition.textDecoration, - textShadow: definition.textShadow, - whiteSpace: definition.whiteSpace, - wordSpacing: definition.wordSpacing, - textOverflow: definition.textOverflow, - direction: definition.direction, - writingMode: definition.writingMode, - textRendering: definition.textRendering, - hyphens: definition.hyphens, - }; - if (definition.fontSize) { - styles.fontSize = definition.fontSize; - } - if (definition.clamp) { - const customMinScreenSize = (options === null || options === void 0 ? void 0 : options.customMinScreenSize) || 1024; - const customMaxScreenSize = (options === null || options === void 0 ? void 0 : options.customMaxScreenSize) || 1440; - styles.fontSize = createRemClamp(definition.clamp[0], definition.clamp[1], customMinScreenSize, customMaxScreenSize); - } - return styles; - }; - /** - * @todo Look into using deepmerge to merge the default and custom definitions - */ - const defaultHeadlines = (options === null || options === void 0 ? void 0 : options.disableDefaults) ? null : DEFAULT_HEADLINE; - const mergedHeadlines = Object.assign(Object.assign({}, defaultHeadlines), options === null || options === void 0 ? void 0 : options.customHeadlines); - const defaultTexts = (options === null || options === void 0 ? void 0 : options.disableDefaults) ? null : DEFAULT_TEXT; - const mergedTexts = Object.assign(Object.assign({}, defaultTexts), options === null || options === void 0 ? void 0 : options.customTexts); - let headlineUtilities = {}; - typedKeys(mergedHeadlines).forEach((key) => { - const style = mergedHeadlines[key]; - if (style) { - headlineUtilities[`.headline-${key}`] = generateStyles(style); - if (style.classAlias) { - style.classAlias.forEach((alias) => { - headlineUtilities[`.${alias}`] = generateStyles(style); - }); - } - } - }); - let textUtilities = {}; - typedKeys(mergedTexts).forEach((key) => { - const style = mergedTexts[key]; - if (style) { - textUtilities[`.text-${key}`] = generateStyles(style); - if (style.classAlias) { - style.classAlias.forEach((alias) => { - textUtilities[`.text-${alias}`] = generateStyles(style); - }); - } - } - }); - addUtilities(headlineUtilities); - addUtilities(textUtilities); -} -//# sourceMappingURL=buenTypeTailwind.js.map \ No newline at end of file diff --git a/dist/buenTypeTailwind.js.map b/dist/buenTypeTailwind.js.map deleted file mode 100644 index 6a05c0b..0000000 --- a/dist/buenTypeTailwind.js.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"file":"buenTypeTailwind.js","sourceRoot":"","sources":["../src/buenTypeTailwind.ts"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/dist/defaults.d.ts b/dist/defaults.d.ts deleted file mode 100644 index 0c0bd5d..0000000 --- a/dist/defaults.d.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { TypeDefinitionHeadlines, TypeDefinitionTexts } from "./types"; -/** - * Default headline object - */ -export declare const DEFAULT_HEADLINE: TypeDefinitionHeadlines; -/** - * Default text object - */ -export declare const DEFAULT_TEXT: TypeDefinitionTexts; diff --git a/dist/defaults.js b/dist/defaults.js deleted file mode 100644 index 75b514c..0000000 --- a/dist/defaults.js +++ /dev/null @@ -1,87 +0,0 @@ -/** - * Default headline object - */ -export const DEFAULT_HEADLINE = { - "display-xxl": { - _id: "headline-display-xxl", - classAlias: ["main-headline"], - fontWeight: "bold", - clamp: [6, 12], - letterSpacing: "-0.05em", - }, - "display-xl": { - _id: "headline-display-xl", - fontWeight: "bold", - clamp: [4.5, 9], - letterSpacing: "-0.05em", - }, - "display-lg": { - _id: "headline-display-lg", - fontWeight: "bold", - clamp: [3.5, 5], - letterSpacing: "-0.05em", - lineHeight: 1, - }, - "display-md": { - _id: "headline-display-md", - fontWeight: "bold", - clamp: [3, 4], - letterSpacing: "-0.05em", - lineHeight: 1, - }, - "display-sm": { - _id: "headline-display-sm", - fontWeight: "bold", - clamp: [1.5, 2], - letterSpacing: "-0.05em", - lineHeight: 1, - }, - "display-xs": { - _id: "headline-display-xs", - fontWeight: "bold", - clamp: [1, 1], - letterSpacing: "-0em", - lineHeight: 1, - }, -}; -/** - * Default text object - */ -export const DEFAULT_TEXT = { - title: { - _id: "text-title", - fontSize: "1.5rem", - lineHeight: 1.25, - fontWeight: "normal", - letterSpacing: "0em", - }, - paragraph: { - _id: "text-paragraph", - fontSize: "1.25rem", - lineHeight: 1.35, - fontWeight: "normal", - letterSpacing: "0em", - }, - string: { - _id: "text-string", - fontSize: ".9rem", - lineHeight: 1.25, - fontWeight: "normal", - letterSpacing: "0em", - }, - body: { - _id: "text-body", - fontSize: "0.8rem", - lineHeight: 1.25, - fontWeight: "normal", - letterSpacing: "0em", - }, - caption: { - _id: "text-caption", - fontSize: "0.65rem", - lineHeight: 1.25, - fontWeight: "normal", - letterSpacing: "0em", - }, -}; -//# sourceMappingURL=defaults.js.map \ No newline at end of file diff --git a/dist/defaults.js.map b/dist/defaults.js.map deleted file mode 100644 index 0cd66fc..0000000 --- a/dist/defaults.js.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"file":"defaults.js","sourceRoot":"","sources":["../src/defaults.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAA4B;IACvD,aAAa,EAAE;QACb,GAAG,EAAE,sBAAsB;QAC3B,UAAU,EAAE,CAAC,eAAe,CAAC;QAC7B,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;QACd,aAAa,EAAE,SAAS;KACzB;IACD,YAAY,EAAE;QACZ,GAAG,EAAE,qBAAqB;QAC1B,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC;QACf,aAAa,EAAE,SAAS;KACzB;IACD,YAAY,EAAE;QACZ,GAAG,EAAE,qBAAqB;QAC1B,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC;QACf,aAAa,EAAE,SAAS;QACxB,UAAU,EAAE,CAAC;KACd;IACD,YAAY,EAAE;QACZ,GAAG,EAAE,qBAAqB;QAC1B,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;QACb,aAAa,EAAE,SAAS;QACxB,UAAU,EAAE,CAAC;KACd;IACD,YAAY,EAAE;QACZ,GAAG,EAAE,qBAAqB;QAC1B,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC;QACf,aAAa,EAAE,SAAS;QACxB,UAAU,EAAE,CAAC;KACd;IACD,YAAY,EAAE;QACZ,GAAG,EAAE,qBAAqB;QAC1B,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;QACb,aAAa,EAAE,MAAM;QACrB,UAAU,EAAE,CAAC;KACd;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAwB;IAC/C,KAAK,EAAE;QACL,GAAG,EAAE,YAAY;QACjB,QAAQ,EAAE,QAAQ;QAClB,UAAU,EAAE,IAAI;QAChB,UAAU,EAAE,QAAQ;QACpB,aAAa,EAAE,KAAK;KACrB;IACD,SAAS,EAAE;QACT,GAAG,EAAE,gBAAgB;QACrB,QAAQ,EAAE,SAAS;QACnB,UAAU,EAAE,IAAI;QAChB,UAAU,EAAE,QAAQ;QACpB,aAAa,EAAE,KAAK;KACrB;IACD,MAAM,EAAE;QACN,GAAG,EAAE,aAAa;QAClB,QAAQ,EAAE,OAAO;QACjB,UAAU,EAAE,IAAI;QAChB,UAAU,EAAE,QAAQ;QACpB,aAAa,EAAE,KAAK;KACrB;IACD,IAAI,EAAE;QACJ,GAAG,EAAE,WAAW;QAChB,QAAQ,EAAE,QAAQ;QAClB,UAAU,EAAE,IAAI;QAChB,UAAU,EAAE,QAAQ;QACpB,aAAa,EAAE,KAAK;KACrB;IACD,OAAO,EAAE;QACP,GAAG,EAAE,cAAc;QACnB,QAAQ,EAAE,SAAS;QACnB,UAAU,EAAE,IAAI;QAChB,UAAU,EAAE,QAAQ;QACpB,aAAa,EAAE,KAAK;KACrB;CACF,CAAC"} \ No newline at end of file diff --git a/dist/types.d.ts b/dist/index.d.mts similarity index 60% rename from dist/types.d.ts rename to dist/index.d.mts index 8f47f7c..9e47de1 100644 --- a/dist/types.d.ts +++ b/dist/index.d.mts @@ -1,11 +1,11 @@ /** * Default headline types, e.g. `display-xxl`, `display-xl`, etc. */ -export type DefaultHeadlineTypes = "display-xxl" | "display-xl" | "display-lg" | "display-md" | "display-sm" | "display-xs"; +type DefaultHeadlineTypes = "display-xxl" | "display-xl" | "display-lg" | "display-md" | "display-sm" | "display-xs"; /** * Default text types, e.g. `title`, `paragraph`, etc. */ -export type DefaultTextTypes = "title" | "paragraph" | "string" | "body" | "caption"; +type DefaultTextTypes = "title" | "paragraph" | "string" | "body" | "caption"; /** * Type definition properties * @@ -33,7 +33,7 @@ export type DefaultTextTypes = "title" | "paragraph" | "string" | "body" | "capt * @param textRendering - e.g., auto, optimizeLegibility, geometricPrecision * @param hyphens - e.g., none, manual, auto */ -export type TypeDefinition = { +type TypeDefinition = { _id?: string; classAlias?: string[] | ["some-class-alias"]; fontFamily?: string | "sans-serif" | "monospace"; @@ -54,29 +54,56 @@ export type TypeDefinition = { textRendering?: string | "auto" | "optimizeLegibility" | "geometricPrecision"; hyphens?: string | "none" | "manual" | "auto"; }; -/** - * CSS output properties, mirrors TypeDefinition excluding clamp and _id - */ -export type CSSOutput = Omit; -/** - * Type definitions object - */ -export type TypeDefinitions = Record; /** * Default type definitions for headlines */ -export type TypeDefinitionHeadlines = Record; +type TypeDefinitionHeadlines = Record; /** * Default type definitions for text elements */ -export type TypeDefinitionTexts = Record; +type TypeDefinitionTexts = Record; /** * Custom type definitions for headlines and texts. */ -export type CustomTypeDefinitions = { +type CustomTypeDefinitions = { customHeadlines?: Record; customTexts?: Record; disableDefaults?: boolean; customMinScreenSize?: number; customMaxScreenSize?: number; }; + +type AddUtilities = { + (utilities: Record, options?: any): void; +}; +/** + * A module that converts an object of headlines and text definitions into Tailwind CSS utilities. + * + * @todo Explore making minScreenSize and maxScreenSize configurable in createRemClamp + * @todo Make addUtilities a named parameter, importing @tailwindcss/types + * @todo Make return type more specific to what tailwind plugins expect + */ +declare function buenTypeTailwind({ addUtilities }: { + addUtilities: AddUtilities; +}, options?: CustomTypeDefinitions): void; + +/** + * A module that provides a function to create a `rem`-based `clamp` function. + * + * @param minFontSize - The minimum font size in rem + * @param maxFontSize - The maximum font size in rem + * @param minScreenSize - The minimum screen size in pixels + * @param maxScreenSize - The maximum screen size in pixels + */ +declare function createRemClamp(minFontSize: number, maxFontSize: number, minScreenSize?: number, maxScreenSize?: number): string; + +/** + * Default headline object + */ +declare const DEFAULT_HEADLINE: TypeDefinitionHeadlines; +/** + * Default text object + */ +declare const DEFAULT_TEXT: TypeDefinitionTexts; + +export { type CustomTypeDefinitions, type TypeDefinition, type TypeDefinitionHeadlines, type TypeDefinitionTexts, buenTypeTailwind, createRemClamp, DEFAULT_HEADLINE as headlineDefault, DEFAULT_TEXT as textDefault }; diff --git a/dist/index.d.ts b/dist/index.d.ts index 58d3a6f..9e47de1 100644 --- a/dist/index.d.ts +++ b/dist/index.d.ts @@ -1,85 +1,109 @@ /** - * A module that converts an object of headlinea and text defs into Tailwind CSS utilities. - * - * @example - * - * 1. Define custom styles, using either the default keys or by expanding upon them - * - * ```ts - * // type-config.ts - * - * const customHeadlines = { - * 'display-xl': { - * fontFamily: "'Inter', 'sans-serif'", - * fontWeight: 'bold', - * clamp: [4.5, 9], - * letterSpacing: '-0.1em', - * lineHeight: 1, - * textTransform: 'uppercase', - * }, - * // ... - * } - * - * const customTexts = { - * 'body': { - * fontFamily: "'Inter', 'sans-serif'", - * fontWeight: 'normal', - * fontSize: '1.1rem' - * letterSpacing: '0em', - * lineHeight: 1.5, - * textTransform: 'none', - * }, - * // ... - * } - * ``` - * - * 2. Add the custom styles to the plugin - * - * ```tsx - * // tailwind.config.ts - * import { buenTypeTailwind } from "@muybuen/type"; - * import { customHeadlines, customTexts } from "./type-config"; + * Default headline types, e.g. `display-xxl`, `display-xl`, etc. + */ +type DefaultHeadlineTypes = "display-xxl" | "display-xl" | "display-lg" | "display-md" | "display-sm" | "display-xs"; +/** + * Default text types, e.g. `title`, `paragraph`, etc. + */ +type DefaultTextTypes = "title" | "paragraph" | "string" | "body" | "caption"; +/** + * Type definition properties * - * function typePlugin({ addUtilities }) { - * buenTypeTailwind({ addUtilities }, { - * customHeadlines, - * customTexts - * }); - * }; + * @todo refactor to import types from @react/types * - * module.exports = { - * // ... - * plugins: [ - * typePlugin - * ] - * }; - * ``` + * @param classAlias - e.g., ["main-headline"] + * @param fontFamily - e.g., Arial, sans-serif, monospace + * @param fontWeight - e.g., normal, bold, 400, 700 + * @param lineHeight - e.g., 1.5, 150%, 1.5em + * @param letterSpacing - e.g., 0.1em, 1px + * @param textTransform - e.g., uppercase, lowercase, capitalize, none + * @param fontSize - e.g., 1.5rem, 1.5em, 150%, 1.5vw + * @param clamp - e.g., [1, 2] + * @param color - e.g., #000, rgba(0, 0, 0, 0.5) + * @param fontStyle - e.g., normal, italic, oblique + * @param textDecoration - e.g., underline, overline, line-through, none + * @param textAlign - e.g., left, right, center, justify + * @param textShadow - e.g., 1px 1px 2px black + * @param whiteSpace - e.g., normal, nowrap, pre + * @param wordSpacing - e.g., normal, 0.25em + * @param textOverflow - e.g., clip, ellipsis + * @param textIndent - e.g., 50px, 5% + * @param direction - e.g., ltr, rtl + * @param writingMode - e.g., horizontal-tb, vertical-rl + * @param textRendering - e.g., auto, optimizeLegibility, geometricPrecision + * @param hyphens - e.g., none, manual, auto + */ +type TypeDefinition = { + _id?: string; + classAlias?: string[] | ["some-class-alias"]; + fontFamily?: string | "sans-serif" | "monospace"; + fontWeight?: string | number | "normal" | "bold" | 400 | 700; + lineHeight?: string | number | 1.5 | "150%" | "1.5em"; + letterSpacing?: string | "-0.01em"; + textTransform?: string | "uppercase" | "lowercase" | "capitalize" | "none"; + fontSize?: string | "1.5rem" | "1.5em" | "150%" | "1.5vw"; + clamp?: [number, number]; + fontStyle?: string | "normal" | "italic" | "oblique"; + textDecoration?: string | "underline" | "overline" | "line-through" | "none"; + textShadow?: string | "1px 1px 2px black"; + whiteSpace?: string | "normal" | "nowrap" | "pre"; + wordSpacing?: string | "normal" | "0.25em"; + textOverflow?: string | "clip" | "ellipsis"; + direction?: string | "ltr" | "rtl"; + writingMode?: string | "horizontal-tb" | "vertical-rl"; + textRendering?: string | "auto" | "optimizeLegibility" | "geometricPrecision"; + hyphens?: string | "none" | "manual" | "auto"; +}; +/** + * Default type definitions for headlines + */ +type TypeDefinitionHeadlines = Record; +/** + * Default type definitions for text elements + */ +type TypeDefinitionTexts = Record; +/** + * Custom type definitions for headlines and texts. + */ +type CustomTypeDefinitions = { + customHeadlines?: Record; + customTexts?: Record; + disableDefaults?: boolean; + customMinScreenSize?: number; + customMaxScreenSize?: number; +}; + +type AddUtilities = { + (utilities: Record, options?: any): void; +}; +/** + * A module that converts an object of headlines and text definitions into Tailwind CSS utilities. * - * @module + * @todo Explore making minScreenSize and maxScreenSize configurable in createRemClamp + * @todo Make addUtilities a named parameter, importing @tailwindcss/types + * @todo Make return type more specific to what tailwind plugins expect */ -export { buenTypeTailwind } from "./buenTypeTailwind"; +declare function buenTypeTailwind({ addUtilities }: { + addUtilities: AddUtilities; +}, options?: CustomTypeDefinitions): void; + /** * A module that provides a function to create a `rem`-based `clamp` function. * - * @example - * ```ts - * import { createRemClamp } from "@muybuen/type"; - * - * createRemClamp(1, 2, 1024, 1440); // "clamp(1rem, 1rem + 0.06666666666666667vw, 2rem)" - * ``` - * - * @module + * @param minFontSize - The minimum font size in rem + * @param maxFontSize - The maximum font size in rem + * @param minScreenSize - The minimum screen size in pixels + * @param maxScreenSize - The maximum screen size in pixels */ -export { createRemClamp } from "./utils/createRemClamp"; +declare function createRemClamp(minFontSize: number, maxFontSize: number, minScreenSize?: number, maxScreenSize?: number): string; + /** - * Types for the Buen Type module, for use when implementing custom type definitions. - * - * @module + * Default headline object */ -export type { CustomTypeDefinitions, TypeDefinition, TypeDefinitionHeadlines, TypeDefinitionTexts, } from "./types.ts"; +declare const DEFAULT_HEADLINE: TypeDefinitionHeadlines; /** - * Default objects for headline and text definitions. - * - * @module + * Default text object */ -export { DEFAULT_HEADLINE as headlineDefault, DEFAULT_TEXT as textDefault, } from "./defaults"; +declare const DEFAULT_TEXT: TypeDefinitionTexts; + +export { type CustomTypeDefinitions, type TypeDefinition, type TypeDefinitionHeadlines, type TypeDefinitionTexts, buenTypeTailwind, createRemClamp, DEFAULT_HEADLINE as headlineDefault, DEFAULT_TEXT as textDefault }; diff --git a/dist/index.js b/dist/index.js index 38bb1d5..f5683ca 100644 --- a/dist/index.js +++ b/dist/index.js @@ -1,80 +1,214 @@ -/** - * A module that converts an object of headlinea and text defs into Tailwind CSS utilities. - * - * @example - * - * 1. Define custom styles, using either the default keys or by expanding upon them - * - * ```ts - * // type-config.ts - * - * const customHeadlines = { - * 'display-xl': { - * fontFamily: "'Inter', 'sans-serif'", - * fontWeight: 'bold', - * clamp: [4.5, 9], - * letterSpacing: '-0.1em', - * lineHeight: 1, - * textTransform: 'uppercase', - * }, - * // ... - * } - * - * const customTexts = { - * 'body': { - * fontFamily: "'Inter', 'sans-serif'", - * fontWeight: 'normal', - * fontSize: '1.1rem' - * letterSpacing: '0em', - * lineHeight: 1.5, - * textTransform: 'none', - * }, - * // ... - * } - * ``` - * - * 2. Add the custom styles to the plugin - * - * ```tsx - * // tailwind.config.ts - * import { buenTypeTailwind } from "@muybuen/type"; - * import { customHeadlines, customTexts } from "./type-config"; - * - * function typePlugin({ addUtilities }) { - * buenTypeTailwind({ addUtilities }, { - * customHeadlines, - * customTexts - * }); - * }; - * - * module.exports = { - * // ... - * plugins: [ - * typePlugin - * ] - * }; - * ``` - * - * @module - */ -export { buenTypeTailwind } from "./buenTypeTailwind"; -/** - * A module that provides a function to create a `rem`-based `clamp` function. - * - * @example - * ```ts - * import { createRemClamp } from "@muybuen/type"; - * - * createRemClamp(1, 2, 1024, 1440); // "clamp(1rem, 1rem + 0.06666666666666667vw, 2rem)" - * ``` - * - * @module - */ -export { createRemClamp } from "./utils/createRemClamp"; -/** - * Default objects for headline and text definitions. - * - * @module - */ -export { DEFAULT_HEADLINE as headlineDefault, DEFAULT_TEXT as textDefault, } from "./defaults"; +"use strict"; +var __defProp = Object.defineProperty; +var __getOwnPropDesc = Object.getOwnPropertyDescriptor; +var __getOwnPropNames = Object.getOwnPropertyNames; +var __getOwnPropSymbols = Object.getOwnPropertySymbols; +var __hasOwnProp = Object.prototype.hasOwnProperty; +var __propIsEnum = Object.prototype.propertyIsEnumerable; +var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; +var __spreadValues = (a, b) => { + for (var prop in b || (b = {})) + if (__hasOwnProp.call(b, prop)) + __defNormalProp(a, prop, b[prop]); + if (__getOwnPropSymbols) + for (var prop of __getOwnPropSymbols(b)) { + if (__propIsEnum.call(b, prop)) + __defNormalProp(a, prop, b[prop]); + } + return a; +}; +var __export = (target, all) => { + for (var name in all) + __defProp(target, name, { get: all[name], enumerable: true }); +}; +var __copyProps = (to, from, except, desc) => { + if (from && typeof from === "object" || typeof from === "function") { + for (let key of __getOwnPropNames(from)) + if (!__hasOwnProp.call(to, key) && key !== except) + __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); + } + return to; +}; +var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); + +// src/index.ts +var src_exports = {}; +__export(src_exports, { + buenTypeTailwind: () => buenTypeTailwind, + createRemClamp: () => createRemClamp, + headlineDefault: () => DEFAULT_HEADLINE, + textDefault: () => DEFAULT_TEXT +}); +module.exports = __toCommonJS(src_exports); + +// src/defaults.ts +var DEFAULT_HEADLINE = { + "display-xxl": { + _id: "headline-display-xxl", + classAlias: ["main-headline"], + fontWeight: "bold", + clamp: [6, 12], + letterSpacing: "-0.05em" + }, + "display-xl": { + _id: "headline-display-xl", + fontWeight: "bold", + clamp: [4.5, 9], + letterSpacing: "-0.05em" + }, + "display-lg": { + _id: "headline-display-lg", + fontWeight: "bold", + clamp: [3.5, 5], + letterSpacing: "-0.05em", + lineHeight: 1 + }, + "display-md": { + _id: "headline-display-md", + fontWeight: "bold", + clamp: [3, 4], + letterSpacing: "-0.05em", + lineHeight: 1 + }, + "display-sm": { + _id: "headline-display-sm", + fontWeight: "bold", + clamp: [1.5, 2], + letterSpacing: "-0.05em", + lineHeight: 1 + }, + "display-xs": { + _id: "headline-display-xs", + fontWeight: "bold", + clamp: [1, 1], + letterSpacing: "-0em", + lineHeight: 1 + } +}; +var DEFAULT_TEXT = { + title: { + _id: "text-title", + fontSize: "1.5rem", + lineHeight: 1.25, + fontWeight: "normal", + letterSpacing: "0em" + }, + paragraph: { + _id: "text-paragraph", + fontSize: "1.25rem", + lineHeight: 1.35, + fontWeight: "normal", + letterSpacing: "0em" + }, + string: { + _id: "text-string", + fontSize: ".9rem", + lineHeight: 1.25, + fontWeight: "normal", + letterSpacing: "0em" + }, + body: { + _id: "text-body", + fontSize: "0.8rem", + lineHeight: 1.25, + fontWeight: "normal", + letterSpacing: "0em" + }, + caption: { + _id: "text-caption", + fontSize: "0.65rem", + lineHeight: 1.25, + fontWeight: "normal", + letterSpacing: "0em" + } +}; + +// src/utils/createRemClamp.ts +function createRemClamp(minFontSize, maxFontSize, minScreenSize = 1024, maxScreenSize = 1440) { + const minWidth = minScreenSize / 16; + const maxWidth = maxScreenSize / 16; + const m = (maxFontSize - minFontSize) / (maxWidth - minWidth); + const b = -minWidth * m + minFontSize; + return `clamp(${minFontSize}rem, ${b}rem + ${m * 100}vw, ${maxFontSize}rem)`; +} + +// src/utils/typedKeys.ts +function typedKeys(obj) { + return Object.keys(obj); +} + +// src/buenTypeTailwind.ts +function buenTypeTailwind({ addUtilities }, options) { + const generateStyles = (definition) => { + let styles = { + fontFamily: definition.fontFamily, + fontWeight: definition.fontWeight, + lineHeight: definition.lineHeight, + letterSpacing: definition.letterSpacing, + textTransform: definition.textTransform, + fontSize: definition.fontSize, + fontStyle: definition.fontStyle, + textDecoration: definition.textDecoration, + textShadow: definition.textShadow, + whiteSpace: definition.whiteSpace, + wordSpacing: definition.wordSpacing, + textOverflow: definition.textOverflow, + direction: definition.direction, + writingMode: definition.writingMode, + textRendering: definition.textRendering, + hyphens: definition.hyphens + }; + if (definition.fontSize) { + styles.fontSize = definition.fontSize; + } + if (definition.clamp) { + const customMinScreenSize = (options == null ? void 0 : options.customMinScreenSize) || 1024; + const customMaxScreenSize = (options == null ? void 0 : options.customMaxScreenSize) || 1440; + styles.fontSize = createRemClamp( + definition.clamp[0], + definition.clamp[1], + customMinScreenSize, + customMaxScreenSize + ); + } + return styles; + }; + const defaultHeadlines = (options == null ? void 0 : options.disableDefaults) ? null : DEFAULT_HEADLINE; + const mergedHeadlines = __spreadValues(__spreadValues({}, defaultHeadlines), options == null ? void 0 : options.customHeadlines); + const defaultTexts = (options == null ? void 0 : options.disableDefaults) ? null : DEFAULT_TEXT; + const mergedTexts = __spreadValues(__spreadValues({}, defaultTexts), options == null ? void 0 : options.customTexts); + let headlineUtilities = {}; + typedKeys(mergedHeadlines).forEach((key) => { + const style = mergedHeadlines[key]; + if (style) { + headlineUtilities[`.headline-${key}`] = generateStyles(style); + if (style.classAlias) { + style.classAlias.forEach((alias) => { + headlineUtilities[`.${alias}`] = generateStyles(style); + }); + } + } + }); + let textUtilities = {}; + typedKeys(mergedTexts).forEach((key) => { + const style = mergedTexts[key]; + if (style) { + textUtilities[`.text-${key}`] = generateStyles(style); + if (style.classAlias) { + style.classAlias.forEach((alias) => { + textUtilities[`.text-${alias}`] = generateStyles(style); + }); + } + } + }); + addUtilities(headlineUtilities); + addUtilities(textUtilities); +} +// Annotate the CommonJS export names for ESM import in node: +0 && (module.exports = { + buenTypeTailwind, + createRemClamp, + headlineDefault, + textDefault +}); //# sourceMappingURL=index.js.map \ No newline at end of file diff --git a/dist/index.js.map b/dist/index.js.map index f7c8499..1a8753a 100644 --- a/dist/index.js.map +++ b/dist/index.js.map @@ -1 +1 @@ -{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0DG;AACH,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAcxD;;;;GAIG;AACH,OAAO,EACL,gBAAgB,IAAI,eAAe,EACnC,YAAY,IAAI,WAAW,GAC5B,MAAM,YAAY,CAAC"} \ No newline at end of file +{"version":3,"sources":["../src/index.ts","../src/defaults.ts","../src/utils/createRemClamp.ts","../src/utils/typedKeys.ts","../src/buenTypeTailwind.ts"],"sourcesContent":["/**\n * A module that converts an object of headlinea and text defs into Tailwind CSS utilities.\n *\n * @example\n *\n * 1. Define custom styles, using either the default keys or by expanding upon them\n *\n * ```ts\n * // type-config.ts\n *\n * const customHeadlines = {\n * 'display-xl': {\n * fontFamily: \"'Inter', 'sans-serif'\",\n * fontWeight: 'bold',\n * clamp: [4.5, 9],\n * letterSpacing: '-0.1em',\n * lineHeight: 1,\n * textTransform: 'uppercase',\n * },\n * // ...\n * }\n *\n * const customTexts = {\n * 'body': {\n * fontFamily: \"'Inter', 'sans-serif'\",\n * fontWeight: 'normal',\n * fontSize: '1.1rem'\n * letterSpacing: '0em',\n * lineHeight: 1.5,\n * textTransform: 'none',\n * },\n * // ...\n * }\n * ```\n *\n * 2. Add the custom styles to the plugin\n *\n * ```tsx\n * // tailwind.config.ts\n * import { buenTypeTailwind } from \"@muybuen/type\";\n * import { customHeadlines, customTexts } from \"./type-config\";\n *\n * function typePlugin({ addUtilities }) {\n * buenTypeTailwind({ addUtilities }, {\n * customHeadlines,\n * customTexts\n * });\n * };\n *\n * module.exports = {\n * // ...\n * plugins: [\n * typePlugin\n * ]\n * };\n * ```\n *\n * @module\n */\nexport { buenTypeTailwind } from \"./buenTypeTailwind\";\n\n/**\n * A module that provides a function to create a `rem`-based `clamp` function.\n *\n * @example\n * ```ts\n * import { createRemClamp } from \"@muybuen/type\";\n *\n * createRemClamp(1, 2, 1024, 1440); // \"clamp(1rem, 1rem + 0.06666666666666667vw, 2rem)\"\n * ```\n *\n * @module\n */\nexport { createRemClamp } from \"./utils/createRemClamp\";\n\n/**\n * Types for the Buen Type module, for use when implementing custom type definitions.\n *\n * @module\n */\nexport type {\n CustomTypeDefinitions,\n TypeDefinition,\n TypeDefinitionHeadlines,\n TypeDefinitionTexts,\n} from \"./types.ts\";\n\n/**\n * Default objects for headline and text definitions.\n *\n * @module\n */\nexport {\n DEFAULT_HEADLINE as headlineDefault,\n DEFAULT_TEXT as textDefault,\n} from \"./defaults\";\n","import { TypeDefinitionHeadlines, TypeDefinitionTexts } from \"./types\";\n\n/**\n * Default headline object\n */\nexport const DEFAULT_HEADLINE: TypeDefinitionHeadlines = {\n \"display-xxl\": {\n _id: \"headline-display-xxl\",\n classAlias: [\"main-headline\"],\n fontWeight: \"bold\",\n clamp: [6, 12],\n letterSpacing: \"-0.05em\",\n },\n \"display-xl\": {\n _id: \"headline-display-xl\",\n fontWeight: \"bold\",\n clamp: [4.5, 9],\n letterSpacing: \"-0.05em\",\n },\n \"display-lg\": {\n _id: \"headline-display-lg\",\n fontWeight: \"bold\",\n clamp: [3.5, 5],\n letterSpacing: \"-0.05em\",\n lineHeight: 1,\n },\n \"display-md\": {\n _id: \"headline-display-md\",\n fontWeight: \"bold\",\n clamp: [3, 4],\n letterSpacing: \"-0.05em\",\n lineHeight: 1,\n },\n \"display-sm\": {\n _id: \"headline-display-sm\",\n fontWeight: \"bold\",\n clamp: [1.5, 2],\n letterSpacing: \"-0.05em\",\n lineHeight: 1,\n },\n \"display-xs\": {\n _id: \"headline-display-xs\",\n fontWeight: \"bold\",\n clamp: [1, 1],\n letterSpacing: \"-0em\",\n lineHeight: 1,\n },\n};\n\n/**\n * Default text object\n */\nexport const DEFAULT_TEXT: TypeDefinitionTexts = {\n title: {\n _id: \"text-title\",\n fontSize: \"1.5rem\",\n lineHeight: 1.25,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n paragraph: {\n _id: \"text-paragraph\",\n fontSize: \"1.25rem\",\n lineHeight: 1.35,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n string: {\n _id: \"text-string\",\n fontSize: \".9rem\",\n lineHeight: 1.25,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n body: {\n _id: \"text-body\",\n fontSize: \"0.8rem\",\n lineHeight: 1.25,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n caption: {\n _id: \"text-caption\",\n fontSize: \"0.65rem\",\n lineHeight: 1.25,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n};\n","/**\n * A module that provides a function to create a `rem`-based `clamp` function.\n *\n * @param minFontSize - The minimum font size in rem\n * @param maxFontSize - The maximum font size in rem\n * @param minScreenSize - The minimum screen size in pixels\n * @param maxScreenSize - The maximum screen size in pixels\n */\nexport function createRemClamp(\n minFontSize: number,\n maxFontSize: number,\n minScreenSize: number = 1024,\n maxScreenSize: number = 1440,\n): string {\n const minWidth = minScreenSize / 16;\n const maxWidth = maxScreenSize / 16;\n const m = (maxFontSize - minFontSize) / (maxWidth - minWidth);\n const b = -minWidth * m + minFontSize;\n\n return `clamp(${minFontSize}rem, ${b}rem + ${m * 100}vw, ${maxFontSize}rem)`;\n}\n","export function typedKeys(obj: T): (keyof T)[] {\n return Object.keys(obj) as (keyof T)[];\n}\n","import { DEFAULT_HEADLINE, DEFAULT_TEXT } from \"./defaults\";\nimport { CustomTypeDefinitions, TypeDefinition } from \"./types\";\nimport { createRemClamp } from \"./utils/createRemClamp\";\nimport { typedKeys } from \"./utils/typedKeys\";\n\ntype AddUtilities = {\n (utilities: Record, options?: any): void;\n};\n\n/**\n * A module that converts an object of headlines and text definitions into Tailwind CSS utilities.\n *\n * @todo Explore making minScreenSize and maxScreenSize configurable in createRemClamp\n * @todo Make addUtilities a named parameter, importing @tailwindcss/types\n * @todo Make return type more specific to what tailwind plugins expect\n */\nexport function buenTypeTailwind(\n { addUtilities }: { addUtilities: AddUtilities },\n options?: CustomTypeDefinitions,\n): void {\n const generateStyles = (definition: TypeDefinition) => {\n let styles: TypeDefinition = {\n fontFamily: definition.fontFamily,\n fontWeight: definition.fontWeight,\n lineHeight: definition.lineHeight,\n letterSpacing: definition.letterSpacing,\n textTransform: definition.textTransform,\n fontSize: definition.fontSize,\n fontStyle: definition.fontStyle,\n textDecoration: definition.textDecoration,\n textShadow: definition.textShadow,\n whiteSpace: definition.whiteSpace,\n wordSpacing: definition.wordSpacing,\n textOverflow: definition.textOverflow,\n direction: definition.direction,\n writingMode: definition.writingMode,\n textRendering: definition.textRendering,\n hyphens: definition.hyphens,\n };\n if (definition.fontSize) {\n styles.fontSize = definition.fontSize;\n }\n if (definition.clamp) {\n const customMinScreenSize = options?.customMinScreenSize || 1024;\n const customMaxScreenSize = options?.customMaxScreenSize || 1440;\n styles.fontSize = createRemClamp(\n definition.clamp[0],\n definition.clamp[1],\n customMinScreenSize,\n customMaxScreenSize,\n );\n }\n\n return styles;\n };\n\n /**\n * @todo Look into using deepmerge to merge the default and custom definitions\n */\n\n const defaultHeadlines = options?.disableDefaults ? null : DEFAULT_HEADLINE;\n const mergedHeadlines = {\n ...defaultHeadlines,\n ...options?.customHeadlines,\n };\n\n const defaultTexts = options?.disableDefaults ? null : DEFAULT_TEXT;\n const mergedTexts = { ...defaultTexts, ...options?.customTexts };\n\n let headlineUtilities: Record = {};\n typedKeys(mergedHeadlines).forEach((key) => {\n const style = mergedHeadlines[key];\n if (style) {\n headlineUtilities[`.headline-${key}`] = generateStyles(style);\n if (style.classAlias) {\n style.classAlias.forEach((alias) => {\n headlineUtilities[`.${alias}`] = generateStyles(style);\n });\n }\n }\n });\n\n let textUtilities: Record = {};\n typedKeys(mergedTexts).forEach((key) => {\n const style = mergedTexts[key];\n if (style) {\n textUtilities[`.text-${key}`] = generateStyles(style);\n if (style.classAlias) {\n style.classAlias.forEach((alias) => {\n textUtilities[`.text-${alias}`] = generateStyles(style);\n });\n }\n }\n });\n\n addUtilities(headlineUtilities);\n addUtilities(textUtilities);\n}\n"],"mappings":"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","names":[]} \ No newline at end of file diff --git a/dist/index.mjs b/dist/index.mjs new file mode 100644 index 0000000..87aeeaf --- /dev/null +++ b/dist/index.mjs @@ -0,0 +1,187 @@ +var __defProp = Object.defineProperty; +var __getOwnPropSymbols = Object.getOwnPropertySymbols; +var __hasOwnProp = Object.prototype.hasOwnProperty; +var __propIsEnum = Object.prototype.propertyIsEnumerable; +var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; +var __spreadValues = (a, b) => { + for (var prop in b || (b = {})) + if (__hasOwnProp.call(b, prop)) + __defNormalProp(a, prop, b[prop]); + if (__getOwnPropSymbols) + for (var prop of __getOwnPropSymbols(b)) { + if (__propIsEnum.call(b, prop)) + __defNormalProp(a, prop, b[prop]); + } + return a; +}; + +// src/defaults.ts +var DEFAULT_HEADLINE = { + "display-xxl": { + _id: "headline-display-xxl", + classAlias: ["main-headline"], + fontWeight: "bold", + clamp: [6, 12], + letterSpacing: "-0.05em" + }, + "display-xl": { + _id: "headline-display-xl", + fontWeight: "bold", + clamp: [4.5, 9], + letterSpacing: "-0.05em" + }, + "display-lg": { + _id: "headline-display-lg", + fontWeight: "bold", + clamp: [3.5, 5], + letterSpacing: "-0.05em", + lineHeight: 1 + }, + "display-md": { + _id: "headline-display-md", + fontWeight: "bold", + clamp: [3, 4], + letterSpacing: "-0.05em", + lineHeight: 1 + }, + "display-sm": { + _id: "headline-display-sm", + fontWeight: "bold", + clamp: [1.5, 2], + letterSpacing: "-0.05em", + lineHeight: 1 + }, + "display-xs": { + _id: "headline-display-xs", + fontWeight: "bold", + clamp: [1, 1], + letterSpacing: "-0em", + lineHeight: 1 + } +}; +var DEFAULT_TEXT = { + title: { + _id: "text-title", + fontSize: "1.5rem", + lineHeight: 1.25, + fontWeight: "normal", + letterSpacing: "0em" + }, + paragraph: { + _id: "text-paragraph", + fontSize: "1.25rem", + lineHeight: 1.35, + fontWeight: "normal", + letterSpacing: "0em" + }, + string: { + _id: "text-string", + fontSize: ".9rem", + lineHeight: 1.25, + fontWeight: "normal", + letterSpacing: "0em" + }, + body: { + _id: "text-body", + fontSize: "0.8rem", + lineHeight: 1.25, + fontWeight: "normal", + letterSpacing: "0em" + }, + caption: { + _id: "text-caption", + fontSize: "0.65rem", + lineHeight: 1.25, + fontWeight: "normal", + letterSpacing: "0em" + } +}; + +// src/utils/createRemClamp.ts +function createRemClamp(minFontSize, maxFontSize, minScreenSize = 1024, maxScreenSize = 1440) { + const minWidth = minScreenSize / 16; + const maxWidth = maxScreenSize / 16; + const m = (maxFontSize - minFontSize) / (maxWidth - minWidth); + const b = -minWidth * m + minFontSize; + return `clamp(${minFontSize}rem, ${b}rem + ${m * 100}vw, ${maxFontSize}rem)`; +} + +// src/utils/typedKeys.ts +function typedKeys(obj) { + return Object.keys(obj); +} + +// src/buenTypeTailwind.ts +function buenTypeTailwind({ addUtilities }, options) { + const generateStyles = (definition) => { + let styles = { + fontFamily: definition.fontFamily, + fontWeight: definition.fontWeight, + lineHeight: definition.lineHeight, + letterSpacing: definition.letterSpacing, + textTransform: definition.textTransform, + fontSize: definition.fontSize, + fontStyle: definition.fontStyle, + textDecoration: definition.textDecoration, + textShadow: definition.textShadow, + whiteSpace: definition.whiteSpace, + wordSpacing: definition.wordSpacing, + textOverflow: definition.textOverflow, + direction: definition.direction, + writingMode: definition.writingMode, + textRendering: definition.textRendering, + hyphens: definition.hyphens + }; + if (definition.fontSize) { + styles.fontSize = definition.fontSize; + } + if (definition.clamp) { + const customMinScreenSize = (options == null ? void 0 : options.customMinScreenSize) || 1024; + const customMaxScreenSize = (options == null ? void 0 : options.customMaxScreenSize) || 1440; + styles.fontSize = createRemClamp( + definition.clamp[0], + definition.clamp[1], + customMinScreenSize, + customMaxScreenSize + ); + } + return styles; + }; + const defaultHeadlines = (options == null ? void 0 : options.disableDefaults) ? null : DEFAULT_HEADLINE; + const mergedHeadlines = __spreadValues(__spreadValues({}, defaultHeadlines), options == null ? void 0 : options.customHeadlines); + const defaultTexts = (options == null ? void 0 : options.disableDefaults) ? null : DEFAULT_TEXT; + const mergedTexts = __spreadValues(__spreadValues({}, defaultTexts), options == null ? void 0 : options.customTexts); + let headlineUtilities = {}; + typedKeys(mergedHeadlines).forEach((key) => { + const style = mergedHeadlines[key]; + if (style) { + headlineUtilities[`.headline-${key}`] = generateStyles(style); + if (style.classAlias) { + style.classAlias.forEach((alias) => { + headlineUtilities[`.${alias}`] = generateStyles(style); + }); + } + } + }); + let textUtilities = {}; + typedKeys(mergedTexts).forEach((key) => { + const style = mergedTexts[key]; + if (style) { + textUtilities[`.text-${key}`] = generateStyles(style); + if (style.classAlias) { + style.classAlias.forEach((alias) => { + textUtilities[`.text-${alias}`] = generateStyles(style); + }); + } + } + }); + addUtilities(headlineUtilities); + addUtilities(textUtilities); +} +export { + buenTypeTailwind, + createRemClamp, + DEFAULT_HEADLINE as headlineDefault, + DEFAULT_TEXT as textDefault +}; +//# sourceMappingURL=index.mjs.map \ No newline at end of file diff --git a/dist/index.mjs.map b/dist/index.mjs.map new file mode 100644 index 0000000..0f0bfbc --- /dev/null +++ b/dist/index.mjs.map @@ -0,0 +1 @@ +{"version":3,"sources":["../src/defaults.ts","../src/utils/createRemClamp.ts","../src/utils/typedKeys.ts","../src/buenTypeTailwind.ts"],"sourcesContent":["import { TypeDefinitionHeadlines, TypeDefinitionTexts } from \"./types\";\n\n/**\n * Default headline object\n */\nexport const DEFAULT_HEADLINE: TypeDefinitionHeadlines = {\n \"display-xxl\": {\n _id: \"headline-display-xxl\",\n classAlias: [\"main-headline\"],\n fontWeight: \"bold\",\n clamp: [6, 12],\n letterSpacing: \"-0.05em\",\n },\n \"display-xl\": {\n _id: \"headline-display-xl\",\n fontWeight: \"bold\",\n clamp: [4.5, 9],\n letterSpacing: \"-0.05em\",\n },\n \"display-lg\": {\n _id: \"headline-display-lg\",\n fontWeight: \"bold\",\n clamp: [3.5, 5],\n letterSpacing: \"-0.05em\",\n lineHeight: 1,\n },\n \"display-md\": {\n _id: \"headline-display-md\",\n fontWeight: \"bold\",\n clamp: [3, 4],\n letterSpacing: \"-0.05em\",\n lineHeight: 1,\n },\n \"display-sm\": {\n _id: \"headline-display-sm\",\n fontWeight: \"bold\",\n clamp: [1.5, 2],\n letterSpacing: \"-0.05em\",\n lineHeight: 1,\n },\n \"display-xs\": {\n _id: \"headline-display-xs\",\n fontWeight: \"bold\",\n clamp: [1, 1],\n letterSpacing: \"-0em\",\n lineHeight: 1,\n },\n};\n\n/**\n * Default text object\n */\nexport const DEFAULT_TEXT: TypeDefinitionTexts = {\n title: {\n _id: \"text-title\",\n fontSize: \"1.5rem\",\n lineHeight: 1.25,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n paragraph: {\n _id: \"text-paragraph\",\n fontSize: \"1.25rem\",\n lineHeight: 1.35,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n string: {\n _id: \"text-string\",\n fontSize: \".9rem\",\n lineHeight: 1.25,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n body: {\n _id: \"text-body\",\n fontSize: \"0.8rem\",\n lineHeight: 1.25,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n caption: {\n _id: \"text-caption\",\n fontSize: \"0.65rem\",\n lineHeight: 1.25,\n fontWeight: \"normal\",\n letterSpacing: \"0em\",\n },\n};\n","/**\n * A module that provides a function to create a `rem`-based `clamp` function.\n *\n * @param minFontSize - The minimum font size in rem\n * @param maxFontSize - The maximum font size in rem\n * @param minScreenSize - The minimum screen size in pixels\n * @param maxScreenSize - The maximum screen size in pixels\n */\nexport function createRemClamp(\n minFontSize: number,\n maxFontSize: number,\n minScreenSize: number = 1024,\n maxScreenSize: number = 1440,\n): string {\n const minWidth = minScreenSize / 16;\n const maxWidth = maxScreenSize / 16;\n const m = (maxFontSize - minFontSize) / (maxWidth - minWidth);\n const b = -minWidth * m + minFontSize;\n\n return `clamp(${minFontSize}rem, ${b}rem + ${m * 100}vw, ${maxFontSize}rem)`;\n}\n","export function typedKeys(obj: T): (keyof T)[] {\n return Object.keys(obj) as (keyof T)[];\n}\n","import { DEFAULT_HEADLINE, DEFAULT_TEXT } from \"./defaults\";\nimport { CustomTypeDefinitions, TypeDefinition } from \"./types\";\nimport { createRemClamp } from \"./utils/createRemClamp\";\nimport { typedKeys } from \"./utils/typedKeys\";\n\ntype AddUtilities = {\n (utilities: Record, options?: any): void;\n};\n\n/**\n * A module that converts an object of headlines and text definitions into Tailwind CSS utilities.\n *\n * @todo Explore making minScreenSize and maxScreenSize configurable in createRemClamp\n * @todo Make addUtilities a named parameter, importing @tailwindcss/types\n * @todo Make return type more specific to what tailwind plugins expect\n */\nexport function buenTypeTailwind(\n { addUtilities }: { addUtilities: AddUtilities },\n options?: CustomTypeDefinitions,\n): void {\n const generateStyles = (definition: TypeDefinition) => {\n let styles: TypeDefinition = {\n fontFamily: definition.fontFamily,\n fontWeight: definition.fontWeight,\n lineHeight: definition.lineHeight,\n letterSpacing: definition.letterSpacing,\n textTransform: definition.textTransform,\n fontSize: definition.fontSize,\n fontStyle: definition.fontStyle,\n textDecoration: definition.textDecoration,\n textShadow: definition.textShadow,\n whiteSpace: definition.whiteSpace,\n wordSpacing: definition.wordSpacing,\n textOverflow: definition.textOverflow,\n direction: definition.direction,\n writingMode: definition.writingMode,\n textRendering: definition.textRendering,\n hyphens: definition.hyphens,\n };\n if (definition.fontSize) {\n styles.fontSize = definition.fontSize;\n }\n if (definition.clamp) {\n const customMinScreenSize = options?.customMinScreenSize || 1024;\n const customMaxScreenSize = options?.customMaxScreenSize || 1440;\n styles.fontSize = createRemClamp(\n definition.clamp[0],\n definition.clamp[1],\n customMinScreenSize,\n customMaxScreenSize,\n );\n }\n\n return styles;\n };\n\n /**\n * @todo Look into using deepmerge to merge the default and custom definitions\n */\n\n const defaultHeadlines = options?.disableDefaults ? null : DEFAULT_HEADLINE;\n const mergedHeadlines = {\n ...defaultHeadlines,\n ...options?.customHeadlines,\n };\n\n const defaultTexts = options?.disableDefaults ? null : DEFAULT_TEXT;\n const mergedTexts = { ...defaultTexts, ...options?.customTexts };\n\n let headlineUtilities: Record = {};\n typedKeys(mergedHeadlines).forEach((key) => {\n const style = mergedHeadlines[key];\n if (style) {\n headlineUtilities[`.headline-${key}`] = generateStyles(style);\n if (style.classAlias) {\n style.classAlias.forEach((alias) => {\n headlineUtilities[`.${alias}`] = generateStyles(style);\n });\n }\n }\n });\n\n let textUtilities: Record = {};\n typedKeys(mergedTexts).forEach((key) => {\n const style = mergedTexts[key];\n if (style) {\n textUtilities[`.text-${key}`] = generateStyles(style);\n if (style.classAlias) {\n style.classAlias.forEach((alias) => {\n textUtilities[`.text-${alias}`] = generateStyles(style);\n });\n }\n }\n });\n\n addUtilities(headlineUtilities);\n addUtilities(textUtilities);\n}\n"],"mappings":"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","names":[]} \ No newline at end of file diff --git a/dist/types.js b/dist/types.js deleted file mode 100644 index 718fd38..0000000 --- a/dist/types.js +++ /dev/null @@ -1,2 +0,0 @@ -export {}; -//# sourceMappingURL=types.js.map \ No newline at end of file diff --git a/dist/types.js.map b/dist/types.js.map deleted file mode 100644 index c768b79..0000000 --- a/dist/types.js.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""} \ No newline at end of file diff --git a/dist/utils/createRemClamp.d.ts b/dist/utils/createRemClamp.d.ts deleted file mode 100644 index 9a2e5b4..0000000 --- a/dist/utils/createRemClamp.d.ts +++ /dev/null @@ -1,9 +0,0 @@ -/** - * A module that provides a function to create a `rem`-based `clamp` function. - * - * @param minFontSize - The minimum font size in rem - * @param maxFontSize - The maximum font size in rem - * @param minScreenSize - The minimum screen size in pixels - * @param maxScreenSize - The maximum screen size in pixels - */ -export declare function createRemClamp(minFontSize: number, maxFontSize: number, minScreenSize?: number, maxScreenSize?: number): string; diff --git a/dist/utils/createRemClamp.js b/dist/utils/createRemClamp.js deleted file mode 100644 index 46f8cbf..0000000 --- a/dist/utils/createRemClamp.js +++ /dev/null @@ -1,16 +0,0 @@ -/** - * A module that provides a function to create a `rem`-based `clamp` function. - * - * @param minFontSize - The minimum font size in rem - * @param maxFontSize - The maximum font size in rem - * @param minScreenSize - The minimum screen size in pixels - * @param maxScreenSize - The maximum screen size in pixels - */ -export function createRemClamp(minFontSize, maxFontSize, minScreenSize = 1024, maxScreenSize = 1440) { - const minWidth = minScreenSize / 16; - const maxWidth = maxScreenSize / 16; - const m = (maxFontSize - minFontSize) / (maxWidth - minWidth); - const b = -minWidth * m + minFontSize; - return `clamp(${minFontSize}rem, ${b}rem + ${m * 100}vw, ${maxFontSize}rem)`; -} -//# sourceMappingURL=createRemClamp.js.map \ No newline at end of file diff --git a/dist/utils/createRemClamp.js.map b/dist/utils/createRemClamp.js.map deleted file mode 100644 index fc3f08d..0000000 --- a/dist/utils/createRemClamp.js.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"file":"createRemClamp.js","sourceRoot":"","sources":["../../src/utils/createRemClamp.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,MAAM,UAAU,cAAc,CAC5B,WAAmB,EACnB,WAAmB,EACnB,gBAAwB,IAAI,EAC5B,gBAAwB,IAAI;IAE5B,MAAM,QAAQ,GAAG,aAAa,GAAG,EAAE,CAAC;IACpC,MAAM,QAAQ,GAAG,aAAa,GAAG,EAAE,CAAC;IACpC,MAAM,CAAC,GAAG,CAAC,WAAW,GAAG,WAAW,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC;IAC9D,MAAM,CAAC,GAAG,CAAC,QAAQ,GAAG,CAAC,GAAG,WAAW,CAAC;IAEtC,OAAO,SAAS,WAAW,QAAQ,CAAC,SAAS,CAAC,GAAG,GAAG,OAAO,WAAW,MAAM,CAAC;AAC/E,CAAC"} \ No newline at end of file diff --git a/dist/utils/typedKeys.d.ts b/dist/utils/typedKeys.d.ts deleted file mode 100644 index afe80e7..0000000 --- a/dist/utils/typedKeys.d.ts +++ /dev/null @@ -1 +0,0 @@ -export declare function typedKeys(obj: T): (keyof T)[]; diff --git a/dist/utils/typedKeys.js b/dist/utils/typedKeys.js deleted file mode 100644 index 4319288..0000000 --- a/dist/utils/typedKeys.js +++ /dev/null @@ -1,4 +0,0 @@ -export function typedKeys(obj) { - return Object.keys(obj); -} -//# sourceMappingURL=typedKeys.js.map \ No newline at end of file diff --git a/dist/utils/typedKeys.js.map b/dist/utils/typedKeys.js.map deleted file mode 100644 index 2ac35b4..0000000 --- a/dist/utils/typedKeys.js.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"file":"typedKeys.js","sourceRoot":"","sources":["../../src/utils/typedKeys.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,SAAS,CAAmB,GAAM;IAChD,OAAO,MAAM,CAAC,IAAI,CAAC,GAAG,CAAgB,CAAC;AACzC,CAAC"} \ No newline at end of file