@helsenorge/designsystem-react 3.1.5 → 4.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +555 -593
- package/Checkbox.js +1 -1
- package/Checkbox.js.map +1 -1
- package/Input.js +1 -1
- package/Input.js.map +1 -1
- package/Label.js +2 -0
- package/Label.js.map +1 -0
- package/Panel.js +1 -1
- package/Panel.js.map +1 -1
- package/README.md +0 -8
- package/RadioButton.js +1 -1
- package/RadioButton.js.map +1 -1
- package/Select.js +1 -1
- package/Select.js.map +1 -1
- package/StatusDot.js +1 -1
- package/StatusDot.js.map +1 -1
- package/Table.js +2 -0
- package/Table.js.map +1 -0
- package/TableBody.js +1 -1
- package/TableBody.js.map +1 -1
- package/TableCell.js +1 -1
- package/TableCell.js.map +1 -1
- package/TableExpandedRow.js +1 -1
- package/TableExpandedRow.js.map +1 -1
- package/TableExpanderCell.js +1 -1
- package/TableExpanderCell.js.map +1 -1
- package/TableHead.js +1 -1
- package/TableHead.js.map +1 -1
- package/TableHeadCell.js +1 -1
- package/TableHeadCell.js.map +1 -1
- package/TableRow.js +1 -1
- package/TableRow.js.map +1 -1
- package/Textarea.js +1 -1
- package/Textarea.js.map +1 -1
- package/components/AnchorLink/styles.module.scss +1 -1
- package/components/Button/componentdata.json +1 -1
- package/components/Checkbox/Checkbox.d.ts +3 -3
- package/components/Checkbox/Checkbox.d.ts.map +1 -1
- package/components/Checkbox/componentdata.json +1 -1
- package/components/Checkbox/index.js +1 -1
- package/components/Checkbox/styles.module.scss +225 -62
- package/components/Checkbox/styles.module.scss.d.ts +25 -3
- package/components/Dropdown/componentdata.json +1 -1
- package/components/ErrorWrapper/componentdata.json +1 -1
- package/components/Expander/componentdata.json +1 -1
- package/components/FormExample/FormExample.d.ts.map +1 -1
- package/components/FormExample/index.js +3 -3
- package/components/FormExample/index.js.map +1 -1
- package/components/FormGroup/index.js +1 -1
- package/components/HelpBubbleExample/componentdata.json +1 -1
- package/components/HighlightBox/componentdata.json +1 -1
- package/components/Icons/ActiveMonitoring.js.map +1 -1
- package/components/Icons/AdditionalIconInformation.js +11 -0
- package/components/Icons/AlarmClock.js.map +1 -1
- package/components/Icons/AlertSignFill.js.map +1 -1
- package/components/Icons/AlertSignStroke.js.map +1 -1
- package/components/Icons/Amputation.js.map +1 -1
- package/components/Icons/Anxiety.js.map +1 -1
- package/components/Icons/Apple.js.map +1 -1
- package/components/Icons/ArmFlexing.js.map +1 -1
- package/components/Icons/ArrowDown.js.map +1 -1
- package/components/Icons/ArrowLeft.js.map +1 -1
- package/components/Icons/ArrowUp.js.map +1 -1
- package/components/Icons/ArrowUpRight.js.map +1 -1
- package/components/Icons/Attachment.js.map +1 -1
- package/components/Icons/Atv.js.map +1 -1
- package/components/Icons/Avatar.js.map +1 -1
- package/components/Icons/AwakePersonOnPillow.js.map +1 -1
- package/components/Icons/Baby.js.map +1 -1
- package/components/Icons/BandAid.js.map +1 -1
- package/components/Icons/BeerAndPills.js.map +1 -1
- package/components/Icons/Bike.js.map +1 -1
- package/components/Icons/BirthControl.js.map +1 -1
- package/components/Icons/Boat.js.map +1 -1
- package/components/Icons/Body.js.map +1 -1
- package/components/Icons/Brain.js.map +1 -1
- package/components/Icons/BreastReconstruction.js.map +1 -1
- package/components/Icons/BrokenHeart.js.map +1 -1
- package/components/Icons/Bus.js.map +1 -1
- package/components/Icons/Calendar.js.map +1 -1
- package/components/Icons/CalendarChange.js.map +1 -1
- package/components/Icons/CalendarCheck.js.map +1 -1
- package/components/Icons/CalendarEvent.js.map +1 -1
- package/components/Icons/Cancer.js.map +1 -1
- package/components/Icons/Candle.d.ts +5 -0
- package/components/Icons/Candle.d.ts.map +1 -0
- package/components/Icons/Candle.js +2 -0
- package/components/Icons/Candle.js.map +1 -0
- package/components/Icons/Car.js.map +1 -1
- package/components/Icons/Change.js.map +1 -1
- package/components/Icons/Check.js.map +1 -1
- package/components/Icons/CheckOutline.js.map +1 -1
- package/components/Icons/Chest.js.map +1 -1
- package/components/Icons/ChevronDown.js.map +1 -1
- package/components/Icons/ChevronLeft.js.map +1 -1
- package/components/Icons/ChevronRight.js.map +1 -1
- package/components/Icons/ChevronUp.js.map +1 -1
- package/components/Icons/ChevronsDown.js.map +1 -1
- package/components/Icons/ChevronsUp.js.map +1 -1
- package/components/Icons/ChildPlaying.js.map +1 -1
- package/components/Icons/Cigarette.js.map +1 -1
- package/components/Icons/Coins.js.map +1 -1
- package/components/Icons/Contacts.js.map +1 -1
- package/components/Icons/Copy.js.map +1 -1
- package/components/Icons/CoronaCertificate.js.map +1 -1
- package/components/Icons/Coronavirus.js.map +1 -1
- package/components/Icons/Cough.js.map +1 -1
- package/components/Icons/CriticalHealthInfo.js.map +1 -1
- package/components/Icons/Cross.js.map +1 -1
- package/components/Icons/DataExchange.js.map +1 -1
- package/components/Icons/DataReceived.js.map +1 -1
- package/components/Icons/Depression.js.map +1 -1
- package/components/Icons/DigestiveSystem.js.map +1 -1
- package/components/Icons/Dizzy.js.map +1 -1
- package/components/Icons/Documents.js.map +1 -1
- package/components/Icons/Dog.js.map +1 -1
- package/components/Icons/DonorCard.js.map +1 -1
- package/components/Icons/Draft.js.map +1 -1
- package/components/Icons/EChat.js.map +1 -1
- package/components/Icons/ElderlyPerson.js.map +1 -1
- package/components/Icons/Embolization.js.map +1 -1
- package/components/Icons/EmoticonAnnoyed.js.map +1 -1
- package/components/Icons/EmoticonDelighted.js.map +1 -1
- package/components/Icons/EmoticonDisappointed.js.map +1 -1
- package/components/Icons/EmoticonHappy.js.map +1 -1
- package/components/Icons/EmoticonMeh.js.map +1 -1
- package/components/Icons/EnterFullScreen.js.map +1 -1
- package/components/Icons/Epilepsy.js.map +1 -1
- package/components/Icons/Eraser.js.map +1 -1
- package/components/Icons/ErrorSignFill.js.map +1 -1
- package/components/Icons/ErrorSignStroke.js.map +1 -1
- package/components/Icons/EuropeanHealthCard.js.map +1 -1
- package/components/Icons/ExitFullScreen.js.map +1 -1
- package/components/Icons/Eye.js.map +1 -1
- package/components/Icons/Facebook.js.map +1 -1
- package/components/Icons/FallingLeaf.d.ts +5 -0
- package/components/Icons/FallingLeaf.d.ts.map +1 -0
- package/components/Icons/FallingLeaf.js +2 -0
- package/components/Icons/FallingLeaf.js.map +1 -0
- package/components/Icons/Female.js.map +1 -1
- package/components/Icons/FemaleDoctor.js.map +1 -1
- package/components/Icons/Ferry.js.map +1 -1
- package/components/Icons/File.js.map +1 -1
- package/components/Icons/Filter.js.map +1 -1
- package/components/Icons/FingerBleed.js.map +1 -1
- package/components/Icons/FirstAidKit.js.map +1 -1
- package/components/Icons/FloppyDisk.js.map +1 -1
- package/components/Icons/Football.js.map +1 -1
- package/components/Icons/Form.js.map +1 -1
- package/components/Icons/Forward.js.map +1 -1
- package/components/Icons/Garden.js.map +1 -1
- package/components/Icons/GasCan.js.map +1 -1
- package/components/Icons/GenderIdentity.js.map +1 -1
- package/components/Icons/Globe.js.map +1 -1
- package/components/Icons/Graph.d.ts +5 -0
- package/components/Icons/Graph.d.ts.map +1 -0
- package/components/Icons/Graph.js +2 -0
- package/components/Icons/Graph.js.map +1 -0
- package/components/Icons/GroupTwins.d.ts +5 -0
- package/components/Icons/GroupTwins.d.ts.map +1 -0
- package/components/Icons/GroupTwins.js +2 -0
- package/components/Icons/GroupTwins.js.map +1 -0
- package/components/Icons/HandWithDisease.js.map +1 -1
- package/components/Icons/HandsAndHeart.d.ts +5 -0
- package/components/Icons/HandsAndHeart.d.ts.map +1 -0
- package/components/Icons/HandsAndHeart.js +2 -0
- package/components/Icons/HandsAndHeart.js.map +1 -0
- package/components/Icons/HealthClinic.js.map +1 -1
- package/components/Icons/HealthWarning.js.map +1 -1
- package/components/Icons/HealthcarePerson.d.ts +5 -0
- package/components/Icons/HealthcarePerson.d.ts.map +1 -0
- package/components/Icons/HealthcarePerson.js +2 -0
- package/components/Icons/HealthcarePerson.js.map +1 -0
- package/components/Icons/HealthcarePersonell.d.ts +5 -0
- package/components/Icons/HealthcarePersonell.d.ts.map +1 -0
- package/components/Icons/HealthcarePersonell.js +2 -0
- package/components/Icons/HealthcarePersonell.js.map +1 -0
- package/components/Icons/Heart.js.map +1 -1
- package/components/Icons/HeartHands.js.map +1 -1
- package/components/Icons/HelpSign.js.map +1 -1
- package/components/Icons/HelpingHand.js.map +1 -1
- package/components/Icons/Hemodialysis.js.map +1 -1
- package/components/Icons/Hiker.js.map +1 -1
- package/components/Icons/History.js.map +1 -1
- package/components/Icons/HivAndAids.js.map +1 -1
- package/components/Icons/Home.js.map +1 -1
- package/components/Icons/Hospital.js.map +1 -1
- package/components/Icons/Hourglass.js.map +1 -1
- package/components/Icons/Icon.d.ts +7 -7
- package/components/Icons/Icon.d.ts.map +1 -1
- package/components/Icons/Icon.js.map +1 -1
- package/components/Icons/IconWall.d.ts +8 -0
- package/components/Icons/IconWall.d.ts.map +1 -0
- package/components/Icons/IconWall.js +2 -0
- package/components/Icons/IconWall.js.map +1 -0
- package/components/Icons/ImgFile.js.map +1 -1
- package/components/Icons/Inbox.js.map +1 -1
- package/components/Icons/InfoSignStroke.js.map +1 -1
- package/components/Icons/Instagram.js.map +1 -1
- package/components/Icons/JointPain.js.map +1 -1
- package/components/Icons/Journal.js.map +1 -1
- package/components/Icons/JpgFile.js.map +1 -1
- package/components/Icons/Kidney.js.map +1 -1
- package/components/Icons/Kjernejournal.js.map +1 -1
- package/components/Icons/Laboratory.js.map +1 -1
- package/components/Icons/LaptopBlog.js.map +1 -1
- package/components/Icons/LawBook.js.map +1 -1
- package/components/Icons/LegalDocument.d.ts +5 -0
- package/components/Icons/LegalDocument.d.ts.map +1 -0
- package/components/Icons/LegalDocument.js +2 -0
- package/components/Icons/LegalDocument.js.map +1 -0
- package/components/Icons/LightBulb.js.map +1 -1
- package/components/Icons/List.js.map +1 -1
- package/components/Icons/Location.js.map +1 -1
- package/components/Icons/Login.js.map +1 -1
- package/components/Icons/Logout.js.map +1 -1
- package/components/Icons/Lungs.js.map +1 -1
- package/components/Icons/Makeup.js.map +1 -1
- package/components/Icons/MaleDoctor.js.map +1 -1
- package/components/Icons/MaleDoctorAndPerson.js.map +1 -1
- package/components/Icons/MaleGenitalia.js.map +1 -1
- package/components/Icons/Medicine.js.map +1 -1
- package/components/Icons/MedicineWarning.js.map +1 -1
- package/components/Icons/MentalHealthAdult.js.map +1 -1
- package/components/Icons/MentalHealthChild.js.map +1 -1
- package/components/Icons/Menu.js.map +1 -1
- package/components/Icons/Microscope.js.map +1 -1
- package/components/Icons/Minus.js.map +1 -1
- package/components/Icons/Mirror.js.map +1 -1
- package/components/Icons/MobilePhone.js.map +1 -1
- package/components/Icons/MotherHoldingBaby.js.map +1 -1
- package/components/Icons/MuscleBack.js.map +1 -1
- package/components/Icons/MuscleLeg.js.map +1 -1
- package/components/Icons/Mushroom.js.map +1 -1
- package/components/Icons/Music.js.map +1 -1
- package/components/Icons/MusselsAndSalt.js.map +1 -1
- package/components/Icons/NoAccess.js.map +1 -1
- package/components/Icons/NoEye.js.map +1 -1
- package/components/Icons/NoFilter.js.map +1 -1
- package/components/Icons/Notepad.js.map +1 -1
- package/components/Icons/Osteotomy.js.map +1 -1
- package/components/Icons/PaintRoller.js.map +1 -1
- package/components/Icons/PaperPlane.js.map +1 -1
- package/components/Icons/PatientAndPerson.js.map +1 -1
- package/components/Icons/Pause.js.map +1 -1
- package/components/Icons/PdfFile.js.map +1 -1
- package/components/Icons/Pencil.js.map +1 -1
- package/components/Icons/PeopleTalking.js.map +1 -1
- package/components/Icons/Peritonealdialysis.js.map +1 -1
- package/components/Icons/Person.js.map +1 -1
- package/components/Icons/PersonAndPatient.js.map +1 -1
- package/components/Icons/PersonCancel.js.map +1 -1
- package/components/Icons/PersonInXRayMachine.js.map +1 -1
- package/components/Icons/PersonOverweight.js.map +1 -1
- package/components/Icons/PersonWithBrain.js.map +1 -1
- package/components/Icons/PersonWithBrokenArm.js.map +1 -1
- package/components/Icons/PersonWithCrutches.js.map +1 -1
- package/components/Icons/PersonWithJaw.js.map +1 -1
- package/components/Icons/PersonWithMagnifyingGlass.js.map +1 -1
- package/components/Icons/PersonWithSenses.js.map +1 -1
- package/components/Icons/PersonalPlan.js.map +1 -1
- package/components/Icons/PizzaSlice.js.map +1 -1
- package/components/Icons/Plant.js.map +1 -1
- package/components/Icons/Play.js.map +1 -1
- package/components/Icons/PlusLarge.js.map +1 -1
- package/components/Icons/PlusSmall.js.map +1 -1
- package/components/Icons/PngFile.js.map +1 -1
- package/components/Icons/Podcast.js.map +1 -1
- package/components/Icons/PoisonInformation.js.map +1 -1
- package/components/Icons/Pregnant.js.map +1 -1
- package/components/Icons/Printer.js.map +1 -1
- package/components/Icons/Psychosis.js.map +1 -1
- package/components/Icons/Publication.js.map +1 -1
- package/components/Icons/Puzzle.js.map +1 -1
- package/components/Icons/Quarrel.js.map +1 -1
- package/components/Icons/RadioTherapy.js.map +1 -1
- package/components/Icons/RadioactiveTreatment.js.map +1 -1
- package/components/Icons/Radioiodine.js.map +1 -1
- package/components/Icons/Receipt.js.map +1 -1
- package/components/Icons/Receptionist.js.map +1 -1
- package/components/Icons/Recovery.js.map +1 -1
- package/components/Icons/Referral.js.map +1 -1
- package/components/Icons/Refresh.js.map +1 -1
- package/components/Icons/Refund.js.map +1 -1
- package/components/Icons/Reply.js.map +1 -1
- package/components/Icons/Rocket.js.map +1 -1
- package/components/Icons/RtfFile.js.map +1 -1
- package/components/Icons/STDs.js.map +1 -1
- package/components/Icons/Save.js.map +1 -1
- package/components/Icons/Scale.js.map +1 -1
- package/components/Icons/Search.js.map +1 -1
- package/components/Icons/SectionSign.js.map +1 -1
- package/components/Icons/Sexualorientation.js.map +1 -1
- package/components/Icons/ShakingHand.js.map +1 -1
- package/components/Icons/Share.js.map +1 -1
- package/components/Icons/ShuntOperation.js.map +1 -1
- package/components/Icons/Skeleton.js.map +1 -1
- package/components/Icons/Skin.js.map +1 -1
- package/components/Icons/Snake.js.map +1 -1
- package/components/Icons/Snapchat.js.map +1 -1
- package/components/Icons/SortDown.js.map +1 -1
- package/components/Icons/SortUp.js.map +1 -1
- package/components/Icons/SpeechBubble.js.map +1 -1
- package/components/Icons/Spray.js.map +1 -1
- package/components/Icons/SupportingPerson.js.map +1 -1
- package/components/Icons/Surgery.js.map +1 -1
- package/components/Icons/Syringe.js.map +1 -1
- package/components/Icons/Taxi.js.map +1 -1
- package/components/Icons/TeddyBear.js.map +1 -1
- package/components/Icons/Teenagers.js.map +1 -1
- package/components/Icons/ThinkingAboutBaby.js.map +1 -1
- package/components/Icons/Ticket.js.map +1 -1
- package/components/Icons/Tombstone.d.ts +5 -0
- package/components/Icons/Tombstone.d.ts.map +1 -0
- package/components/Icons/Tombstone.js +2 -0
- package/components/Icons/Tombstone.js.map +1 -0
- package/components/Icons/Toolbox.js.map +1 -1
- package/components/Icons/Tooth.js.map +1 -1
- package/components/Icons/TotalKneeProsthesis.js.map +1 -1
- package/components/Icons/Train.js.map +1 -1
- package/components/Icons/Transplantation.js.map +1 -1
- package/components/Icons/TrashCan.js.map +1 -1
- package/components/Icons/TravelRoute.js.map +1 -1
- package/components/Icons/TriangleX.js.map +1 -1
- package/components/Icons/Twitter.js.map +1 -1
- package/components/Icons/Undo.js.map +1 -1
- package/components/Icons/UniProsthesis.js.map +1 -1
- package/components/Icons/Upload.js.map +1 -1
- package/components/Icons/UserOrganization.js.map +1 -1
- package/components/Icons/VerticalDots.js.map +1 -1
- package/components/Icons/VideoCamera.js.map +1 -1
- package/components/Icons/VideoChat.js.map +1 -1
- package/components/Icons/Wallet.js.map +1 -1
- package/components/Icons/Watch.js.map +1 -1
- package/components/Icons/Wheelchair.js.map +1 -1
- package/components/Icons/WheelchairActive.js.map +1 -1
- package/components/Icons/Window.js.map +1 -1
- package/components/Icons/WorkSuitcase.js.map +1 -1
- package/components/Icons/X.js.map +1 -1
- package/components/Icons/XOutline.js.map +1 -1
- package/components/Icons/YouTube.js.map +1 -1
- package/components/Icons/Zoom.js.map +1 -1
- package/components/Icons/componentdata.json +1 -1
- package/components/Input/Input.d.ts +2 -8
- package/components/Input/Input.d.ts.map +1 -1
- package/components/Input/componentdata.json +1 -1
- package/components/Input/index.js +1 -1
- package/components/Input/styles.module.scss.d.ts +0 -3
- package/components/Label/Label.d.ts +41 -0
- package/components/Label/Label.d.ts.map +1 -0
- package/components/Label/SubLabel.d.ts +17 -0
- package/components/Label/SubLabel.d.ts.map +1 -0
- package/components/Label/componentdata.json +1 -0
- package/components/Label/index.d.ts +5 -0
- package/components/Label/index.d.ts.map +1 -0
- package/components/Label/index.js +2 -0
- package/components/Label/index.js.map +1 -0
- package/components/Label/styles.module.scss +66 -0
- package/components/Label/styles.module.scss.d.ts +17 -0
- package/components/LinkList/styles.module.scss +2 -2
- package/components/Panel/Panel.d.ts +2 -0
- package/components/Panel/Panel.d.ts.map +1 -1
- package/components/Panel/componentdata.json +1 -1
- package/components/Panel/styles.module.scss +65 -2
- package/components/Panel/styles.module.scss.d.ts +7 -0
- package/components/PopMenu/componentdata.json +1 -1
- package/components/RadioButton/RadioButton.d.ts +3 -3
- package/components/RadioButton/RadioButton.d.ts.map +1 -1
- package/components/RadioButton/componentdata.json +1 -1
- package/components/RadioButton/index.js +1 -1
- package/components/RadioButton/styles.module.scss +228 -52
- package/components/RadioButton/styles.module.scss.d.ts +15 -3
- package/components/Select/Select.d.ts +2 -2
- package/components/Select/Select.d.ts.map +1 -1
- package/components/Select/componentdata.json +1 -1
- package/components/Select/index.js +1 -1
- package/components/Select/styles.module.scss +0 -22
- package/components/Select/styles.module.scss.d.ts +0 -3
- package/components/ServiceMessage/ServiceMessage.d.ts.map +1 -1
- package/components/ServiceMessage/index.js +1 -1
- package/components/ServiceMessage/index.js.map +1 -1
- package/components/ServiceMessage/styles.module.scss +18 -0
- package/components/ServiceMessage/styles.module.scss.d.ts +4 -0
- package/components/StatusDot/StatusDot.d.ts +9 -0
- package/components/StatusDot/StatusDot.d.ts.map +1 -1
- package/components/StatusDot/componentdata.json +1 -1
- package/components/StatusDot/index.js +1 -1
- package/components/StatusDot/styles.module.scss +14 -3
- package/components/StatusDot/styles.module.scss.d.ts +1 -0
- package/components/Step/componentdata.json +1 -1
- package/components/Table/Table.d.ts +6 -0
- package/components/Table/Table.d.ts.map +1 -1
- package/components/Table/TableBody/TableBody.d.ts +4 -1
- package/components/Table/TableBody/TableBody.d.ts.map +1 -1
- package/components/Table/TableBody/componentdata.json +1 -1
- package/components/Table/TableBody/index.js +1 -1
- package/components/Table/TableCell/TableCell.d.ts +6 -1
- package/components/Table/TableCell/TableCell.d.ts.map +1 -1
- package/components/Table/TableCell/componentdata.json +1 -1
- package/components/Table/TableCell/index.js +1 -1
- package/components/Table/TableExpandedRow/TableExpandedRow.d.ts +4 -1
- package/components/Table/TableExpandedRow/TableExpandedRow.d.ts.map +1 -1
- package/components/Table/TableExpandedRow/componentdata.json +1 -1
- package/components/Table/TableExpandedRow/index.js +1 -1
- package/components/Table/TableExpanderCell/TableExpanderCell.d.ts +5 -2
- package/components/Table/TableExpanderCell/TableExpanderCell.d.ts.map +1 -1
- package/components/Table/TableExpanderCell/TableExpanderCellMobile.d.ts +1 -1
- package/components/Table/TableExpanderCell/TableExpanderCellMobile.d.ts.map +1 -1
- package/components/Table/TableExpanderCell/componentdata.json +1 -1
- package/components/Table/TableExpanderCell/index.js +1 -1
- package/components/Table/TableHead/TableHead.d.ts +4 -1
- package/components/Table/TableHead/TableHead.d.ts.map +1 -1
- package/components/Table/TableHead/componentdata.json +1 -1
- package/components/Table/TableHead/index.js +1 -1
- package/components/Table/TableHeadCell/TableHeadCell.d.ts +4 -1
- package/components/Table/TableHeadCell/TableHeadCell.d.ts.map +1 -1
- package/components/Table/TableHeadCell/componentdata.json +1 -1
- package/components/Table/TableHeadCell/index.js +1 -1
- package/components/Table/TableRow/TableRow.d.ts +3 -0
- package/components/Table/TableRow/TableRow.d.ts.map +1 -1
- package/components/Table/TableRow/componentdata.json +1 -1
- package/components/Table/TableRow/index.js +1 -1
- package/components/Table/index.js +1 -1
- package/components/Table/index.js.map +1 -1
- package/components/Table/styles.module.scss +67 -45
- package/components/Table/styles.module.scss.d.ts +5 -0
- package/components/Tag/componentdata.json +1 -1
- package/components/Textarea/Textarea.d.ts +2 -6
- package/components/Textarea/Textarea.d.ts.map +1 -1
- package/components/Textarea/componentdata.json +1 -1
- package/components/Textarea/index.js +1 -1
- package/components/Textarea/styles.module.scss.d.ts +0 -3
- package/components/Tooltip/TooltipWord/styles.module.scss +4 -1
- package/components/Tooltip/componentdata.json +1 -1
- package/components/TooltipExample/componentdata.json +1 -1
- package/components/Validation/index.js +1 -1
- package/constants.d.ts +2 -0
- package/constants.d.ts.map +1 -1
- package/constants.js +1 -1
- package/constants.js.map +1 -1
- package/hooks/usePseudoClasses.d.ts +12 -0
- package/hooks/usePseudoClasses.d.ts.map +1 -0
- package/hooks/usePseudoClasses.js +2 -0
- package/hooks/usePseudoClasses.js.map +1 -0
- package/package.json +5 -1
- package/scss/_input.scss +6 -28
- package/scss/_palette.scss +1 -0
- package/scss/_spacers.scss +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import{T as r}from"../../Table.js";import{M as q,R as z,d as F,s as G}from"../../Table.js";import{T as J}from"../../TableBody.js";import{T as L,a as N}from"../../TableCell.js";import{T as P}from"../../TableExpandedRow.js";import{T as U}from"../../TableExpanderCell.js";import{H as X,T as Y}from"../../TableHead.js";import{S as _,T as $}from"../../TableHeadCell.js";import{T as ro}from"../../TableRow.js";import"react";import"classnames";import"../../constants.js";import"../../hooks/useBreakpoint.js";import"../../theme/grid.js";import"../../hooks/useLayoutEvent.js";import"../../utils/debounce.js";import"../../HorizontalScroll.js";import"../../hooks/useIsVisible.js";import"../../hooks/useIntersectionObserver.js";import"../../hooks/useSize.js";import"../HorizontalScroll/styles.module.scss";import"./styles.module.scss";import"../../utils/device.js";import"../../Button.js";import"../Icons/Icon.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../../hooks/useHover.js";import"../../hooks/useIcons.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../Icons/ArrowRight.js";import"../Button/styles.module.scss";import"../Icons/ChevronUp.js";import"../Icons/ChevronDown.js";import"../Icons/ArrowDown.js";import"../Icons/ArrowUp.js";export{X as HeaderCategory,q as ModeType,z as ResponsiveTableVariant,_ as SortDirection,r as Table,J as TableBody,L as TableCell,P as TableExpandedRow,U as TableExpanderCell,Y as TableHead,$ as TableHeadCell,ro as TableRow,N as TextAlign,r as default,F as defaultConfig,G as simpleConfig};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/Table/utils.ts","../../../src/components/Table/Table.tsx"],"sourcesContent":["import React from 'react';\n\nimport { BreakpointConfig, ResponsiveTableVariant } from './Table';\nimport { Breakpoint } from '../../hooks/useBreakpoint';\nimport { isTouchDevice } from '../../utils/device';\n\nimport styles from './styles.module.scss';\n\n/**\n * Sjekk om det skal brukes CSS for å bestemme responsivt utseende på dette breakpoint\n * @param config Konfigurasjon for responsiv oppførsel\n * @returns true om breakpoint bruker CSS\n */\nconst configUsesCss = (config: BreakpointConfig): boolean =>\n config.variant === ResponsiveTableVariant.centeredoverflow || config.variant === ResponsiveTableVariant.block;\n\n/**\n * Lag klassenavn for CSS-config\n * @param config Konfigurasjon for responsiv oppførsel\n * @returns CSS-klassenavn\n */\nconst mapConfigToClass = (config: BreakpointConfig): string => styles[`table--${config.variant}-${config.breakpoint}`];\n\n/**\n * Sorter konfigurasjon etter breakpoints, fra største til minste\n * @param a Konfigurasjon for responsiv oppførsel\n * @param b Konfigurasjon for responsiv oppførsel\n * @returns Sortert liste\n */\nconst sortByBreakpointsDescending = (a: BreakpointConfig, b: BreakpointConfig): number =>\n Breakpoint[a.breakpoint] - Breakpoint[b.breakpoint];\n\n/**\n * Sjekk om en konfigurasjon skal brukes for nåværende breakpoint\n * @param a Konfigurasjon for responsiv oppførsel\n * @param breakpoint Nåværende breakpoint\n * @returns true dersom config skal brukes for breakpointet\n */\nconst isValidForCurrentBreakpoint = (config: BreakpointConfig, breakpoint: Breakpoint): boolean =>\n Breakpoint[config.breakpoint] >= breakpoint;\n\n/**\n * Finn konfigurasjon for nåværende breakpoint\n * @param config Konfigurasjon for responsiv oppførsel\n * @param breakpoint Nåværende breakpoint\n * @returns Konfigurasjon for responsiv oppførsel\n */\nconst getConfigForBreakpoint = (config: BreakpointConfig | BreakpointConfig[], breakpoint: Breakpoint): BreakpointConfig | undefined => {\n if (Array.isArray(config)) {\n config.sort(sortByBreakpointsDescending);\n\n return config.find(x => isValidForCurrentBreakpoint(x, breakpoint));\n } else if (config && isValidForCurrentBreakpoint(config, breakpoint)) {\n return config;\n }\n};\n\n/**\n * Finn konfigurasjon for nåværende breakpoint og tabellbredde\n * @param config Konfigurasjon for responsiv oppførsel\n * @param breakpoint Nåværende breakpoint\n * @param tableWidth Bredde på tabell i px\n * @returns Konfigurasjon for responsiv oppførsel uten fallbackVariant\n */\nexport const getCurrentConfig = (\n config: BreakpointConfig | BreakpointConfig[],\n breakpoint: Breakpoint,\n tableWidth: number,\n windowWidth: number\n): Omit<BreakpointConfig, 'fallbackVariant'> | undefined => {\n const breakpointConfig = getConfigForBreakpoint(config, breakpoint);\n const canUseHorizontalScroll = isTouchDevice();\n const canUseCenteredOverflow = tableWidth <= windowWidth;\n\n if (!breakpointConfig) {\n return;\n }\n\n if (\n breakpointConfig.variant === ResponsiveTableVariant.centeredoverflow &&\n !canUseCenteredOverflow &&\n breakpointConfig.fallbackVariant === ResponsiveTableVariant.horizontalscroll\n ) {\n return {\n variant: canUseHorizontalScroll ? ResponsiveTableVariant.horizontalscroll : ResponsiveTableVariant.none,\n breakpoint: breakpointConfig.breakpoint,\n };\n }\n\n if (\n breakpointConfig.variant === ResponsiveTableVariant.centeredoverflow &&\n !canUseCenteredOverflow &&\n breakpointConfig.fallbackVariant !== ResponsiveTableVariant.centeredoverflow\n ) {\n return {\n variant: breakpointConfig.fallbackVariant ?? ResponsiveTableVariant.none,\n breakpoint: breakpointConfig.breakpoint,\n };\n }\n\n if (\n breakpointConfig.variant === ResponsiveTableVariant.horizontalscroll &&\n !canUseHorizontalScroll &&\n breakpointConfig.fallbackVariant === ResponsiveTableVariant.centeredoverflow\n ) {\n return {\n variant: canUseCenteredOverflow ? ResponsiveTableVariant.centeredoverflow : ResponsiveTableVariant.none,\n breakpoint: breakpointConfig.breakpoint,\n };\n }\n\n if (\n breakpointConfig.variant === ResponsiveTableVariant.horizontalscroll &&\n !canUseHorizontalScroll &&\n breakpointConfig.fallbackVariant !== ResponsiveTableVariant.horizontalscroll\n ) {\n return {\n variant: breakpointConfig.fallbackVariant ?? ResponsiveTableVariant.none,\n breakpoint: breakpointConfig.breakpoint,\n };\n }\n\n return breakpointConfig;\n};\n\n/**\n * Finn klassenavn for responsiv oppførsel\n * @param config Konfigurasjon for responsiv oppførsel\n * @returns Klassenavn\n */\nexport const getBreakpointClass = (config?: BreakpointConfig): string | undefined =>\n config && configUsesCss(config) ? mapConfigToClass(config) : undefined;\n\n/**\n * Finn riktig posisjon for horisontal sentrering av tabell som skal vises \"centeredoverflow\"\n * @param parentWidth Bredde på element som tabellen ligger i\n * @param tableWidth Bredde på tabellen\n * @returns Styling som posisjonerer tabellen riktig\n */\nexport const getCenteredOverflowTableStyle = (parentWidth: number, tableWidth: number): React.CSSProperties => {\n const COLUMN_GUTTER_WIDTH_PX = 8;\n\n return { left: `${(parentWidth - tableWidth) / 2 - COLUMN_GUTTER_WIDTH_PX}px` };\n};\n","import React, { useEffect, useRef, useState } from 'react';\n\nimport classNames from 'classnames';\n\nimport { getCurrentConfig, getBreakpointClass, getCenteredOverflowTableStyle } from './utils';\nimport { AnalyticsId } from '../../constants';\nimport { Breakpoint, useBreakpoint } from '../../hooks/useBreakpoint';\nimport { useLayoutEvent } from '../../hooks/useLayoutEvent';\nimport HorizontalScroll from '../HorizontalScroll';\n\nimport styles from './styles.module.scss';\n\nexport enum ResponsiveTableVariant {\n /** No handling responsive behaviour. Default. */\n none = 'none',\n /** Overflow parent container to the left and right while remaining centered horizontally. */\n centeredoverflow = 'centeredoverflow',\n /** Show horizontal scrollbar when table is too big for the screen. */\n horizontalscroll = 'horizontalscroll',\n /** Collapse to two columns. */\n block = 'block',\n}\n\nexport interface BreakpointConfig {\n /** Breakpoint at which responsive behaviour will be applied. The table component uses a \"desktop first\" approach. */\n breakpoint: keyof typeof Breakpoint;\n /** Desired behaviour on this breakpoint and all smaller screens. */\n variant: keyof typeof ResponsiveTableVariant;\n /** If variant is horizontallscroll, use a fallback instead of device is not a touch device. */\n fallbackVariant?: keyof typeof ResponsiveTableVariant;\n}\n\nexport interface Props {\n /** Unique ID */\n id?: string;\n /** Id used for testing */\n testId?: string;\n /** Customize how the table behaves on various screen widths */\n breakpointConfig?: BreakpointConfig | BreakpointConfig[];\n /** Adds custom classes to the element. */\n className?: string;\n /** Sets the content of the table. Use TableHead and TableBody */\n children: React.ReactNode;\n}\n\nexport const defaultConfig: BreakpointConfig[] = [\n {\n breakpoint: 'xl',\n variant: ResponsiveTableVariant.centeredoverflow,\n fallbackVariant: ResponsiveTableVariant.horizontalscroll,\n },\n];\n\nexport const simpleConfig: BreakpointConfig[] = [\n {\n breakpoint: 'xl',\n variant: ResponsiveTableVariant.centeredoverflow,\n fallbackVariant: ResponsiveTableVariant.horizontalscroll,\n },\n {\n breakpoint: 'sm',\n variant: ResponsiveTableVariant.centeredoverflow,\n fallbackVariant: ResponsiveTableVariant.block,\n },\n];\n\nexport const Table: React.FC<Props> = ({ id, testId, className, children, breakpointConfig = defaultConfig }) => {\n const [currentConfig, setCurrentConfig] = useState<BreakpointConfig>();\n const [tableWidth, setTableWidth] = useState<number>(0);\n const [parentWidth, setParentWidth] = useState<number>(0);\n const [windowWidth, setWindowWidth] = useState(window.innerWidth);\n const tableRef = useRef<HTMLTableElement>(null);\n const breakpoint = useBreakpoint();\n\n useEffect(() => {\n setCurrentConfig(getCurrentConfig(breakpointConfig, breakpoint, tableWidth, windowWidth));\n }, [breakpointConfig, breakpoint, tableWidth, windowWidth]);\n\n useEffect(() => {\n if (\n currentConfig?.variant === ResponsiveTableVariant.centeredoverflow ||\n currentConfig?.variant === ResponsiveTableVariant.horizontalscroll\n ) {\n setTableWidth(tableRef.current?.getBoundingClientRect().width ?? 0);\n }\n if (currentConfig?.variant === ResponsiveTableVariant.centeredoverflow) {\n setParentWidth(tableRef.current?.parentElement?.getBoundingClientRect().width ?? 0);\n }\n }, [currentConfig]);\n\n useLayoutEvent(() => setWindowWidth(window.innerWidth), ['resize'], 100);\n\n const tableStyle =\n currentConfig?.variant === ResponsiveTableVariant.centeredoverflow ? getCenteredOverflowTableStyle(parentWidth, tableWidth) : undefined;\n\n const breakpointClass = getBreakpointClass(currentConfig);\n const tableClass = classNames(styles.table, breakpointClass, className);\n\n const table = (\n <table className={tableClass} id={id} data-testid={testId} data-analyticsid={AnalyticsId.Table} ref={tableRef} style={tableStyle}>\n {children}\n </table>\n );\n\n if (currentConfig?.variant === ResponsiveTableVariant.horizontalscroll) {\n return (\n <HorizontalScroll childWidth={tableWidth} testId=\"horizontal-scroll\">\n {table}\n </HorizontalScroll>\n );\n }\n\n return table;\n};\n\nexport default Table;\n"],"names":["configUsesCss","config","ResponsiveTableVariant","mapConfigToClass","styles","sortByBreakpointsDescending","a","b","Breakpoint","isValidForCurrentBreakpoint","breakpoint","getConfigForBreakpoint","x","getCurrentConfig","tableWidth","windowWidth","breakpointConfig","canUseHorizontalScroll","isTouchDevice","canUseCenteredOverflow","getBreakpointClass","getCenteredOverflowTableStyle","parentWidth","defaultConfig","simpleConfig","Table","id","testId","className","children","currentConfig","setCurrentConfig","useState","setTableWidth","setParentWidth","setWindowWidth","tableRef","useRef","useBreakpoint","useEffect","_a","_c","_b","useLayoutEvent","tableStyle","breakpointClass","tableClass","classNames","table","React","AnalyticsId","HorizontalScroll"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
// Kan fjernes når konvensjonen for BEM er tillatt.
|
|
2
|
+
/* stylelint-disable selector-class-pattern */
|
|
1
3
|
@use 'sass:map';
|
|
2
4
|
@import '../../scss/spacers';
|
|
3
5
|
@import '../../scss/breakpoints';
|
|
@@ -6,7 +8,7 @@
|
|
|
6
8
|
@import '../../scss/grid';
|
|
7
9
|
|
|
8
10
|
/* fix outline for Safari */
|
|
9
|
-
table
|
|
11
|
+
table .table-body .table-row {
|
|
10
12
|
outline: 3px solid transparent;
|
|
11
13
|
}
|
|
12
14
|
|
|
@@ -26,14 +28,14 @@ table tbody tr {
|
|
|
26
28
|
display: block;
|
|
27
29
|
clear: both;
|
|
28
30
|
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
31
|
+
.table-body,
|
|
32
|
+
.table-row,
|
|
33
|
+
.table__head-cell,
|
|
34
|
+
.table__cell {
|
|
33
35
|
display: block;
|
|
34
36
|
}
|
|
35
37
|
|
|
36
|
-
|
|
38
|
+
.table-row {
|
|
37
39
|
clear: both;
|
|
38
40
|
}
|
|
39
41
|
|
|
@@ -41,24 +43,35 @@ table tbody tr {
|
|
|
41
43
|
max-width: 100%;
|
|
42
44
|
}
|
|
43
45
|
|
|
44
|
-
|
|
46
|
+
.table__head-cell:focus {
|
|
45
47
|
outline: none;
|
|
46
48
|
background-color: $blueberry800;
|
|
47
49
|
text-decoration: underline;
|
|
48
50
|
}
|
|
49
51
|
|
|
50
|
-
|
|
52
|
+
.table__cell {
|
|
51
53
|
position: relative;
|
|
52
54
|
padding: 0.75rem 0 0.75rem 40%;
|
|
53
55
|
float: left;
|
|
54
56
|
clear: both;
|
|
55
57
|
width: 100%;
|
|
58
|
+
border-top: 0;
|
|
59
|
+
border-bottom: 0;
|
|
60
|
+
outline: 0;
|
|
61
|
+
|
|
62
|
+
&--center {
|
|
63
|
+
text-align: left;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
&--right {
|
|
67
|
+
text-align: left;
|
|
68
|
+
}
|
|
56
69
|
|
|
57
70
|
&:not(.expandable-container) {
|
|
58
71
|
font-weight: 400;
|
|
59
72
|
}
|
|
60
73
|
|
|
61
|
-
/* Get data from the td-tag attribute "data-label"
|
|
74
|
+
/* Get data from the td-tag attribute "data-label" and use this to populate :before content */
|
|
62
75
|
&::before {
|
|
63
76
|
content: attr(data-label);
|
|
64
77
|
position: relative;
|
|
@@ -78,33 +91,16 @@ table tbody tr {
|
|
|
78
91
|
|
|
79
92
|
.table__expander-cell-mobile {
|
|
80
93
|
padding-left: 0.75rem;
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
.table__expanded-row td {
|
|
84
|
-
text-align: left;
|
|
85
|
-
padding: 0.75rem;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
.table__expanded-row {
|
|
89
|
-
display: none;
|
|
94
|
+
border-bottom: 1px solid $neutral500;
|
|
90
95
|
|
|
91
96
|
&--expanded {
|
|
92
|
-
|
|
97
|
+
border-bottom: 0;
|
|
93
98
|
}
|
|
94
99
|
}
|
|
95
100
|
|
|
96
|
-
.table__cell {
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
outline: 0;
|
|
100
|
-
|
|
101
|
-
&--center {
|
|
102
|
-
text-align: left;
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
&--right {
|
|
106
|
-
text-align: left;
|
|
107
|
-
}
|
|
101
|
+
.table__expanded-row .table__cell {
|
|
102
|
+
text-align: left;
|
|
103
|
+
padding: 0.75rem;
|
|
108
104
|
}
|
|
109
105
|
|
|
110
106
|
.table__cell:first-child {
|
|
@@ -113,6 +109,12 @@ table tbody tr {
|
|
|
113
109
|
}
|
|
114
110
|
|
|
115
111
|
.table__expanded-row {
|
|
112
|
+
display: none;
|
|
113
|
+
|
|
114
|
+
&--expanded {
|
|
115
|
+
display: block;
|
|
116
|
+
}
|
|
117
|
+
|
|
116
118
|
.table__cell:first-child {
|
|
117
119
|
border-top: 0;
|
|
118
120
|
}
|
|
@@ -123,25 +125,15 @@ table tbody tr {
|
|
|
123
125
|
border-collapse: collapse;
|
|
124
126
|
border-top: 1px solid $neutral500;
|
|
125
127
|
}
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
tr:last-child .table__cell:last-child {
|
|
129
|
-
border-bottom: 1px solid $neutral500;
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
.table__expander-cell-mobile {
|
|
133
|
-
border-bottom: 1px solid $neutral500;
|
|
134
|
-
|
|
135
|
-
&--expanded {
|
|
136
|
-
border-bottom: 0;
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
128
|
|
|
140
|
-
.table__row--expandable {
|
|
141
129
|
&:focus-within {
|
|
142
130
|
outline: none;
|
|
143
131
|
}
|
|
144
132
|
}
|
|
133
|
+
|
|
134
|
+
.table-row:last-child .table__cell:last-child {
|
|
135
|
+
border-bottom: 1px solid $neutral500;
|
|
136
|
+
}
|
|
145
137
|
}
|
|
146
138
|
|
|
147
139
|
.table {
|
|
@@ -184,6 +176,14 @@ table tbody tr {
|
|
|
184
176
|
@media (min-width: map.get($grid-breakpoints, lg)) {
|
|
185
177
|
height: 6.125rem;
|
|
186
178
|
}
|
|
179
|
+
|
|
180
|
+
&--compact {
|
|
181
|
+
height: unset;
|
|
182
|
+
|
|
183
|
+
@media (min-width: map.get($grid-breakpoints, lg)) {
|
|
184
|
+
height: unset;
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
187
|
}
|
|
188
188
|
|
|
189
189
|
.table__head-cell {
|
|
@@ -225,6 +225,20 @@ table tbody tr {
|
|
|
225
225
|
line-height: $lineheight-size-sm;
|
|
226
226
|
font-weight: 700;
|
|
227
227
|
}
|
|
228
|
+
|
|
229
|
+
&--compact {
|
|
230
|
+
padding: getSpacer(2xs) getSpacer(3xs) getSpacer(4xs) getSpacer(3xs);
|
|
231
|
+
line-height: 18px;
|
|
232
|
+
font-size: 14px;
|
|
233
|
+
height: unset;
|
|
234
|
+
|
|
235
|
+
@media (min-width: map.get($grid-breakpoints, sm)) {
|
|
236
|
+
padding: getSpacer(s) getSpacer(3xs) getSpacer(3xs) getSpacer(3xs);
|
|
237
|
+
line-height: 20px;
|
|
238
|
+
font-size: 16px;
|
|
239
|
+
height: unset;
|
|
240
|
+
}
|
|
241
|
+
}
|
|
228
242
|
}
|
|
229
243
|
|
|
230
244
|
.table__head-cell-sort-icon-wrapper {
|
|
@@ -257,6 +271,14 @@ table tbody tr {
|
|
|
257
271
|
font-size: $font-size-sm;
|
|
258
272
|
line-height: 1.75rem;
|
|
259
273
|
}
|
|
274
|
+
|
|
275
|
+
&--compact {
|
|
276
|
+
padding: getSpacer(4xs) getSpacer(3xs);
|
|
277
|
+
|
|
278
|
+
@media (min-width: map.get($grid-breakpoints, sm)) {
|
|
279
|
+
padding: getSpacer(3xs);
|
|
280
|
+
}
|
|
281
|
+
}
|
|
260
282
|
}
|
|
261
283
|
|
|
262
284
|
.table__cell-expander {
|
|
@@ -3,6 +3,7 @@ export type Styles = {
|
|
|
3
3
|
table: string;
|
|
4
4
|
table__cell: string;
|
|
5
5
|
'table__cell--center': string;
|
|
6
|
+
'table__cell--compact': string;
|
|
6
7
|
'table__cell--nowrap': string;
|
|
7
8
|
'table__cell--right': string;
|
|
8
9
|
'table__cell-expander': string;
|
|
@@ -13,10 +14,12 @@ export type Styles = {
|
|
|
13
14
|
'table__expander-cell-mobile': string;
|
|
14
15
|
'table__expander-cell-mobile--expanded': string;
|
|
15
16
|
table__head: string;
|
|
17
|
+
'table__head--compact': string;
|
|
16
18
|
'table__head--normal': string;
|
|
17
19
|
'table__head--sortable': string;
|
|
18
20
|
'table__head--transparent': string;
|
|
19
21
|
'table__head-cell': string;
|
|
22
|
+
'table__head-cell--compact': string;
|
|
20
23
|
'table__head-cell--sortable': string;
|
|
21
24
|
'table__head-cell--sorted': string;
|
|
22
25
|
'table__head-cell-sort-icon-wrapper': string;
|
|
@@ -35,6 +38,8 @@ export type Styles = {
|
|
|
35
38
|
'table--centeredoverflow-xl': string;
|
|
36
39
|
'table--centeredoverflow-xs': string;
|
|
37
40
|
'table--centeredoverflow-xxs': string;
|
|
41
|
+
'table-body': string;
|
|
42
|
+
'table-row': string;
|
|
38
43
|
};
|
|
39
44
|
|
|
40
45
|
export type ClassNames = keyof Styles;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"props":{"children":{"defaultValue":null,"description":"Sets the text of the tag","name":"children","parent":{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},"declarations":[{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},{"fileName":"
|
|
1
|
+
{"props":{"children":{"defaultValue":null,"description":"Sets the text of the tag","name":"children","parent":{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},"declarations":[{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"string & ReactNode"}},"size":{"defaultValue":null,"description":"Sets the size of the tag. Default: small","name":"size","parent":{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},"declarations":[{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"}],"required":false,"type":{"name":"enum","raw":"\"medium\" | \"large\"","value":[{"value":"\"medium\""},{"value":"\"large\""}]}},"color":{"defaultValue":null,"description":"Sets the background of the tag. Not used if action is \"undo\". Default: blueberry","name":"color","parent":{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},"declarations":[{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"}],"required":false,"type":{"name":"enum","raw":"TagColors","value":[{"value":"\"banana\""},{"value":"\"blueberry\""},{"value":"\"cherry\""},{"value":"\"kiwi\""},{"value":"\"neutral\""},{"value":"\"plum\""}]}},"svgIcon":{"defaultValue":null,"description":"Adds an icon to the tag. Not shown if action is set.","name":"svgIcon","parent":{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},"declarations":[{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"}],"required":false,"type":{"name":"SvgIcon"}},"variant":{"defaultValue":null,"description":"","name":"variant","parent":{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},"declarations":[{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"}],"required":false,"type":{"name":"enum","raw":"\"normal\" | \"oncolor\" | \"emphasised\"","value":[{"value":"\"normal\""},{"value":"\"oncolor\""},{"value":"\"emphasised\""}]}},"action":{"defaultValue":null,"description":"","name":"action","parent":{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},"declarations":[{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"}],"required":false,"type":{"name":"enum","raw":"\"remove\" | \"undo\"","value":[{"value":"\"remove\""},{"value":"\"undo\""}]}},"onClick":{"defaultValue":null,"description":"","name":"onClick","parent":{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},"declarations":[{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"}],"required":false,"type":{"name":"(() => void)"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute on the expander button.","name":"testId","parent":{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"},"declarations":[{"fileName":"src/components/Tag/Tag.tsx","name":"TagProps"}],"required":false,"type":{"name":"string"}}}}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FormMode } from '../../constants';
|
|
3
|
-
interface TextareaProps extends Pick<React.InputHTMLAttributes<HTMLTextAreaElement>, 'autoFocus' | 'disabled' | 'name' | 'autoComplete' | 'placeholder' | 'readOnly' | 'required' | 'defaultValue' | 'onChange'> {
|
|
3
|
+
interface TextareaProps extends Pick<React.InputHTMLAttributes<HTMLTextAreaElement>, 'aria-describedby' | 'autoFocus' | 'disabled' | 'name' | 'autoComplete' | 'placeholder' | 'readOnly' | 'required' | 'defaultValue' | 'onChange'> {
|
|
4
4
|
/** max character limit in textarea */
|
|
5
5
|
maxCharacters?: number;
|
|
6
6
|
/** The text is displayed in the end of the text-counter */
|
|
@@ -16,7 +16,7 @@ interface TextareaProps extends Pick<React.InputHTMLAttributes<HTMLTextAreaEleme
|
|
|
16
16
|
/** Changes the visuals of the textarea */
|
|
17
17
|
mode?: keyof typeof FormMode;
|
|
18
18
|
/** Label of the input */
|
|
19
|
-
label?:
|
|
19
|
+
label?: React.ReactNode;
|
|
20
20
|
/** id of the textarea */
|
|
21
21
|
textareaId?: string;
|
|
22
22
|
/** max rows */
|
|
@@ -27,10 +27,6 @@ interface TextareaProps extends Pick<React.InputHTMLAttributes<HTMLTextAreaEleme
|
|
|
27
27
|
grow?: boolean;
|
|
28
28
|
/** Error text to show above the component */
|
|
29
29
|
errorText?: string;
|
|
30
|
-
/** Component shown after label */
|
|
31
|
-
afterLabelChildren?: React.ReactNode;
|
|
32
|
-
/** Component shown under label */
|
|
33
|
-
belowLabelChildren?: React.ReactNode;
|
|
34
30
|
}
|
|
35
31
|
declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
36
32
|
export default Textarea;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,EAA2C,QAAQ,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,EAA2C,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAQpF,UAAU,aACR,SAAQ,IAAI,CACV,KAAK,CAAC,mBAAmB,CAAC,mBAAmB,CAAC,EAC5C,kBAAkB,GAClB,WAAW,GACX,UAAU,GACV,MAAM,GACN,cAAc,GACd,aAAa,GACb,UAAU,GACV,UAAU,GACV,cAAc,GACd,UAAU,CACb;IACD,uCAAuC;IACvC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2DAA2D;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,oDAAoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wDAAwD;IACxD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kDAAkD;IAClD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,OAAO,QAAQ,CAAC;IAC7B,yBAAyB;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,eAAe;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,eAAe;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+BAA+B;IAC/B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAUD,QAAA,MAAM,QAAQ,2FAwIZ,CAAC;AAIH,eAAe,QAAQ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"props":{"maxCharacters":{"defaultValue":null,"description":"max character limit in textarea","name":"maxCharacters","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"number"}},"maxText":{"defaultValue":null,"description":"The text is displayed in the end of the text-counter","name":"maxText","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"string"}},"width":{"defaultValue":null,"description":"Width of textarea in characters (approximate)","name":"width","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"number"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"string"}},"marginBottom":{"defaultValue":null,"description":"If true, the component will have a bottom margin.","name":"marginBottom","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"boolean"}},"transparent":{"defaultValue":null,"description":"If true, the component will be transparent.","name":"transparent","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"boolean"}},"mode":{"defaultValue":null,"description":"Changes the visuals of the textarea","name":"mode","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"enum","raw":"\"onwhite\" | \"ongrey\" | \"onblueberry\" | \"ondark\" | \"oninvalid\"","value":[{"value":"\"onwhite\""},{"value":"\"ongrey\""},{"value":"\"onblueberry\""},{"value":"\"ondark\""},{"value":"\"oninvalid\""}]}},"label":{"defaultValue":null,"description":"Label of the input","name":"label","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"
|
|
1
|
+
{"props":{"maxCharacters":{"defaultValue":null,"description":"max character limit in textarea","name":"maxCharacters","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"number"}},"maxText":{"defaultValue":null,"description":"The text is displayed in the end of the text-counter","name":"maxText","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"string"}},"width":{"defaultValue":null,"description":"Width of textarea in characters (approximate)","name":"width","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"number"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"string"}},"marginBottom":{"defaultValue":null,"description":"If true, the component will have a bottom margin.","name":"marginBottom","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"boolean"}},"transparent":{"defaultValue":null,"description":"If true, the component will be transparent.","name":"transparent","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"boolean"}},"mode":{"defaultValue":null,"description":"Changes the visuals of the textarea","name":"mode","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"enum","raw":"\"onwhite\" | \"ongrey\" | \"onblueberry\" | \"ondark\" | \"oninvalid\"","value":[{"value":"\"onwhite\""},{"value":"\"ongrey\""},{"value":"\"onblueberry\""},{"value":"\"ondark\""},{"value":"\"oninvalid\""}]}},"label":{"defaultValue":null,"description":"Label of the input","name":"label","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"ReactNode"}},"textareaId":{"defaultValue":null,"description":"id of the textarea","name":"textareaId","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"string"}},"maxRows":{"defaultValue":null,"description":"max rows","name":"maxRows","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"number"}},"minRows":{"defaultValue":null,"description":"min rows","name":"minRows","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"number"}},"grow":{"defaultValue":null,"description":"auto-grows until maxRows","name":"grow","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"boolean"}},"errorText":{"defaultValue":null,"description":"Error text to show above the component","name":"errorText","parent":{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"},"declarations":[{"fileName":"src/components/Textarea/Textarea.tsx","name":"TextareaProps"}],"required":false,"type":{"name":"string"}},"aria-describedby":{"defaultValue":null,"description":"Identifies the element (or elements) that describes the object.\n@see aria-labelledby","name":"aria-describedby","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"AriaAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"AriaAttributes"}],"required":false,"type":{"name":"string"}},"autoFocus":{"defaultValue":null,"description":"","name":"autoFocus","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"}],"required":false,"type":{"name":"boolean"}},"disabled":{"defaultValue":null,"description":"","name":"disabled","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"}],"required":false,"type":{"name":"boolean"}},"name":{"defaultValue":null,"description":"","name":"name","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"}],"required":false,"type":{"name":"string"}},"autoComplete":{"defaultValue":null,"description":"","name":"autoComplete","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"}],"required":false,"type":{"name":"string"}},"placeholder":{"defaultValue":null,"description":"","name":"placeholder","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"}],"required":false,"type":{"name":"string"}},"readOnly":{"defaultValue":null,"description":"","name":"readOnly","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"}],"required":false,"type":{"name":"boolean"}},"required":{"defaultValue":null,"description":"","name":"required","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"}],"required":false,"type":{"name":"boolean"}},"defaultValue":{"defaultValue":null,"description":"","name":"defaultValue","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"HTMLAttributes"}],"required":false,"type":{"name":"string | number | readonly string[]"}},"onChange":{"defaultValue":null,"description":"","name":"onChange","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"InputHTMLAttributes"}],"required":false,"type":{"name":"ChangeEventHandler<HTMLTextAreaElement>"}}}}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{T as t}from"../../Textarea.js";import"react";import"classnames";import"../../constants.js";import"../../uuid.js";import"../../utils/environment.js";import"../../ErrorWrapper.js";import"../ErrorWrapper/styles.module.scss";import"../../MaxCharacters.js";import"../MaxCharacters/styles.module.scss";import"./styles.module.scss";export{t as default};
|
|
1
|
+
import{T as t}from"../../Textarea.js";import"react";import"classnames";import"../../constants.js";import"../../uuid.js";import"../../utils/environment.js";import"../../ErrorWrapper.js";import"../ErrorWrapper/styles.module.scss";import"../../Label.js";import"../../Spacer.js";import"../Spacer/styles.module.scss";import"../Label/styles.module.scss";import"../../utils/component.js";import"../../StatusDot.js";import"../../theme/grid.js";import"../../hooks/useBreakpoint.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../Icons/Attachment.js";import"../Icons/Icon.js";import"../../hooks/useUuid.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../Icons/Undo.js";import"../StatusDot/styles.module.scss";import"../../MaxCharacters.js";import"../MaxCharacters/styles.module.scss";import"./styles.module.scss";export{t as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -9,9 +9,6 @@ export type Styles = {
|
|
|
9
9
|
'content-wrapper--on-dark': string;
|
|
10
10
|
'content-wrapper--transparent': string;
|
|
11
11
|
textarea: string;
|
|
12
|
-
'textarea__after-label-children': string;
|
|
13
|
-
'textarea__label-wrapper': string;
|
|
14
|
-
'textarea__label-wrapper--on-dark': string;
|
|
15
12
|
'textarea--gutterBottom': string;
|
|
16
13
|
};
|
|
17
14
|
|
|
@@ -5,9 +5,12 @@
|
|
|
5
5
|
all: unset;
|
|
6
6
|
position: relative;
|
|
7
7
|
display: inline-block;
|
|
8
|
-
text-decoration: underline 0.15rem dashed $plum400;
|
|
9
8
|
cursor: help;
|
|
10
9
|
|
|
10
|
+
// bruker border istedet for text-decoration for å komme rundt text-decoraton-thickness begrensninger i safari
|
|
11
|
+
border-bottom: 0.2rem dotted $plum400;
|
|
12
|
+
line-height: 1.4rem;
|
|
13
|
+
|
|
11
14
|
&:focus-visible {
|
|
12
15
|
box-shadow: 0 0 0 getSpacer(4xs) $black;
|
|
13
16
|
outline: none;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"props":{"children":{"defaultValue":null,"description":"Ordet som skal ha en tilhørende tooltip","name":"children","parent":{"fileName":"src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},"declarations":[{"fileName":"src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},{"fileName":"
|
|
1
|
+
{"props":{"children":{"defaultValue":null,"description":"Ordet som skal ha en tilhørende tooltip","name":"children","parent":{"fileName":"src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},"declarations":[{"fileName":"src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"string & ReactNode"}},"description":{"defaultValue":null,"description":"Teksten som skal vises i tooltip","name":"description","parent":{"fileName":"src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},"declarations":[{"fileName":"src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"}],"required":true,"type":{"name":"ReactNode"}},"testId":{"defaultValue":null,"description":"Valgfri test-id","name":"testId","parent":{"fileName":"src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},"declarations":[{"fileName":"src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"}],"required":false,"type":{"name":"string"}}}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"props":{"children":{"defaultValue":null,"description":"Ordet som skal ha en tilhørende tooltip","name":"children","parent":{"fileName":"designsystem/src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},"declarations":[{"fileName":"designsystem/src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},{"fileName":"
|
|
1
|
+
{"props":{"children":{"defaultValue":null,"description":"Ordet som skal ha en tilhørende tooltip","name":"children","parent":{"fileName":"designsystem/src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},"declarations":[{"fileName":"designsystem/src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"TypeLiteral"}],"required":false,"type":{"name":"string & ReactNode"}},"description":{"defaultValue":null,"description":"Teksten som skal vises i tooltip","name":"description","parent":{"fileName":"designsystem/src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},"declarations":[{"fileName":"designsystem/src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"}],"required":true,"type":{"name":"ReactNode"}},"testId":{"defaultValue":null,"description":"Valgfri test-id","name":"testId","parent":{"fileName":"designsystem/src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"},"declarations":[{"fileName":"designsystem/src/components/Tooltip/Tooltip.tsx","name":"TooltipProps"}],"required":false,"type":{"name":"string"}}}}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{V as t}from"../../Validation.js";import{a as
|
|
1
|
+
import{V as t}from"../../Validation.js";import{a as Y}from"../../Validation.js";import"react";import"classnames";import"../../constants.js";import"../../FormGroup.js";import"../../utils/component.js";import"../../Checkbox.js";import"../../hooks/usePseudoClasses.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/grid.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../../uuid.js";import"../../utils/environment.js";import"../Icons/Icon.js";import"../../hooks/useUuid.js";import"../Icons/Check.js";import"../../Label.js";import"../../Spacer.js";import"../Spacer/styles.module.scss";import"../Label/styles.module.scss";import"../../StatusDot.js";import"../../hooks/useBreakpoint.js";import"../Icons/Attachment.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../Icons/Undo.js";import"../StatusDot/styles.module.scss";import"../Checkbox/styles.module.scss";import"../../ErrorWrapper.js";import"../ErrorWrapper/styles.module.scss";import"../../FormLayout.js";import"../FormLayout/styles.module.scss";import"../../Input.js";import"../../MaxCharacters.js";import"../MaxCharacters/styles.module.scss";import"../Input/styles.module.scss";import"../../RadioButton.js";import"../RadioButton/styles.module.scss";import"../../Select.js";import"../Icons/ChevronDown.js";import"../Select/styles.module.scss";import"../../Title.js";import"../Title/styles.module.scss";import"../FormGroup/styles.module.scss";import"./styles.module.scss";export{Y as Validation,t as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/constants.d.ts
CHANGED
|
@@ -68,6 +68,7 @@ export declare enum AnalyticsId {
|
|
|
68
68
|
HighlightBox = "highlight-box",
|
|
69
69
|
Icon = "icon",
|
|
70
70
|
Input = "input",
|
|
71
|
+
Label = "label",
|
|
71
72
|
Link = "link",
|
|
72
73
|
LinkList = "link-list",
|
|
73
74
|
List = "list",
|
|
@@ -86,6 +87,7 @@ export declare enum AnalyticsId {
|
|
|
86
87
|
Slider = "slider",
|
|
87
88
|
Spacer = "spacer",
|
|
88
89
|
StatusDot = "status-dot",
|
|
90
|
+
Sublabel = "sublabel",
|
|
89
91
|
Table = "table",
|
|
90
92
|
Tag = "tag",
|
|
91
93
|
TagList = "tag-list",
|
package/constants.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,oBAAY,QAAQ;IAClB,OAAO,KAAK;IACZ,MAAM,KAAK;IACX,KAAK,KAAK;IACV,MAAM,KAAK;IACX,KAAK,KAAK;IACV,MAAM,MAAM;CACb;AAED,oBAAY,MAAM;IAChB,KAAK,UAAU;IACf,eAAe,QAAQ;CACxB;AAED,eAAO,MAAM,0BAA0B,KAAK,CAAC;AAE7C,MAAM,WAAW,eAAe;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC9C,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACnC,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;AAEnE,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,YAAY,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EACX,EAAE,GACF,aAAa,GACb,aAAa,GACb,4BAA4B,GAC5B,QAAQ,GACR,0BAA0B,GAC1B,eAAe,GACf,iCAAiC,GACjC,YAAY,CAAC;CAClB;AAED,MAAM,MAAM,aAAa,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC;AAEjF,oBAAY,QAAQ;IAClB,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,MAAM,WAAW;IACjB,SAAS,cAAc;CACxB;AAED,oBAAY,WAAW;IACrB,MAAM,WAAW;IACjB,OAAO,YAAY;CACpB;AAED,oBAAY,WAAW;IACrB,UAAU,gBAAgB;IAC1B,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,QAAQ,aAAa;IACrB,KAAK,UAAU;IACf,QAAQ,aAAa;IACrB,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,YAAY,kBAAkB;IAC9B,oBAAoB,2BAA2B;IAC/C,iBAAiB,uBAAuB;IACxC,yBAAyB,gCAAgC;IACzD,SAAS,eAAe;IACxB,UAAU,gBAAgB;IAC1B,UAAU,gBAAgB;IAC1B,YAAY,kBAAkB;IAC9B,IAAI,SAAS;IACb,KAAK,UAAU;IACf,KAAK,UAAU;IACf,IAAI,SAAS;IACb,QAAQ,cAAc;IACtB,IAAI,SAAS;IACb,MAAM,WAAW;IACjB,IAAI,SAAS;IACb,KAAK,UAAU;IACf,iBAAiB,uBAAuB;IACxC,KAAK,UAAU;IACf,SAAS,eAAe;IACxB,OAAO,aAAa;IACpB,OAAO,aAAa;IACpB,MAAM,WAAW;IACjB,OAAO,YAAY;IACnB,WAAW,iBAAiB;IAC5B,MAAM,WAAW;IACjB,MAAM,WAAW;IACjB,MAAM,WAAW;IACjB,SAAS,eAAe;IACxB,QAAQ,aAAa;IACrB,KAAK,UAAU;IACf,GAAG,QAAQ;IACX,OAAO,aAAa;IACpB,QAAQ,aAAa;IACrB,IAAI,SAAS;IACb,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,UAAU,eAAe;CAC1B;AAED,oBAAY,gBAAgB;IAC1B,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,SAAS,cAAc;IACvB,OAAO,YAAY;IACnB,IAAI,SAAS;IACb,GAAG,QAAQ;CACZ"}
|
package/constants.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var e=(r=>(r[r.XXSmall=24]="XXSmall",r[r.XSmall=38]="XSmall",r[r.Small=48]="Small",r[r.Medium=64]="Medium",r[r.Large=80]="Large",r[r.XLarge=130]="XLarge",r))(e||{}),o=(r=>(r[r.Modal=13e5]="Modal",r[r.ExpanderTrigger=1e4]="ExpanderTrigger",r))(o||{});const
|
|
1
|
+
var e=(r=>(r[r.XXSmall=24]="XXSmall",r[r.XSmall=38]="XSmall",r[r.Small=48]="Small",r[r.Medium=64]="Medium",r[r.Large=80]="Large",r[r.XLarge=130]="XLarge",r))(e||{}),o=(r=>(r[r.Modal=13e5]="Modal",r[r.ExpanderTrigger=1e4]="ExpanderTrigger",r))(o||{});const g=12;var p=(r=>(r.onwhite="onwhite",r.ongrey="ongrey",r.onblueberry="onblueberry",r.ondark="ondark",r.oninvalid="oninvalid",r))(p||{}),a=(r=>(r.normal="normal",r.bigform="bigform",r))(a||{}),u=(r=>(r.AnchorLink="anchor-link",r.Avatar="avatar",r.Badge="badge",r.Button="button",r.Checkbox="checkbox",r.Close="close",r.Dropdown="dropdown",r.Duolist="duolist",r.Expander="expander",r.ExpanderList="expander-list",r.ExpanderListExpander="expander-list-expander",r.ExpanderHierarchy="expander-hierarchy",r.ExpanderHierarchyExpander="expander-hierarchy-expander",r.FormGroup="form-group",r.FormLayout="form-layout",r.HelpBubble="help-bubble",r.HighlightBox="highlight-box",r.Icon="icon",r.Input="input",r.Label="label",r.Link="link",r.LinkList="link-list",r.List="list",r.Loader="loader",r.Logo="logo",r.Modal="modal",r.NotificationPanel="notification-panel",r.Panel="panel",r.PanelList="panel-list",r.PopMenu="pop-menu",r.PopOver="pop-over",r.Portal="portal",r.Stepper="stepper",r.RadioButton="radio-button",r.Select="select",r.Slider="slider",r.Spacer="spacer",r.StatusDot="status-dot",r.Sublabel="sublabel",r.Table="table",r.Tag="tag",r.TagList="tag-list",r.Textarea="textarea",r.Tile="tile",r.Title="title",r.Tooltip="tooltip",r.Validation="validation",r))(u||{}),l=(r=>(r.Enter="Enter",r.Escape="Escape",r.ArrowDown="ArrowDown",r.ArrowUp="ArrowUp",r.Home="Home",r.End="End",r))(l||{});export{g as AVERAGE_CHARACTER_WIDTH_PX,u as AnalyticsId,p as FormMode,a as FormVariant,e as IconSize,l as KeyboardEventKey,o as ZIndex};
|
|
2
2
|
//# sourceMappingURL=constants.js.map
|
package/constants.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../src/constants.ts"],"sourcesContent":["export enum IconSize {\n XXSmall = 24,\n XSmall = 38,\n Small = 48,\n Medium = 64,\n Large = 80,\n XLarge = 130,\n}\n\nexport enum ZIndex {\n Modal = 1300000,\n ExpanderTrigger = 10000,\n}\n\nexport const AVERAGE_CHARACTER_WIDTH_PX = 12;\n\nexport interface HTMLButtonProps {\n autoFocus?: boolean;\n disabled?: boolean;\n form?: string;\n formAction?: string;\n formEncType?: string;\n formMethod?: string;\n formNoValidate?: boolean;\n formTarget?: string;\n name?: string;\n type?: 'submit' | 'reset' | 'button' | string;\n value?: string | string[] | number;\n id?: string;\n}\n\nexport type AnchorTarget = '_self' | '_blank' | '_parent' | '_top';\n\nexport interface HTMLAnchorProps {\n download?: string;\n href?: string;\n hrefLang?: string;\n media?: string;\n ping?: string;\n rel?: AnchorTarget;\n target?: string;\n referrerPolicy?:\n | ''\n | 'same-origin'\n | 'no-referrer'\n | 'no-referrer-when-downgrade'\n | 'origin'\n | 'origin-when-cross-origin'\n | 'strict-origin'\n | 'strict-origin-when-cross-origin'\n | 'unsafe-url';\n}\n\nexport type ButtonVariant = 'secondary' | 'tertiary' | string | undefined | null;\n\nexport enum FormMode {\n onwhite = 'onwhite',\n ongrey = 'ongrey',\n onblueberry = 'onblueberry',\n ondark = 'ondark',\n oninvalid = 'oninvalid',\n}\n\nexport enum FormVariant {\n normal = 'normal',\n bigform = 'bigform',\n}\n\nexport enum AnalyticsId {\n AnchorLink = 'anchor-link',\n Avatar = 'avatar',\n Badge = 'badge',\n Button = 'button',\n Checkbox = 'checkbox',\n Close = 'close',\n Dropdown = 'dropdown',\n Duolist = 'duolist',\n Expander = 'expander',\n ExpanderList = 'expander-list',\n ExpanderListExpander = 'expander-list-expander',\n ExpanderHierarchy = 'expander-hierarchy',\n ExpanderHierarchyExpander = 'expander-hierarchy-expander',\n FormGroup = 'form-group',\n FormLayout = 'form-layout',\n HelpBubble = 'help-bubble',\n HighlightBox = 'highlight-box',\n Icon = 'icon',\n Input = 'input',\n Link = 'link',\n LinkList = 'link-list',\n List = 'list',\n Loader = 'loader',\n Logo = 'logo',\n Modal = 'modal',\n NotificationPanel = 'notification-panel',\n Panel = 'panel',\n PanelList = 'panel-list',\n PopMenu = 'pop-menu',\n PopOver = 'pop-over',\n Portal = 'portal',\n Stepper = 'stepper',\n RadioButton = 'radio-button',\n Select = 'select',\n Slider = 'slider',\n Spacer = 'spacer',\n StatusDot = 'status-dot',\n Table = 'table',\n Tag = 'tag',\n TagList = 'tag-list',\n Textarea = 'textarea',\n Tile = 'tile',\n Title = 'title',\n Tooltip = 'tooltip',\n Validation = 'validation',\n}\n\nexport enum KeyboardEventKey {\n Enter = 'Enter',\n Escape = 'Escape',\n ArrowDown = 'ArrowDown',\n ArrowUp = 'ArrowUp',\n Home = 'Home',\n End = 'End',\n}\n"],"names":["IconSize","ZIndex","AVERAGE_CHARACTER_WIDTH_PX","FormMode","FormVariant","AnalyticsId","KeyboardEventKey"],"mappings":"AAAY,IAAAA,GAAAA,IACVA,EAAAA,EAAA,QAAU,EAAV,EAAA,UACAA,EAAAA,EAAA,OAAS,EAAT,EAAA,SACAA,EAAAA,EAAA,MAAQ,EAAR,EAAA,QACAA,EAAAA,EAAA,OAAS,EAAT,EAAA,SACAA,EAAAA,EAAA,MAAQ,EAAR,EAAA,QACAA,EAAAA,EAAA,OAAS,GAAT,EAAA,SANUA,IAAAA,GAAA,CAAA,CAAA,EASAC,GAAAA,IACVA,EAAAA,EAAA,MAAQ,IAAR,EAAA,QACAA,EAAAA,EAAA,gBAAkB,GAAlB,EAAA,kBAFUA,IAAAA,GAAA,CAAA,CAAA,EAKL,MAAMC,EAA6B,GAyC9B,IAAAC,GAAAA,IACVA,EAAA,QAAU,UACVA,EAAA,OAAS,SACTA,EAAA,YAAc,cACdA,EAAA,OAAS,SACTA,EAAA,UAAY,YALFA,IAAAA,GAAA,CAAA,CAAA,EAQAC,GAAAA,IACVA,EAAA,OAAS,SACTA,EAAA,QAAU,UAFAA,IAAAA,GAAA,CAAA,CAAA,EAKAC,GAAAA,IACVA,EAAA,WAAa,cACbA,EAAA,OAAS,SACTA,EAAA,MAAQ,QACRA,EAAA,OAAS,SACTA,EAAA,SAAW,WACXA,EAAA,MAAQ,QACRA,EAAA,SAAW,WACXA,EAAA,QAAU,UACVA,EAAA,SAAW,WACXA,EAAA,aAAe,gBACfA,EAAA,qBAAuB,yBACvBA,EAAA,kBAAoB,qBACpBA,EAAA,0BAA4B,8BAC5BA,EAAA,UAAY,aACZA,EAAA,WAAa,cACbA,EAAA,WAAa,cACbA,EAAA,aAAe,gBACfA,EAAA,KAAO,OACPA,EAAA,MAAQ,QACRA,EAAA,KAAO,OACPA,EAAA,SAAW,YACXA,EAAA,KAAO,OACPA,EAAA,OAAS,SACTA,EAAA,KAAO,OACPA,EAAA,MAAQ,QACRA,EAAA,kBAAoB,qBACpBA,EAAA,MAAQ,QACRA,EAAA,UAAY,aACZA,EAAA,QAAU,WACVA,EAAA,QAAU,WACVA,EAAA,OAAS,SACTA,EAAA,QAAU,UACVA,EAAA,YAAc,eACdA,EAAA,OAAS,SACTA,EAAA,OAAS,SACTA,EAAA,OAAS,SACTA,EAAA,UAAY,aACZA,EAAA,MAAQ,QACRA,EAAA,IAAM,MACNA,EAAA,QAAU,WACVA,EAAA,SAAW,WACXA,EAAA,KAAO,OACPA,EAAA,MAAQ,QACRA,EAAA,QAAU,UACVA,EAAA,WAAa,
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../src/constants.ts"],"sourcesContent":["export enum IconSize {\n XXSmall = 24,\n XSmall = 38,\n Small = 48,\n Medium = 64,\n Large = 80,\n XLarge = 130,\n}\n\nexport enum ZIndex {\n Modal = 1300000,\n ExpanderTrigger = 10000,\n}\n\nexport const AVERAGE_CHARACTER_WIDTH_PX = 12;\n\nexport interface HTMLButtonProps {\n autoFocus?: boolean;\n disabled?: boolean;\n form?: string;\n formAction?: string;\n formEncType?: string;\n formMethod?: string;\n formNoValidate?: boolean;\n formTarget?: string;\n name?: string;\n type?: 'submit' | 'reset' | 'button' | string;\n value?: string | string[] | number;\n id?: string;\n}\n\nexport type AnchorTarget = '_self' | '_blank' | '_parent' | '_top';\n\nexport interface HTMLAnchorProps {\n download?: string;\n href?: string;\n hrefLang?: string;\n media?: string;\n ping?: string;\n rel?: AnchorTarget;\n target?: string;\n referrerPolicy?:\n | ''\n | 'same-origin'\n | 'no-referrer'\n | 'no-referrer-when-downgrade'\n | 'origin'\n | 'origin-when-cross-origin'\n | 'strict-origin'\n | 'strict-origin-when-cross-origin'\n | 'unsafe-url';\n}\n\nexport type ButtonVariant = 'secondary' | 'tertiary' | string | undefined | null;\n\nexport enum FormMode {\n onwhite = 'onwhite',\n ongrey = 'ongrey',\n onblueberry = 'onblueberry',\n ondark = 'ondark',\n oninvalid = 'oninvalid',\n}\n\nexport enum FormVariant {\n normal = 'normal',\n bigform = 'bigform',\n}\n\nexport enum AnalyticsId {\n AnchorLink = 'anchor-link',\n Avatar = 'avatar',\n Badge = 'badge',\n Button = 'button',\n Checkbox = 'checkbox',\n Close = 'close',\n Dropdown = 'dropdown',\n Duolist = 'duolist',\n Expander = 'expander',\n ExpanderList = 'expander-list',\n ExpanderListExpander = 'expander-list-expander',\n ExpanderHierarchy = 'expander-hierarchy',\n ExpanderHierarchyExpander = 'expander-hierarchy-expander',\n FormGroup = 'form-group',\n FormLayout = 'form-layout',\n HelpBubble = 'help-bubble',\n HighlightBox = 'highlight-box',\n Icon = 'icon',\n Input = 'input',\n Label = 'label',\n Link = 'link',\n LinkList = 'link-list',\n List = 'list',\n Loader = 'loader',\n Logo = 'logo',\n Modal = 'modal',\n NotificationPanel = 'notification-panel',\n Panel = 'panel',\n PanelList = 'panel-list',\n PopMenu = 'pop-menu',\n PopOver = 'pop-over',\n Portal = 'portal',\n Stepper = 'stepper',\n RadioButton = 'radio-button',\n Select = 'select',\n Slider = 'slider',\n Spacer = 'spacer',\n StatusDot = 'status-dot',\n Sublabel = 'sublabel',\n Table = 'table',\n Tag = 'tag',\n TagList = 'tag-list',\n Textarea = 'textarea',\n Tile = 'tile',\n Title = 'title',\n Tooltip = 'tooltip',\n Validation = 'validation',\n}\n\nexport enum KeyboardEventKey {\n Enter = 'Enter',\n Escape = 'Escape',\n ArrowDown = 'ArrowDown',\n ArrowUp = 'ArrowUp',\n Home = 'Home',\n End = 'End',\n}\n"],"names":["IconSize","ZIndex","AVERAGE_CHARACTER_WIDTH_PX","FormMode","FormVariant","AnalyticsId","KeyboardEventKey"],"mappings":"AAAY,IAAAA,GAAAA,IACVA,EAAAA,EAAA,QAAU,EAAV,EAAA,UACAA,EAAAA,EAAA,OAAS,EAAT,EAAA,SACAA,EAAAA,EAAA,MAAQ,EAAR,EAAA,QACAA,EAAAA,EAAA,OAAS,EAAT,EAAA,SACAA,EAAAA,EAAA,MAAQ,EAAR,EAAA,QACAA,EAAAA,EAAA,OAAS,GAAT,EAAA,SANUA,IAAAA,GAAA,CAAA,CAAA,EASAC,GAAAA,IACVA,EAAAA,EAAA,MAAQ,IAAR,EAAA,QACAA,EAAAA,EAAA,gBAAkB,GAAlB,EAAA,kBAFUA,IAAAA,GAAA,CAAA,CAAA,EAKL,MAAMC,EAA6B,GAyC9B,IAAAC,GAAAA,IACVA,EAAA,QAAU,UACVA,EAAA,OAAS,SACTA,EAAA,YAAc,cACdA,EAAA,OAAS,SACTA,EAAA,UAAY,YALFA,IAAAA,GAAA,CAAA,CAAA,EAQAC,GAAAA,IACVA,EAAA,OAAS,SACTA,EAAA,QAAU,UAFAA,IAAAA,GAAA,CAAA,CAAA,EAKAC,GAAAA,IACVA,EAAA,WAAa,cACbA,EAAA,OAAS,SACTA,EAAA,MAAQ,QACRA,EAAA,OAAS,SACTA,EAAA,SAAW,WACXA,EAAA,MAAQ,QACRA,EAAA,SAAW,WACXA,EAAA,QAAU,UACVA,EAAA,SAAW,WACXA,EAAA,aAAe,gBACfA,EAAA,qBAAuB,yBACvBA,EAAA,kBAAoB,qBACpBA,EAAA,0BAA4B,8BAC5BA,EAAA,UAAY,aACZA,EAAA,WAAa,cACbA,EAAA,WAAa,cACbA,EAAA,aAAe,gBACfA,EAAA,KAAO,OACPA,EAAA,MAAQ,QACRA,EAAA,MAAQ,QACRA,EAAA,KAAO,OACPA,EAAA,SAAW,YACXA,EAAA,KAAO,OACPA,EAAA,OAAS,SACTA,EAAA,KAAO,OACPA,EAAA,MAAQ,QACRA,EAAA,kBAAoB,qBACpBA,EAAA,MAAQ,QACRA,EAAA,UAAY,aACZA,EAAA,QAAU,WACVA,EAAA,QAAU,WACVA,EAAA,OAAS,SACTA,EAAA,QAAU,UACVA,EAAA,YAAc,eACdA,EAAA,OAAS,SACTA,EAAA,OAAS,SACTA,EAAA,OAAS,SACTA,EAAA,UAAY,aACZA,EAAA,SAAW,WACXA,EAAA,MAAQ,QACRA,EAAA,IAAM,MACNA,EAAA,QAAU,WACVA,EAAA,SAAW,WACXA,EAAA,KAAO,OACPA,EAAA,MAAQ,QACRA,EAAA,QAAU,UACVA,EAAA,WAAa,aA/CHA,IAAAA,GAAA,CAAA,CAAA,EAkDAC,GAAAA,IACVA,EAAA,MAAQ,QACRA,EAAA,OAAS,SACTA,EAAA,UAAY,YACZA,EAAA,QAAU,UACVA,EAAA,KAAO,OACPA,EAAA,IAAM,MANIA,IAAAA,GAAA,CAAA,CAAA"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { RefObject } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Få vite når et element hovres over eller mottar fokus.
|
|
4
|
+
* @param ref Element som skal observeres
|
|
5
|
+
* @returns Objekt med ref og om objekt er hovered/focused
|
|
6
|
+
*/
|
|
7
|
+
export declare const usePseudoClasses: <T extends HTMLElement | SVGElement>(ref?: RefObject<T> | null | undefined) => {
|
|
8
|
+
refObject: RefObject<T>;
|
|
9
|
+
isHovered: boolean;
|
|
10
|
+
isFocused: boolean;
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=usePseudoClasses.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"usePseudoClasses.d.ts","sourceRoot":"","sources":["../../src/hooks/usePseudoClasses.ts"],"names":[],"mappings":"AAAA,OAAO,EAA+B,SAAS,EAAE,MAAM,OAAO,CAAC;AAE/D;;;;GAIG;AACH,eAAO,MAAM,gBAAgB;;eAEY,OAAO;eAAa,OAAO;CAyBnE,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{useRef as I,useState as L,useEffect as p}from"react";const M=t=>{const e=t||I(null),[h,s]=L(!1),[F,n]=L(!1);return p(()=>{var a,d,v,i;const r=()=>s(!0),u=()=>s(!1),o=()=>n(!0),c=()=>n(!1);return(a=e.current)==null||a.addEventListener("mouseenter",r),(d=e.current)==null||d.addEventListener("mouseleave",u),(v=e.current)==null||v.addEventListener("focusin",o),(i=e.current)==null||i.addEventListener("focusout",c),()=>{var l,f,m,E;(l=e.current)==null||l.removeEventListener("mouseenter",r),(f=e.current)==null||f.removeEventListener("mouseleave",u),(m=e.current)==null||m.removeEventListener("focusin",o),(E=e.current)==null||E.removeEventListener("focusout",c)}},[e]),{refObject:e,isHovered:h,isFocused:F}};export{M as usePseudoClasses};
|
|
2
|
+
//# sourceMappingURL=usePseudoClasses.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"usePseudoClasses.js","sources":["../../src/hooks/usePseudoClasses.ts"],"sourcesContent":["import { useRef, useEffect, useState, RefObject } from 'react';\n\n/**\n * Få vite når et element hovres over eller mottar fokus.\n * @param ref Element som skal observeres\n * @returns Objekt med ref og om objekt er hovered/focused\n */\nexport const usePseudoClasses = <T extends HTMLElement | SVGElement>(\n ref?: RefObject<T> | null\n): { refObject: RefObject<T>; isHovered: boolean; isFocused: boolean } => {\n const refObject = ref ? ref : useRef<T>(null);\n const [isHovered, setIsHovered] = useState(false);\n const [isFocused, setIsFocused] = useState(false);\n\n useEffect(() => {\n const handleMouseEnter = (): void => setIsHovered(true);\n const handleMouseLeave = (): void => setIsHovered(false);\n const handleFocusIn = (): void => setIsFocused(true);\n const handleFocusOut = (): void => setIsFocused(false);\n\n refObject.current?.addEventListener('mouseenter', handleMouseEnter);\n refObject.current?.addEventListener('mouseleave', handleMouseLeave);\n refObject.current?.addEventListener('focusin', handleFocusIn);\n refObject.current?.addEventListener('focusout', handleFocusOut);\n\n return (): void => {\n refObject.current?.removeEventListener('mouseenter', handleMouseEnter);\n refObject.current?.removeEventListener('mouseleave', handleMouseLeave);\n refObject.current?.removeEventListener('focusin', handleFocusIn);\n refObject.current?.removeEventListener('focusout', handleFocusOut);\n };\n }, [refObject]);\n\n return { refObject, isHovered, isFocused };\n};\n"],"names":["usePseudoClasses","ref","refObject","useRef","isHovered","setIsHovered","useState","isFocused","setIsFocused","useEffect","handleMouseEnter","handleMouseLeave","handleFocusIn","handleFocusOut","_a","_b","_c","_d"],"mappings":"4DAOa,MAAAA,EACXC,GACwE,CACxE,MAAMC,EAAYD,GAAYE,EAAU,IAAI,EACtC,CAACC,EAAWC,CAAY,EAAIC,EAAS,EAAK,EAC1C,CAACC,EAAWC,CAAY,EAAIF,EAAS,EAAK,EAEhD,OAAAG,EAAU,IAAM,aACR,MAAAC,EAAmB,IAAYL,EAAa,EAAI,EAChDM,EAAmB,IAAYN,EAAa,EAAK,EACjDO,EAAgB,IAAYJ,EAAa,EAAI,EAC7CK,EAAiB,IAAYL,EAAa,EAAK,EAE3C,OAAAM,EAAAZ,EAAA,UAAA,MAAAY,EAAS,iBAAiB,aAAcJ,IACxCK,EAAAb,EAAA,UAAA,MAAAa,EAAS,iBAAiB,aAAcJ,IACxCK,EAAAd,EAAA,UAAA,MAAAc,EAAS,iBAAiB,UAAWJ,IACrCK,EAAAf,EAAA,UAAA,MAAAe,EAAS,iBAAiB,WAAYJ,GAEzC,IAAY,cACPC,EAAAZ,EAAA,UAAA,MAAAY,EAAS,oBAAoB,aAAcJ,IAC3CK,EAAAb,EAAA,UAAA,MAAAa,EAAS,oBAAoB,aAAcJ,IAC3CK,EAAAd,EAAA,UAAA,MAAAc,EAAS,oBAAoB,UAAWJ,IACxCK,EAAAf,EAAA,UAAA,MAAAe,EAAS,oBAAoB,WAAYJ,EAAc,CACnE,EACC,CAACX,CAAS,CAAC,EAEP,CAAE,UAAAA,EAAW,UAAAE,EAAW,UAAAG,EACjC"}
|
package/package.json
CHANGED
|
@@ -2,8 +2,12 @@
|
|
|
2
2
|
"name": "@helsenorge/designsystem-react",
|
|
3
3
|
"type": "module",
|
|
4
4
|
"description": "The official design system for Helsenorge built with React.",
|
|
5
|
+
"repository": {
|
|
6
|
+
"type": "git",
|
|
7
|
+
"url": "https://github.com/helsenorge/designsystem"
|
|
8
|
+
},
|
|
5
9
|
"homepage": "https://helsenorge.design",
|
|
6
|
-
"version": "
|
|
10
|
+
"version": "4.1.0",
|
|
7
11
|
"author": "Helsenorge",
|
|
8
12
|
"license": "MIT",
|
|
9
13
|
"peerDependencies": {
|