{"_id":"@aqzhyi/astro-react-mantine","_rev":"3-0110ba3d8f115fe688c3be2c89904d89","name":"@aqzhyi/astro-react-mantine","dist-tags":{"latest":"0.1.2"},"versions":{"0.0.2":{"name":"@aqzhyi/astro-react-mantine","version":"0.0.2","keywords":["astro-component","astro","components","design","frontend","react","mantine","mantine UI","ui kit","ui-kit","ui","withastro"],"license":"MIT","_id":"@aqzhyi/astro-react-mantine@0.0.2","maintainers":[{"name":"pleasurazy","email":"pleasurazy@gmail.com"}],"homepage":"https://github.com/Aqzhyi/oh-my-monorepo#readme","bugs":{"url":"https://github.com/Aqzhyi/oh-my-monorepo/issues"},"dist":{"shasum":"36cd716c0e5cf1ba121a54e639298ac24678fce6","tarball":"https://registry.npmjs.org/@aqzhyi/astro-react-mantine/-/astro-react-mantine-0.0.2.tgz","fileCount":13,"integrity":"sha512-sVdPZnygLa6QFyBW3EhLOJtvN6v3mMos6oR970DLeLEwNaS/pN6E5nQM8YbymYnj8aOdVf5HL+GjiZof51MqnA==","signatures":[{"sig":"MEQCIGvwC4SVpSERJTBW37NCjFINV5mTGwoMqIFY9zykQh2+AiAokhyYztpAewWil6UQZdFCIRPbSfDYtwBi/xaYIAGAIg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":8311},"type":"module","_from":"file:aqzhyi-astro-react-mantine-0.0.2.tgz","exports":{".":["./src/libs/astro-components/index.astro"]},"private":false,"scripts":{"dev":"turbo watch web css lint tsc -F={*/astro-react-mantine}","tsc":"tsc --noEmit --preserveWatchOutput","web":"astro dev","lint":"biome lint ./src","build":"astro check --minimumSeverity error && astro build"},"_npmUser":{"name":"pleasurazy","email":"pleasurazy@gmail.com"},"_resolved":"/private/var/folders/dq/y_hzh5vx4v7126077cddwfdc0000gn/T/200776480b226114c35db47ecbb4c8c0/aqzhyi-astro-react-mantine-0.0.2.tgz","_integrity":"sha512-sVdPZnygLa6QFyBW3EhLOJtvN6v3mMos6oR970DLeLEwNaS/pN6E5nQM8YbymYnj8aOdVf5HL+GjiZof51MqnA==","repository":{"url":"git+https://github.com/Aqzhyi/oh-my-monorepo.git","type":"git","directory":"@aqzhyi/astro-react-mantine"},"_npmVersion":"10.1.0","description":"Although it may slightly conflict with Astro's original intent, you remain dedicated to integrating mantine UI within Astro.","directories":{},"_nodeVersion":"20.8.0","_hasShrinkwrap":false,"devDependencies":{"astro":"^4.15.9","react":"^18.3.1","react-dom":"^18.3.1","typescript":"^5.6.2","@types/react":"^18.3.10","@mantine/core":"^7.13.1","@astrojs/check":"^0.9.3","@astrojs/react":"^3.6.2","@mantine/hooks":"^7.13.1","@types/react-dom":"^18.3.0","@astrojs/ts-plugin":"^1.10.2"},"_npmOperationalInternal":{"tmp":"tmp/astro-react-mantine_0.0.2_1727874330226_0.48489080973974996","host":"s3://npm-registry-packages"}},"0.1.0":{"name":"@aqzhyi/astro-react-mantine","version":"0.1.0","keywords":["astro-component","astro","components","design","frontend","react","mantine","mantine UI","ui kit","ui-kit","ui","withastro"],"license":"MIT","_id":"@aqzhyi/astro-react-mantine@0.1.0","maintainers":[{"name":"pleasurazy","email":"pleasurazy@gmail.com"}],"homepage":"https://github.com/Aqzhyi/oh-my-monorepo#readme","bugs":{"url":"https://github.com/Aqzhyi/oh-my-monorepo/issues"},"dist":{"shasum":"78acfe4f65b08341d09376e5380e275b43126efe","tarball":"https://registry.npmjs.org/@aqzhyi/astro-react-mantine/-/astro-react-mantine-0.1.0.tgz","fileCount":10,"integrity":"sha512-bibm09q6A/6JXnXIpqK+Q6AZeIz74aWYypUuxNkGGqERuapkB3yOnvL+qJRSVi4mq3gHZgklP6nguym7MqvXGA==","signatures":[{"sig":"MEQCIB5ghCNRqkQ/XS8phmqgtV5T92yc71qP54a6kZKyF/zuAiAQhQqWmx1jRqkimCAwD1jt6r4CxccLgsSwWVnx1KpScg==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":7290},"type":"module","_from":"file:aqzhyi-astro-react-mantine-0.1.0.tgz","exports":{".":"./src/index.ts"},"private":false,"scripts":{"dev":"astro dev","tsc":"astro check","lint":"biome lint ./src","build":"astro check --minimumSeverity error && astro build"},"_npmUser":{"name":"pleasurazy","email":"pleasurazy@gmail.com"},"_resolved":"/private/var/folders/dq/y_hzh5vx4v7126077cddwfdc0000gn/T/dd4fd195db9ffcf42d2298c9c14ac411/aqzhyi-astro-react-mantine-0.1.0.tgz","_integrity":"sha512-bibm09q6A/6JXnXIpqK+Q6AZeIz74aWYypUuxNkGGqERuapkB3yOnvL+qJRSVi4mq3gHZgklP6nguym7MqvXGA==","repository":{"url":"git+https://github.com/Aqzhyi/oh-my-monorepo.git","type":"git","directory":"@aqzhyi/astro-react-mantine"},"_npmVersion":"10.1.0","description":"Although it may slightly conflict with Astro's original intent, you remain dedicated to integrating mantine UI within Astro.","directories":{},"_nodeVersion":"20.8.0","_hasShrinkwrap":false,"devDependencies":{"astro":"^4.15.9","react":"^18.3.1","react-dom":"^18.3.1","typescript":"^5.6.2","@types/react":"^18.3.10","@mantine/core":"^7.13.1","@astrojs/check":"^0.9.3","@astrojs/react":"^3.6.2","@mantine/hooks":"^7.13.1","@types/react-dom":"^18.3.0","@astrojs/ts-plugin":"^1.10.2"},"peerDependencies":{"astro":"^4.15.9","react":"^18.3.1","react-dom":"^18.3.1","@mantine/core":"^7.13.1"},"_npmOperationalInternal":{"tmp":"tmp/astro-react-mantine_0.1.0_1729069628145_0.6762889148932205","host":"s3://npm-registry-packages"}},"0.1.1":{"name":"@aqzhyi/astro-react-mantine","version":"0.1.1","keywords":["astro-component","astro","components","design","frontend","react","mantine","mantine UI","ui kit","ui-kit","ui","withastro"],"license":"MIT","_id":"@aqzhyi/astro-react-mantine@0.1.1","maintainers":[{"name":"pleasurazy","email":"pleasurazy@gmail.com"}],"homepage":"https://github.com/Aqzhyi/oh-my-monorepo#readme","bugs":{"url":"https://github.com/Aqzhyi/oh-my-monorepo/issues"},"dist":{"shasum":"e0d9d06456c03ec0e6e6cad9cd0b1786a9cb03ac","tarball":"https://registry.npmjs.org/@aqzhyi/astro-react-mantine/-/astro-react-mantine-0.1.1.tgz","fileCount":10,"integrity":"sha512-i0AtWVHmRSrZBUjvO3X3JVUN4MC87PCJOB614M3JZ0HEdG/aW66R5ayiOypeCGLUV+XvZ0z+ifiRU9kzIrPW0A==","signatures":[{"sig":"MEUCICS0Gk9zJ85wRnEc8jIb12ZjtkWk4TzrHk6C3gdlkwrlAiEAuMjPsWal1Eigf1vDx95ffY7SFn1pBgflPOBR6jpFtTg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":7253},"type":"module","_from":"file:aqzhyi-astro-react-mantine-0.1.1.tgz","exports":{".":"./src/index.ts"},"private":false,"scripts":{"dev":"astro dev","tsc":"astro check","lint":"biome lint ./src","build":"astro check --minimumSeverity error && astro build"},"_npmUser":{"name":"pleasurazy","email":"pleasurazy@gmail.com"},"_resolved":"/private/var/folders/dq/y_hzh5vx4v7126077cddwfdc0000gn/T/4106108d8eba486a6c8026109e02402f/aqzhyi-astro-react-mantine-0.1.1.tgz","_integrity":"sha512-i0AtWVHmRSrZBUjvO3X3JVUN4MC87PCJOB614M3JZ0HEdG/aW66R5ayiOypeCGLUV+XvZ0z+ifiRU9kzIrPW0A==","repository":{"url":"git+https://github.com/Aqzhyi/oh-my-monorepo.git","type":"git","directory":"@aqzhyi/astro-react-mantine"},"_npmVersion":"10.1.0","description":"Although it may slightly conflict with Astro's original intent, you remain dedicated to integrating mantine UI within Astro.","directories":{},"_nodeVersion":"20.8.0","_hasShrinkwrap":false,"devDependencies":{"astro":"^4.15.9","react":"^18.3.1","react-dom":"^18.3.1","typescript":"^5.6.2","@types/react":"^18.3.10","@mantine/core":"^7.13.1","@astrojs/check":"^0.9.3","@astrojs/react":"^3.6.2","@mantine/hooks":"^7.13.1","@types/react-dom":"^18.3.0"},"peerDependencies":{"astro":"^4.15.9","react":"^18.3.1","react-dom":"^18.3.1","@mantine/core":"^7.13.1"},"_npmOperationalInternal":{"tmp":"tmp/astro-react-mantine_0.1.1_1729076596460_0.9927352381669201","host":"s3://npm-registry-packages"}},"0.1.2":{"private":false,"license":"MIT","version":"0.1.2","name":"@aqzhyi/astro-react-mantine","description":"Although it may slightly conflict with Astro's original intent, you remain dedicated to integrating mantine UI within Astro.","type":"module","exports":{".":"./src/index.ts"},"peerDependencies":{"@mantine/core":"^7.13.1","astro":"^4.15.9","react":"^18.3.1","react-dom":"^18.3.1"},"devDependencies":{"@astrojs/check":"^0.9.3","@astrojs/react":"^3.6.2","@mantine/core":"^7.13.1","@mantine/hooks":"^7.13.1","@types/react":"^18.3.10","@types/react-dom":"^18.3.0","astro":"^4.15.9","react":"^18.3.1","react-dom":"^18.3.1","typescript":"^5.6.2"},"repository":{"type":"git","url":"git+https://github.com/Aqzhyi/oh-my-monorepo.git","directory":"@aqzhyi/astro-react-mantine"},"keywords":["astro-component","astro","components","design","frontend","react","mantine","mantine UI","ui kit","ui-kit","ui","withastro"],"scripts":{"dev":"astro dev","lint":"biome lint ./src","tsc":"astro check","build":"astro check --minimumSeverity error && astro build"},"_id":"@aqzhyi/astro-react-mantine@0.1.2","bugs":{"url":"https://github.com/Aqzhyi/oh-my-monorepo/issues"},"homepage":"https://github.com/Aqzhyi/oh-my-monorepo#readme","_integrity":"sha512-sZHDEGp1Xv4eBZi8Sx8HdR7jNJ7mxpBpxepeD+07RGpYxyjYvA39M7CFjSSlXTmfVIYFlAIDjvlNsoeZHdMMaw==","_resolved":"/private/var/folders/dq/y_hzh5vx4v7126077cddwfdc0000gn/T/a2f179250ca10d2327da5009738cf117/aqzhyi-astro-react-mantine-0.1.2.tgz","_from":"file:aqzhyi-astro-react-mantine-0.1.2.tgz","_nodeVersion":"22.11.0","_npmVersion":"10.9.0","dist":{"integrity":"sha512-sZHDEGp1Xv4eBZi8Sx8HdR7jNJ7mxpBpxepeD+07RGpYxyjYvA39M7CFjSSlXTmfVIYFlAIDjvlNsoeZHdMMaw==","shasum":"4433a34271bcfc5c34db8167e1bbbbcd43193b93","tarball":"https://registry.npmjs.org/@aqzhyi/astro-react-mantine/-/astro-react-mantine-0.1.2.tgz","fileCount":15,"unpackedSize":11860,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCKqcJRbw4zwBxZ0NMv1Hc9Ms22NX6gOD3FUKxP5AT8WAIgD2QzUCmAGj+SIMbxLjB/CB7mA/DktCWZnEEWxUgxH24="}]},"_npmUser":{"name":"pleasurazy","email":"pleasurazy@gmail.com"},"directories":{},"maintainers":[{"name":"pleasurazy","email":"pleasurazy@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/astro-react-mantine_0.1.2_1734448873219_0.9725356735313806"},"_hasShrinkwrap":false}},"time":{"created":"2024-10-02T13:05:30.124Z","modified":"2024-12-17T15:21:13.603Z","0.0.2":"2024-10-02T13:05:30.399Z","0.1.0":"2024-10-16T09:07:08.332Z","0.1.1":"2024-10-16T11:03:16.643Z","0.1.2":"2024-12-17T15:21:13.418Z"},"bugs":{"url":"https://github.com/Aqzhyi/oh-my-monorepo/issues"},"license":"MIT","homepage":"https://github.com/Aqzhyi/oh-my-monorepo#readme","keywords":["astro-component","astro","components","design","frontend","react","mantine","mantine UI","ui kit","ui-kit","ui","withastro"],"repository":{"type":"git","url":"git+https://github.com/Aqzhyi/oh-my-monorepo.git","directory":"@aqzhyi/astro-react-mantine"},"description":"Although it may slightly conflict with Astro's original intent, you remain dedicated to integrating mantine UI within Astro.","maintainers":[{"name":"pleasurazy","email":"pleasurazy@gmail.com"}],"readme":"# @aqzhyi/astro-react-mantine\n\n> Although it may go against Astro's original purpose, you still want to use mantine.dev with Astro\n\nThe main reason why Astro cannot work with mantine.dev is that Astro does not share the React Context. this makes the MantineProvider not usable and causes the page to crash.\n\n> [!TIP]\n>\n> for example\n\nWhen your astro parts are set up like this,\n\n```astro\n<BasicLayout>\n  <MantineProvider\n    defaultColorScheme='dark'\n    client:only='react'\n  >\n    <Content client:load />\n  </MantineProvider>\n</BasicLayout>\n```\n\n> [!IMPORTANT]\n>\n> Will receive an error message:\n\nERROR: `@mantine/core: MantineProvider was not found in component tree, make sure you have it in your app`\n\n---\n\n## Current Solution\n\nUse a specific React component as the main part to give the shared features of ReactContext, and show it as the only main part in Astro with `client:load`\n\n> [!CAUTION]\n>\n> It's Working, as pseudocode below:\n\n```tsx\n//\n// Create a React component that integrates MantineProvider as the root component for an Astro island component\nexport const createAstroComponent = (config: { component: React.ComponentType<React.PropsWithChildren> }) => {\n  function MantineContextContainer() {\n    return (\n      <MantineProvider defaultColorScheme='dark'>\n        <config.component />\n      </MantineProvider>\n    )\n  }\n\n  return MantineContextContainer\n}\n\n//\n// Create your Mantine interactive component layout and export it for Astro.\nexport const DemoContainer = createAstroComponent((props: React.PropsWithChildren) => {\n  return (props: React.PropsWithChildren) => {\n    const [title, setTitle] = useState('')\n    const [items, setItems] = useState<string[]>(['111', '222', '333', '444', '555', '666'])\n\n    return (\n      <SimpleGrid>\n        <TextInput\n          value={title}\n          onChange={(current) => {\n            setTitle(current.target.value)\n          }}\n          label='Add a task to the to-do list'\n        />\n        <Button\n          color='orange'\n          onClick={() => {\n            setItems((prev) => ([...prev, title]))\n            setTitle(() => '')\n          }}\n        >\n          Add\n        </Button>\n      </SimpleGrid>\n    )\n  })\n}\n```\n\n---\n\n## Installation\n\n```\npnpm i @aqzhyi/astro-react-mantine -S\n```\n\n## Usage\n\n> [!NOTE]\n>\n> import `<MantineLayout />` in ./src/pages/\\_MyLayout.astro\n\n```astro\n---\nimport { Head, MantineLayout } from '@aqzhyi/astro-react-mantine'\n---\n\n<MantineLayout\n  lang='zh-TW'\n  {...Astro.props}\n>\n  <Head>\n    <meta\n      name='keywords'\n      content={'aqzhyi, github, library, packages, docs, astro, react, mantine, layout, ui'}\n    />\n  </Head>\n\n  <slot />\n</MantineLayout>\n```\n","readmeFilename":"README.md"}