{"_id":"@avicennatechnology/next-activity-indicator","_rev":"3-eb7abc06d3a2c893fc6259caed25f1f8","name":"@avicennatechnology/next-activity-indicator","dist-tags":{"latest":"0.6.0"},"versions":{"0.1.0":{"name":"@avicennatechnology/next-activity-indicator","version":"0.1.0","keywords":["nextjs","next.js","react","activity-indicator","loading","spinner","typescript","component"],"author":{"name":"Avicenna Technology"},"license":"MIT","_id":"@avicennatechnology/next-activity-indicator@0.1.0","maintainers":[{"name":"avicennateknoloji","email":"yldrmw96@gmail.com"}],"homepage":"https://github.com/avicennatechnology/next-activity-indicator#readme","bugs":{"url":"https://github.com/avicennatechnology/next-activity-indicator/issues"},"dist":{"shasum":"1eb97b1078d4f2eac20e3a62a5261172792c61ce","tarball":"https://registry.npmjs.org/@avicennatechnology/next-activity-indicator/-/next-activity-indicator-0.1.0.tgz","fileCount":10,"integrity":"sha512-Lb6M6fdZNJ7BnzUEAPppp862d492vQmOFDLSDIZNCtiZhnAZeNwo1vMJovuIfmfP07aFLGATr98S1k9EPnbATw==","signatures":[{"sig":"MEUCIQDNTq58bxwumE7vnuKoc0MrN4kRYMMcKdPq96xOYnO+jQIgKe2Kqqy4qH5WrZosyCBbUKBG11uQmiOvmH4qVxXOqUQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":29067},"main":"dist/index.js","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"}},"gitHead":"9fc761985967fd02ef6a45a2fbaefd027698af03","scripts":{"build":"tsup","prepublishOnly":"npm run build"},"_npmUser":{"name":"avicennateknoloji","actor":{"name":"avicennateknoloji","type":"user","email":"yldrmw96@gmail.com"},"email":"yldrmw96@gmail.com"},"repository":{"url":"git+https://github.com/avicennatechnology/next-activity-indicator.git","type":"git"},"_npmVersion":"11.4.2","description":"Next.js için modern ve özelleştirilebilir aktivite göstergesi (loading spinner) bileşeni","directories":{},"_nodeVersion":"22.15.0","_hasShrinkwrap":false,"devDependencies":{"next":"^14.0.0","tsup":"^8.5.0","react":"^18.0.0","typescript":"^5.8.3","@types/react":"^18.0.0"},"peerDependencies":{"next":">=12.0.0","react":">=17.0.0"},"_npmOperationalInternal":{"tmp":"tmp/next-activity-indicator_0.1.0_1751833264503_0.3067525721178055","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@avicennatechnology/next-activity-indicator","version":"0.2.0","keywords":["nextjs","next.js","react","activity-indicator","loading","spinner","typescript","component"],"author":{"name":"Avicenna Technology"},"license":"MIT","_id":"@avicennatechnology/next-activity-indicator@0.2.0","maintainers":[{"name":"avicennateknoloji","email":"yldrmw96@gmail.com"}],"homepage":"https://github.com/avicennatechnology/next-activity-indicator#readme","bugs":{"url":"https://github.com/avicennatechnology/next-activity-indicator/issues"},"dist":{"shasum":"f4df2a39162aba9dcaf3524ab9e436077dcda20f","tarball":"https://registry.npmjs.org/@avicennatechnology/next-activity-indicator/-/next-activity-indicator-0.2.0.tgz","fileCount":10,"integrity":"sha512-bW8kp8BimRTDyv3Z/uvOgtr7BYxOQMxAZartZD8DVzd5ndM6egLKGqPIzN67alMeVqj2URQO4tvEO3wnep+K4w==","signatures":[{"sig":"MEUCIQDadpAcGeiY8aVuQ1LCJVS1/7pzi8SnBfz/V/VqKz02rwIgXON0rRvwNJ0GJ3/WaeDJ75YG4xWDn9MOx0vqTiIzAGA=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":22685},"main":"dist/index.js","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"}},"gitHead":"16c6c83764185d795e9fdac2d81049fd7cc7e996","scripts":{"build":"tsup","prepublishOnly":"npm run build"},"_npmUser":{"name":"avicennateknoloji","actor":{"name":"avicennateknoloji","type":"user","email":"yldrmw96@gmail.com"},"email":"yldrmw96@gmail.com"},"repository":{"url":"git+https://github.com/avicennatechnology/next-activity-indicator.git","type":"git"},"_npmVersion":"11.4.2","description":"Next.js için modern ve özelleştirilebilir aktivite göstergesi (loading spinner) bileşeni","directories":{},"_nodeVersion":"22.15.0","dependencies":{"classnames":"^2.5.1"},"_hasShrinkwrap":false,"devDependencies":{"next":"^14.0.0","tsup":"^8.5.0","react":"^18.0.0","typescript":"^5.8.3","@types/react":"^18.0.0"},"peerDependencies":{"next":">=12.0.0","react":">=17.0.0"},"_npmOperationalInternal":{"tmp":"tmp/next-activity-indicator_0.2.0_1751834148118_0.28295386080410734","host":"s3://npm-registry-packages-npm-production"}},"0.6.0":{"name":"@avicennatechnology/next-activity-indicator","version":"0.6.0","description":"Next.js için modern ve özelleştirilebilir aktivite göstergesi (loading spinner) bileşeni","main":"dist/index.js","module":"./dist/index.js","types":"./dist/index.d.ts","type":"module","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"scripts":{"build":"tsup","prepublishOnly":"npm run build"},"keywords":["nextjs","next.js","react","activity-indicator","loading","spinner","typescript","component"],"author":{"name":"Avicenna Technology"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/avicennatechnology/next-activity-indicator.git"},"homepage":"https://github.com/avicennatechnology/next-activity-indicator#readme","bugs":{"url":"https://github.com/avicennatechnology/next-activity-indicator/issues"},"peerDependencies":{"next":">=12.0.0","react":">=17.0.0"},"devDependencies":{"@types/react":"^18.0.0","next":"^14.0.0","react":"^18.0.0","tsup":"^8.5.0","typescript":"^5.8.3"},"dependencies":{"@tailwindcss/postcss":"^4.1.11","classnames":"^2.5.1","tailwindcss":"^4.1.11"},"_id":"@avicennatechnology/next-activity-indicator@0.6.0","gitHead":"16c6c83764185d795e9fdac2d81049fd7cc7e996","_nodeVersion":"22.15.0","_npmVersion":"11.4.2","dist":{"integrity":"sha512-8aYO+/jPqpW0jNhiAJuQhRCLS0QqZTJdct1sXaYa5KLzlhkra5wAiGihdbnbR3G9P4xmvjOa/hj52o8J1zUSaQ==","shasum":"cc4c9a18fe490f89c1a87a574083f03932d9edd4","tarball":"https://registry.npmjs.org/@avicennatechnology/next-activity-indicator/-/next-activity-indicator-0.6.0.tgz","fileCount":10,"unpackedSize":25694,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIE9S7YvQcOFW5q69+7BZcuwoNscy/50OmQvhxX/RvaWtAiBjqb3Dm5l7tyxv0/p/K1t9xdEnRfQ3nZ8s3jYkO5qQ8A=="}]},"_npmUser":{"name":"avicennateknoloji","email":"yldrmw96@gmail.com","actor":{"name":"avicennateknoloji","email":"yldrmw96@gmail.com","type":"user"}},"directories":{},"maintainers":[{"name":"avicennateknoloji","email":"yldrmw96@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/next-activity-indicator_0.6.0_1751834776825_0.4481831850074993"},"_hasShrinkwrap":false}},"time":{"created":"2025-07-06T20:21:04.409Z","modified":"2025-07-06T20:46:17.197Z","0.1.0":"2025-07-06T20:21:04.684Z","0.2.0":"2025-07-06T20:35:48.296Z","0.6.0":"2025-07-06T20:46:17.002Z"},"bugs":{"url":"https://github.com/avicennatechnology/next-activity-indicator/issues"},"author":{"name":"Avicenna Technology"},"license":"MIT","homepage":"https://github.com/avicennatechnology/next-activity-indicator#readme","keywords":["nextjs","next.js","react","activity-indicator","loading","spinner","typescript","component"],"repository":{"type":"git","url":"git+https://github.com/avicennatechnology/next-activity-indicator.git"},"description":"Next.js için modern ve özelleştirilebilir aktivite göstergesi (loading spinner) bileşeni","maintainers":[{"name":"avicennateknoloji","email":"yldrmw96@gmail.com"}],"readme":"# Next.js Activity Indicator\n\nNext.js projelerinde kullanılmak üzere tasarlanmış modern ve özelleştirilebilir aktivite göstergesi (loading spinner) bileşeni.\n\n## ✨ Özellikler\n\n- 🎨 **Özelleştirilebilir** - Boyut ve renk seçenekleri\n- 🔧 **TypeScript Desteği** - Tam tip güvenliği\n- 🎯 **Next.js Optimized** - Next.js projelerine özel optimize edilmiş\n- 📱 **Responsive** - Tüm cihazlarda mükemmel görünüm\n- 🎭 **CSS Modules** - Stil çakışmalarını önler\n- ⚡ **Hafif** - Minimal dosya boyutu\n\n## 🚀 Kurulum\n\n```bash\nnpm install @avicennatechnology/next-activity-indicator\n```\n\n```bash\nyarn add @avicennatechnology/next-activity-indicator\n```\n\n```bash\npnpm add @avicennatechnology/next-activity-indicator\n```\n\n## 📖 Kullanım\n\n### Temel Kullanım\n\n```jsx\nimport { ActivityIndicator } from '@avicennatechnology/next-activity-indicator';\n\nfunction MyComponent() {\n return (\n
\n \n
\n );\n}\n```\n\n### Boyut Seçenekleri\n\n```jsx\nimport { ActivityIndicator } from '@avicennatechnology/next-activity-indicator';\n\nfunction MyComponent() {\n return (\n
\n \n \n \n
\n );\n}\n```\n\n### Renk Özelleştirme\n\n```jsx\nimport { ActivityIndicator } from '@avicennatechnology/next-activity-indicator';\n\nfunction MyComponent() {\n return (\n
\n \n \n \n
\n );\n}\n```\n\n### Loading State ile Kullanım\n\n```jsx\nimport { ActivityIndicator } from '@avicennatechnology/next-activity-indicator';\nimport { useState, useEffect } from 'react';\n\nfunction DataComponent() {\n const [loading, setLoading] = useState(true);\n const [data, setData] = useState(null);\n\n useEffect(() => {\n fetchData().then(result => {\n setData(result);\n setLoading(false);\n });\n }, []);\n\n if (loading) {\n return (\n
\n \n
\n );\n }\n\n return
{/* Veri gösterimi */}
;\n}\n```\n\n### Next.js Sayfa Geçişleri\n\n```jsx\nimport { ActivityIndicator } from '@avicennatechnology/next-activity-indicator';\nimport { useRouter } from 'next/router';\nimport { useEffect, useState } from 'react';\n\nfunction Layout({ children }) {\n const router = useRouter();\n const [loading, setLoading] = useState(false);\n\n useEffect(() => {\n const handleStart = () => setLoading(true);\n const handleComplete = () => setLoading(false);\n\n router.events.on('routeChangeStart', handleStart);\n router.events.on('routeChangeComplete', handleComplete);\n router.events.on('routeChangeError', handleComplete);\n\n return () => {\n router.events.off('routeChangeStart', handleStart);\n router.events.off('routeChangeComplete', handleComplete);\n router.events.off('routeChangeError', handleComplete);\n };\n }, [router]);\n\n return (\n
\n {loading && (\n
\n \n
\n )}\n {children}\n
\n );\n}\n```\n\n### API Çağrıları ile Kullanım\n\n```jsx\nimport { ActivityIndicator } from '@avicennatechnology/next-activity-indicator';\nimport { useState } from 'react';\n\nfunction LoginForm() {\n const [isSubmitting, setIsSubmitting] = useState(false);\n\n const handleSubmit = async (e) => {\n e.preventDefault();\n setIsSubmitting(true);\n \n try {\n await loginUser(formData);\n // Başarılı giriş\n } catch (error) {\n // Hata yönetimi\n } finally {\n setIsSubmitting(false);\n }\n };\n\n return (\n
\n {/* Form alanları */}\n \n
\n );\n}\n```\n\n## 🎛️ API Referansı\n\n### ActivityIndicator Props\n\n| Prop | Tip | Varsayılan | Açıklama |\n|------|-----|-----------|----------|\n| `size` | `\"small\" \\| \"medium\" \\| \"large\"` | `\"medium\"` | Spinner'ın boyutu |\n| `color` | `string` | `undefined` | Spinner'ın rengi (CSS renk değeri) |\n| `className` | `string` | `undefined` | Ek CSS sınıfı |\n| `style` | `React.CSSProperties` | `undefined` | Inline stil |\n| `...props` | `HTMLAttributes` | - | Tüm div özellikleri |\n\n### Boyut Seçenekleri\n\n- **small**: 0.8rem (12.8px)\n- **medium**: 1.2rem (19.2px) \n- **large**: 1.8rem (28.8px)\n\n## 🎨 Özelleştirme\n\n### CSS Değişkenleri\n\nBileşen aşağıdaki CSS değişkenlerini kullanır:\n\n```css\n.activity-indicator {\n --spinner-color: #71717a; /* Varsayılan renk */\n --spinner-size: 1.2rem; /* Varsayılan boyut */\n}\n```\n\n### Özel Stiller\n\n```jsx\n\n```\n\n## 💡 Örnekler\n\n### Veri Yükleme\n\n```jsx\nfunction ProductList() {\n const [products, setProducts] = useState([]);\n const [loading, setLoading] = useState(true);\n\n useEffect(() => {\n fetchProducts()\n .then(setProducts)\n .finally(() => setLoading(false));\n }, []);\n\n return (\n
\n {loading ? (\n
\n \n

Ürünler yükleniyor...

\n
\n ) : (\n
\n {products.map(product => (\n \n ))}\n
\n )}\n
\n );\n}\n```\n\n### Form Gönderimi\n\n```jsx\nfunction ContactForm() {\n const [sending, setSending] = useState(false);\n const [message, setMessage] = useState('');\n\n const handleSubmit = async (e) => {\n e.preventDefault();\n setSending(true);\n \n try {\n await sendMessage(message);\n setMessage('');\n alert('Mesaj gönderildi!');\n } catch (error) {\n alert('Hata oluştu!');\n } finally {\n setSending(false);\n }\n };\n\n return (\n
\n