diff --git a/package.json b/package.json index e7138bd8..9fe08a9a 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "@types/react-dom": "18", "expo-modules-core": "^1.5.9", "react": "18", + "react-color": "^2.19.3", "react-dom": "18", "react-native": "^0.72.3", "react-native-svg": "^13.10.0", @@ -48,6 +49,7 @@ "@storybook/react-vite": "^7.2.0", "@storybook/test-runner": "^0.12.0", "@storybook/testing-library": "^0.2.0", + "@types/react-color": "^3.0.6", "@typescript-eslint/eslint-plugin": "^6.0.0", "@typescript-eslint/parser": "^6.0.0", "@vitejs/plugin-react": "^4.0.3", diff --git a/src/App.css b/src/App.css index 55e6bd98..29d4f3ac 100644 --- a/src/App.css +++ b/src/App.css @@ -1,30 +1,3 @@ #root { width: 100%; -} - -@media (prefers-reduced-motion: no-preference) { - a:nth-of-type(2) .logo { - animation: logo-spin infinite 20s linear; - } -} - -/* span { - display: inline-block; - vertical-align: middle; - line-height: 1; -} */ - -.mb-1 { - margin-bottom: 1em; -} -.mt-1 { - margin-top: 1em; -} -.my-1 { - margin-top: 1em; - margin-bottom: 1em; -} -.py-05 { - padding-top: 0.5em; - padding-bottom: 0.5em; } \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx index 3b14deeb..64627932 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -10,6 +10,7 @@ import DeviceSyncStatus from './pages/DeviceSyncStatus/DeviceSyncStatus' import { Provider as ReduxProvider } from 'react-redux' import PinnedNotification from './components/General/PinnedNottification' import store from './redux/store' +import CreateLocalNodePage from './pages/CreateLocalNodePage/CreateLocalNodePage' const router = createBrowserRouter([ { @@ -28,6 +29,10 @@ const router = createBrowserRouter([ path: '/device-sync-status', element: , }, + { + path: '/create-local-node', + element: , + }, ]) function App() { return ( diff --git a/src/components/General/BreadcrumbBar/breadcrumbbar.css b/src/components/General/BreadcrumbBar/BreadcrumbBar.css similarity index 78% rename from src/components/General/BreadcrumbBar/breadcrumbbar.css rename to src/components/General/BreadcrumbBar/BreadcrumbBar.css index b63bec69..e4dbdae6 100644 --- a/src/components/General/BreadcrumbBar/breadcrumbbar.css +++ b/src/components/General/BreadcrumbBar/BreadcrumbBar.css @@ -4,19 +4,14 @@ padding: 1rem 2rem; margin: 0.5rem; } -.breadcrumb-bar-ul { - list-style-type: none; - display: flex; - padding: 0; - margin: 0; -} .breadcrumb-bar-li { - padding: 0 1em; color: #647084; - font-size: 15px; font-weight: 500; position: relative; } +.breadcrumb-bar-li:last-child { + color: #09101C; +} .breadcrumb-bar-li::after { display: inline-block; content: url("/icons/chevron.svg"); @@ -26,10 +21,7 @@ left: 100%; transform: translateX(-50%); } -.breadcrumb-bar-li:last-child { - color: #09101C; -} .breadcrumb-bar-li:last-child::after { display: none; -} \ No newline at end of file +} diff --git a/src/components/General/BreadcrumbBar/BreadcrumbBar.tsx b/src/components/General/BreadcrumbBar/BreadcrumbBar.tsx index 9034efbb..44199c1a 100644 --- a/src/components/General/BreadcrumbBar/BreadcrumbBar.tsx +++ b/src/components/General/BreadcrumbBar/BreadcrumbBar.tsx @@ -1,4 +1,4 @@ -import './breadcrumbbar.css' +import './BreadcrumbBar.css' type BreadcrumbBarProps = { breadcrumbList: string[] diff --git a/src/components/General/ColorPicker.stories.tsx b/src/components/General/ColorPicker.stories.tsx new file mode 100644 index 00000000..371a3309 --- /dev/null +++ b/src/components/General/ColorPicker.stories.tsx @@ -0,0 +1,19 @@ +import type { Meta, StoryObj } from '@storybook/react' + +import ColorPicker from './ColorPicker' + +const meta = { + title: 'General/ColorPicker', + component: ColorPicker, + parameters: { + layout: 'centered', + }, + tags: ['autodocs'], +} satisfies Meta + +export default meta +type Story = StoryObj + +export const DefaultColors: Story = { + args: {}, +} diff --git a/src/components/General/ColorPicker.tsx b/src/components/General/ColorPicker.tsx new file mode 100644 index 00000000..80d5afed --- /dev/null +++ b/src/components/General/ColorPicker.tsx @@ -0,0 +1,33 @@ +import { useState } from 'react' +import { CirclePicker } from 'react-color' +import { XStack } from 'tamagui' + +const ColorPicker = () => { + const [chosenColor, setChosenColor] = useState('#FFFFFF') + return ( + + setChosenColor(color.hex)} + /> + + ) +} + +export default ColorPicker diff --git a/src/components/General/LabelInputField.css b/src/components/General/LabelInputField.css new file mode 100644 index 00000000..a1859b9a --- /dev/null +++ b/src/components/General/LabelInputField.css @@ -0,0 +1,6 @@ +.input-container { + background-color: #fff; + border-radius: 12px; + margin-top: 8px; + width: 100%; +} \ No newline at end of file diff --git a/src/components/General/LabelInputField.tsx b/src/components/General/LabelInputField.tsx index 298fabee..fb71d95e 100644 --- a/src/components/General/LabelInputField.tsx +++ b/src/components/General/LabelInputField.tsx @@ -1,5 +1,6 @@ import { Input as StatusInput, Text } from '@status-im/components' import { Label } from 'tamagui' +import './LabelInputField.css' type LabelInputProps = { labelText: string @@ -12,7 +13,9 @@ function LabelInputField({ labelText, placeholderText }: LabelInputProps) { {labelText} - +
+ +
) } diff --git a/src/components/General/QuickStartBar/QuickStartBar.css b/src/components/General/QuickStartBar/QuickStartBar.css index 334c8d90..90d344f3 100644 --- a/src/components/General/QuickStartBar/QuickStartBar.css +++ b/src/components/General/QuickStartBar/QuickStartBar.css @@ -14,22 +14,12 @@ } .quick-start-bar > div { width: 100%; - display: flex; - justify-content: space-between; - align-items: center; border-radius: 24px; background: rgba(100, 112, 132, 0.05); margin-left: 1rem; + padding: 1rem 0.5rem; } -.quick-start-bar ul { - list-style-type: none; - display: flex; - padding: 0; - margin: 0; -} - .quick-start-bar ul li { - padding: 0 1rem; color: #0D1625; font-size: 13px; } diff --git a/src/components/General/QuickStartBar/QuickStartBar.tsx b/src/components/General/QuickStartBar/QuickStartBar.tsx index 66560c6c..da93872a 100644 --- a/src/components/General/QuickStartBar/QuickStartBar.tsx +++ b/src/components/General/QuickStartBar/QuickStartBar.tsx @@ -38,7 +38,6 @@ const QuickStartBar = () => {
  • Nodes Community
  • Documentation
    • - ) diff --git a/src/components/General/TagContainer.css b/src/components/General/TagContainer.css new file mode 100644 index 00000000..d02ec351 --- /dev/null +++ b/src/components/General/TagContainer.css @@ -0,0 +1,4 @@ + +.tag-container div:nth-child(1) { + background:transparent; + } \ No newline at end of file diff --git a/src/components/General/TagContainer.tsx b/src/components/General/TagContainer.tsx new file mode 100644 index 00000000..42dbfd0d --- /dev/null +++ b/src/components/General/TagContainer.tsx @@ -0,0 +1,16 @@ +import { Tag } from '@status-im/components' +import { XStack } from 'tamagui' +import PairIcon from '../Icons/PairIcon' +import CreateIcon from '../Icons/CreateIcon' +import './TagContainer.css' + +const TagContainer = () => { + return ( + + + + + ) +} + +export default TagContainer diff --git a/src/components/General/Title.tsx b/src/components/General/Title.tsx index b5a02796..925e590b 100644 --- a/src/components/General/Title.tsx +++ b/src/components/General/Title.tsx @@ -7,7 +7,7 @@ type TitleProps = { const Title = ({ color, children }: TitleProps) => { return ( - + {children} ) diff --git a/src/components/General/Titles.tsx b/src/components/General/Titles.tsx index 29aaae53..fb24683a 100644 --- a/src/components/General/Titles.tsx +++ b/src/components/General/Titles.tsx @@ -11,7 +11,7 @@ type TitlesProps = { const Titles = ({ title, subtitle, isAdvancedSettings }: TitlesProps) => { return ( - + {title} {isAdvancedSettings && ( diff --git a/src/components/Icons/ReactionIcon.tsx b/src/components/Icons/ReactionIcon.tsx new file mode 100644 index 00000000..74a71de2 --- /dev/null +++ b/src/components/Icons/ReactionIcon.tsx @@ -0,0 +1,16 @@ +function ReactionIcon() { + return ( + + + + + + ) +} +export default ReactionIcon diff --git a/src/components/Logos/NimbusLogo.css b/src/components/Logos/NimbusLogo.css new file mode 100644 index 00000000..52c7136e --- /dev/null +++ b/src/components/Logos/NimbusLogo.css @@ -0,0 +1,5 @@ + +.nimbus-logomark{ + width: auto; + height: 30%; +} \ No newline at end of file diff --git a/src/components/Logos/NimbusLogo.tsx b/src/components/Logos/NimbusLogo.tsx index e955012e..729c7c16 100644 --- a/src/components/Logos/NimbusLogo.tsx +++ b/src/components/Logos/NimbusLogo.tsx @@ -1,5 +1,6 @@ import { XStack } from 'tamagui' import BetaTag from './BetaTag' +import './NimbusLogo.css' const NimbusLogo = () => { return ( diff --git a/src/components/PageWrappers/layout.css b/src/components/PageWrappers/layout.css index 7de68989..a2911318 100644 --- a/src/components/PageWrappers/layout.css +++ b/src/components/PageWrappers/layout.css @@ -25,8 +25,8 @@ display: flex; flex-wrap: wrap; justify-content: end; - height: 100%; - margin: 0 auto; + height: 100%; + padding: 70px 0 0; } .container-inner { max-width: 70%; @@ -34,88 +34,42 @@ display: flex; flex-direction: column; } -header { - width: 100%; - display: flex; - justify-content: space-between; - padding: 1.5rem 0; -} -header > div { - display: flex; - align-items: center; -} -.logo-title { - font-size: 27px; - font-weight: 700; - display: flex; - align-items: center; - -} -.logo-title .beta{ - color: #FFF; - font-size: 10px; - font-weight: 600; - border-radius: 66.667px; - background-color: #2A4AF5; - padding: 4px 6px; - margin-left: 10px; -} .content { flex-grow: 1; } -.content .title { - font-size: 27px; - font-weight: 600; - margin-bottom: 0.25em; -} -.content .subtitle { - font-size: 15px; - margin: 0.1em; -} -.content .subtitle span{ - font-weight: 700; -} -.content button { - display: flex; - align-items: center; -} -.content button span { - padding-right: 10px; + +/* LAYOUT RIGHT ELEMENT WITH IMAGE TAKING UP THE WHOLE HIGHT OF THE VIEWPORT */ +.layout-right { + flex: 0 0 45%; + max-width: 45%; + z-index: 0; } - - /* LAYOUT RIGHT ELEMENT WITH IMAGE TAKING UP THE WHOLE HIGHT OF THE VIEWPORT */ - .layout-right { - flex: 0 0 45%; - max-width: 45%; - z-index: 0; - } - - .image-container { - height: 100%; - position: relative; - overflow: hidden; - } - .image-container::before { - display: block; - content: ""; - padding-bottom: 100%; - } - .image-container::after { - display: block; - content: ""; - position: absolute; - top: 0; - left: -1%; - width: 50%; - height: 100%; - background: linear-gradient(to right, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 0.0)); - } - .image-container img { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - height: 140%; - width: auto; - } +.image-container { + height: 100%; + position: relative; + overflow: hidden; +} +.image-container::before { + display: block; + content: ""; + padding-bottom: 100%; +} +.image-container::after { + display: block; + content: ""; + position: absolute; + top: 0; + left: -1%; + width: 50%; + height: 100%; + background: linear-gradient(to right, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, 0.0)); +} +.image-container img { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + height: 140%; + width: auto; +} diff --git a/src/index.css b/src/index.css index bd360c1c..54b88a93 100644 --- a/src/index.css +++ b/src/index.css @@ -13,69 +13,46 @@ -moz-osx-font-smoothing: grayscale; -webkit-text-size-adjust: 100%; } - #storybook-root { - width: 100%; + width: 100%; } - body { margin: 0; display: flex; min-width: 320px; min-height: 100vh; } - h1, h2, h3, h4, h5, h6 { line-height: 1.2; font-weight: 700; } - -h1 { - font-size: 3.2em; - -} - a { font-weight: 500; text-decoration: inherit; cursor: pointer; } -a:hover { - color: #535bf2; -} button { border-radius: 12px; border: 1px solid transparent; - padding: 0.6em 1.2em; font-size: 15px; font-weight: 500; font-family: inherit; - background-color: #2A4AF5; - cursor: pointer; - transition: border-color 0.25s; -} -button.inversed { - border-radius: 12px; - border: 1px solid #2A4AF5; - color: #2A4AF5; - padding: 0.75em 1.2em; - font-size: 15px; - background-color:transparent; - font-weight: 500; - font-family: inherit; cursor: pointer; transition: border-color 0.25s; } -button:hover { - border-color: #646cff; -} button:focus, button:focus-visible { outline: 4px auto -webkit-focus-ring-color; } -.nimbus-logomark{ - width: auto; - height: 30%; +ul{ + list-style-type: none; + padding: 0; + margin: 0; + display: flex; +} +ul li { + padding: 0 1rem; + font-size: 15px; } @media (prefers-color-scheme: light) { :root { diff --git a/src/pages/CreateLocalNodePage/CreateLocalNodePage.stories.ts b/src/pages/CreateLocalNodePage/CreateLocalNodePage.stories.ts new file mode 100644 index 00000000..99c8bae0 --- /dev/null +++ b/src/pages/CreateLocalNodePage/CreateLocalNodePage.stories.ts @@ -0,0 +1,20 @@ +import type { Meta, StoryObj } from '@storybook/react' + +import CreateLocalNodePage from './CreateLocalNodePage' + +const meta = { + title: 'Pages/CreateLocalNodePage', + component: CreateLocalNodePage, + parameters: { + layout: 'centered', + }, + tags: ['autodocs'], + argTypes: {}, +} satisfies Meta + +export default meta +type Story = StoryObj + +export const Page: Story = { + args: {}, +} diff --git a/src/pages/CreateLocalNodePage/CreateLocalNodePage.tsx b/src/pages/CreateLocalNodePage/CreateLocalNodePage.tsx new file mode 100644 index 00000000..dcc4b61f --- /dev/null +++ b/src/pages/CreateLocalNodePage/CreateLocalNodePage.tsx @@ -0,0 +1,76 @@ +import { useState } from 'react' +import { Button as StatusButton, Text, Avatar, Checkbox } from '@status-im/components' +import { Label, Separator, XStack, YStack } from 'tamagui' +import PageWrapperShadow from '../../components/PageWrappers/PageWrapperShadow' +import NimbusLogo from '../../components/Logos/NimbusLogo' +import TagContainer from '../../components/General/TagContainer' +import Titles from '../../components/General/Titles' +import NodeIcon from '../../components/Icons/NodeIcon' +import LabelInputField from '../../components/General/LabelInputField' +import ReactionIcon from '../../components/Icons/ReactionIcon' +import ColorPicker from '../../components/General/ColorPicker' + +const CreateLocalNodePage = () => { + const [autoConnectChecked, setAutoConnectChecked] = useState(false) + + return ( + +
    + + + + +
    + + + + + + + + + Device Avatar + + + + } backgroundColor={'white'} /> + + + + + Highlight Color + + + + + + + + Settings + + + setAutoConnectChecked(v)} + variant="outline" + /> + + + + + }>Continue +
    +
    +     + ) +} + +export default CreateLocalNodePage diff --git a/src/pages/LandingPage/LandingPage.css b/src/pages/LandingPage/LandingPage.css index 39012d51..e021e88e 100644 --- a/src/pages/LandingPage/LandingPage.css +++ b/src/pages/LandingPage/LandingPage.css @@ -1,7 +1,4 @@ -.landing-page header div img { - margin-right: 0.5rem; +.landing-page { + height: 100%; } -.landing-page .content .subtitle { - margin-bottom: 3em; -} \ No newline at end of file diff --git a/src/pages/LandingPage/LandingPage.tsx b/src/pages/LandingPage/LandingPage.tsx index 801a7006..733fe697 100644 --- a/src/pages/LandingPage/LandingPage.tsx +++ b/src/pages/LandingPage/LandingPage.tsx @@ -1,92 +1,29 @@ import PageWrapperShadow from '../../components/PageWrappers/PageWrapperShadow' import './LandingPage.css' import QuickStartBar from '../../components/General/QuickStartBar/QuickStartBar' -import NodesLogo from '../../components/Logos/NodesLogo' +import Titles from '../../components/General/Titles' +import { Button as StatusButton } from '@status-im/components' +import NodeIcon from '../../components/Icons/NodeIcon' +import NimbusLogo from '../../components/Logos/NimbusLogo' +import { XStack, YStack } from 'tamagui' function LandingPage() { return ( <>
    -
    - -
    -
    -
    - - - - - - - - - -
    -

    - Welcome, John. This is your complete access to a truly decentralized Web 3.0 -

    -

    - Status Nodes allows you to finally take control and ownership of the - services you wish to run in a completely trustless and decentralized manner. -

    - -
    + + + + + + + }>Get Started + +
    diff --git a/yarn.lock b/yarn.lock index 22b8040f..0d82d177 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2167,6 +2167,15 @@ __metadata: languageName: node linkType: hard +"@icons/material@npm:^0.2.4": + version: 0.2.4 + resolution: "@icons/material@npm:0.2.4" + peerDependencies: + react: "*" + checksum: 24baa360cb83f7e1a9e6784ac11185d57eb895b0efd3070ec915693378330f35ff9feb248f650b9649fa3e1045601286585dc05795a4c734d4849b33900351ee + languageName: node + linkType: hard + "@isaacs/cliui@npm:^8.0.2": version: 8.0.2 resolution: "@isaacs/cliui@npm:8.0.2" @@ -7072,6 +7081,16 @@ __metadata: languageName: node linkType: hard +"@types/react-color@npm:^3.0.6": + version: 3.0.6 + resolution: "@types/react-color@npm:3.0.6" + dependencies: + "@types/react": "*" + "@types/reactcss": "*" + checksum: 8cd881d6eb725190be942c1d71f7917d3dd1b418417740f64fa6c03ae3ba16cb91d07c4b3b348cf5bae20071c8ca5d4aaf514c9a5318077d5e50bd782a5e8da2 + languageName: node + linkType: hard + "@types/react-dom@npm:18": version: 18.2.7 resolution: "@types/react-dom@npm:18.2.7" @@ -7101,6 +7120,15 @@ __metadata: languageName: node linkType: hard +"@types/reactcss@npm:*": + version: 1.2.6 + resolution: "@types/reactcss@npm:1.2.6" + dependencies: + "@types/react": "*" + checksum: f4711d707a1af653178c8941080e989a945feb0c529d848fed36687ee5e8a462cda183383caadf8848497b5c03bec16e6cdf22fc70462913d8d706cabb597130 + languageName: node + linkType: hard + "@types/resolve@npm:1.20.2": version: 1.20.2 resolution: "@types/resolve@npm:1.20.2" @@ -12882,6 +12910,13 @@ __metadata: languageName: node linkType: hard +"lodash-es@npm:^4.17.15": + version: 4.17.21 + resolution: "lodash-es@npm:4.17.21" + checksum: 05cbffad6e2adbb331a4e16fbd826e7faee403a1a04873b82b42c0f22090f280839f85b95393f487c1303c8a3d2a010048bf06151a6cbe03eee4d388fb0a12d2 + languageName: node + linkType: hard + "lodash.debounce@npm:^4.0.8": version: 4.0.8 resolution: "lodash.debounce@npm:4.0.8" @@ -12910,7 +12945,7 @@ __metadata: languageName: node linkType: hard -"lodash@npm:^4.17.15, lodash@npm:^4.17.21": +"lodash@npm:^4.0.1, lodash@npm:^4.17.15, lodash@npm:^4.17.21": version: 4.17.21 resolution: "lodash@npm:4.17.21" checksum: eb835a2e51d381e561e508ce932ea50a8e5a68f4ebdd771ea240d3048244a8d13658acbd502cd4829768c56f2e16bdd4340b9ea141297d472517b83868e677f7 @@ -13086,6 +13121,13 @@ __metadata: languageName: node linkType: hard +"material-colors@npm:^1.2.1": + version: 1.2.6 + resolution: "material-colors@npm:1.2.6" + checksum: 72d005ccccb82bab68eef3cd757e802668634fc86976dedb9fc564ce994f2d3258273766b7efecb7404a0031969e2d72201a1b74169763f0a53c0dd8d649209f + languageName: node + linkType: hard + "mdast-util-definitions@npm:^4.0.0": version: 4.0.0 resolution: "mdast-util-definitions@npm:4.0.0" @@ -13780,6 +13822,7 @@ __metadata: "@tamagui/react-17-patch": 1.36.4 "@tamagui/vite-plugin": 1.36.4 "@types/react": 18 + "@types/react-color": ^3.0.6 "@types/react-dom": 18 "@typescript-eslint/eslint-plugin": ^6.0.0 "@typescript-eslint/parser": ^6.0.0 @@ -13791,6 +13834,7 @@ __metadata: expo-modules-core: ^1.5.9 prettier: ^3.0.1 react: 18 + react-color: ^2.19.3 react-dom: 18 react-native: ^0.72.3 react-native-svg: ^13.10.0 @@ -14649,7 +14693,7 @@ __metadata: languageName: node linkType: hard -"prop-types@npm:*, prop-types@npm:^15.7.2": +"prop-types@npm:*, prop-types@npm:^15.5.10, prop-types@npm:^15.7.2": version: 15.8.1 resolution: "prop-types@npm:15.8.1" dependencies: @@ -14793,6 +14837,23 @@ __metadata: languageName: node linkType: hard +"react-color@npm:^2.19.3": + version: 2.19.3 + resolution: "react-color@npm:2.19.3" + dependencies: + "@icons/material": ^0.2.4 + lodash: ^4.17.15 + lodash-es: ^4.17.15 + material-colors: ^1.2.1 + prop-types: ^15.5.10 + reactcss: ^1.2.0 + tinycolor2: ^1.4.1 + peerDependencies: + react: "*" + checksum: 40b49e1aa2ab27a099cc37a3fa2d5bb906b8def4dbe2d922c0e42365e386d82b03f9b06a2b29a44a51f1e114cef72e61c0ba0740581a128d951936ea4617429b + languageName: node + linkType: hard + "react-colorful@npm:^5.1.2": version: 5.6.1 resolution: "react-colorful@npm:5.6.1" @@ -15205,6 +15266,15 @@ __metadata: languageName: node linkType: hard +"reactcss@npm:^1.2.0": + version: 1.2.3 + resolution: "reactcss@npm:1.2.3" + dependencies: + lodash: ^4.0.1 + checksum: c53e386a0881f1477e1cff661f6a6ad4c662230941f3827862193ac30f9b75cdf7bc7b4c7e5ca543d3e4e80fee1a3e9fa0056c206b1c0423726c41773ab3fe45 + languageName: node + linkType: hard + "read-pkg-up@npm:^7.0.1": version: 7.0.1 resolution: "read-pkg-up@npm:7.0.1" @@ -16519,6 +16589,13 @@ __metadata: languageName: node linkType: hard +"tinycolor2@npm:^1.4.1": + version: 1.6.0 + resolution: "tinycolor2@npm:1.6.0" + checksum: 6df4d07fceeedc0a878d7bac47e2cd47c1ceeb1078340a9eb8a295bc0651e17c750f73d47b3028d829f30b85c15e0572c0fd4142083e4c21a30a597e47f47230 + languageName: node + linkType: hard + "tmpl@npm:1.0.5": version: 1.0.5 resolution: "tmpl@npm:1.0.5"