From fe93824063cdb8289e1109e3cddde99bf9a7b061 Mon Sep 17 00:00:00 2001 From: Mira Date: Wed, 15 Apr 2026 14:18:46 +0300 Subject: [PATCH] delete everythihg for fresh start --- src/index.ts | 234 --------------------------------------------------- 1 file changed, 234 deletions(-) delete mode 100644 src/index.ts diff --git a/src/index.ts b/src/index.ts deleted file mode 100644 index 9ec0314..0000000 --- a/src/index.ts +++ /dev/null @@ -1,234 +0,0 @@ -import plugin from "tailwindcss/plugin"; - -interface ThemeValueMap { - [key: string]: string | ThemeValueMap; -} - -const DEFAULT_SPACING_VALUE = "0.25rem"; -const DEFAULT_GAP = `calc(var(--spacing, ${DEFAULT_SPACING_VALUE}) * 2)`; -const DEFAULT_LENGTH = `calc(var(--spacing, ${DEFAULT_SPACING_VALUE}) * 3)`; -const DEFAULT_BORDER_WIDTH = "1px"; -const DEFAULT_OFFSET = "0px"; -const DEFAULT_COLOR = "currentColor"; -const DEFAULT_RADIUS = "0px"; -const svgRadius = - "max(0px, calc(var(--tw-dashed-border-radius) - (var(--tw-dashed-border-width) / 2)))"; -const dashedBorderTransitionProperties = - "stroke-dasharray, stroke-dashoffset, stroke-width, stroke, rx"; -const strokeDasharrayValue = ( - length: string, - gap: string, -): string => `${length} max(${gap}, 0.001px)`; - -const flattenThemeMap = ( - input: ThemeValueMap, - path: string[] = [], -): Record => { - const output: Record = {}; - - for (const [key, value] of Object.entries(input)) { - const nextPath = key === "DEFAULT" ? path : [...path, key]; - - if (typeof value === "string") { - output[nextPath.join("-")] = value; - continue; - } - - Object.assign(output, flattenThemeMap(value, nextPath)); - } - - return output; -}; - -const roundedSelector = (name: string): string => - name === "DEFAULT" ? ".rounded" : `.rounded-${name}`; - -const dashedBorderPlugin: ReturnType = plugin( - ({ addBase, addUtilities, matchUtilities, theme }) => { - addBase({ - "@property --tw-dashed-border-gap": { - syntax: "", - inherits: "true", - "initial-value": "0.5rem", - }, - "@property --tw-dashed-border-length": { - syntax: "", - inherits: "true", - "initial-value": "0.75rem", - }, - "@property --tw-dashed-border-offset": { - syntax: "", - inherits: "true", - "initial-value": DEFAULT_OFFSET, - }, - "@property --tw-dashed-border-width": { - syntax: "", - inherits: "true", - "initial-value": DEFAULT_BORDER_WIDTH, - }, - "@property --tw-dashed-border-radius": { - syntax: "", - inherits: "true", - "initial-value": DEFAULT_RADIUS, - }, - }); - - addUtilities({ - ".dashed-border": { - "--tw-dashed-border-gap": DEFAULT_GAP, - "--tw-dashed-border-length": DEFAULT_LENGTH, - "--tw-dashed-border-offset": DEFAULT_OFFSET, - "--tw-dashed-border-width": DEFAULT_BORDER_WIDTH, - "--tw-dashed-border-color": DEFAULT_COLOR, - "--tw-dashed-border-radius": DEFAULT_RADIUS, - position: "relative", - }, - ".dashed-border-svg": { - display: "block", - position: "absolute", - inset: "0", - width: "100%", - height: "100%", - overflow: "hidden", - pointerEvents: "none", - }, - ".dashed-border-rect": { - fill: "none", - stroke: "var(--tw-dashed-border-color)", - strokeWidth: "var(--tw-dashed-border-width)", - strokeDasharray: strokeDasharrayValue( - "var(--tw-dashed-border-length)", - "var(--tw-dashed-border-gap)", - ), - strokeDashoffset: "var(--tw-dashed-border-offset)", - shapeRendering: "geometricPrecision", - vectorEffect: "non-scaling-stroke", - x: "calc(var(--tw-dashed-border-width) / 2)", - y: "calc(var(--tw-dashed-border-width) / 2)", - width: "calc(100% - var(--tw-dashed-border-width))", - height: "calc(100% - var(--tw-dashed-border-width))", - rx: svgRadius, - }, - ".dashed-border-transition, .dashed-border.transition, .dashed-border.transition-all": - { - transitionTimingFunction: - "var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1))", - transitionDuration: "var(--default-transition-duration, 150ms)", - }, - ".dashed-border.transition-colors": { - transitionTimingFunction: - "var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1))", - transitionDuration: "var(--default-transition-duration, 150ms)", - }, - ".dashed-border-transition .dashed-border-rect, .dashed-border.transition .dashed-border-rect, .dashed-border.transition-all .dashed-border-rect": - { - transitionProperty: dashedBorderTransitionProperties, - transitionTimingFunction: "inherit", - transitionDuration: "inherit", - }, - ".dashed-border.transition-colors .dashed-border-rect": { - transitionProperty: "stroke", - transitionTimingFunction: "inherit", - transitionDuration: "inherit", - }, - }); - - const spacing = theme("spacing", {}) as Record; - const borderWidths = theme("borderWidth", { - DEFAULT: DEFAULT_BORDER_WIDTH, - }) as Record; - const colors = flattenThemeMap(theme("colors", {}) as ThemeValueMap); - const radii = theme("borderRadius", { - DEFAULT: DEFAULT_RADIUS, - }) as Record; - - matchUtilities( - { - "dashed-border-gap": (value: string) => ({ - "--tw-dashed-border-gap": value, - "& .dashed-border-rect": { - strokeDasharray: strokeDasharrayValue( - "var(--tw-dashed-border-length)", - value, - ), - }, - }), - "dashed-border-length": (value: string) => ({ - "--tw-dashed-border-length": value, - "& .dashed-border-rect": { - strokeDasharray: strokeDasharrayValue( - value, - "var(--tw-dashed-border-gap)", - ), - }, - }), - "dashed-border-offset": (value: string) => ({ - "--tw-dashed-border-offset": value, - "& .dashed-border-rect": { - strokeDashoffset: value, - }, - }), - "dashed-border-radius": (value: string) => ({ - "--tw-dashed-border-radius": value, - "& .dashed-border-rect": { - rx: `max(0px, calc(${value} - (var(--tw-dashed-border-width) / 2)))`, - }, - }), - }, - { - values: spacing, - }, - ); - - matchUtilities( - { - "dashed-border-width": (value: string) => ({ - "--tw-dashed-border-width": value, - "& .dashed-border-rect": { - strokeWidth: value, - x: `calc(${value} / 2)`, - y: `calc(${value} / 2)`, - width: `calc(100% - ${value})`, - height: `calc(100% - ${value})`, - rx: `max(0px, calc(var(--tw-dashed-border-radius) - (${value} / 2)))`, - }, - }), - }, - { - values: borderWidths, - }, - ); - - matchUtilities( - { - "dashed-border-color": (value: string) => ({ - "--tw-dashed-border-color": value, - "& .dashed-border-rect": { - stroke: value, - }, - }), - }, - { - values: { - ...colors, - current: "currentColor", - inherit: "inherit", - transparent: "transparent", - }, - }, - ); - - addUtilities( - Object.fromEntries( - Object.entries(radii).map(([name, value]) => [ - `.dashed-border${roundedSelector(name)}`, - { - "--tw-dashed-border-radius": value, - }, - ]), - ), - ); - }, -); - -export default dashedBorderPlugin;