Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Socket
Sign inDemoInstall

@fremtind/jkl-core

Package Overview
Dependencies
Maintainers
3
Versions
179
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@fremtind/jkl-core - npm Package Compare versions

Comparing version 10.0.2 to 10.0.3

build/cjs/components/index.js

248

build/cjs/index.js

@@ -1,222 +0,34 @@

'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var cn = require('classnames');
var React = require('react');
var _extends = require('@babel/runtime/helpers/extends');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
let mousenavigation = false;
let touchnavigation = false;
let touchEventFired = false;
const listeners = {
mousedown: handleMouseDown,
keydown: handleKeydown,
touchstart: handleTouchStart
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
function removeAllListeners() {
Object.keys(listeners).forEach(listenerType => {
document.removeEventListener(listenerType, listeners[listenerType]);
});
}
function addListener(listenerType) {
document.addEventListener(listenerType, listeners[listenerType]);
}
function handleMouseDown() {
if (!mousenavigation && !touchEventFired) {
mousenavigation = true;
touchnavigation = false;
const htmlElement = document.querySelector("html");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.setAttribute("data-mousenavigation", "true");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.removeAttribute("data-touchnavigation"); // Reset listeners
removeAllListeners();
addListener("touchstart");
addListener("keydown");
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
}
function handleKeydown(event) {
if (event.key === "Tab") {
const htmlElement = document.querySelector("html");
removeAllListeners();
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.removeAttribute("data-mousenavigation");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.removeAttribute("data-touchnavigation");
mousenavigation = false;
touchnavigation = false; // Reset listeners
addListener("touchstart");
addListener("mousedown");
}
}
function handleTouchStart() {
if (!touchnavigation) {
mousenavigation = false;
touchnavigation = true;
const htmlElement = document.querySelector("html");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.setAttribute("data-touchnavigation", "true");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.removeAttribute("data-mousenavigation"); // Reset listeners
removeAllListeners();
addListener("touchstart");
addListener("keydown");
addListener("mousedown");
} // Most touch devices fire both touch and mouse events on touch (in that order)
// see https://w3c.github.io/touch-events/#mouse-events
// Set a check variable to avoid resetting the data-attribute:
touchEventFired = true;
setTimeout(() => {
touchEventFired = false;
}, 150); // Yes, it can take this long between the events
}
function initTabListener() {
if (typeof document !== "undefined") {
addListener("touchstart");
addListener("mousedown");
}
}
function getValuePair(item) {
return typeof item === "string" ? {
value: item,
label: item
} : item;
}
const breakpoints = {
medium: 680,
large: 1200,
xl: 1600
return to;
};
const easings = Object.freeze({
standard: "ease",
entrance: "ease-out",
exit: "ease-in",
easeInBounceOut: "cubic-bezier(0, 0, 0.375, 1.17)"
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var src_exports = {};
__export(src_exports, {
Label: () => import_components.Label,
Link: () => import_components.Link,
NavLink: () => import_components.NavLink,
ScreenReaderOnly: () => import_components.ScreenReaderOnly,
SupportLabel: () => import_components.SupportLabel,
breakpoints: () => import_utils.breakpoints,
easings: () => import_utils.easings,
getValuePair: () => import_utils.getValuePair,
initTabListener: () => import_utils.initTabListener,
timings: () => import_utils.timings
});
const timings = Object.freeze({
energetic: "75ms",
productive: "150ms",
expressive: "250ms",
lazy: "400ms"
});
const Label = ({
variant = "small",
forceCompact,
srOnly,
children,
standAlone,
htmlFor,
className = ""
}) => {
const labelClassNames = cn__default["default"]("jkl-label", className, {
[`jkl-label--${variant}`]: variant,
"jkl-label--compact": forceCompact,
"jkl-label--sr-only": srOnly
});
const C = standAlone ? "label" : "span";
if (!standAlone && htmlFor) {
htmlFor = undefined;
if (process.env.NODE_ENV !== "production") {
console.warn("WARNING: The standard Label component renders as a <span> element, which does not take a htmlFor prop. If you want the Label to belong to a specific input, use the standAlone prop, which renders as a <label> element instead. In most cases the Label component should not be used directly, as it is part of all our input components.");
}
}
return /*#__PURE__*/React__default["default"].createElement(C, {
className: labelClassNames,
htmlFor: htmlFor
}, children);
};
const Link = ({
external = false,
className = "",
children,
...rest
}) => /*#__PURE__*/React__default["default"].createElement("a", _extends__default["default"]({
className: cn__default["default"]("jkl-link", className, {
"jkl-link--external": external
})
}, rest), children);
const NavLink = ({
active = false,
back = false,
className,
children,
...rest
}) => /*#__PURE__*/React__default["default"].createElement("a", _extends__default["default"]({
className: cn__default["default"]("jkl-nav-link", {
"jkl-nav-link--active": active,
"jkl-nav-link--back": back
}, className)
}, rest), children);
const ScreenReaderOnly = ({
children,
showOnFocus
}) => /*#__PURE__*/React__default["default"].createElement("span", {
className: `jkl-sr-only ${showOnFocus ? "jkl-sr-only--focusable" : ""}`
}, children);
const SupportLabel = ({
id,
helpLabel,
errorLabel,
forceCompact,
className,
srOnly,
...rest
}) => {
const hasLabel = errorLabel || helpLabel;
const componentClassName = hasLabel ? cn__default["default"]("jkl-form-support-label", className, {
"jkl-form-support-label--compact": forceCompact,
"jkl-form-support-label--error": errorLabel,
"jkl-form-support-label--help": !errorLabel,
"jkl-form-support-label--sr-only": srOnly
}) : "jkl-dormant-form-support-label";
const restProps = hasLabel ? rest : {};
return /*#__PURE__*/React__default["default"].createElement("span", _extends__default["default"]({
id: id,
className: componentClassName
}, restProps), /*#__PURE__*/React__default["default"].createElement("svg", {
className: "jkl-form-support-label__icon",
"aria-hidden": true,
viewBox: "0 0 24 24",
fill: "none",
xmlns: "http://www.w3.org/2000/svg"
}, /*#__PURE__*/React__default["default"].createElement("path", {
fillRule: "evenodd",
clipRule: "evenodd",
d: "M18.3588 20.5107L5.64157 20.5107C3.33259 20.5107 1.88917 18.0116 3.04301 16.0116L9.40163 4.98996C10.5561 2.98885 13.4443 2.98885 14.5987 4.98996L20.9574 16.0116C22.1112 18.0116 20.6678 20.5107 18.3588 20.5107ZM12.7515 13.6525L12.7515 7.63131L11.9988 7.63131L11.2462 7.63131L11.2462 13.6525L12.7515 13.6525ZM12.0012 15.0458C11.441 15.0458 10.9868 15.5 10.9868 16.0602C10.9868 16.6205 11.441 17.0747 12.0012 17.0747C12.5615 17.0747 13.0157 16.6205 13.0157 16.0602C13.0157 15.5 12.5615 15.0458 12.0012 15.0458Z",
fill: "currentColor"
})), errorLabel || helpLabel);
};
exports.Label = Label;
exports.Link = Link;
exports.NavLink = NavLink;
exports.ScreenReaderOnly = ScreenReaderOnly;
exports.SupportLabel = SupportLabel;
exports.breakpoints = breakpoints;
exports.easings = easings;
exports.getValuePair = getValuePair;
exports.initTabListener = initTabListener;
exports.timings = timings;
module.exports = __toCommonJS(src_exports);
var import_utils = require("./utils");
var import_components = require("./components");
//# sourceMappingURL=index.js.map

@@ -1,203 +0,15 @@

import cn from 'classnames';
import React from 'react';
import _extends from '@babel/runtime/helpers/extends';
let mousenavigation = false;
let touchnavigation = false;
let touchEventFired = false;
const listeners = {
mousedown: handleMouseDown,
keydown: handleKeydown,
touchstart: handleTouchStart
import { initTabListener, getValuePair, breakpoints, timings, easings } from "./utils";
import { Label, Link, NavLink, ScreenReaderOnly, SupportLabel } from "./components";
export {
Label,
Link,
NavLink,
ScreenReaderOnly,
SupportLabel,
breakpoints,
easings,
getValuePair,
initTabListener,
timings
};
function removeAllListeners() {
Object.keys(listeners).forEach(listenerType => {
document.removeEventListener(listenerType, listeners[listenerType]);
});
}
function addListener(listenerType) {
document.addEventListener(listenerType, listeners[listenerType]);
}
function handleMouseDown() {
if (!mousenavigation && !touchEventFired) {
mousenavigation = true;
touchnavigation = false;
const htmlElement = document.querySelector("html");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.setAttribute("data-mousenavigation", "true");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.removeAttribute("data-touchnavigation"); // Reset listeners
removeAllListeners();
addListener("touchstart");
addListener("keydown");
}
}
function handleKeydown(event) {
if (event.key === "Tab") {
const htmlElement = document.querySelector("html");
removeAllListeners();
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.removeAttribute("data-mousenavigation");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.removeAttribute("data-touchnavigation");
mousenavigation = false;
touchnavigation = false; // Reset listeners
addListener("touchstart");
addListener("mousedown");
}
}
function handleTouchStart() {
if (!touchnavigation) {
mousenavigation = false;
touchnavigation = true;
const htmlElement = document.querySelector("html");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.setAttribute("data-touchnavigation", "true");
htmlElement === null || htmlElement === void 0 ? void 0 : htmlElement.removeAttribute("data-mousenavigation"); // Reset listeners
removeAllListeners();
addListener("touchstart");
addListener("keydown");
addListener("mousedown");
} // Most touch devices fire both touch and mouse events on touch (in that order)
// see https://w3c.github.io/touch-events/#mouse-events
// Set a check variable to avoid resetting the data-attribute:
touchEventFired = true;
setTimeout(() => {
touchEventFired = false;
}, 150); // Yes, it can take this long between the events
}
function initTabListener() {
if (typeof document !== "undefined") {
addListener("touchstart");
addListener("mousedown");
}
}
function getValuePair(item) {
return typeof item === "string" ? {
value: item,
label: item
} : item;
}
const breakpoints = {
medium: 680,
large: 1200,
xl: 1600
};
const easings = Object.freeze({
standard: "ease",
entrance: "ease-out",
exit: "ease-in",
easeInBounceOut: "cubic-bezier(0, 0, 0.375, 1.17)"
});
const timings = Object.freeze({
energetic: "75ms",
productive: "150ms",
expressive: "250ms",
lazy: "400ms"
});
const Label = ({
variant = "small",
forceCompact,
srOnly,
children,
standAlone,
htmlFor,
className = ""
}) => {
const labelClassNames = cn("jkl-label", className, {
[`jkl-label--${variant}`]: variant,
"jkl-label--compact": forceCompact,
"jkl-label--sr-only": srOnly
});
const C = standAlone ? "label" : "span";
if (!standAlone && htmlFor) {
htmlFor = undefined;
if (process.env.NODE_ENV !== "production") {
console.warn("WARNING: The standard Label component renders as a <span> element, which does not take a htmlFor prop. If you want the Label to belong to a specific input, use the standAlone prop, which renders as a <label> element instead. In most cases the Label component should not be used directly, as it is part of all our input components.");
}
}
return /*#__PURE__*/React.createElement(C, {
className: labelClassNames,
htmlFor: htmlFor
}, children);
};
const Link = ({
external = false,
className = "",
children,
...rest
}) => /*#__PURE__*/React.createElement("a", _extends({
className: cn("jkl-link", className, {
"jkl-link--external": external
})
}, rest), children);
const NavLink = ({
active = false,
back = false,
className,
children,
...rest
}) => /*#__PURE__*/React.createElement("a", _extends({
className: cn("jkl-nav-link", {
"jkl-nav-link--active": active,
"jkl-nav-link--back": back
}, className)
}, rest), children);
const ScreenReaderOnly = ({
children,
showOnFocus
}) => /*#__PURE__*/React.createElement("span", {
className: `jkl-sr-only ${showOnFocus ? "jkl-sr-only--focusable" : ""}`
}, children);
const SupportLabel = ({
id,
helpLabel,
errorLabel,
forceCompact,
className,
srOnly,
...rest
}) => {
const hasLabel = errorLabel || helpLabel;
const componentClassName = hasLabel ? cn("jkl-form-support-label", className, {
"jkl-form-support-label--compact": forceCompact,
"jkl-form-support-label--error": errorLabel,
"jkl-form-support-label--help": !errorLabel,
"jkl-form-support-label--sr-only": srOnly
}) : "jkl-dormant-form-support-label";
const restProps = hasLabel ? rest : {};
return /*#__PURE__*/React.createElement("span", _extends({
id: id,
className: componentClassName
}, restProps), /*#__PURE__*/React.createElement("svg", {
className: "jkl-form-support-label__icon",
"aria-hidden": true,
viewBox: "0 0 24 24",
fill: "none",
xmlns: "http://www.w3.org/2000/svg"
}, /*#__PURE__*/React.createElement("path", {
fillRule: "evenodd",
clipRule: "evenodd",
d: "M18.3588 20.5107L5.64157 20.5107C3.33259 20.5107 1.88917 18.0116 3.04301 16.0116L9.40163 4.98996C10.5561 2.98885 13.4443 2.98885 14.5987 4.98996L20.9574 16.0116C22.1112 18.0116 20.6678 20.5107 18.3588 20.5107ZM12.7515 13.6525L12.7515 7.63131L11.9988 7.63131L11.2462 7.63131L11.2462 13.6525L12.7515 13.6525ZM12.0012 15.0458C11.441 15.0458 10.9868 15.5 10.9868 16.0602C10.9868 16.6205 11.441 17.0747 12.0012 17.0747C12.5615 17.0747 13.0157 16.6205 13.0157 16.0602C13.0157 15.5 12.5615 15.0458 12.0012 15.0458Z",
fill: "currentColor"
})), errorLabel || helpLabel);
};
export { Label, Link, NavLink, ScreenReaderOnly, SupportLabel, breakpoints, easings, getValuePair, initTabListener, timings };
//# sourceMappingURL=index.js.map
{
"name": "@fremtind/jkl-core",
"version": "10.0.2",
"version": "10.0.3",
"publishConfig": {

@@ -21,3 +21,7 @@ "access": "public"

"module": "./build/esm/index.js",
"browser": "./build/browser/index.js",
"browser": "./build/esm/index.js",
"sideEffects": [
"*.css",
"*.scss"
],
"directories": {

@@ -40,7 +44,7 @@ "lib": "build"

"build:types": "tsc -p tsconfig-for-declarations.json",
"build:scripts": "rollup --config ../../rollup.config.js",
"build:scripts": "node ./esbuild.prod.mjs",
"test": "echo \"Error: run tests from root\" && exit 1",
"dev:js": "ESBUILD_WATCH=true node ./esbuild.mjs",
"dev:js": "ESBUILD_WATCH=true node ./esbuild.dev.mjs",
"dev:server": "node ./dist/server.js",
"predev": "node ./esbuild.mjs",
"predev": "node ./esbuild.dev.mjs",
"dev": "run-p dev:*"

@@ -56,3 +60,2 @@ },

"dependencies": {
"@babel/runtime": "^7.17.8",
"classnames": "^2.2.6"

@@ -66,3 +69,3 @@ },

},
"gitHead": "d471a0c0caacdb01d183d59ed2e7bdc190646f61"
"gitHead": "41c541ee1ca9b890f50d931d7541d69e1ccd61ac"
}

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc