இணைப்பு ​

எழுத்தைத் தேர்ந்தெடுத்து அதற்கு முகவரியை இணைக்கவும். எழுத்தைத் தேர்ந்தெடுக்காமல் முகவரியை உள்ளிட்டால் முகவரியே இணைப்பு உரையாகச் சேரும்; http:// அல்லது https:// முகவரியை உள்ளிட்டு Space அல்லது Enter அழுத்தினாலும் இணைப்பாக மாறும்.

இணைப்பில் http:, https:, மேலும் . அல்லது / இல் தொடங்கும் அதே தளப் பாதைகள் மட்டுமே சேமிக்கப்படும். javascript: அல்லது //example.com போல தோற்றம் தெளிவாக அறிய முடியாத முகவரிகள் மறுக்கப்படும். பதிவேற்றம் உருவாக்கிய இணைப்பு கோப்புத் தகவலையும் சேமிப்பதால், சாதாரண இணைப்புபோல் நேரடியாக உருவாக்க முடியாது.

npm install nabi-note

import {
  createLocale, createNabiWith, mountSurface, mountToolbar,
  mountContextToolbar, mountHints, watchSettle, subscriptWing, linkWing,
  footnoteWing, mountViewTools,
} from 'nabi-note'

const selected = [
  subscriptWing,
  linkWing,
  footnoteWing,
]
const locale = createLocale('ta')
const { nabi, registry } = createNabiWith(selected, { locale })

const root = document.querySelector('.nabi')!
const content = document.querySelector('.nabi-content')!

// The locale also sets the direction — Arabic and Urdu run right to left
mountSurface({ nabi, registry, root: content, locale })

const settle = watchSettle(document, { surface: content })
const shared = { nabi, registry, surface: content, settle, locale }
const toolbar = mountToolbar({ ...shared, root: document.querySelector('#toolbar')! })
const context = mountContextToolbar({ ...shared, root: document.querySelector('#context')! })
mountHints({ toolbar, context, root, surface: content })
// The preview and fullscreen buttons — they stand their own box at the end of the row
mountViewTools({ ...shared, root, container: document.querySelector('#toolbar')! })

// on every change — hook up your own code here
// nabi.onChange(() => user_callback(nabi.getHtml()))

// Call from your language selector. Content and editing history stay intact.
// locale.setLocale('ko')

const selected = wings().use('a').build()

URL ஒட்டுதல் ​

முன்னும் பின்னும் உள்ள வெற்று எழுத்துகளை நீக்கிய பிறகு, ஒட்டப்படும் முழு உள்ளடக்கமும் செல்லுபடியான http:// அல்லது https:// URL ஆக இருந்தால், அது உடனடியாக இணைப்பாகச் செருகப்படும். வாக்கியங்களுக்குள் உள்ள URL, பல URL உள்ள உரை, சார்புப் பாதைகள் ஆகியவை ஏற்கெனவே உள்ள ஒட்டுதல் முறையில் கையாளப்படும். குறியீட்டுத் தொகுதிகளிலும் இணைப்பு wing இல்லாத திருத்திகளிலும் உள்ளடக்கம் உரையாகவே இருக்கும். அசல் வடிவமைப்பைப் பாதுகாக்க, திருத்தியிலிருந்து நகலெடுக்கப்பட்ட செல்லுபடியான உள் clipboard தரவுக்கு முன்னுரிமை அளிக்கப்படும்.

இணைப்பில் காட்டப்படும் உரையைத் தீர்மானிக்க mountSurface() இல் உள்ள onPasteUrl callback ஐப் பயன்படுத்தவும்.

const surface = mountSurface({
  nabi,
  registry,
  root: document.querySelector<HTMLElement>('#editor')!,
  onPasteUrl(url, isSameOrigin, path) {
    if (isSameOrigin && path === '/guide') return 'NABI NOTE'
    return url
  },
})

திருப்பித் தரப்படும் சரத்தில் வெற்று எழுத்துகள் தவிர வேறு எழுத்துகள் இருந்தால், அது காட்டப்படும் உரையாகும். callback இல்லாவிட்டால், வெற்று மதிப்பு அல்லது சரம் அல்லாத மதிப்பைத் திருப்பித் தந்தால், அல்லது பிழை ஏற்பட்டால், ஒட்டிய URL தொடர்ந்து காட்டப்படும். திருப்பித் தரப்படும் சரங்கள் ஒருபோதும் HTML ஆகப் பொருள்கொள்ளப்படாது; அவை இணைப்பின் முகவரியையும் மாற்றாது.

callback, async செயல்பாடுகளையும் Promise களையும் ஆதரிக்கிறது. பதிலுக்காகக் காத்திருக்கும்போதே URL இணைப்பு உடனடியாகச் செருகப்படும்; பின்னர் செல்லுபடியான முடிவு வந்தால், அந்த இணைப்பின் காட்டப்படும் உரை மட்டும் மாறும். இடையில் இணைப்பு திருத்தப்பட்டிருந்தால் அல்லது நீக்கப்பட்டிருந்தால், புதிய ஆவணம் ஏற்றப்பட்டிருந்தால், அல்லது surface அகற்றப்பட்டிருந்தால், தாமதமாக வரும் முடிவு புறக்கணிக்கப்படும்.

CSS பாணிகள் ​

சாதாரண இணைப்பை .nabi-content a மூலமும், இணைப்பு கோப்பை .nabi-content a[data-nabi-file] மூலமும் தனித்தனியாக வடிவமைக்கலாம்.

.article-body a:not([data-nabi-file]) {
  color: var(--nabi-accent);
  text-decoration-thickness: .08em;
  text-underline-offset: .16em;
}

.article-body a[data-nabi-file] {
  display: inline-flex;
  gap: .35em;
  padding: .25em .55em;
  background: var(--nabi-soft);
}

இணைப்பு கோப்பின் ::before, ::after கோப்பு சின்னம் மற்றும் நீட்டிப்பைக் காட்டப் பயன்படுவதால், அவற்றின் content ஐ மாற்றாமலோ நீக்காமலோ இருப்பது நல்லது.