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

@ribajs/bs4

Package Overview
Dependencies
Maintainers
1
Versions
79
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@ribajs/bs4 - npm Package Compare versions

Comparing version 1.5.0 to 1.6.0

jest.config.js

26

package.json
{
"name": "@ribajs/bs4",
"description": "Bootstrap 4 module for Riba.js",
"version": "1.5.0",
"version": "1.6.0",
"author": "Pascal Garber <pascal@artandcode.studio>",

@@ -37,2 +37,3 @@ "contributors": [],

"scripts": {
"test": "npm run type-check && jest --config=jest.config.js",
"type-check": "tslint -c tslint.json 'src/**/*.ts' && tsc --noEmit",

@@ -43,14 +44,16 @@ "build": "npm run build:module",

"devDependencies": {
"@babel/cli": "^7.6.4",
"@babel/core": "^7.6.4",
"@babel/plugin-proposal-class-properties": "^7.5.5",
"@babel/cli": "^7.7.0",
"@babel/core": "^7.7.2",
"@babel/plugin-proposal-class-properties": "^7.7.0",
"@babel/plugin-proposal-object-rest-spread": "^7.6.2",
"@babel/plugin-transform-runtime": "^7.6.2",
"@babel/preset-env": "^7.6.3",
"@babel/preset-typescript": "^7.6.0",
"@types/jquery": "^3.3.28",
"@babel/preset-env": "^7.7.1",
"@babel/preset-typescript": "^7.7.2",
"@types/jest": "^24.0.22",
"babel-loader": "^8.0.6",
"babel-plugin-array-includes": "^2.0.3",
"tslint": "^5.20.0",
"typescript": "^3.6.4",
"jest": "^24.9.0",
"ts-jest": "^24.1.0",
"tslint": "^5.20.1",
"typescript": "^3.7.2",
"webpack": "^4.41.2",

@@ -60,5 +63,4 @@ "webpack-cli": "^3.3.10"

"dependencies": {
"@ribajs/core": "^1.5.0",
"@ribajs/jquery": "^1.5.0",
"@types/jquery": "^3.3.31",
"@ribajs/core": "^1.6.0",
"@ribajs/jquery": "^1.6.0",
"bootstrap": "^4.3.1",

@@ -65,0 +67,0 @@ "jquery": "^3.4.1",

@@ -6,3 +6,3 @@ # Bootstrap 4 Module

```bash
npm install --save-dev @ribajs/bs4
npm install --save @ribajs/bs4
```

@@ -9,0 +9,0 @@

@@ -1,2 +0,2 @@

import { IBinder, EventDispatcher } from '@ribajs/core';
import { Binder, EventDispatcher } from '@ribajs/core';
import { JQuery as $ } from '@ribajs/jquery';

@@ -11,3 +11,3 @@ import { CollapseService } from '../services/collapse.service';

*/
export const collapseOnUrlBinder: IBinder<string> = {
export const collapseOnUrlBinder: Binder<string> = {
name: 'bs4-collapse-on-url',

@@ -14,0 +14,0 @@ routine(el: HTMLElement, url: string) {

@@ -1,2 +0,2 @@

import { IBinder } from '@ribajs/core';
import { Binder } from '@ribajs/core';
import { JQuery as $ } from '@ribajs/jquery';

@@ -9,3 +9,3 @@ import { CollapseService } from '../services/collapse.service';

*/
export const collapseBinder: IBinder<string> = {
export const collapseBinder: Binder<string> = {
name: 'bs4-collapse',

@@ -12,0 +12,0 @@ routine(el: HTMLElement, targetSelector: string) {

@@ -1,2 +0,2 @@

import { IBinder } from '@ribajs/core';
import { Binder } from '@ribajs/core';
import { JQuery as $ } from '@ribajs/jquery';

@@ -9,3 +9,3 @@ import { DropdownService } from '../services/dropdown.service';

*/
export const dropdownBinder: IBinder<string> = {
export const dropdownBinder: Binder<string> = {
name: 'bs4-dropdown',

@@ -12,0 +12,0 @@ routine(el: HTMLElement, option: string) {

@@ -1,2 +0,2 @@

import { IBinder, EventDispatcher } from '@ribajs/core';
import { Binder, EventDispatcher } from '@ribajs/core';
import { JQuery as $ } from '@ribajs/jquery';

@@ -11,3 +11,3 @@ import { CollapseService } from '../services/collapse.service';

*/
export const expanOnUrlBinder: IBinder<string> = {
export const expanOnUrlBinder: Binder<string> = {
name: 'bs4-expan-on-url',

@@ -14,0 +14,0 @@ routine(el: HTMLElement, url: string) {

@@ -1,2 +0,2 @@

import { Riba } from '@ribajs/core';
import { Riba, dotAdapter } from '@ribajs/core';

@@ -6,10 +6,21 @@ import { scrollToOnEventBinder } from './scroll-to-on-event.binder';

describe('riba.binders', () => {
let el: HTMLUnknownElement;
let el: HTMLDivElement;
let scrollToMeEl: HTMLDivElement;
let fragment: DocumentFragment;
const model: any = {};
const riba = new Riba();
riba.module.adapter.regist(dotAdapter);
riba.module.binder.regist(scrollToOnEventBinder);
beforeEach(() => {
fragment = document.createDocumentFragment();
el = document.createElement('div');
document.body.appendChild(el);
el.setAttribute('rv-scroll-to-on-click', '#scrollToMe');
fragment.appendChild(el);
scrollToMeEl = document.createElement('div');
scrollToMeEl.id = '#scrollToMe';
fragment.appendChild(el);
});

@@ -25,7 +36,6 @@

describe('ScrollToOnEvent', () => {
it('sets the element\'s text content', () => {
(riba.binders['test-app-example'] as any).routine(el, '<em>hello</em>');
expect(el.innerHTML).toEqual('<em>hello</em> from test-app-example <strong>binder</strong>!');
it('Should bind riba without an error', () => {
riba.bind(fragment, model);
});
});
});

@@ -1,4 +0,4 @@

import { IBinder, Utils } from '@ribajs/core';
import { Binder, Utils } from '@ribajs/core';
export const scrollToOnEventBinder: IBinder<string> = {
export const scrollToOnEventBinder: Binder<string> = {
name: 'scroll-to-on-*',

@@ -5,0 +5,0 @@ bind(el: HTMLUnknownElement) {

@@ -1,2 +0,2 @@

import { IBinder } from '@ribajs/core';
import { Binder } from '@ribajs/core';

@@ -7,3 +7,3 @@ /**

*/
export const scrollspyClassBinder: IBinder<string> = {
export const scrollspyClassBinder: Binder<string> = {
name: 'bs4-scrollspy-*',

@@ -10,0 +10,0 @@ bind(el: HTMLElement) {

@@ -8,3 +8,3 @@ import Popper from 'popper.js'; // /dist/umd/popper

*/
import { IBinder, Debug } from '@ribajs/core';
import { Binder } from '@ribajs/core';
import { JQuery as $ } from '@ribajs/jquery';

@@ -16,8 +16,6 @@

const debug = Debug('binder:rv-bs4-tooltip');
/**
*
*/
export const tooltipBinder: IBinder<string> = {
export const tooltipBinder: Binder<string> = {
name: 'bs4-tooltip',

@@ -46,8 +44,2 @@ block: false,

},
onCreate: (data) => {
debug('onCreate');
},
onUpdate: (data) => {
debug('onUpdate');
},
});

@@ -69,3 +61,2 @@ this.customData.$tip.appendTo(document.body);

routine(el: HTMLElement, text: string) {
debug('TODO routine');
this.customData.$tip.find('.tooltip-inner').html(text);

@@ -72,0 +63,0 @@ },

import { IRibaModule } from '@ribajs/core';
import { RibaModule } from '@ribajs/core';

@@ -8,3 +8,3 @@ import * as binders from './binders';

import * as services from './services';
export const bs4Module: IRibaModule = {
export const bs4Module: RibaModule = {
binders,

@@ -11,0 +11,0 @@ services,

@@ -1,5 +0,2 @@

import {
Component,
Debug,
} from '@ribajs/core';
import { Component } from '@ribajs/core';

@@ -58,4 +55,2 @@ import template from './bs4-contents.component.html';

protected debug = Debug('component:' + Bs4ContentsComponent.tagName);
protected scope: Scope = {

@@ -72,13 +67,5 @@ headersDepth: 1,

super(element);
this.debug('constructor', this);
this.init(Bs4ContentsComponent.observedAttributes);
}
protected async init(observedAttributes: string[]) {
return super.init(observedAttributes)
.then((view) => {
return view;
});
}
protected getIdFromElementOrParent(element: HTMLElement, depth = 1): string | null {

@@ -98,7 +85,5 @@ if (element.id) {

const headerElements = wrapperElement.querySelectorAll('h' + headersStart) as NodeListOf<HTMLHeadingElement>;
this.debug(`search for h${headersStart} in`, wrapperElement);
headerElements.forEach((headerElement) => {
const id = this.getIdFromElementOrParent(headerElement);
if (!id) {
this.debug('Ignore element because it has no id', headerElement);
return;

@@ -112,4 +97,2 @@ }

});
this.debug('Header pushed', id);
this.debug('headersDepth <= headersStart + 1', headersDepth <= headersStart + 1, headersDepth, headersStart + 1);
if (headerElement.parentElement && headersDepth >= headersStart + 1) {

@@ -122,3 +105,2 @@ this.pushHeaders(headerElement.parentElement, headersStart + 1, headersDepth, pushTo[pushTo.length - 1].childs);

protected async beforeBind() {
this.debug('beforeBind');
if (this.scope.headerParentSelector && this.scope.headersStart && this.scope.headersDepth) {

@@ -155,6 +137,4 @@ this.wrapperElement = document.querySelector(this.scope.headerParentSelector) || undefined;

if (this.el.hasChildNodes()) {
this.debug('Do not use template, because element has child nodes');
return null;
} else {
this.debug('Use template', template);
return template;

@@ -161,0 +141,0 @@ }

@@ -1,2 +0,1 @@

import Debug from 'debug';
import { Component } from '@ribajs/core';

@@ -8,4 +7,2 @@

protected debug = Debug('component:' + Bs4IconComponent.tagName);
static get observedAttributes() {

@@ -33,3 +30,2 @@ return ['size', 'width', 'height', 'src', 'color', 'direction'];

public attributeChangedCallback(name: string, oldValue: any, newValue: any, namespace: string | null) {
this.debug('attributeChangedCallback', name, oldValue, newValue, namespace);
// injects the changed attributes to scope

@@ -58,5 +54,19 @@ super.attributeChangedCallback(name, oldValue, newValue, namespace);

if (name === 'color') {
this.el.style.color = newValue;
this.el.className.replace(/(^|\s)color-\S+/g, '');
this.el.classList.add(`color-${newValue}`);
if (newValue.indexOf(',') !== -1) {
newValue = newValue.split(',');
if (newValue.length > 0) {
this.el.className.replace(/(^|\s)color-\S+/g, '');
for (let i = 0; i < newValue.length; i++) {
const newColor: string = newValue[i];
if (newColor.startsWith('#') || newColor.startsWith('rgb')) {
this.el.style.color = newColor;
}
this.el.classList.add(`color-${newColor}`);
}
}
} else {
this.el.style.color = newValue;
this.el.className.replace(/(^|\s)color-\S+/g, '');
this.el.classList.add(`color-${newValue}`);
}
}

@@ -66,5 +76,4 @@

const size = newValue;
this.debug('set size', this.el);
this.el.style.height = size;
this.el.style.width = size;
this.el.style.height = size + 'px';
this.el.style.width = size + 'px';
this.el.className.replace(/(^|\s)size-\S+/g, '');

@@ -76,4 +85,3 @@ this.el.classList.add(`size-${size}`);

const width = newValue;
this.debug('set width', this.el);
this.el.style.width = width;
this.el.style.width = width + 'px';
this.el.className.replace(/(^|\s)width-\S+/g, '');

@@ -85,4 +93,3 @@ this.el.classList.add(`width-${width}`);

const height = newValue;
this.debug('set height', this.el);
this.el.style.height = height;
this.el.style.height = height + 'px';
this.el.className.replace(/(^|\s)height-\S+/g, '');

@@ -113,4 +120,2 @@ this.el.classList.add(`height-${height}`);

this.el.style.height = newValue;
this.el.style.width = newValue;
this.el.className.replace(/(^|\s)direction-\S+/g, '');

@@ -117,0 +122,0 @@ this.el.className.replace(/(^|\s)rotate-\S+/g, '');

@@ -1,5 +0,1 @@

import {
Debug,
} from '@ribajs/core';
import { Bs4ContentsComponent, Scope as Bs4ContentsComponentScope } from '../bs4-contents/bs4-contents.component';

@@ -39,4 +35,2 @@

protected debug = Debug('component:' + Bs4ScrollspyComponent.tagName);
protected scope: Scope = {

@@ -55,3 +49,2 @@ headersDepth: 1,

super(element);
this.debug('constructor', this);
this.init(Bs4ScrollspyComponent.observedAttributes);

@@ -67,6 +60,4 @@ }

if (this.el.hasChildNodes()) {
this.debug('Do not use template, because element has child nodes');
return null;
} else {
this.debug('Use template', template);
return template;

@@ -73,0 +64,0 @@ }

import {
Component,
Debug,
EventDispatcher,

@@ -8,7 +7,5 @@ Utils,

import template from './bs4-sidebar.component.html';
type State = 'overlay-left' | 'overlay-right' | 'side-left' | 'side-right' | 'hidden';
interface IScope {
interface Scope {
/**

@@ -88,6 +85,4 @@ * Selector string to get the container element from DOM

protected debug = Debug('component:' + Bs4SidebarComponent.tagName);
protected scope: Scope = {
protected scope: IScope = {
// template properties

@@ -115,3 +110,2 @@ containerSelector: undefined,

super(element);
this.debug('constructor', this);
this.init(Bs4SidebarComponent.observedAttributes);

@@ -154,3 +148,2 @@ this.style = window.getComputedStyle(this.el);

protected onToggle(targetId: string) {
this.debug('toggle targetId', targetId);
this.toggle();

@@ -188,3 +181,2 @@ }

protected onStateChange() {
this.debug('state changed: ' + this.scope.state);
switch (this.scope.state) {

@@ -243,3 +235,2 @@ case 'side-left':

protected initContainers() {
this.debug('initContainers', this.scope.containerSelector);
const containers = this.getContainers();

@@ -254,3 +245,4 @@ this.setContainersStyle(containers);

if (containers) {
for (const container of containers) {
for (let i = 0; i < containers.length; i++) {
const container = containers[i];
this.setContainerStyle(container, style, move);

@@ -299,11 +291,3 @@ }

protected async init(observedAttributes: string[]) {
return super.init(observedAttributes)
.then((view) => {
return view;
});
}
protected async beforeBind() {
this.debug('beforeBind');
this.initRouterEventDispatcher();

@@ -314,3 +298,2 @@ this.onEnviromentChanges();

protected async afterBind() {
this.debug('afterBind', this.scope);
this.onEnviromentChanges();

@@ -339,11 +322,7 @@ }

protected template() {
// Only set the component template if there no childs already
if (this.el.hasChildNodes()) {
this.debug('Do not use template, because element has child nodes');
return null;
} else {
this.debug('Use template', template);
return template;
if (!this.el.hasChildNodes()) {
console.warn('No child elements found, this component as no template so you need to define your own as child of this component.');
}
return null;
}
}
import {
Component,
Debug,
EventDispatcher,
} from '@ribajs/core';
import template from './bs4-toggle-button.component.html';
type State = 'undefined' | 'overlay-left' | 'overlay-right' | 'side-left' | 'side-right' | 'hidden';
interface IScope {
interface Scope {
targetId?: string;

@@ -28,7 +25,5 @@ toggle: Bs4ToggleButtonComponent['toggle'];

protected debug = Debug('component:' + Bs4ToggleButtonComponent.tagName);
protected eventDispatcher?: EventDispatcher;
protected scope: IScope = {
protected scope: Scope = {
targetId: undefined,

@@ -42,3 +37,2 @@ toggle: this.toggle,

super(element);
this.debug('constructor', this);
this.init(Bs4ToggleButtonComponent.observedAttributes);

@@ -48,3 +42,2 @@ }

public toggle() {
this.debug('toggle');
if (this.eventDispatcher) {

@@ -68,17 +61,2 @@ this.eventDispatcher.trigger('toggle', this.scope.targetId);

protected async init(observedAttributes: string[]) {
return super.init(observedAttributes)
.then((view) => {
return view;
});
}
protected async beforeBind() {
this.debug('beforeBind');
}
protected async afterBind() {
this.debug('afterBind', this.scope);
}
protected requiredAttributes() {

@@ -108,11 +86,7 @@ return ['targetId'];

protected template() {
// Only set the component template if there no childs already
if (this.el.hasChildNodes()) {
this.debug('Do not use template, because element has child nodes');
return null;
} else {
this.debug('Use template', template);
return template;
if (!this.el.hasChildNodes()) {
console.warn('No child elements found, this component as no template so you need to define your own as child of this component.');
}
return null;
}
}

@@ -1,2 +0,2 @@

import { Component, Debug, IBinder } from '@ribajs/core';
import { Component, Binder } from '@ribajs/core';
import { JQuery as $ } from '@ribajs/jquery';

@@ -9,3 +9,2 @@ import { DropdownService } from '../../services/dropdown.service';

protected debug = Debug('component:bs4-dropdown');
protected scope: any = {

@@ -28,4 +27,3 @@ toggle: this.toggle,

public toggle(context: IBinder<any>, event: Event) {
this.debug('toggle');
public toggle(context: Binder<any>, event: Event) {
event.preventDefault();

@@ -32,0 +30,0 @@ event.stopPropagation();

@@ -1,2 +0,2 @@

import { Component, Debug, EventDispatcher, IBinder } from '@ribajs/core';
import { Component, EventDispatcher, Binder } from '@ribajs/core';
import { CollapseService } from '../../services/collapse.service';

@@ -9,3 +9,2 @@ import { JQuery as $ } from '@ribajs/jquery';

protected debug = Debug('component:bs4-navbar');
protected scope: any = {

@@ -56,4 +55,3 @@ toggle: this.toggle,

public toggle(context: IBinder<any>, event: Event) {
this.debug('toggle');
public toggle(context: Binder<any>, event: Event) {
this.collapseService.toggle();

@@ -60,0 +58,0 @@ event.preventDefault();

@@ -1,2 +0,2 @@

import { Component, Debug, Binding, handleizeFormatter } from '@ribajs/core';
import { Component, Binding, handleizeFormatter } from '@ribajs/core';
import template from './tabs.component.html';

@@ -22,3 +22,2 @@

protected debug = Debug('component:' + TabsComponent.tagName);
protected scope: Scope = {

@@ -115,3 +114,2 @@ tabs: new Array<Tab>(),

tab.active = true;
this.debug('activate', event);
if (event) {

@@ -163,4 +161,2 @@ event.preventDefault();

this.debug('constructor', this.el, this.tabs, this.tabPanes);
if (this.tabs) {

@@ -181,5 +177,3 @@ this.tabs.forEach(((tab) => {

protected addTabByAttribute(attributeName: string, newValue: string) {
this.debug('addTabByAttribute');
const index = Number(attributeName.replace(/[^0-9]/g, ''));
this.debug('index', index);
if (index >= this.scope.tabs.length) {

@@ -198,3 +192,2 @@ this.resizeTabsArray(index + 1);

}
this.debug('this.scope', this.scope);

@@ -238,3 +231,2 @@ // if is first tab

super.parsedAttributeChangedCallback(attributeName, oldValue, newValue, namespace);
this.debug('parsedAttributeChangedCallback', attributeName);
if (attributeName.startsWith('tab')) {

@@ -258,3 +250,2 @@ this.addTabByAttribute(attributeName, newValue);

this.el.childNodes.forEach((child) => {
this.debug('child', child);
allAreTemplates = allAreTemplates && (child.nodeName === 'TEMPLATE' || child.nodeName === '#text');

@@ -268,6 +259,4 @@ });

if (!this.el.hasChildNodes() || this.onlyTemplateChilds()) {
this.debug('Use template', template);
return template;
} else {
this.debug('Do not use template, because element has child nodes');
return null;

@@ -274,0 +263,0 @@ }

import Popper from 'popper.js'; // /dist/umd/popper
import { Debug } from '@ribajs/core';
import { JQuery as $ } from '@ribajs/jquery';

@@ -225,4 +224,2 @@

private debug = Debug('service:DropdownService');
constructor(element: HTMLButtonElement | HTMLAnchorElement, config?: any) {

@@ -243,3 +240,2 @@ this._element = element;

public close() {
this.debug('close');
return DropdownService.close(this._element, $(this._menu));

@@ -249,3 +245,2 @@ }

public show() {
this.debug('show');
const relatedTarget = {

@@ -273,4 +268,2 @@ relatedTarget: this._element,

this.debug('toggle');
const parent = DropdownService._getParentFromElement(this._element);

@@ -277,0 +270,0 @@ const isActive = $(this._menu).hasClass(CLASSNAME.SHOW);

{
"extends": "../../tsconfig.json",
"compilerOptions": {
"module": "commonjs",
"target": "es2017",
"typeRoots": ["./node_modules/@ribajs/core/src/types", "./node_modules/@types"],
"outDir": "dist",
"declaration": true,
"inlineSourceMap": true,
"baseUrl": "./src/",
"outDir": "./lib/",
"noUnusedLocals": true,
"esModuleInterop": true
"typeRoots": ["./node_modules/@types", "./src/types"],
"types": ["jest"]
},
"include": ["src"],
"types": ["jest"]
"include": ["*.ts", "**/*.ts"]
}

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