@klinking/squircle 0.7.3 → 0.7.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"tw-plugin.d.mts","names":[],"sources":["../src/tw-plugin.ts"],"mappings":";;;UAUiB,qBAAA;;EAEf,MAAA;EAFoC;EAIpC,SAAA;EAJoC;EAMpC,MAAA;AAAA;AAAA,cAGI,QAAA,EAAU,UAAA,QAAkB,MAAA,CAAO,WAAA,CAAY,qBAAA"}
1
+ {"version":3,"file":"tw-plugin.d.mts","names":[],"sources":["../src/tw-plugin.ts"],"mappings":";;;UAWiB,qBAAA;;EAEf,MAAA;EAFoC;EAIpC,SAAA;EAJoC;EAMpC,MAAA;AAAA;AAAA,cAGI,QAAA,EAAU,UAAA,QAAkB,MAAA,CAAO,WAAA,CAAY,qBAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"tw-plugin.mjs","names":[],"sources":["../src/variants.ts","../src/tw-plugin.ts"],"sourcesContent":["export const DEFAULT_AMT = 2 as const;\nexport const DEFAULT_AMOUNT_VAR_NAME = \"--squircle-amt\" as const;\nexport const DEFAULT_AMT_CSS = `var(${DEFAULT_AMOUNT_VAR_NAME}, ${DEFAULT_AMT})` as const;\n\nexport const getCornerShape = (varName: string = DEFAULT_AMOUNT_VAR_NAME) =>\n `superellipse(var(${varName}, ${DEFAULT_AMT}))` as const;\n\nexport function correctedRadius(radius: string, amt: string = DEFAULT_AMT_CSS): string {\n return `calc(${radius} * (1 - pow(2, -0.5)) / (1 - pow(2, -1 * pow(2, -1 * ${amt}))))` as const;\n}\n\ntype SectionComment = { comment: string };\ntype VariantEntry = string[] | SectionComment;\n\nfunction isComment(entry: VariantEntry): entry is SectionComment {\n return !Array.isArray(entry);\n}\n\nexport const SUPPORTS_RULE = \"@supports (corner-shape: superellipse(2))\";\n\nexport const VARIANTS: Record<string, VariantEntry> & Record<`$comment-${string}`, SectionComment> =\n {\n \"\": [\"border-radius\"],\n \"$comment-physical-sides\": { comment: \"/* --- Per-side physical variants --- */\" },\n t: [\"border-top-left-radius\", \"border-top-right-radius\"],\n r: [\"border-top-right-radius\", \"border-bottom-right-radius\"],\n b: [\"border-bottom-left-radius\", \"border-bottom-right-radius\"],\n l: [\"border-top-left-radius\", \"border-bottom-left-radius\"],\n \"$comment-logical-sides\": { comment: \"/* --- Per-side logical variants --- */\" },\n s: [\"border-start-start-radius\", \"border-end-start-radius\"],\n e: [\"border-start-end-radius\", \"border-end-end-radius\"],\n \"$comment-physical-corners\": { comment: \"/* --- Per-corner physical variants --- */\" },\n tl: [\"border-top-left-radius\"],\n tr: [\"border-top-right-radius\"],\n br: [\"border-bottom-right-radius\"],\n bl: [\"border-bottom-left-radius\"],\n \"$comment-logical-corners\": { comment: \"/* --- Per-corner logical variants --- */\" },\n ss: [\"border-start-start-radius\"],\n se: [\"border-start-end-radius\"],\n es: [\"border-end-start-radius\"],\n ee: [\"border-end-end-radius\"],\n };\n\nexport function variantEntries(): [string, string[]][] {\n return Object.entries(VARIANTS).filter(\n (entry): entry is [string, string[]] => !isComment(entry[1]),\n );\n}\n\nexport function usesIntermediateVar(suffix: string): boolean {\n const entry = VARIANTS[suffix];\n if (!entry || isComment(entry)) return false;\n return suffix === \"\" || entry.length > 1;\n}\n\nexport { isComment };\nexport type { SectionComment, VariantEntry };\n","import plugin from \"tailwindcss/plugin\";\nimport {\n DEFAULT_AMOUNT_VAR_NAME,\n correctedRadius,\n getCornerShape,\n usesIntermediateVar,\n variantEntries,\n} from \"./variants\";\nimport { SUPPORTS_RULE } from \"./variants\";\n\nexport interface SquirclePluginOptions {\n /** CSS custom property name for the superellipse amount (default: \"--squircle-amt\") */\n amtVar?: string;\n /** @plugin CSS alias for amtVar */\n \"amt-var\"?: string;\n /** Class name prefix for utilities (default: \"squircle\") */\n prefix?: string;\n}\n\nconst squircle: ReturnType<typeof plugin.withOptions<SquirclePluginOptions>> =\n plugin.withOptions<SquirclePluginOptions>((options = {}) =>\n // eslint-disable-next-line @typescript-eslint/unbound-method\n ({ matchUtilities, theme }) => {\n const amtVar = options.amtVar ?? options[\"amt-var\"] ?? DEFAULT_AMOUNT_VAR_NAME;\n const prefix = options.prefix ?? \"squircle\";\n const radiusValues = theme(\"borderRadius\");\n\n const amtCss = `var(${amtVar}, 2)`;\n const cornerShape = getCornerShape(amtVar);\n\n matchUtilities(\n {\n [`${prefix}-amt`]: (value: string) => ({\n [amtVar]: value,\n [SUPPORTS_RULE]: {\n \"corner-shape\": `superellipse(var(${amtVar}))`,\n },\n }),\n },\n { type: \"number\" },\n );\n\n for (const [suffix, props] of variantEntries()) {\n const name = suffix ? `${prefix}-${suffix}` : prefix;\n\n if (usesIntermediateVar(suffix)) {\n matchUtilities(\n {\n [name]: (value: string) => ({\n ...Object.fromEntries(props.map((p) => [p, value])),\n [SUPPORTS_RULE]: {\n \"--squircle-r\": correctedRadius(value, amtCss),\n ...Object.fromEntries(props.map((p) => [p, \"var(--squircle-r)\"])),\n \"corner-shape\": cornerShape,\n },\n }),\n },\n { type: \"length\", values: radiusValues },\n );\n } else {\n const prop = props[0]!;\n matchUtilities(\n {\n [name]: (value: string) => {\n const result: Record<string, string | Record<string, string>> = {\n [prop]: value,\n };\n result[SUPPORTS_RULE] = {\n [prop]: correctedRadius(value, amtCss),\n \"corner-shape\": cornerShape,\n };\n return result;\n },\n },\n { type: \"length\", values: radiusValues },\n );\n }\n }\n });\n\nexport default squircle;\n"],"mappings":";AACA,MAAa,0BAA0B;AACvC,MAAa,kBAAkB,OAAO,wBAAwB;AAE9D,MAAa,kBAAkB,UAAkB,4BAC/C,oBAAoB,QAAQ;AAE9B,SAAgB,gBAAgB,QAAgB,MAAc,iBAAyB;AACrF,QAAO,QAAQ,OAAO,uDAAuD,IAAI;;AAMnF,SAAS,UAAU,OAA8C;AAC/D,QAAO,CAAC,MAAM,QAAQ,MAAM;;AAG9B,MAAa,gBAAgB;AAE7B,MAAa,WACX;CACE,IAAI,CAAC,gBAAgB;CACrB,2BAA2B,EAAE,SAAS,4CAA4C;CAClF,GAAG,CAAC,0BAA0B,0BAA0B;CACxD,GAAG,CAAC,2BAA2B,6BAA6B;CAC5D,GAAG,CAAC,6BAA6B,6BAA6B;CAC9D,GAAG,CAAC,0BAA0B,4BAA4B;CAC1D,0BAA0B,EAAE,SAAS,2CAA2C;CAChF,GAAG,CAAC,6BAA6B,0BAA0B;CAC3D,GAAG,CAAC,2BAA2B,wBAAwB;CACvD,6BAA6B,EAAE,SAAS,8CAA8C;CACtF,IAAI,CAAC,yBAAyB;CAC9B,IAAI,CAAC,0BAA0B;CAC/B,IAAI,CAAC,6BAA6B;CAClC,IAAI,CAAC,4BAA4B;CACjC,4BAA4B,EAAE,SAAS,6CAA6C;CACpF,IAAI,CAAC,4BAA4B;CACjC,IAAI,CAAC,0BAA0B;CAC/B,IAAI,CAAC,0BAA0B;CAC/B,IAAI,CAAC,wBAAwB;CAC9B;AAEH,SAAgB,iBAAuC;AACrD,QAAO,OAAO,QAAQ,SAAS,CAAC,QAC7B,UAAuC,CAAC,UAAU,MAAM,GAAG,CAC7D;;AAGH,SAAgB,oBAAoB,QAAyB;CAC3D,MAAM,QAAQ,SAAS;AACvB,KAAI,CAAC,SAAS,UAAU,MAAM,CAAE,QAAO;AACvC,QAAO,WAAW,MAAM,MAAM,SAAS;;;;ACjCzC,MAAM,WACJ,OAAO,aAAoC,UAAU,EAAE,MAEpD,EAAE,gBAAgB,YAAY;CAC/B,MAAM,SAAS,QAAQ,UAAU,QAAQ,cAAA;CACzC,MAAM,SAAS,QAAQ,UAAU;CACjC,MAAM,eAAe,MAAM,eAAe;CAE1C,MAAM,SAAS,OAAO,OAAO;CAC7B,MAAM,cAAc,eAAe,OAAO;AAE1C,gBACE,GACG,GAAG,OAAO,SAAS,WAAmB;GACpC,SAAS;GACT,gBAAgB,EACf,gBAAgB,oBAAoB,OAAO,KAC5C;EACF,GACF,EACD,EAAE,MAAM,UAAU,CACnB;AAED,MAAK,MAAM,CAAC,QAAQ,UAAU,gBAAgB,EAAE;EAC9C,MAAM,OAAO,SAAS,GAAG,OAAO,GAAG,WAAW;AAE9C,MAAI,oBAAoB,OAAO,CAC7B,gBACE,GACG,QAAQ,WAAmB;GAC1B,GAAG,OAAO,YAAY,MAAM,KAAK,MAAM,CAAC,GAAG,MAAM,CAAC,CAAC;IAClD,gBAAgB;IACf,gBAAgB,gBAAgB,OAAO,OAAO;IAC9C,GAAG,OAAO,YAAY,MAAM,KAAK,MAAM,CAAC,GAAG,oBAAoB,CAAC,CAAC;IACjE,gBAAgB;IACjB;GACF,GACF,EACD;GAAE,MAAM;GAAU,QAAQ;GAAc,CACzC;OACI;GACL,MAAM,OAAO,MAAM;AACnB,kBACE,GACG,QAAQ,UAAkB;IACzB,MAAM,SAA0D,GAC7D,OAAO,OACT;AACD,WAAO,iBAAiB;MACrB,OAAO,gBAAgB,OAAO,OAAO;KACtC,gBAAgB;KACjB;AACD,WAAO;MAEV,EACD;IAAE,MAAM;IAAU,QAAQ;IAAc,CACzC;;;EAGL"}
1
+ {"version":3,"file":"tw-plugin.mjs","names":[],"sources":["../src/variants.ts","../src/tw-plugin.ts"],"sourcesContent":["export const DEFAULT_AMT = 2 as const;\nexport const DEFAULT_AMOUNT_VAR_NAME = \"--squircle-amt\" as const;\nexport const DEFAULT_AMT_CSS = `var(${DEFAULT_AMOUNT_VAR_NAME}, ${DEFAULT_AMT})` as const;\n\nexport const getCornerShape = (varName: string = DEFAULT_AMOUNT_VAR_NAME) =>\n `superellipse(var(${varName}, ${DEFAULT_AMT}))` as const;\n\nexport function correctedRadius(radius: string, amt: string = DEFAULT_AMT_CSS): string {\n return `calc(${radius} * (1 - pow(2, -0.5)) / (1 - pow(2, -1 * pow(2, -1 * ${amt}))))` as const;\n}\n\ntype SectionComment = { comment: string };\ntype VariantEntry = string[] | SectionComment;\n\nfunction isComment(entry: VariantEntry): entry is SectionComment {\n return !Array.isArray(entry);\n}\n\nexport const SUPPORTS_RULE = \"@supports (corner-shape: superellipse(2))\";\n\nexport const VARIANTS: Record<string, VariantEntry> & Record<`$comment-${string}`, SectionComment> =\n {\n \"\": [\"border-radius\"],\n \"$comment-physical-sides\": { comment: \"/* --- Per-side physical variants --- */\" },\n t: [\"border-top-left-radius\", \"border-top-right-radius\"],\n r: [\"border-top-right-radius\", \"border-bottom-right-radius\"],\n b: [\"border-bottom-left-radius\", \"border-bottom-right-radius\"],\n l: [\"border-top-left-radius\", \"border-bottom-left-radius\"],\n \"$comment-logical-sides\": { comment: \"/* --- Per-side logical variants --- */\" },\n s: [\"border-start-start-radius\", \"border-end-start-radius\"],\n e: [\"border-start-end-radius\", \"border-end-end-radius\"],\n \"$comment-physical-corners\": { comment: \"/* --- Per-corner physical variants --- */\" },\n tl: [\"border-top-left-radius\"],\n tr: [\"border-top-right-radius\"],\n br: [\"border-bottom-right-radius\"],\n bl: [\"border-bottom-left-radius\"],\n \"$comment-logical-corners\": { comment: \"/* --- Per-corner logical variants --- */\" },\n ss: [\"border-start-start-radius\"],\n se: [\"border-start-end-radius\"],\n es: [\"border-end-start-radius\"],\n ee: [\"border-end-end-radius\"],\n };\n\nexport function variantEntries(): [string, string[]][] {\n return Object.entries(VARIANTS).filter(\n (entry): entry is [string, string[]] => !isComment(entry[1]),\n );\n}\n\nexport function usesIntermediateVar(suffix: string): boolean {\n const entry = VARIANTS[suffix];\n if (!entry || isComment(entry)) return false;\n return suffix === \"\" || entry.length > 1;\n}\n\nexport { isComment };\nexport type { SectionComment, VariantEntry };\n","import plugin from \"tailwindcss/plugin\";\nimport {\n DEFAULT_AMT,\n DEFAULT_AMOUNT_VAR_NAME,\n correctedRadius,\n getCornerShape,\n usesIntermediateVar,\n variantEntries,\n SUPPORTS_RULE,\n} from \"./variants\";\n\nexport interface SquirclePluginOptions {\n /** CSS custom property name for the superellipse amount (default: \"--squircle-amt\") */\n amtVar?: string;\n /** @plugin CSS alias for amtVar */\n \"amt-var\"?: string;\n /** Class name prefix for utilities (default: \"squircle\") */\n prefix?: string;\n}\n\nconst squircle: ReturnType<typeof plugin.withOptions<SquirclePluginOptions>> =\n plugin.withOptions<SquirclePluginOptions>((options = {}) =>\n // eslint-disable-next-line @typescript-eslint/unbound-method\n ({ matchUtilities, theme }) => {\n const amtVar = options.amtVar ?? options[\"amt-var\"] ?? DEFAULT_AMOUNT_VAR_NAME;\n const prefix = options.prefix ?? \"squircle\";\n const radiusValues = theme(\"borderRadius\");\n\n const amtCss = `var(${amtVar}, ${DEFAULT_AMT})`;\n const cornerShape = getCornerShape(amtVar);\n\n matchUtilities(\n {\n [`${prefix}-amt`]: (value: string) => ({\n [amtVar]: value,\n [SUPPORTS_RULE]: {\n \"corner-shape\": `superellipse(var(${amtVar}))`,\n },\n }),\n },\n { type: \"number\" },\n );\n\n for (const [suffix, props] of variantEntries()) {\n const name = suffix ? `${prefix}-${suffix}` : prefix;\n\n if (usesIntermediateVar(suffix)) {\n matchUtilities(\n {\n [name]: (value: string) => ({\n ...Object.fromEntries(props.map((p) => [p, value])),\n [SUPPORTS_RULE]: {\n \"--squircle-r\": correctedRadius(value, amtCss),\n ...Object.fromEntries(props.map((p) => [p, \"var(--squircle-r)\"])),\n \"corner-shape\": cornerShape,\n },\n }),\n },\n { type: \"length\", values: radiusValues },\n );\n } else {\n const prop = props[0]!;\n matchUtilities(\n {\n [name]: (value: string) => {\n const result: Record<string, string | Record<string, string>> = {\n [prop]: value,\n };\n result[SUPPORTS_RULE] = {\n [prop]: correctedRadius(value, amtCss),\n \"corner-shape\": cornerShape,\n };\n return result;\n },\n },\n { type: \"length\", values: radiusValues },\n );\n }\n }\n });\n\nexport default squircle;\n"],"mappings":";AACA,MAAa,0BAA0B;AACvC,MAAa,kBAAkB,OAAO,wBAAwB;AAE9D,MAAa,kBAAkB,UAAkB,4BAC/C,oBAAoB,QAAQ;AAE9B,SAAgB,gBAAgB,QAAgB,MAAc,iBAAyB;AACrF,QAAO,QAAQ,OAAO,uDAAuD,IAAI;;AAMnF,SAAS,UAAU,OAA8C;AAC/D,QAAO,CAAC,MAAM,QAAQ,MAAM;;AAG9B,MAAa,gBAAgB;AAE7B,MAAa,WACX;CACE,IAAI,CAAC,gBAAgB;CACrB,2BAA2B,EAAE,SAAS,4CAA4C;CAClF,GAAG,CAAC,0BAA0B,0BAA0B;CACxD,GAAG,CAAC,2BAA2B,6BAA6B;CAC5D,GAAG,CAAC,6BAA6B,6BAA6B;CAC9D,GAAG,CAAC,0BAA0B,4BAA4B;CAC1D,0BAA0B,EAAE,SAAS,2CAA2C;CAChF,GAAG,CAAC,6BAA6B,0BAA0B;CAC3D,GAAG,CAAC,2BAA2B,wBAAwB;CACvD,6BAA6B,EAAE,SAAS,8CAA8C;CACtF,IAAI,CAAC,yBAAyB;CAC9B,IAAI,CAAC,0BAA0B;CAC/B,IAAI,CAAC,6BAA6B;CAClC,IAAI,CAAC,4BAA4B;CACjC,4BAA4B,EAAE,SAAS,6CAA6C;CACpF,IAAI,CAAC,4BAA4B;CACjC,IAAI,CAAC,0BAA0B;CAC/B,IAAI,CAAC,0BAA0B;CAC/B,IAAI,CAAC,wBAAwB;CAC9B;AAEH,SAAgB,iBAAuC;AACrD,QAAO,OAAO,QAAQ,SAAS,CAAC,QAC7B,UAAuC,CAAC,UAAU,MAAM,GAAG,CAC7D;;AAGH,SAAgB,oBAAoB,QAAyB;CAC3D,MAAM,QAAQ,SAAS;AACvB,KAAI,CAAC,SAAS,UAAU,MAAM,CAAE,QAAO;AACvC,QAAO,WAAW,MAAM,MAAM,SAAS;;;;AChCzC,MAAM,WACJ,OAAO,aAAoC,UAAU,EAAE,MAEpD,EAAE,gBAAgB,YAAY;CAC/B,MAAM,SAAS,QAAQ,UAAU,QAAQ,cAAA;CACzC,MAAM,SAAS,QAAQ,UAAU;CACjC,MAAM,eAAe,MAAM,eAAe;CAE1C,MAAM,SAAS,OAAO,OAAO;CAC7B,MAAM,cAAc,eAAe,OAAO;AAE1C,gBACE,GACG,GAAG,OAAO,SAAS,WAAmB;GACpC,SAAS;GACT,gBAAgB,EACf,gBAAgB,oBAAoB,OAAO,KAC5C;EACF,GACF,EACD,EAAE,MAAM,UAAU,CACnB;AAED,MAAK,MAAM,CAAC,QAAQ,UAAU,gBAAgB,EAAE;EAC9C,MAAM,OAAO,SAAS,GAAG,OAAO,GAAG,WAAW;AAE9C,MAAI,oBAAoB,OAAO,CAC7B,gBACE,GACG,QAAQ,WAAmB;GAC1B,GAAG,OAAO,YAAY,MAAM,KAAK,MAAM,CAAC,GAAG,MAAM,CAAC,CAAC;IAClD,gBAAgB;IACf,gBAAgB,gBAAgB,OAAO,OAAO;IAC9C,GAAG,OAAO,YAAY,MAAM,KAAK,MAAM,CAAC,GAAG,oBAAoB,CAAC,CAAC;IACjE,gBAAgB;IACjB;GACF,GACF,EACD;GAAE,MAAM;GAAU,QAAQ;GAAc,CACzC;OACI;GACL,MAAM,OAAO,MAAM;AACnB,kBACE,GACG,QAAQ,UAAkB;IACzB,MAAM,SAA0D,GAC7D,OAAO,OACT;AACD,WAAO,iBAAiB;MACrB,OAAO,gBAAgB,OAAO,OAAO;KACtC,gBAAgB;KACjB;AACD,WAAO;MAEV,EACD;IAAE,MAAM;IAAU,QAAQ;IAAc,CACzC;;;EAGL"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@klinking/squircle",
3
- "version": "0.7.3",
3
+ "version": "0.7.4",
4
4
  "description": "Tailwind CSS v4 squircle (superellipse) corner utilities with visual radius correction",
5
5
  "keywords": [
6
6
  "border-radius",