{"_id":"@abdumamdouh/s360-react-ui","_rev":"4-13ad691a0f47c6afbc011ed0cb5ac3fd","name":"@abdumamdouh/s360-react-ui","dist-tags":{"latest":"0.1.3"},"versions":{"0.1.0":{"name":"@abdumamdouh/s360-react-ui","version":"0.1.0","license":"MIT","_id":"@abdumamdouh/s360-react-ui@0.1.0","maintainers":[{"name":"abdumamdouh","email":"eabdogfx@gmail.com"}],"dist":{"shasum":"37919dd3e9933695043ddfdcd9dce797d118045a","tarball":"https://registry.npmjs.org/@abdumamdouh/s360-react-ui/-/s360-react-ui-0.1.0.tgz","fileCount":9,"integrity":"sha512-2yHlx23gbXzIa55C6NSaZzl2I2Q3kLcFbZqvHHyrZ/kNM4Mm1oxVAHtUt6W/lTzCxwCFrAP//NOln9V66lEsZw==","signatures":[{"sig":"MEUCIQCWmE8qlMA6sEzmmoyr4CrbNkaQHv+xEv3fDjgepmZ2XQIgau90Tkm/Quuhasv7Dryli/ZLWoEr8vgFp5E2YGOYfjI=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":135691},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./styles.css":"./dist/styles.css"},"scripts":{"dev":"storybook dev -p 6006","lint":"eslint src","test":"vitest run","build":"tsup && cp src/styles.css dist/styles.css","typecheck":"tsc --noEmit","release:minor":"npm version minor && npm publish --access public","release:patch":"npm version patch && npm publish --access public","prepublishOnly":"npm run test && npm run build","build:storybook":"storybook build"},"_npmUser":{"name":"abdumamdouh","email":"eabdogfx@gmail.com"},"_npmVersion":"11.13.0","description":"Shift360 design-system React components: fields, dialog, file drop, phone input. Styled by s360 design tokens provided by the host page.","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"20.20.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"8.3.5","vite":"6.4.3","jsdom":"25.0.1","react":"18.2.0","eslint":"9.15.0","vitest":"3.2.4","react-dom":"18.2.0","storybook":"8.4.7","@eslint/js":"9.15.0","typescript":"5.6.3","@types/react":"18.2.79","@storybook/react":"8.4.7","@types/react-dom":"18.2.25","typescript-eslint":"8.15.0","@testing-library/dom":"10.4.0","@vitejs/plugin-react":"4.5.1","@storybook/react-vite":"8.4.7","@testing-library/react":"16.0.1","@testing-library/jest-dom":"6.6.3","eslint-plugin-react-hooks":"5.0.0","@testing-library/user-event":"14.5.2"},"peerDependencies":{"react":">=18 <19","react-dom":">=18 <19"},"_npmOperationalInternal":{"tmp":"tmp/s360-react-ui_0.1.0_1787236273081_0.2554896706320233","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@abdumamdouh/s360-react-ui","version":"0.1.1","license":"MIT","_id":"@abdumamdouh/s360-react-ui@0.1.1","maintainers":[{"name":"abdumamdouh","email":"eabdogfx@gmail.com"}],"dist":{"shasum":"8176055743233464498902e72dccd650c9ea7126","tarball":"https://registry.npmjs.org/@abdumamdouh/s360-react-ui/-/s360-react-ui-0.1.1.tgz","fileCount":9,"integrity":"sha512-ORMT2cdktxcKmzjnzCBJkGBPaUKC9OceSpMxr9dLKV+Rg3wYvwqC8qPJOSiIg72r69gkyBWJuT0hpiJwkTNIFA==","signatures":[{"sig":"MEUCIQC9jGJsyrGEs5NX9RbsG+P6ayNFcxIOsL+G6GmlE9e9swIgTOe9vsjqePGz1nUdYKb3bxKDyooodQPUSWNse0UN7G8=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":136014},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./styles.css":"./dist/styles.css"},"scripts":{"dev":"storybook dev -p 6006","lint":"eslint src","test":"vitest run","build":"tsup && cp src/styles.css dist/styles.css","typecheck":"tsc --noEmit","release:minor":"npm version minor --no-git-tag-version && npm publish --access public --userconfig ./.npmrc","release:patch":"npm version patch --no-git-tag-version && npm publish --access public --userconfig ./.npmrc","prepublishOnly":"npm run test && npm run build","build:storybook":"storybook build"},"_npmUser":{"name":"abdumamdouh","email":"eabdogfx@gmail.com"},"_npmVersion":"11.13.0","description":"Shift360 design-system React components: fields, dialog, file drop, phone input. Styled by s360 design tokens provided by the host page.","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"20.20.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"8.3.5","vite":"6.4.3","jsdom":"25.0.1","react":"18.2.0","eslint":"9.15.0","vitest":"3.2.4","react-dom":"18.2.0","storybook":"8.4.7","@eslint/js":"9.15.0","typescript":"5.6.3","@types/react":"18.2.79","@storybook/react":"8.4.7","@types/react-dom":"18.2.25","typescript-eslint":"8.15.0","@testing-library/dom":"10.4.0","@vitejs/plugin-react":"4.5.1","@storybook/react-vite":"8.4.7","@testing-library/react":"16.0.1","@testing-library/jest-dom":"6.6.3","eslint-plugin-react-hooks":"5.0.0","@testing-library/user-event":"14.5.2"},"peerDependencies":{"react":">=18 <19","react-dom":">=18 <19"},"_npmOperationalInternal":{"tmp":"tmp/s360-react-ui_0.1.1_1787241937537_0.5294053987578122","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@abdumamdouh/s360-react-ui","version":"0.1.2","license":"MIT","_id":"@abdumamdouh/s360-react-ui@0.1.2","maintainers":[{"name":"abdumamdouh","email":"eabdogfx@gmail.com"}],"dist":{"shasum":"93f2820283ce3d900a4549410021dc22a7054c8b","tarball":"https://registry.npmjs.org/@abdumamdouh/s360-react-ui/-/s360-react-ui-0.1.2.tgz","fileCount":10,"integrity":"sha512-zhYfUjfITpGfcFUEkQ8arGrKEURP0NfbW9Rrsw4Ps6KQs77OnRPZtQCQDJjhYbQvxSn6HbwRrkOrn2SOtnQ54w==","signatures":[{"sig":"MEQCIFMtrXj7EXE6FDfkXH0ICf14KxP/iYjv3KDb4Pl6hFFSAiACOG6OzpSEO7Y8uZQgSJO7xaeptuDTar3VPCJ1b33mVg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":136446},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./styles.css":"./dist/styles.css"},"scripts":{"dev":"storybook dev -p 6006","lint":"eslint src","test":"vitest run","build":"tsup && cp src/styles.css dist/styles.css","typecheck":"tsc --noEmit","release:minor":"npm version minor --no-git-tag-version && npm publish --access public --userconfig ./.npmrc","release:patch":"npm version patch --no-git-tag-version && npm publish --access public --userconfig ./.npmrc","prepublishOnly":"npm run test && npm run build","build:storybook":"storybook build"},"_npmUser":{"name":"abdumamdouh","email":"eabdogfx@gmail.com"},"_npmVersion":"11.13.0","description":"Shift360 design-system React components: fields, dialog, file drop, phone input. Styled by s360 design tokens provided by the host page.","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"20.20.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"8.3.5","vite":"6.4.3","jsdom":"25.0.1","react":"18.2.0","eslint":"9.15.0","vitest":"3.2.4","react-dom":"18.2.0","storybook":"8.4.7","@eslint/js":"9.15.0","typescript":"5.6.3","@types/react":"18.2.79","@storybook/react":"8.4.7","@types/react-dom":"18.2.25","typescript-eslint":"8.15.0","@testing-library/dom":"10.4.0","@vitejs/plugin-react":"4.5.1","@storybook/react-vite":"8.4.7","@testing-library/react":"16.0.1","@testing-library/jest-dom":"6.6.3","eslint-plugin-react-hooks":"5.0.0","@testing-library/user-event":"14.5.2"},"peerDependencies":{"react":">=18 <19","react-dom":">=18 <19"},"_npmOperationalInternal":{"tmp":"tmp/s360-react-ui_0.1.2_1787241982399_0.5489140423716203","host":"s3://npm-registry-packages-npm-production"}},"0.1.3":{"name":"@abdumamdouh/s360-react-ui","version":"0.1.3","description":"Shift360 design-system React components: fields, dialog, file drop, phone input. Styled by s360 design tokens provided by the host page.","license":"MIT","type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./styles.css":"./dist/styles.css"},"sideEffects":["**/*.css"],"scripts":{"dev":"storybook dev -p 6006","build":"tsup && cp src/styles.css dist/styles.css","build:storybook":"storybook build","test":"vitest run","typecheck":"tsc --noEmit","lint":"eslint src","prepublishOnly":"npm run test && npm run build","release:patch":"npm version patch --no-git-tag-version && npm publish --access public --userconfig ./.npmrc","release:minor":"npm version minor --no-git-tag-version && npm publish --access public --userconfig ./.npmrc"},"peerDependencies":{"react":">=18 <19","react-dom":">=18 <19"},"devDependencies":{"@eslint/js":"9.15.0","@storybook/react":"8.4.7","@storybook/react-vite":"8.4.7","@testing-library/dom":"10.4.0","@testing-library/jest-dom":"6.6.3","@testing-library/react":"16.0.1","@testing-library/user-event":"14.5.2","@types/react":"18.2.79","@types/react-dom":"18.2.25","@vitejs/plugin-react":"4.5.1","eslint":"9.15.0","eslint-plugin-react-hooks":"5.0.0","jsdom":"25.0.1","react":"18.2.0","react-dom":"18.2.0","storybook":"8.4.7","tsup":"8.3.5","typescript":"5.6.3","typescript-eslint":"8.15.0","vite":"6.4.3","vitest":"3.2.4"},"_id":"@abdumamdouh/s360-react-ui@0.1.3","_nodeVersion":"20.20.0","_npmVersion":"11.13.0","dist":{"integrity":"sha512-hUJbeIm3RXTkuGVfD56vhcZVrC45rRiFzvmilcraOkTiltVbVhqvUKs/vgP2zGdoVuoHh58cjYhCiXR6zhthvQ==","shasum":"cbf71a39248dedd535efdf57b9208374cc435117","tarball":"https://registry.npmjs.org/@abdumamdouh/s360-react-ui/-/s360-react-ui-0.1.3.tgz","fileCount":10,"unpackedSize":136657,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCUNW0O0ruNqhUhepA/a7qjs4fczpBlTEKD8Wif0Ni7BAIhANnuIYTWtTNP3qHTaF8m1IRG6Hu8t0lmcRIleQVZOroY"}]},"_npmUser":{"name":"abdumamdouh","email":"eabdogfx@gmail.com"},"directories":{},"maintainers":[{"name":"abdumamdouh","email":"eabdogfx@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/s360-react-ui_0.1.3_1787512039510_0.9184678163887239"},"_hasShrinkwrap":false}},"time":{"created":"2026-08-20T14:31:12.540Z","modified":"2026-08-23T19:07:19.840Z","0.1.0":"2026-08-20T14:31:13.226Z","0.1.1":"2026-08-20T16:05:37.725Z","0.1.2":"2026-08-20T16:06:22.657Z","0.1.3":"2026-08-23T19:07:19.655Z"},"license":"MIT","description":"Shift360 design-system React components: fields, dialog, file drop, phone input. Styled by s360 design tokens provided by the host page.","maintainers":[{"name":"abdumamdouh","email":"eabdogfx@gmail.com"}],"readme":"# @abdumamdouh/s360-react-ui\n\nShift360 design-system React components extracted from the enquiry client extension:\nform field shell, text/textarea fields (with live character counter), native dialog wrapper,\ndrag-and-drop file input with preview card, and a phone field with an accessible\ncountry-code combobox — plus `useCountdown` and `useClipboardFlash`.\n\n## Install\n\n```bash\nnpm i @abdumamdouh/s360-react-ui\n```\n\n`react` / `react-dom` 18 are peer dependencies.\n\n## Usage in a Liferay client extension\n\n```tsx\nimport { TextField, FileDrop, PhoneField, Dialog } from '@abdumamdouh/s360-react-ui';\nimport '@abdumamdouh/s360-react-ui/styles.css';\n```\n\nThe components are styled by `--s360-*` design tokens and the base `.s360-field` rules,\nboth provided on every portal page by the `shift360-global-styles` client extension.\nOutside the portal (Storybook, tests) import those css files yourself.\n\n## Development\n\n```bash\nnpm install\nnpm run dev          # Storybook on :6006\nnpm run test         # vitest\nnpm run typecheck\nnpm run lint\nnpm run build        # dist/: ESM + CJS + d.ts + styles.css\n```\n\n## Architecture\n\n`src/` is layered — imports only point down:\n\n```\ncomposites (PhoneField)  →  inputs (TextField, FileDrop)  →  primitives (Field, Dialog)  →  hooks\n```\n\nEach component folder co-locates implementation + story + test + `index.ts`.\nEverything public is re-exported from `src/index.ts`; every prop type is an exported interface.\nAll component CSS lives in `src/styles.css`, scoped under `.s360-ui`.\n\n## Release\n\n```bash\nnpm run release:patch   # fix\nnpm run release:minor   # new component/prop\n```\n\n`prepublishOnly` runs tests + build automatically. No npm account or OTP needed:\nthis folder's `.npmrc` carries a granular npm token that can publish ONLY this\npackage (2FA-bypass, yearly expiry — the package owner renews it). The token\ngrants publish rights to anyone with repo access; keep the repo private.\n","readmeFilename":"README.md"}