Missing select package from ariakit

lewisl9029 commented 2 years ago

Hi there!

This is a strange one. https://github.com/ariakit/ariakit/blob/main/packages/ariakit/package.json doesn't have an exports map, but JSPM seems to be able to figure out most of the individual packages from the entry point and split them out into sub packages. For example:

https://ga.jspm.io/npm:ariakit@2.0.0-next.30/esm/menu/index.js https://ga.jspm.io/npm:ariakit@2.0.0-next.30/esm/tooltip/index.js https://ga.jspm.io/npm:ariakit@2.0.0-next.30/esm/combobox/index.js

However, the select package I wanted to use seems to be missing from this list:

https://ga.jspm.io/npm:ariakit@2.0.0-next.30/esm/select/index.js

Looking at https://ga.jspm.io/npm:ariakit@2.0.0-next.30/esm/index.js, it seems like parts of the select module may have been inlined into the main entry point? Maybe this has something to do with why it's missing?

Should this be considered a bug? FWIW, all of the other esm CDNs I tried seems to have select available as a separate package:

https://esm.sh/v86/ariakit@2.0.0-next.30/es2021/select.js https://cdn.jsdelivr.net/npm/ariakit/select/+esm https://cdn.skypack.dev/ariakit/select

I'm working around this currently by importing the main entry point, which works, but is obviously quite wasteful when I only need the select package.

guybedford commented 2 years ago

Yes, JSPM determines the package exports via statistical analysis of package usage in other packages.

If the exports are incorrect or missing something, we recommend adding a PR to add exports to the original repo, then PRing that as an override in https://github.com/jspm/overrides to update the JSPM exports.

You can use the JSPM generated exports as a starting point:

{
"exports": {
    ".": {
      "module": "./esm/index.js",
      "default": "./cjs/index.js"
    },
    "./menu": {
      "module": "./esm/menu/index.js",
      "default": "./cjs/menu/index.js"
    },
    "./focusable": {
      "module": "./esm/focusable/index.js",
      "default": "./cjs/focusable/index.js"
    },
    "./tooltip": {
      "module": "./esm/tooltip/index.js",
      "default": "./cjs/tooltip/index.js"
    },
    "./portal": {
      "module": "./esm/portal/index.js",
      "default": "./cjs/portal/index.js"
    },
    "./disclosure": {
      "module": "./esm/disclosure/index.js",
      "default": "./cjs/disclosure/index.js"
    },
    "./dialog": {
      "module": "./esm/dialog/index.js",
      "default": "./cjs/dialog/index.js"
    },
    "./composite/composite-state": {
      "module": "./esm/composite/composite-state.js",
      "default": "./cjs/composite/composite-state.js"
    },
    "./composite/composite-item": {
      "module": "./esm/composite/composite-item.js",
      "default": "./cjs/composite/composite-item.js"
    },
    "./combobox": {
      "module": "./esm/combobox/index.js",
      "default": "./cjs/combobox/index.js"
    },
    "./collection/collection-state": {
      "module": "./esm/collection/collection-state.js",
      "default": "./cjs/collection/collection-state.js"
    },
    "./collection/collection-item": {
      "module": "./esm/collection/collection-item.js",
      "default": "./cjs/collection/collection-item.js"
    },
    "./tab": {
      "module": "./esm/tab/index.js",
      "default": "./cjs/tab/index.js"
    },
    "./role": {
      "module": "./esm/role/index.js",
      "default": "./cjs/role/index.js"
    },
    "./radio": {
      "module": "./esm/radio/index.js",
      "default": "./cjs/radio/index.js"
    },
    "./hovercard": {
      "module": "./esm/hovercard/index.js",
      "default": "./cjs/hovercard/index.js"
    },
    "./group": {
      "module": "./esm/group/index.js",
      "default": "./cjs/group/index.js"
    },
    "./composite": {
      "module": "./esm/composite/index.js",
      "default": "./cjs/composite/index.js"
    },
    "./command": {
      "module": "./esm/command/index.js",
      "default": "./cjs/command/index.js"
    },
    "./checkbox": {
      "module": "./esm/checkbox/index.js",
      "default": "./cjs/checkbox/index.js"
    },
    "./button": {
      "module": "./esm/button/index.js",
      "default": "./cjs/button/index.js"
    },
    "./cjs/index.js": "./cjs/index.js",
    "./esm/index.js": "./esm/index.js",
    "./cjs/menu/index.js": "./cjs/menu/index.js",
    "./esm/menu/index.js": "./esm/menu/index.js",
    "./cjs/focusable/index.js": "./cjs/focusable/index.js",
    "./esm/focusable/index.js": "./esm/focusable/index.js",
    "./cjs/tooltip/index.js": "./cjs/tooltip/index.js",
    "./esm/tooltip/index.js": "./esm/tooltip/index.js",
    "./cjs/portal/index.js": "./cjs/portal/index.js",
    "./esm/portal/index.js": "./esm/portal/index.js",
    "./cjs/disclosure/index.js": "./cjs/disclosure/index.js",
    "./esm/disclosure/index.js": "./esm/disclosure/index.js",
    "./cjs/dialog/index.js": "./cjs/dialog/index.js",
    "./esm/dialog/index.js": "./esm/dialog/index.js",
    "./cjs/composite/composite-state.js": "./cjs/composite/composite-state.js",
    "./esm/composite/composite-state.js": "./esm/composite/composite-state.js",
    "./cjs/composite/composite-item.js": "./cjs/composite/composite-item.js",
    "./esm/composite/composite-item.js": "./esm/composite/composite-item.js",
    "./cjs/combobox/index.js": "./cjs/combobox/index.js",
    "./esm/combobox/index.js": "./esm/combobox/index.js",
    "./cjs/collection/collection-state.js": "./cjs/collection/collection-state.js",
    "./esm/collection/collection-state.js": "./esm/collection/collection-state.js",
    "./cjs/collection/collection-item.js": "./cjs/collection/collection-item.js",
    "./esm/collection/collection-item.js": "./esm/collection/collection-item.js",
    "./cjs/tab/index.js": "./cjs/tab/index.js",
    "./esm/tab/index.js": "./esm/tab/index.js",
    "./cjs/role/index.js": "./cjs/role/index.js",
    "./esm/role/index.js": "./esm/role/index.js",
    "./cjs/radio/index.js": "./cjs/radio/index.js",
    "./esm/radio/index.js": "./esm/radio/index.js",
    "./cjs/hovercard/index.js": "./cjs/hovercard/index.js",
    "./esm/hovercard/index.js": "./esm/hovercard/index.js",
    "./cjs/group/index.js": "./cjs/group/index.js",
    "./esm/group/index.js": "./esm/group/index.js",
    "./cjs/composite/index.js": "./cjs/composite/index.js",
    "./esm/composite/index.js": "./esm/composite/index.js",
    "./cjs/command/index.js": "./cjs/command/index.js",
    "./esm/command/index.js": "./esm/command/index.js",
    "./cjs/checkbox/index.js": "./cjs/checkbox/index.js",
    "./esm/checkbox/index.js": "./esm/checkbox/index.js",
    "./cjs/button/index.js": "./cjs/button/index.js",
    "./esm/button/index.js": "./esm/button/index.js"
  }
}

Then just add the changes you need further. Once checked in, the rebuild can be run.

lewisl9029 commented 2 years ago

Sounds good, I submitted an issue to get this addressed upstream (by adding an exports map). Hopefully that gets resolved quickly, if not, I'll open a PR for the overrides repo. 🙏

jspm / project

Missing select package from ariakit #194