styled-components-jsx 1.0.0 → 1.0.2

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.
package/README.md CHANGED
@@ -206,9 +206,6 @@ This package brings the comfort and beauty of `styled-components` to the world o
206
206
 
207
207
  **You get the best of both worlds — now with a splash of color. 🎨**
208
208
 
209
-
210
- Конечно! Вот секция благодарности, оформленная с теплотой и уважением к авторам `styled-jsx` и `styled-components`:
211
-
212
209
  ---
213
210
 
214
211
  ## 🙏 Thanks & Credits
package/package.json CHANGED
@@ -1,7 +1,8 @@
1
1
  {
2
- "version": "1.0.0",
2
+ "version": "1.0.2",
3
3
  "license": "MIT",
4
4
  "name": "styled-components-jsx",
5
+ "type": "module",
5
6
  "author": {
6
7
  "email": "freshcrowd@gmail.com",
7
8
  "name": "Denis Orlov",
@@ -23,24 +24,14 @@
23
24
  "react-typescript",
24
25
  "typescript"
25
26
  ],
26
- "module": "dist/styled-components-jsx.esm.js",
27
- "main": "dist/index.js",
28
- "typings": "dist/index.d.ts",
27
+ "main": "./src/index.tsx",
28
+ "types": "./src/index.tsx",
29
29
  "files": [
30
- "dist"
30
+ "src"
31
31
  ],
32
32
  "scripts": {
33
- "start": "tsdx watch",
34
- "build": "tsdx build",
35
- "lint": "tsdx lint",
36
- "prepare": "install-peers && tsdx build",
37
33
  "postinstall": "manypkg fix && manypkg check"
38
34
  },
39
- "husky": {
40
- "hooks": {
41
- "pre-commit": "tsdx lint"
42
- }
43
- },
44
35
  "prettier": {
45
36
  "printWidth": 100,
46
37
  "trailingComma": "es5",
@@ -71,7 +62,6 @@
71
62
  "devDependencies": {
72
63
  "@eslint/js": "9.24.0",
73
64
  "@manypkg/cli": "0.23.0",
74
- "@next/eslint-plugin-next": "^15.3.0",
75
65
  "@types/react": "^18.0.0 ||^19.0.0",
76
66
  "@types/react-dom": "^19.1.2",
77
67
  "@types/styled-jsx": "3.4.4",
@@ -87,14 +77,9 @@
87
77
  "eslint-plugin-react-hooks": "^5.2.0",
88
78
  "eslint-plugin-security": "3.0.1",
89
79
  "eslint-plugin-unicorn": "58.0.0",
90
- "husky": "^9.1.7",
91
- "install-peers-cli": "^2.2.0",
92
80
  "prettier": "3.5.3",
93
81
  "react": "^18.0.0 ||^19.0.0",
94
82
  "react-dom": "^18.0.0 ||^19.0.0",
95
- "semantic-release": "24.2.3",
96
- "tsdx": "^0.14.1",
97
- "tslib": "^2.8.1",
98
83
  "typescript": "5.8.3",
99
84
  "typescript-eslint": "^8.29.1"
100
85
  }
@@ -0,0 +1,22 @@
1
+ /* Precompile regular expressions */
2
+ const commentRegex = /\/\*[\s\S]*?\*\/|\/\/.*/g
3
+ const symbolRegex = /\s*([{}:;,>~+()])\s*/g
4
+ const whitespaceRegex = /\s+/g
5
+ const semicolonRegex = /;}/g
6
+
7
+ /**
8
+ * Minifies a LESS string by removing comments, extra spaces, and unnecessary semicolons.
9
+ *
10
+ * @param {string} lessString - The LESS string to be minified.
11
+ * @returns {string} - The minified LESS string.
12
+ */
13
+ export function minifyLess(lessString: string): string {
14
+ return lessString
15
+ .replaceAll(commentRegex, '') // Remove multi-line and single-line comments
16
+ .replaceAll(symbolRegex, '$1') // Remove extra spaces around symbols
17
+ .replaceAll(whitespaceRegex, ' ') // Compress remaining whitespace to a single space
18
+ .replaceAll(semicolonRegex, '}') // Remove extra semicolons before closing braces
19
+ .trim() // Trim spaces from the beginning and end
20
+ }
21
+
22
+ console.log('test')
package/src/index.tsx ADDED
@@ -0,0 +1,89 @@
1
+ import React, { ElementType, JSX, ReactNode } from 'react'
2
+ import { minifyLess } from './helpers/minifyLess'
3
+
4
+ /**
5
+ * Type definition for the styled function.
6
+ * Supports both HTML elements and React components.
7
+ */
8
+ type StyledComponent<T extends ElementType> = <P extends object = React.ComponentProps<T>>(
9
+ styles: TemplateStringsArray,
10
+ ...interpolations: Array<((properties: P) => string | number) | string | number>
11
+ ) => (properties: P & { children?: ReactNode; className?: string }) => JSX.Element
12
+
13
+ /**
14
+ * Filters out props starting with '$' or custom props not accepted by HTML elements.
15
+ */
16
+ const filterDollarProperties = <T extends Record<string, unknown>>(properties: T): Partial<T> =>
17
+ Object.fromEntries(
18
+ Object.entries(properties).filter(([key]) => !key.startsWith('$'))
19
+ ) as Partial<T>
20
+
21
+ /**
22
+ * Base function to create styled components.
23
+ *
24
+ * @param Component - An HTML tag (e.g., "div", "button") or a React component.
25
+ * @returns A function that takes CSS styles and returns a styled component.
26
+ */
27
+ const createStyled =
28
+ <T extends ElementType>(Component: T): StyledComponent<T> =>
29
+ (styles, ...interpolations) =>
30
+ properties => {
31
+ // Non-removable class reference for this plugin
32
+ const classNameReference = '🎨'
33
+
34
+ // Process styles and replace interpolations with actual prop values
35
+ const processedStyles = styles
36
+ .map((style, index) => {
37
+ const interpolation = interpolations[index]
38
+ const value =
39
+ typeof interpolation === 'function'
40
+ ? interpolation(properties)
41
+ : (interpolation ?? '')
42
+ return style + value
43
+ })
44
+ .join('')
45
+
46
+ const isCustomComponent = typeof Component !== 'string'
47
+ const filteredProperties = isCustomComponent
48
+ ? properties
49
+ : filterDollarProperties(properties)
50
+
51
+ // Ensure Component is a valid React component or HTML tag
52
+ const Element: ElementType = Component
53
+
54
+ return (
55
+ <>
56
+ <Element
57
+ {...filteredProperties}
58
+ className={[properties.className, classNameReference].filter(Boolean).join(' ')}
59
+ >
60
+ {properties.children}
61
+ </Element>
62
+ <style jsx>{`
63
+ .${classNameReference} {
64
+ ${minifyLess(processedStyles)}
65
+ }
66
+ `}</style>
67
+ </>
68
+ )
69
+ }
70
+
71
+ /**
72
+ * Utility type for mapping styled properties to common HTML elements.
73
+ */
74
+ type StyledHTMLTags = {
75
+ [Tag in keyof JSX.IntrinsicElements]: StyledComponent<Tag>
76
+ }
77
+
78
+ /**
79
+ * Proxy-based styled function allowing:
80
+ * - `styled("div")`
81
+ * - `styled.div`
82
+ */
83
+ const styled = new Proxy(createStyled, {
84
+ get: (_, tag: keyof JSX.IntrinsicElements) => createStyled(tag),
85
+ }) as typeof createStyled & StyledHTMLTags
86
+
87
+ export { minifyLess }
88
+
89
+ export default styled
@@ -1,8 +0,0 @@
1
- /**
2
- * Minifies a LESS string by removing comments, extra spaces, and unnecessary semicolons.
3
- *
4
- * @param {string} lessString - The LESS string to be minified.
5
- * @returns {string} - The minified LESS string.
6
- */
7
- export declare function minifyLess(lessString: string): string;
8
- //# sourceMappingURL=minifyLess.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"minifyLess.d.ts","sourceRoot":"","sources":["../src/helpers/minifyLess.ts"],"names":[],"mappings":"AAMA;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAOrD"}
package/dist/index.d.ts DELETED
@@ -1,25 +0,0 @@
1
- import React, { ElementType, JSX, ReactNode } from 'react';
2
- import { minifyLess } from './helpers/minifyLess';
3
- /**
4
- * Type definition for the styled function.
5
- * Supports both HTML elements and React components.
6
- */
7
- declare type StyledComponent<T extends ElementType> = <P extends object = React.ComponentProps<T>>(styles: TemplateStringsArray, ...interpolations: Array<((properties: P) => string | number) | string | number>) => (properties: P & {
8
- children?: ReactNode;
9
- className?: string;
10
- }) => JSX.Element;
11
- /**
12
- * Utility type for mapping styled properties to common HTML elements.
13
- */
14
- declare type StyledHTMLTags = {
15
- [Tag in keyof JSX.IntrinsicElements]: StyledComponent<Tag>;
16
- };
17
- /**
18
- * Proxy-based styled function allowing:
19
- * - `styled("div")`
20
- * - `styled.div`
21
- */
22
- declare const styled: (<T extends React.ElementType<any, "symbol" | "object" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "big" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "search" | "slot" | "script" | "section" | "select" | "small" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view">>(Component: T) => StyledComponent<T>) & StyledHTMLTags;
23
- export { minifyLess };
24
- export default styled;
25
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAA;AAEjD;;;GAGG;AACH,aAAK,eAAe,CAAC,CAAC,SAAS,WAAW,IAAI,CAAC,CAAC,SAAS,MAAM,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EACxF,MAAM,EAAE,oBAAoB,EAC5B,GAAG,cAAc,EAAE,KAAK,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,CAAC,GAAG,MAAM,GAAG,MAAM,CAAC,KAC5E,CAAC,UAAU,EAAE,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,KAAK,GAAG,CAAC,OAAO,CAAA;AAyDlF;;GAEG;AACH,aAAK,cAAc,GAAG;KACpB,GAAG,IAAI,MAAM,GAAG,CAAC,iBAAiB,GAAG,eAAe,CAAC,GAAG,CAAC;CAC1D,CAAA;AAED;;;;GAIG;AACH,QAAA,MAAM,MAAM,u9DAE8B,CAAA;AAE1C,OAAO,EAAE,UAAU,EAAE,CAAA;AAErB,eAAe,MAAM,CAAA"}
package/dist/index.js DELETED
@@ -1,8 +0,0 @@
1
-
2
- 'use strict'
3
-
4
- if (process.env.NODE_ENV === 'production') {
5
- module.exports = require('./styled-components-jsx.cjs.production.min.js')
6
- } else {
7
- module.exports = require('./styled-components-jsx.cjs.development.js')
8
- }
@@ -1,83 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
6
-
7
- var React = _interopDefault(require('react'));
8
-
9
- /* Precompile regular expressions */
10
- var commentRegex = /\/\*[\s\S]*?\*\/|\/\/.*/g;
11
- var symbolRegex = /\s*([{}:;,>~+()])\s*/g;
12
- var whitespaceRegex = /\s+/g;
13
- var semicolonRegex = /;}/g;
14
- /**
15
- * Minifies a LESS string by removing comments, extra spaces, and unnecessary semicolons.
16
- *
17
- * @param {string} lessString - The LESS string to be minified.
18
- * @returns {string} - The minified LESS string.
19
- */
20
- function minifyLess(lessString) {
21
- return lessString.replaceAll(commentRegex, '') // Remove multi-line and single-line comments
22
- .replaceAll(symbolRegex, '$1') // Remove extra spaces around symbols
23
- .replaceAll(whitespaceRegex, ' ') // Compress remaining whitespace to a single space
24
- .replaceAll(semicolonRegex, '}') // Remove extra semicolons before closing braces
25
- .trim(); // Trim spaces from the beginning and end
26
- }
27
-
28
- /**
29
- * Filters out props starting with '$' or custom props not accepted by HTML elements.
30
- */
31
- var filterDollarProperties = function filterDollarProperties(properties) {
32
- return Object.fromEntries(Object.entries(properties).filter(function (_ref) {
33
- var key = _ref[0];
34
- return !key.startsWith('$');
35
- }));
36
- };
37
- /**
38
- * Base function to create styled components.
39
- *
40
- * @param Component - An HTML tag (e.g., "div", "button") or a React component.
41
- * @returns A function that takes CSS styles and returns a styled component.
42
- */
43
- var createStyled = function createStyled(Component) {
44
- return function (styles) {
45
- for (var _len = arguments.length, interpolations = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
46
- interpolations[_key - 1] = arguments[_key];
47
- }
48
- return function (properties) {
49
- // Non-removable class reference for this plugin
50
- var classNameReference = '🎨';
51
- // Process styles and replace interpolations with actual prop values
52
- var processedStyles = styles.map(function (style, index) {
53
- var interpolation = interpolations[index];
54
- var value = typeof interpolation === 'function' ? interpolation(properties) : interpolation != null ? interpolation : '';
55
- return style + value;
56
- }).join('');
57
- var isCustomComponent = typeof Component !== 'string';
58
- var filteredProperties = isCustomComponent ? properties : filterDollarProperties(properties);
59
- // Ensure Component is a valid React component or HTML tag
60
- var Element = Component;
61
- var content = "." + classNameReference + "{" + minifyLess(processedStyles) + "}";
62
- return React.createElement(React.Fragment, null, React.createElement(Element, Object.assign({}, filteredProperties, {
63
- className: [properties.className, classNameReference].filter(Boolean).join(' ')
64
- }), properties.children), React.createElement("style", {
65
- jsx: true
66
- }, content));
67
- };
68
- };
69
- };
70
- /**
71
- * Proxy-based styled function allowing:
72
- * - `styled("div")`
73
- * - `styled.div`
74
- */
75
- var styled = /*#__PURE__*/new Proxy(createStyled, {
76
- get: function get(_, tag) {
77
- return createStyled(tag);
78
- }
79
- });
80
-
81
- exports.default = styled;
82
- exports.minifyLess = minifyLess;
83
- //# sourceMappingURL=styled-components-jsx.cjs.development.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"styled-components-jsx.cjs.development.js","sources":["../src/helpers/minifyLess.ts","../src/index.tsx"],"sourcesContent":["/* Precompile regular expressions */\nconst commentRegex = /\\/\\*[\\s\\S]*?\\*\\/|\\/\\/.*/g\nconst symbolRegex = /\\s*([{}:;,>~+()])\\s*/g\nconst whitespaceRegex = /\\s+/g\nconst semicolonRegex = /;}/g\n\n/**\n * Minifies a LESS string by removing comments, extra spaces, and unnecessary semicolons.\n *\n * @param {string} lessString - The LESS string to be minified.\n * @returns {string} - The minified LESS string.\n */\nexport function minifyLess(lessString: string): string {\n\treturn lessString\n\t\t.replaceAll(commentRegex, '') // Remove multi-line and single-line comments\n\t\t.replaceAll(symbolRegex, '$1') // Remove extra spaces around symbols\n\t\t.replaceAll(whitespaceRegex, ' ') // Compress remaining whitespace to a single space\n\t\t.replaceAll(semicolonRegex, '}') // Remove extra semicolons before closing braces\n\t\t.trim() // Trim spaces from the beginning and end\n}\n","import React, { ElementType, JSX, ReactNode } from 'react'\nimport { minifyLess } from './helpers/minifyLess'\n\n/**\n * Type definition for the styled function.\n * Supports both HTML elements and React components.\n */\ntype StyledComponent<T extends ElementType> = <P extends object = React.ComponentProps<T>>(\n\tstyles: TemplateStringsArray,\n\t...interpolations: Array<((properties: P) => string | number) | string | number>\n) => (properties: P & { children?: ReactNode; className?: string }) => JSX.Element\n\n/**\n * Filters out props starting with '$' or custom props not accepted by HTML elements.\n */\nconst filterDollarProperties = <T extends Record<string, unknown>>(properties: T): Partial<T> =>\n\tObject.fromEntries(\n\t\tObject.entries(properties).filter(([key]) => !key.startsWith('$'))\n\t) as Partial<T>\n\n/**\n * Base function to create styled components.\n *\n * @param Component - An HTML tag (e.g., \"div\", \"button\") or a React component.\n * @returns A function that takes CSS styles and returns a styled component.\n */\nconst createStyled =\n\t<T extends ElementType>(Component: T): StyledComponent<T> =>\n\t(styles, ...interpolations) =>\n\tproperties => {\n\t\t// Non-removable class reference for this plugin\n\t\tconst classNameReference = '🎨'\n\n\t\t// Process styles and replace interpolations with actual prop values\n\t\tconst processedStyles = styles\n\t\t\t.map((style, index) => {\n\t\t\t\tconst interpolation = interpolations[index]\n\t\t\t\tconst value =\n\t\t\t\t\ttypeof interpolation === 'function'\n\t\t\t\t\t\t? interpolation(properties)\n\t\t\t\t\t\t: (interpolation ?? '')\n\t\t\t\treturn style + value\n\t\t\t})\n\t\t\t.join('')\n\n\t\tconst isCustomComponent = typeof Component !== 'string'\n\t\tconst filteredProperties = isCustomComponent\n\t\t\t? properties\n\t\t\t: filterDollarProperties(properties)\n\n\t\t// Ensure Component is a valid React component or HTML tag\n\t\tconst Element: ElementType = Component\n\t\tconst content = `.${classNameReference}{${minifyLess(processedStyles)}}`\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Element\n\t\t\t\t\t{...filteredProperties}\n\t\t\t\t\tclassName={[properties.className, classNameReference].filter(Boolean).join(' ')}\n\t\t\t\t>\n\t\t\t\t\t{properties.children}\n\t\t\t\t</Element>\n\t\t\t\t<style jsx>{content}</style>\n\t\t\t</>\n\t\t)\n\t}\n\n/**\n * Utility type for mapping styled properties to common HTML elements.\n */\ntype StyledHTMLTags = {\n\t[Tag in keyof JSX.IntrinsicElements]: StyledComponent<Tag>\n}\n\n/**\n * Proxy-based styled function allowing:\n * - `styled(\"div\")`\n * - `styled.div`\n */\nconst styled = new Proxy(createStyled, {\n\tget: (_, tag: keyof JSX.IntrinsicElements) => createStyled(tag),\n}) as typeof createStyled & StyledHTMLTags\n\nexport { minifyLess }\n\nexport default styled\n"],"names":["commentRegex","symbolRegex","whitespaceRegex","semicolonRegex","minifyLess","lessString","replaceAll","trim","filterDollarProperties","properties","Object","fromEntries","entries","filter","_ref","key","startsWith","createStyled","Component","styles","_len","arguments","length","interpolations","Array","_key","classNameReference","processedStyles","map","style","index","interpolation","value","join","isCustomComponent","filteredProperties","Element","content","React","className","Boolean","children","jsx","styled","Proxy","get","_","tag"],"mappings":";;;;;;;;AAAA;AACA,IAAMA,YAAY,GAAG,0BAA0B;AAC/C,IAAMC,WAAW,GAAG,uBAAuB;AAC3C,IAAMC,eAAe,GAAG,MAAM;AAC9B,IAAMC,cAAc,GAAG,KAAK;AAE5B;;;;;;SAMgBC,UAAUA,CAACC,UAAkB;EAC5C,OAAOA,UAAU,CACfC,UAAU,CAACN,YAAY,EAAE,EAAE,CAAC;GAC5BM,UAAU,CAACL,WAAW,EAAE,IAAI,CAAC;GAC7BK,UAAU,CAACJ,eAAe,EAAE,GAAG,CAAC;GAChCI,UAAU,CAACH,cAAc,EAAE,GAAG,CAAC;GAC/BI,IAAI,EAAE,CAAA;AACT;;ACPA;;;AAGA,IAAMC,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAuCC,UAAa;EAAA,OAC/EC,MAAM,CAACC,WAAW,CACjBD,MAAM,CAACE,OAAO,CAACH,UAAU,CAAC,CAACI,MAAM,CAAC,UAAAC,IAAA;IAAA,IAAEC,GAAG,GAAAD,IAAA;IAAA,OAAM,CAACC,GAAG,CAACC,UAAU,CAAC,GAAG,CAAC;IAAC,CACpD;AAAA;AAEhB;;;;;;AAMA,IAAMC,YAAY,GACjB,SADKA,YAAYA,CACOC,SAAY;EAAA,OACpC,UAACC,MAAM;IAAA,SAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAKC,cAAc,OAAAC,KAAA,CAAAJ,IAAA,OAAAA,IAAA,WAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;MAAdF,cAAc,CAAAE,IAAA,QAAAJ,SAAA,CAAAI,IAAA;;IAAA,OAC1B,UAAAhB,UAAU;;MAET,IAAMiB,kBAAkB,GAAG,IAAI;;MAG/B,IAAMC,eAAe,GAAGR,MAAM,CAC5BS,GAAG,CAAC,UAACC,KAAK,EAAEC,KAAK;QACjB,IAAMC,aAAa,GAAGR,cAAc,CAACO,KAAK,CAAC;QAC3C,IAAME,KAAK,GACV,OAAOD,aAAa,KAAK,UAAU,GAChCA,aAAa,CAACtB,UAAU,CAAC,GACxBsB,aAAa,WAAbA,aAAa,GAAI,EAAG;QACzB,OAAOF,KAAK,GAAGG,KAAK;OACpB,CAAC,CACDC,IAAI,CAAC,EAAE,CAAC;MAEV,IAAMC,iBAAiB,GAAG,OAAOhB,SAAS,KAAK,QAAQ;MACvD,IAAMiB,kBAAkB,GAAGD,iBAAiB,GACzCzB,UAAU,GACVD,sBAAsB,CAACC,UAAU,CAAC;;MAGrC,IAAM2B,OAAO,GAAgBlB,SAAS;MACtC,IAAMmB,OAAO,SAAOX,kBAAkB,SAAItB,UAAU,CAACuB,eAAe,CAAC,MAAG;MAExE,OACCW,0CACCA,oBAACF,OAAO,oBACHD,kBAAkB;QACtBI,SAAS,EAAE,CAAC9B,UAAU,CAAC8B,SAAS,EAAEb,kBAAkB,CAAC,CAACb,MAAM,CAAC2B,OAAO,CAAC,CAACP,IAAI,CAAC,GAAG;UAE7ExB,UAAU,CAACgC,QAAQ,CACX,EACVH;QAAOI,GAAG;SAAEL,OAAO,CAAS,CAC1B;KAEJ;;AAAA;AASF;;;;;AAKA,IAAMM,MAAM,gBAAG,IAAIC,KAAK,CAAC3B,YAAY,EAAE;EACtC4B,GAAG,EAAE,SAALA,GAAGA,CAAGC,CAAC,EAAEC,GAAgC;IAAA,OAAK9B,YAAY,CAAC8B,GAAG,CAAC;;CAC/D,CAAyC;;;;;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=(e=require("react"))&&"object"==typeof e&&"default"in e?e.default:e,r=/\/\*[\s\S]*?\*\/|\/\/.*/g,n=/\s*([{}:;,>~+()])\s*/g,l=/\s+/g,a=/;}/g;function c(e){return e.replaceAll(r,"").replaceAll(n,"$1").replaceAll(l," ").replaceAll(a,"}").trim()}var i=function(e){return Object.fromEntries(Object.entries(e).filter((function(e){return!e[0].startsWith("$")})))},u=function(e){return function(r){for(var n=arguments.length,l=new Array(n>1?n-1:0),a=1;a<n;a++)l[a-1]=arguments[a];return function(n){var a="🎨",u=r.map((function(e,t){var r=l[t];return e+("function"==typeof r?r(n):null!=r?r:"")})).join(""),o="string"!=typeof e?n:i(n),s=e,f="."+a+"{"+c(u)+"}";return t.createElement(t.Fragment,null,t.createElement(s,Object.assign({},o,{className:[n.className,a].filter(Boolean).join(" ")}),n.children),t.createElement("style",{jsx:!0},f))}}};exports.default=new Proxy(u,{get:function(e,t){return u(t)}}),exports.minifyLess=c;
2
- //# sourceMappingURL=styled-components-jsx.cjs.production.min.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"styled-components-jsx.cjs.production.min.js","sources":["../src/helpers/minifyLess.ts","../src/index.tsx"],"sourcesContent":["/* Precompile regular expressions */\nconst commentRegex = /\\/\\*[\\s\\S]*?\\*\\/|\\/\\/.*/g\nconst symbolRegex = /\\s*([{}:;,>~+()])\\s*/g\nconst whitespaceRegex = /\\s+/g\nconst semicolonRegex = /;}/g\n\n/**\n * Minifies a LESS string by removing comments, extra spaces, and unnecessary semicolons.\n *\n * @param {string} lessString - The LESS string to be minified.\n * @returns {string} - The minified LESS string.\n */\nexport function minifyLess(lessString: string): string {\n\treturn lessString\n\t\t.replaceAll(commentRegex, '') // Remove multi-line and single-line comments\n\t\t.replaceAll(symbolRegex, '$1') // Remove extra spaces around symbols\n\t\t.replaceAll(whitespaceRegex, ' ') // Compress remaining whitespace to a single space\n\t\t.replaceAll(semicolonRegex, '}') // Remove extra semicolons before closing braces\n\t\t.trim() // Trim spaces from the beginning and end\n}\n","import React, { ElementType, JSX, ReactNode } from 'react'\nimport { minifyLess } from './helpers/minifyLess'\n\n/**\n * Type definition for the styled function.\n * Supports both HTML elements and React components.\n */\ntype StyledComponent<T extends ElementType> = <P extends object = React.ComponentProps<T>>(\n\tstyles: TemplateStringsArray,\n\t...interpolations: Array<((properties: P) => string | number) | string | number>\n) => (properties: P & { children?: ReactNode; className?: string }) => JSX.Element\n\n/**\n * Filters out props starting with '$' or custom props not accepted by HTML elements.\n */\nconst filterDollarProperties = <T extends Record<string, unknown>>(properties: T): Partial<T> =>\n\tObject.fromEntries(\n\t\tObject.entries(properties).filter(([key]) => !key.startsWith('$'))\n\t) as Partial<T>\n\n/**\n * Base function to create styled components.\n *\n * @param Component - An HTML tag (e.g., \"div\", \"button\") or a React component.\n * @returns A function that takes CSS styles and returns a styled component.\n */\nconst createStyled =\n\t<T extends ElementType>(Component: T): StyledComponent<T> =>\n\t(styles, ...interpolations) =>\n\tproperties => {\n\t\t// Non-removable class reference for this plugin\n\t\tconst classNameReference = '🎨'\n\n\t\t// Process styles and replace interpolations with actual prop values\n\t\tconst processedStyles = styles\n\t\t\t.map((style, index) => {\n\t\t\t\tconst interpolation = interpolations[index]\n\t\t\t\tconst value =\n\t\t\t\t\ttypeof interpolation === 'function'\n\t\t\t\t\t\t? interpolation(properties)\n\t\t\t\t\t\t: (interpolation ?? '')\n\t\t\t\treturn style + value\n\t\t\t})\n\t\t\t.join('')\n\n\t\tconst isCustomComponent = typeof Component !== 'string'\n\t\tconst filteredProperties = isCustomComponent\n\t\t\t? properties\n\t\t\t: filterDollarProperties(properties)\n\n\t\t// Ensure Component is a valid React component or HTML tag\n\t\tconst Element: ElementType = Component\n\t\tconst content = `.${classNameReference}{${minifyLess(processedStyles)}}`\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Element\n\t\t\t\t\t{...filteredProperties}\n\t\t\t\t\tclassName={[properties.className, classNameReference].filter(Boolean).join(' ')}\n\t\t\t\t>\n\t\t\t\t\t{properties.children}\n\t\t\t\t</Element>\n\t\t\t\t<style jsx>{content}</style>\n\t\t\t</>\n\t\t)\n\t}\n\n/**\n * Utility type for mapping styled properties to common HTML elements.\n */\ntype StyledHTMLTags = {\n\t[Tag in keyof JSX.IntrinsicElements]: StyledComponent<Tag>\n}\n\n/**\n * Proxy-based styled function allowing:\n * - `styled(\"div\")`\n * - `styled.div`\n */\nconst styled = new Proxy(createStyled, {\n\tget: (_, tag: keyof JSX.IntrinsicElements) => createStyled(tag),\n}) as typeof createStyled & StyledHTMLTags\n\nexport { minifyLess }\n\nexport default styled\n"],"names":["commentRegex","symbolRegex","whitespaceRegex","semicolonRegex","minifyLess","lessString","replaceAll","trim","filterDollarProperties","properties","Object","fromEntries","entries","filter","_ref","startsWith","createStyled","Component","styles","_len","arguments","length","interpolations","Array","_key","classNameReference","processedStyles","map","style","index","interpolation","join","filteredProperties","Element","content","React","className","Boolean","children","jsx","Proxy","get","_","tag"],"mappings":"gJACMA,EAAe,2BACfC,EAAc,wBACdC,EAAkB,OAClBC,EAAiB,eAQPC,EAAWC,GAC1B,OAAOA,EACLC,WAAWN,EAAc,IACzBM,WAAWL,EAAa,MACxBK,WAAWJ,EAAiB,KAC5BI,WAAWH,EAAgB,KAC3BI,OCHH,IAAMC,EAAyB,SAAoCC,GAAa,OAC/EC,OAAOC,YACND,OAAOE,QAAQH,GAAYI,QAAO,SAAAC,GAAK,OAAAA,KAAWC,WAAW,UASzDC,EACL,SAAwBC,GAAY,OACpC,SAACC,GAAM,QAAAC,EAAAC,UAAAC,OAAKC,MAAcC,MAAAJ,IAAAA,OAAAK,IAAAA,EAAAL,EAAAK,IAAdF,EAAcE,KAAAJ,UAAAI,GAAA,OAC1B,SAAAf,GAEC,IAAMgB,EAAqB,KAGrBC,EAAkBR,EACtBS,KAAI,SAACC,EAAOC,GACZ,IAAMC,EAAgBR,EAAeO,GAKrC,OAAOD,GAHmB,mBAAlBE,EACJA,EAAcrB,SACbqB,EAAAA,EAAiB,OAGtBC,KAAK,IAGDC,EADyC,iBAAdf,EAE9BR,EACAD,EAAuBC,GAGpBwB,EAAuBhB,EACvBiB,MAAcT,MAAsBrB,EAAWsB,OAErD,OACCS,gCACCA,gBAACF,mBACID,GACJI,UAAW,CAAC3B,EAAW2B,UAAWX,GAAoBZ,OAAOwB,SAASN,KAAK,OAE1EtB,EAAW6B,UAEbH,yBAAOI,QAAKL,uBAiBD,IAAIM,MAAMxB,EAAc,CACtCyB,IAAK,SAACC,EAAGC,GAAgC,OAAK3B,EAAa2B"}
@@ -1,77 +0,0 @@
1
- import React from 'react';
2
-
3
- /* Precompile regular expressions */
4
- var commentRegex = /\/\*[\s\S]*?\*\/|\/\/.*/g;
5
- var symbolRegex = /\s*([{}:;,>~+()])\s*/g;
6
- var whitespaceRegex = /\s+/g;
7
- var semicolonRegex = /;}/g;
8
- /**
9
- * Minifies a LESS string by removing comments, extra spaces, and unnecessary semicolons.
10
- *
11
- * @param {string} lessString - The LESS string to be minified.
12
- * @returns {string} - The minified LESS string.
13
- */
14
- function minifyLess(lessString) {
15
- return lessString.replaceAll(commentRegex, '') // Remove multi-line and single-line comments
16
- .replaceAll(symbolRegex, '$1') // Remove extra spaces around symbols
17
- .replaceAll(whitespaceRegex, ' ') // Compress remaining whitespace to a single space
18
- .replaceAll(semicolonRegex, '}') // Remove extra semicolons before closing braces
19
- .trim(); // Trim spaces from the beginning and end
20
- }
21
-
22
- /**
23
- * Filters out props starting with '$' or custom props not accepted by HTML elements.
24
- */
25
- var filterDollarProperties = function filterDollarProperties(properties) {
26
- return Object.fromEntries(Object.entries(properties).filter(function (_ref) {
27
- var key = _ref[0];
28
- return !key.startsWith('$');
29
- }));
30
- };
31
- /**
32
- * Base function to create styled components.
33
- *
34
- * @param Component - An HTML tag (e.g., "div", "button") or a React component.
35
- * @returns A function that takes CSS styles and returns a styled component.
36
- */
37
- var createStyled = function createStyled(Component) {
38
- return function (styles) {
39
- for (var _len = arguments.length, interpolations = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
40
- interpolations[_key - 1] = arguments[_key];
41
- }
42
- return function (properties) {
43
- // Non-removable class reference for this plugin
44
- var classNameReference = '🎨';
45
- // Process styles and replace interpolations with actual prop values
46
- var processedStyles = styles.map(function (style, index) {
47
- var interpolation = interpolations[index];
48
- var value = typeof interpolation === 'function' ? interpolation(properties) : interpolation != null ? interpolation : '';
49
- return style + value;
50
- }).join('');
51
- var isCustomComponent = typeof Component !== 'string';
52
- var filteredProperties = isCustomComponent ? properties : filterDollarProperties(properties);
53
- // Ensure Component is a valid React component or HTML tag
54
- var Element = Component;
55
- var content = "." + classNameReference + "{" + minifyLess(processedStyles) + "}";
56
- return React.createElement(React.Fragment, null, React.createElement(Element, Object.assign({}, filteredProperties, {
57
- className: [properties.className, classNameReference].filter(Boolean).join(' ')
58
- }), properties.children), React.createElement("style", {
59
- jsx: true
60
- }, content));
61
- };
62
- };
63
- };
64
- /**
65
- * Proxy-based styled function allowing:
66
- * - `styled("div")`
67
- * - `styled.div`
68
- */
69
- var styled = /*#__PURE__*/new Proxy(createStyled, {
70
- get: function get(_, tag) {
71
- return createStyled(tag);
72
- }
73
- });
74
-
75
- export default styled;
76
- export { minifyLess };
77
- //# sourceMappingURL=styled-components-jsx.esm.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"styled-components-jsx.esm.js","sources":["../src/helpers/minifyLess.ts","../src/index.tsx"],"sourcesContent":["/* Precompile regular expressions */\nconst commentRegex = /\\/\\*[\\s\\S]*?\\*\\/|\\/\\/.*/g\nconst symbolRegex = /\\s*([{}:;,>~+()])\\s*/g\nconst whitespaceRegex = /\\s+/g\nconst semicolonRegex = /;}/g\n\n/**\n * Minifies a LESS string by removing comments, extra spaces, and unnecessary semicolons.\n *\n * @param {string} lessString - The LESS string to be minified.\n * @returns {string} - The minified LESS string.\n */\nexport function minifyLess(lessString: string): string {\n\treturn lessString\n\t\t.replaceAll(commentRegex, '') // Remove multi-line and single-line comments\n\t\t.replaceAll(symbolRegex, '$1') // Remove extra spaces around symbols\n\t\t.replaceAll(whitespaceRegex, ' ') // Compress remaining whitespace to a single space\n\t\t.replaceAll(semicolonRegex, '}') // Remove extra semicolons before closing braces\n\t\t.trim() // Trim spaces from the beginning and end\n}\n","import React, { ElementType, JSX, ReactNode } from 'react'\nimport { minifyLess } from './helpers/minifyLess'\n\n/**\n * Type definition for the styled function.\n * Supports both HTML elements and React components.\n */\ntype StyledComponent<T extends ElementType> = <P extends object = React.ComponentProps<T>>(\n\tstyles: TemplateStringsArray,\n\t...interpolations: Array<((properties: P) => string | number) | string | number>\n) => (properties: P & { children?: ReactNode; className?: string }) => JSX.Element\n\n/**\n * Filters out props starting with '$' or custom props not accepted by HTML elements.\n */\nconst filterDollarProperties = <T extends Record<string, unknown>>(properties: T): Partial<T> =>\n\tObject.fromEntries(\n\t\tObject.entries(properties).filter(([key]) => !key.startsWith('$'))\n\t) as Partial<T>\n\n/**\n * Base function to create styled components.\n *\n * @param Component - An HTML tag (e.g., \"div\", \"button\") or a React component.\n * @returns A function that takes CSS styles and returns a styled component.\n */\nconst createStyled =\n\t<T extends ElementType>(Component: T): StyledComponent<T> =>\n\t(styles, ...interpolations) =>\n\tproperties => {\n\t\t// Non-removable class reference for this plugin\n\t\tconst classNameReference = '🎨'\n\n\t\t// Process styles and replace interpolations with actual prop values\n\t\tconst processedStyles = styles\n\t\t\t.map((style, index) => {\n\t\t\t\tconst interpolation = interpolations[index]\n\t\t\t\tconst value =\n\t\t\t\t\ttypeof interpolation === 'function'\n\t\t\t\t\t\t? interpolation(properties)\n\t\t\t\t\t\t: (interpolation ?? '')\n\t\t\t\treturn style + value\n\t\t\t})\n\t\t\t.join('')\n\n\t\tconst isCustomComponent = typeof Component !== 'string'\n\t\tconst filteredProperties = isCustomComponent\n\t\t\t? properties\n\t\t\t: filterDollarProperties(properties)\n\n\t\t// Ensure Component is a valid React component or HTML tag\n\t\tconst Element: ElementType = Component\n\t\tconst content = `.${classNameReference}{${minifyLess(processedStyles)}}`\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Element\n\t\t\t\t\t{...filteredProperties}\n\t\t\t\t\tclassName={[properties.className, classNameReference].filter(Boolean).join(' ')}\n\t\t\t\t>\n\t\t\t\t\t{properties.children}\n\t\t\t\t</Element>\n\t\t\t\t<style jsx>{content}</style>\n\t\t\t</>\n\t\t)\n\t}\n\n/**\n * Utility type for mapping styled properties to common HTML elements.\n */\ntype StyledHTMLTags = {\n\t[Tag in keyof JSX.IntrinsicElements]: StyledComponent<Tag>\n}\n\n/**\n * Proxy-based styled function allowing:\n * - `styled(\"div\")`\n * - `styled.div`\n */\nconst styled = new Proxy(createStyled, {\n\tget: (_, tag: keyof JSX.IntrinsicElements) => createStyled(tag),\n}) as typeof createStyled & StyledHTMLTags\n\nexport { minifyLess }\n\nexport default styled\n"],"names":["commentRegex","symbolRegex","whitespaceRegex","semicolonRegex","minifyLess","lessString","replaceAll","trim","filterDollarProperties","properties","Object","fromEntries","entries","filter","_ref","key","startsWith","createStyled","Component","styles","_len","arguments","length","interpolations","Array","_key","classNameReference","processedStyles","map","style","index","interpolation","value","join","isCustomComponent","filteredProperties","Element","content","React","className","Boolean","children","jsx","styled","Proxy","get","_","tag"],"mappings":";;AAAA;AACA,IAAMA,YAAY,GAAG,0BAA0B;AAC/C,IAAMC,WAAW,GAAG,uBAAuB;AAC3C,IAAMC,eAAe,GAAG,MAAM;AAC9B,IAAMC,cAAc,GAAG,KAAK;AAE5B;;;;;;SAMgBC,UAAUA,CAACC,UAAkB;EAC5C,OAAOA,UAAU,CACfC,UAAU,CAACN,YAAY,EAAE,EAAE,CAAC;GAC5BM,UAAU,CAACL,WAAW,EAAE,IAAI,CAAC;GAC7BK,UAAU,CAACJ,eAAe,EAAE,GAAG,CAAC;GAChCI,UAAU,CAACH,cAAc,EAAE,GAAG,CAAC;GAC/BI,IAAI,EAAE,CAAA;AACT;;ACPA;;;AAGA,IAAMC,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAuCC,UAAa;EAAA,OAC/EC,MAAM,CAACC,WAAW,CACjBD,MAAM,CAACE,OAAO,CAACH,UAAU,CAAC,CAACI,MAAM,CAAC,UAAAC,IAAA;IAAA,IAAEC,GAAG,GAAAD,IAAA;IAAA,OAAM,CAACC,GAAG,CAACC,UAAU,CAAC,GAAG,CAAC;IAAC,CACpD;AAAA;AAEhB;;;;;;AAMA,IAAMC,YAAY,GACjB,SADKA,YAAYA,CACOC,SAAY;EAAA,OACpC,UAACC,MAAM;IAAA,SAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAKC,cAAc,OAAAC,KAAA,CAAAJ,IAAA,OAAAA,IAAA,WAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;MAAdF,cAAc,CAAAE,IAAA,QAAAJ,SAAA,CAAAI,IAAA;;IAAA,OAC1B,UAAAhB,UAAU;;MAET,IAAMiB,kBAAkB,GAAG,IAAI;;MAG/B,IAAMC,eAAe,GAAGR,MAAM,CAC5BS,GAAG,CAAC,UAACC,KAAK,EAAEC,KAAK;QACjB,IAAMC,aAAa,GAAGR,cAAc,CAACO,KAAK,CAAC;QAC3C,IAAME,KAAK,GACV,OAAOD,aAAa,KAAK,UAAU,GAChCA,aAAa,CAACtB,UAAU,CAAC,GACxBsB,aAAa,WAAbA,aAAa,GAAI,EAAG;QACzB,OAAOF,KAAK,GAAGG,KAAK;OACpB,CAAC,CACDC,IAAI,CAAC,EAAE,CAAC;MAEV,IAAMC,iBAAiB,GAAG,OAAOhB,SAAS,KAAK,QAAQ;MACvD,IAAMiB,kBAAkB,GAAGD,iBAAiB,GACzCzB,UAAU,GACVD,sBAAsB,CAACC,UAAU,CAAC;;MAGrC,IAAM2B,OAAO,GAAgBlB,SAAS;MACtC,IAAMmB,OAAO,SAAOX,kBAAkB,SAAItB,UAAU,CAACuB,eAAe,CAAC,MAAG;MAExE,OACCW,0CACCA,oBAACF,OAAO,oBACHD,kBAAkB;QACtBI,SAAS,EAAE,CAAC9B,UAAU,CAAC8B,SAAS,EAAEb,kBAAkB,CAAC,CAACb,MAAM,CAAC2B,OAAO,CAAC,CAACP,IAAI,CAAC,GAAG;UAE7ExB,UAAU,CAACgC,QAAQ,CACX,EACVH;QAAOI,GAAG;SAAEL,OAAO,CAAS,CAC1B;KAEJ;;AAAA;AASF;;;;;AAKA,IAAMM,MAAM,gBAAG,IAAIC,KAAK,CAAC3B,YAAY,EAAE;EACtC4B,GAAG,EAAE,SAALA,GAAGA,CAAGC,CAAC,EAAEC,GAAgC;IAAA,OAAK9B,YAAY,CAAC8B,GAAG,CAAC;;CAC/D,CAAyC;;;;;"}