Merge remote-tracking branch 'upstream/master'

.github/CONTRIBUTING.md

@@ -0,0 +1,11 @@
+# Contributing
+
+## Publishing
+
+This section is intended only for the project maintainers.
+
+1. Increment the version number in the `package.json`, `./react/package.json` and `./vue/package.json` files.
+2. Commit and tag those changes.
+3. Push the commit and tag to GitHub.
+4. Review the draft release generated by GitHub.
+5. Publish the new release on GitHub. This will automatically trigger a GitHub action to publish these packages to NPM.

CHANGELOG.md

@@ -9,6 +9,16 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Nothing yet!
 
+## [2.0.14] - 2023-01-25
+
+### Fixed
+
+- Fix React ref types ([#903](https://github.com/tailwindlabs/heroicons/pull/903))
+
+### Changed
+
+- Specify explicit package exports ([#920](https://github.com/tailwindlabs/heroicons/pull/920))
+
 ## [2.0.13] - 2022-11-02
 
 ### Fixed
@@ -190,7 +200,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Everything!
 
-[unreleased]: https://github.com/tailwindlabs/heroicons/compare/v2.0.13...HEAD
+[unreleased]: https://github.com/tailwindlabs/heroicons/compare/v2.0.14...HEAD
+[2.0.14]: https://github.com/tailwindlabs/heroicons/compare/v2.0.13...v2.0.14
 [2.0.13]: https://github.com/tailwindlabs/heroicons/compare/v2.0.12...v2.0.13
 [2.0.12]: https://github.com/tailwindlabs/heroicons/compare/v2.0.11...v2.0.12
 [2.0.11]: https://github.com/tailwindlabs/heroicons/compare/v2.0.10...v2.0.11

package.json

@@ -1,6 +1,6 @@
 {
   "name": "heroicons",
-  "version": "2.0.13",
+  "version": "2.0.14",
   "license": "MIT",
   "files": [
     "20/",

react/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@heroicons/react",
   "license": "MIT",
-  "version": "2.0.13",
+  "version": "2.0.14",
   "description": "",
   "keywords": [],
   "homepage": "https://github.com/tailwindlabs/heroicons#readme",
@@ -15,10 +15,102 @@
     "solid",
     "outline"
   ],
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    "./outline": {
+      "default": "./outline/index.js"
+    },
+    "./outline/index": {
+      "default": "./outline/index.js"
+    },
+    "./outline/index.js": {
+      "default": "./outline/index.js"
+    },
+    "./solid": {
+      "default": "./solid/index.js"
+    },
+    "./solid/index": {
+      "default": "./solid/index.js"
+    },
+    "./solid/index.js": {
+      "default": "./solid/index.js"
+    },
+    "./20/solid": {
+      "types": "./20/solid/index.d.ts",
+      "import": "./20/solid/index.js",
+      "require": "./20/solid/index.js"
+    },
+    "./20/solid/*": {
+      "types": "./20/solid/*.d.ts",
+      "import": "./20/solid/esm/*.js",
+      "require": "./20/solid/*.js"
+    },
+    "./20/solid/*.js": {
+      "types": "./20/solid/*.d.ts",
+      "import": "./20/solid/esm/*.js",
+      "require": "./20/solid/*.js"
+    },
+    "./20/solid/esm/*": {
+      "types": "./20/solid/*.d.ts",
+      "import": "./20/solid/esm/*.js"
+    },
+    "./20/solid/esm/*.js": {
+      "types": "./20/solid/*.d.ts",
+      "import": "./20/solid/esm/*.js"
+    },
+    "./24/outline": {
+      "types": "./24/outline/index.d.ts",
+      "import": "./24/outline/index.js",
+      "require": "./24/outline/index.js"
+    },
+    "./24/outline/*": {
+      "types": "./24/outline/*.d.ts",
+      "import": "./24/outline/esm/*.js",
+      "require": "./24/outline/*.js"
+    },
+    "./24/outline/*.js": {
+      "types": "./24/outline/*.d.ts",
+      "import": "./24/outline/esm/*.js",
+      "require": "./24/outline/*.js"
+    },
+    "./24/outline/esm/*": {
+      "types": "./24/outline/*.d.ts",
+      "import": "./24/outline/esm/*.js"
+    },
+    "./24/outline/esm/*.js": {
+      "types": "./24/outline/*.d.ts",
+      "import": "./24/outline/esm/*.js"
+    },
+    "./24/solid": {
+      "types": "./24/solid/index.d.ts",
+      "import": "./24/solid/index.js",
+      "require": "./24/solid/index.js"
+    },
+    "./24/solid/*": {
+      "types": "./24/solid/*.d.ts",
+      "import": "./24/solid/esm/*.js",
+      "require": "./24/solid/*.js"
+    },
+    "./24/solid/*.js": {
+      "types": "./24/solid/*.d.ts",
+      "import": "./24/solid/esm/*.js",
+      "require": "./24/solid/*.js"
+    },
+    "./24/solid/esm/*": {
+      "types": "./24/solid/*.d.ts",
+      "import": "./24/solid/esm/*.js"
+    },
+    "./24/solid/esm/*.js": {
+      "types": "./24/solid/*.d.ts",
+      "import": "./24/solid/esm/*.js"
+    }
+  },
   "publishConfig": {
     "access": "public"
   },
   "peerDependencies": {
     "react": ">= 16"
   }
-}
+}

scripts/build.js

@@ -93,7 +93,7 @@ async function buildIcons(package, style, format) {
       let content = await transform[package](svg, componentName, format)
       let types =
         package === 'react'
-          ? `import * as React from 'react';\ndeclare function ${componentName}(props: React.ComponentProps<'svg'> & { title?: string, titleId?: string }): JSX.Element;\nexport default ${componentName};\n`
+          ? `import * as React from 'react';\ndeclare const ${componentName}: React.ForwardRefExoticComponent<React.SVGProps<SVGSVGElement> & { title?: string, titleId?: string }>;\nexport default ${componentName};\n`
           : `import type { FunctionalComponent, HTMLAttributes, VNodeProps } from 'vue';\ndeclare const ${componentName}: FunctionalComponent<HTMLAttributes & VNodeProps>;\nexport default ${componentName};\n`
 
       return [
@@ -108,6 +108,56 @@ async function buildIcons(package, style, format) {
   await ensureWrite(`${outDir}/index.d.ts`, exportAll(icons, 'esm', false))
 }
 
+/**
+ * @param {string[]} styles
+ */
+async function buildExports(styles) {
+  let pkg = {}
+
+  // For those that want to read the version from package.json
+  pkg[`./package.json`] = { "default": "./package.json" }
+
+  // Backwards compatibility with v1 imports (points to proxy that prints an error message):
+  pkg["./outline"] = { "default": "./outline/index.js" }
+  pkg["./outline/index"] = { "default": "./outline/index.js" }
+  pkg["./outline/index.js"] = { "default": "./outline/index.js" }
+  pkg["./solid"] = { "default": "./solid/index.js" }
+  pkg["./solid/index"] = { "default": "./solid/index.js" }
+  pkg["./solid/index.js"] = { "default": "./solid/index.js" }
+
+  // Explicit exports for each style:
+  for (let style of styles) {
+    pkg[`./${style}`] = {
+      "types": `./${style}/index.d.ts`,
+      "import": `./${style}/index.js`,
+      "require": `./${style}/index.js`
+    }
+    pkg[`./${style}/*`] = {
+      "types": `./${style}/*.d.ts`,
+      "import": `./${style}/esm/*.js`,
+      "require": `./${style}/*.js`
+    }
+    pkg[`./${style}/*.js`] = {
+      "types": `./${style}/*.d.ts`,
+      "import": `./${style}/esm/*.js`,
+      "require": `./${style}/*.js`
+    }
+
+    // This dir is basically an implementation detail, but it's needed for
+    // backwards compatibility in case people were importing from it directly.
+    pkg[`./${style}/esm/*`] = {
+      "types": `./${style}/*.d.ts`,
+      "import": `./${style}/esm/*.js`
+    }
+    pkg[`./${style}/esm/*.js`] = {
+      "types": `./${style}/*.d.ts`,
+      "import": `./${style}/esm/*.js`
+    }
+  }
+
+  return pkg
+}
+
 async function main(package) {
   const cjsPackageJson = { module: './esm/index.js', sideEffects: false }
   const esmPackageJson = { type: 'module', sideEffects: false }
@@ -135,6 +185,16 @@ async function main(package) {
     ensureWriteJson(`./${package}/24/solid/package.json`, cjsPackageJson),
   ])
 
+  let packageJson = JSON.parse(await fs.readFile(`./${package}/package.json`, 'utf8'))
+
+  packageJson.exports = await buildExports([
+    '20/solid',
+    '24/outline',
+    '24/solid',
+  ])
+
+  await ensureWriteJson(`./${package}/package.json`, packageJson)
+
   return console.log(`Finished building ${package} package.`)
 }
 

vue/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@heroicons/vue",
   "license": "MIT",
-  "version": "2.0.13",
+  "version": "2.0.14",
   "description": "",
   "keywords": [],
   "homepage": "https://github.com/tailwindlabs/heroicons#readme",
@@ -15,10 +15,102 @@
     "outline",
     "solid"
   ],
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    "./outline": {
+      "default": "./outline/index.js"
+    },
+    "./outline/index": {
+      "default": "./outline/index.js"
+    },
+    "./outline/index.js": {
+      "default": "./outline/index.js"
+    },
+    "./solid": {
+      "default": "./solid/index.js"
+    },
+    "./solid/index": {
+      "default": "./solid/index.js"
+    },
+    "./solid/index.js": {
+      "default": "./solid/index.js"
+    },
+    "./20/solid": {
+      "types": "./20/solid/index.d.ts",
+      "import": "./20/solid/index.js",
+      "require": "./20/solid/index.js"
+    },
+    "./20/solid/*": {
+      "types": "./20/solid/*.d.ts",
+      "import": "./20/solid/esm/*.js",
+      "require": "./20/solid/*.js"
+    },
+    "./20/solid/*.js": {
+      "types": "./20/solid/*.d.ts",
+      "import": "./20/solid/esm/*.js",
+      "require": "./20/solid/*.js"
+    },
+    "./20/solid/esm/*": {
+      "types": "./20/solid/*.d.ts",
+      "import": "./20/solid/esm/*.js"
+    },
+    "./20/solid/esm/*.js": {
+      "types": "./20/solid/*.d.ts",
+      "import": "./20/solid/esm/*.js"
+    },
+    "./24/outline": {
+      "types": "./24/outline/index.d.ts",
+      "import": "./24/outline/index.js",
+      "require": "./24/outline/index.js"
+    },
+    "./24/outline/*": {
+      "types": "./24/outline/*.d.ts",
+      "import": "./24/outline/esm/*.js",
+      "require": "./24/outline/*.js"
+    },
+    "./24/outline/*.js": {
+      "types": "./24/outline/*.d.ts",
+      "import": "./24/outline/esm/*.js",
+      "require": "./24/outline/*.js"
+    },
+    "./24/outline/esm/*": {
+      "types": "./24/outline/*.d.ts",
+      "import": "./24/outline/esm/*.js"
+    },
+    "./24/outline/esm/*.js": {
+      "types": "./24/outline/*.d.ts",
+      "import": "./24/outline/esm/*.js"
+    },
+    "./24/solid": {
+      "types": "./24/solid/index.d.ts",
+      "import": "./24/solid/index.js",
+      "require": "./24/solid/index.js"
+    },
+    "./24/solid/*": {
+      "types": "./24/solid/*.d.ts",
+      "import": "./24/solid/esm/*.js",
+      "require": "./24/solid/*.js"
+    },
+    "./24/solid/*.js": {
+      "types": "./24/solid/*.d.ts",
+      "import": "./24/solid/esm/*.js",
+      "require": "./24/solid/*.js"
+    },
+    "./24/solid/esm/*": {
+      "types": "./24/solid/*.d.ts",
+      "import": "./24/solid/esm/*.js"
+    },
+    "./24/solid/esm/*.js": {
+      "types": "./24/solid/*.d.ts",
+      "import": "./24/solid/esm/*.js"
+    }
+  },
   "publishConfig": {
     "access": "public"
   },
   "peerDependencies": {
     "vue": ">= 3"
   }
-}
+}