drug-label
Vue component to provide UI drug labels as <drug-label>
tags.
Usage demo on Codepen
docs a bit of a WIP
Parameters
type
Default: null (displayed as others
/ white label)
Determines the type of drug and therefore the color of the label. Possible values are:
Parameter | Type | Example | Colour |
---|
induction-agent | Induction agents | thiopental | yellow |
hypnotic | Sedative/hypnotics | midazolam | orange |
hypnotic-antagonist | Sedative antagonist | flumazenil | orange and white stripes |
neuromuscular-blocker | Neuromuscular blockers | atracurium | fluorescent red |
depolarizing-neuromuscular-blocker | Depolarising neuromuscular blockers | suxamethonium | fluorescent red with black top |
neuromuscular-blocker-antagonist | Neuromuscular blocker reversal agents | neostigmine | fluorescent red and white stripes |
opioid | Opioids | fentanyl | blue |
opioid-antagonist | Opioid antagonists | naloxone | blue and white stripes |
vasopressor | Vasopressors | ephedrine | violet |
adrenaline | Adrenaline | adrenaline | violet with black top |
hypotensive | Hypotensive agents | labetalol | violet and white stripes |
local-anaesthetic | Local anaesthetics | bupivacaine | grey |
anticholinergic | Anticholinergics | atropine | green |
antiemetic | Antiemetics | cyclizine | salmon |
others | others drugs | paracetamol | white |
Example:
<drug-label type="opioid" />
name
Default: null (displayed as "Drug")
The name of the drug to be displayed on the top portion of the label. The initial letter is capitalized automatically.
Example:
<drug-label name="ketamine" />
concentration
Default: null (displayed as ".............")
The concentration of the drug to be displayed on the lower portion of the label suffixed with the units.
units
Default: null (displayed as "mg/ml")
size
Default: null (displayed normal sized)
Determines the size of the label. Possible values are:
Parameter | Size | font-size |
---|
normal | Normal | 1.1rem |
small | Small | 0.8rem |
xsmall | Extra small | 0.6rem |
bordered
Default: null (displayed as false - no border)
value | border |
---|
true | yes |
false | none |
scaled
Default: null (displayed as false)
value | width |
---|
true | 16 rem (size="normal") 12 rem (size="small") 10 rem (size="xsmall") |
false | as parent element |
Example:
<drug-label
name="Midazolam"
type="hypnotic"
scaled
/>
<drug-label
name="Midazolam"
type="hypnotic"
scaled
size="small"
/>
<drug-label
name="Midazolam"
type="hypnotic"
scaled
size="xsmall"
/>