The angular-package supports the development process of angular-based applications in varied ways through the thoughtful, reusable, easy-to-use small pieces of code called packages.
Features to handle properties.
export {
// Class.
Property,
WrapProperty,
} from './lib';
export {
// Class.
Descriptor,
Descriptors,
// Interface.
AccessorDescriptor,
CommonDescriptor,
DataDescriptor,
// Type.
ThisAccessorDescriptor,
} from './descriptor';
export { GetterCallback, SetterCallback } from './type';
Checks
Is to check the provided value to be the same as expected.
Type guard (constrain)
Constrains the parameter type to not let input unexpected value in the code editor.
Guards
Is a combination of both above, constrains the type of the parameter in the code editor, and checks its argument.
Sets
Sets the provided value in the
object
.
Defines
Returns defined value from the method, instead of storing it in the
object
.
This package was generated by the skeleton workspace with Angular CLI version 14.2.0
.
Copy this package to the packages/property
folder of the skeleton workspace then run the commands below.
Run ng generate component component-name --project property
to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module --project property
.
Note: Don't forget to add
--project property
or else it will be added to the default project in yourangular.json
file.
Run ng build property
to build the project. The build artifacts will be stored in the dist/
directory.
After building your library with ng build property
, go to the dist folder cd dist/property
and run npm publish
.
Run ng test property
to execute the unit tests via Karma.
To get more help on the Angular CLI use ng help
or go check out the Angular CLI Overview and Command Reference page.
Install @angular-package/property
package with command:
npm i --save @angular-package/property
Wrapper for the ResultCallback
type function to throw an Error
with the specified message on the specified false
or true
state.
export const errorCallback: ErrorCallback = (
message: string,
on: boolean = false
): ResultCallback => {
return (result: boolean, value: any): boolean => {
if (result === on) {
throw new Error(
`${message}, got value ${
typeof value === 'object' ? JSON.stringify(value) : value
}`
);
}
return result;
};
};
Descriptor features to import.
// Class.
export {
Descriptor,
Descriptors
} from './lib';
// Interface.
export {
AccessorDescriptor,
CommonDescriptor,
DataDescriptor
} from './interface';
// Type.
export {
ThisAccessorDescriptor
} from './type';
Handles object property descriptor.
Features:
- Strictly defines accessor and data descriptor with the
defineAccessor()
anddefineData()
static methods. - Strictly sets, and stores accessor and data descriptor with the
Descriptor
instance respectivelyset.accessor()
andset.data()
methods of the instance. - Get privately stored accessor descriptor defined by the
set.accessor()
method by usingget.accessor
property of the instance. - Get privately stored data descriptor defined by the
set.data()
method by usingget.data
property of the instance.
Strictly means, it guards provided descriptor by checking it against its unique keys and by picking only properties that belong to the appropriate descriptor.
Descriptor<Value, Obj = any> { ... }
Returns defined accessor descriptor of a ThisAccessorDescriptor<Value, Obj>
type, on get
or set
property detected.
static defineAccessor<Value, Obj>(
descriptor: ThisAccessorDescriptor<Value, Obj>,
callback?: ResultCallback
): ThisAccessorDescriptor<Value, Obj> { ... }
Generic type variables:
Name | Description |
---|---|
Value |
Guards the value type of the get() and set() methods of the descriptor object, and in the return type ThisAccessorDescriptor<Value, Obj> |
Obj |
Gives the possibility to use the this keyword that refers to the Obj variable inside the get() and set() methods of the descriptor object, and in the return type ThisAccessorDescriptor<Value, Obj> |
Parameters:
Name: type |
Description |
---|---|
descriptor: ThisAccessorDescriptor<Value, Obj> |
An object of a ThisAccessorDescriptor<Value, Obj> type to define with the default values of the CommonDescriptor |
callback?: ResultCallback |
An optional ResultCallback function to handle the result of the check whether or not the descriptor is an object with get or set property, by default it uses accessorCallback() function |
Throws:
Throws an Error
if the descriptor
is not an object
of a ThisAccessorDescriptor<Value, Obj>
type, which means it doesn't contain get
or set
property.
Returns:
The return value is an object
of a ThisAccessorDescriptor<Value, Obj>
type.
Usage:
// Example usage.
import { Descriptor } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = Descriptor.defineAccessor<string, Person>({
configurable: false,
enumerable: false,
get(): string {
return people.firstName;
},
set(value: string): void {
people.firstName = value;
},
});
// Define the property `firstName` in the `person` object to link with the same property in the `people` object.
// Changes to the property `firstName` in the `person` object affect the property `firstName` in the `people` object.
Object.defineProperty(person, 'firstName', firstNameDescriptor);
Returns defined data descriptor of a DataDescriptor<Value>
interface, on writable
or value
property detected.
static defineData<Value>(
descriptor: DataDescriptor<Value>,
callback: ResultCallback = dataCallback
): DataDescriptor<Value> { ... }
Generic type variables:
Name | Description |
---|---|
Value |
Guards the value property from the descriptor object, and the return type of a DataDescriptor<Value> interface |
Parameters:
Name: type |
Description |
---|---|
descriptor: DataDescriptor<Value> |
An object of a DataDescriptor<Value> interface to define with the default values of the CommonDescriptor |
callback?: ResultCallback |
An optional ResultCallback function to handle the result of the check whether or not the descriptor is an object with writable or value property, by default it uses dataCallback() function |
Throws:
Throws an Error
if the descriptor
is not an object
of a DataDescriptor<Value>
type, which means it doesn't contain writable
or value
property.
Returns:
The return value is an object
of a DataDescriptor<Value>
interface.
Usage:
// Example usage.
import { Descriptor } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = Descriptor.defineData<string>({
configurable: false,
enumerable: false,
writable: false,
value: people.firstName
});
// Defines the property `firstName` of a type string in the `person` object with the same value as the property in the `people` object.
Object.defineProperty(person, 'firstName', firstNameDescriptor);
Returns property descriptor from the property of the specified detected object.
public static get<Obj, Name extends keyof Obj>(
object: Obj,
name: Name
): PropertyDescriptor | undefined { ... }
Returns property descriptors from the specified detected object.
public static getAll<Obj extends object | Function>(
object: Obj
): ObjectPropertyDescriptors<Obj> { ... }
Strictly defines, sets, and stores privately property accessor descriptor of a ThisAccessorDescriptor<Value, Obj>
type.
Strictly means, methods picks
configurable
,enumerable
,get
,set
properties from the provideddescriptor
object.
Features:
- Guarded process of defining the object descriptor, but properties are not being checked against proper values.
- Strictly defines property accessor descriptor.
- Strictly sets, and stores at the same time property accessor descriptor.
- Accessor descriptor is of a
ThisAccessorDescriptor<Value, Obj>
type: The return value of theget()
function is of a genericValue
type. The parameter of theset()
function is of a genericValue
type. Keywordthis
refers to anObj
variable in bothget()
andset()
functions. - Method
set()
of the instance and staticdefine()
picksconfigurable
,enumerable
,get
,set
properties from the provided data. - Get privately stored accessor descriptor defined by the
set()
method of the instance.
AccessorDescriptors<Value, Obj = any> { ... }
Returns defined accessor descriptor of a ThisAccessorDescriptor<Value, Obj>
type, on get
or set
property detected.
static define<Value, Obj>(
descriptor: ThisAccessorDescriptor<Value, Obj>,
callback?: ResultCallback
): ThisAccessorDescriptor<Value, Obj> { ... }
Generic type variables:
Name | Description |
---|---|
Value |
Guards the value type of the get() and set() functions of the descriptor object, and the return type ThisAccessorDescriptor<Value, Obj> |
Obj |
Gives the possibility to use the this keyword that refers to the Obj variable inside the get() and set() functions of the descriptor object, and in the return type ThisAccessorDescriptor<Value, Obj> |
Parameters:
Name: type |
Description |
---|---|
descriptor: ThisAccessorDescriptor<Value, Obj> |
An object of a ThisAccessorDescriptor<Value, Obj> type to define with the default values of the CommonDescriptor |
callback?: ResultCallback |
An optional ResultCallback function to handle the result of the check whether or not the descriptor is an object with get or set property, by default it uses accessorCallback() function |
Throws:
Throws an Error
if the descriptor
is not an object
of a ThisAccessorDescriptor<Value, Obj>
type, which means it doesn't contain get
or set
property.
Returns:
The return value is an object
of a ThisAccessorDescriptor<Value, Obj>
type.
Usage:
// Example usage.
import { AccessorDescriptors } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = AccessorDescriptors.define<string, Person>({
get(): string {
return people.firstName;
},
set(value: string): void {
people.firstName = value;
},
});
// Define the property `firstName` in the `person` object to link with the same property in the `people` object.
// Changes to the property `firstName` in the `person` object affect the property `firstName` in the `people` object.
Object.defineProperty(person, 'firstName', firstNameDescriptor);
Creates an instance, and optionally sets an accessor descriptor of a ThisAccessorDescriptor<Value, Obj>
type.
AccessorDescriptors<Value, Obj>(descriptor?: ThisAccessorDescriptor<Value, Obj>)
Generic type variables:
Name | Description |
---|---|
Value |
Guards the value type of the get() and set() functions of the descriptor object |
Obj |
Gives the possibility to use the this keyword that refers to the Obj variable inside the get() and set() functions of the descriptor object |
Parameters:
Name: type |
Description |
---|---|
descriptor?: ThisAccessorDescriptor<Value, Obj> |
An optional object of a ThisAccessorDescriptor<Value, Obj> type to initially set accessor descriptor |
Usage:
// Example usage.
import { AccessorDescriptors } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = new AccessorDescriptors<string, Person>({
get(): string {
return people.firstName;
},
set(value: string): void {
people.firstName = value;
},
});
Strictly sets with the last saved descriptor values, and stores privately accessor descriptor of a ThisAccessorDescriptor<Value, Obj>
type.
set(
descriptor: ThisAccessorDescriptor<Value, Obj>,
callback?: ResultCallback
): this { ... }
Parameters:
Name: type |
Description |
---|---|
descriptor: ThisAccessorDescriptor<Value, Obj> |
An object of a ThisAccessorDescriptor<Value, Obj> interface, to set with the last saved descriptor values |
callback?: ResultCallback |
An optional ResultCallback function to handle the result of the check whether or not the descriptor is an object containing the get or set property, by default it uses accessorCallback() from the static guard() method |
Throws:
Throws an Error
if the descriptor
is not an object
of a ThisAccessorDescriptor<Value, Obj>
type, which means doesn't contain get
or set
property.
Returns:
The return value is the AccessorDescriptors
instance for the chaining.
Usage:
// Example usage.
import { AccessorDescriptors } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = new AccessorDescriptors<string, Person>().set({
configurable: false,
enumerable: false,
get(): string {
return people.firstName;
},
set(value: string): void {
people.firstName = value;
},
});
Get privately stored accessor descriptor of a ThisAccessorDescriptor<Value, Obj>
type defined by the set()
method.
get get(): ThisAccessorDescriptor<Value, Obj> { ... }
Usage:
// Example usage.
import { AccessorDescriptors } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = new AccessorDescriptors<string, Person>().set({
configurable: false,
enumerable: false,
get(): string {
return people.firstName;
},
set(value: string): void {
people.firstName = value;
},
});
// Define the property `firstName` in the `person` object to link with the same property in the `people` object.
// Changes to the property `firstName` in the `person` object affect the property `firstName` in the `people` object.
Object.defineProperty(person, 'firstName', firstNameDescriptor.get);
Strictly defines, sets, and stores privately property data descriptor of a DataDescriptor<Value>
interface.
Strictly means, data descriptor of a
DataDescriptor<Value>
is type guarded and methods picksconfigurable
,enumerable
,writable
,value
properties from the provideddescriptor
object.
Features:
- Data descriptor is of a
DataDescriptor<Value>
interface: Thevalue
property is of a genericValue
type. - Guarded process of defining the object descriptor, but properties are not being checked against proper values.
- Strictly defines property data descriptor.
- Strictly sets, and stores at the same time property data descriptor.
- Method
set()
of the instance and staticdefine()
picksconfigurable
,enumerable
,writable
,value
properties from the provided data. - Get privately stored data descriptor defined by the
set()
method of the instance.
DataDescriptors<Value> { ... }
Returns strictly defined data descriptor of a DataDescriptor<Value>
interface, on writable
or value
property detected.
static define<Value>(
descriptor: DataDescriptor<Value>,
callback?: ResultCallback
): DataDescriptor<Value> { ... }
Generic type variables:
Name | Description |
---|---|
Value |
Constrains the value property from the descriptor object, and the return type of a DataDescriptor<Value> interface |
Parameters:
Name: type |
Description |
---|---|
descriptor: DataDescriptor<Value> |
An object of a DataDescriptor<Value> interface, to set with the default values of the CommonDescriptor |
callback?: ResultCallback |
An optional ResultCallback function to handle the result of the check whether or not the descriptor is an object with writable or value property, by default it uses dataCallback() function from the static guard() method |
Throws:
Throws an Error
if the descriptor
is not an object
of a DataDescriptor<Value>
interface, which means it doesn't contain writable
or value
property.
Returns:
The return value is an object
of a DataDescriptor<Value>
interface.
Usage:
// Example usage.
import { DataDescriptors } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = DataDescriptor.define<string, Person>({
get(): string {
return people.firstName;
},
set(value: string): void {
people.firstName = value;
},
});
// Define the property `firstName` in the `person` object to link with the same property in the `people` object.
// Changes to the property `firstName` in the `person` object affect the property `firstName` in the `people` object.
Object.defineProperty(person, 'firstName', firstNameDescriptor);
Creates an instance, and optionally sets a data descriptor of a DataDescriptor<Value>
interface.
DataDescriptors<Value>(descriptor?: DataDescriptor<Value>)
Generic type variables:
Name | Description |
---|---|
Value |
Guards the value property from the descriptor object |
Parameters:
Name: type |
Description |
---|---|
descriptor?: DataDescriptor<Value> |
An optional object of a DataDescriptor<Value> interface to initially set data descriptor |
Usage:
// Example usage.
import { DataDescriptors } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = new DataDescriptors<string>({ // Initialize
writable: false,
value: 'not writable'
});
Strictly sets with the last saved descriptor values, and stores privately data descriptor of a DataDescriptor<Value>
interface.
set(
descriptor: DataDescriptor<Value>,
callback?: ResultCallback
): this { ... }
Generic type variables:
Name | Description |
---|---|
Value |
Guards the value property from the descriptor object |
Parameters:
Name: type |
Description |
---|---|
descriptor: DataDescriptor<Value> |
An object of a DataDescriptor<Value> interface, to set with the last saved descriptor |
callback?: ResultCallback |
An optional ResultCallback function to handle the result of the check whether or not the descriptor is an object containing the writable or value property, by default it uses dataCallback() function from the static guard() method |
Throws:
Throws an Error
if the descriptor
is not an object
of a DataDescriptor<Value>
type, which means doesn't contain writable
or value
property.
Returns:
The return value is the DataDescriptors
instance for the chaining.
Usage:
// Example usage.
import { DataDescriptors } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = new DataDescriptors<string>()
.set({
configurable: false,
enumerable: false,
writable: false,
value: people.firstName
});
// Defines the property `firstName` in the `person` object with the same value as the property in the `people` object.
Object.defineProperty(person, 'firstName', firstNameDescriptor.get);
Get privately stored data descriptor of a DataDescriptor<Value>
interface defined by the instance set()
method.
get get(): DataDescriptor<Value> { ... }
Usage:
// Example usage.
import { DataDescriptors } from '@angular-package/property';
interface PersonShape {
firstName: string;
}
class Person implements PersonShape {
firstName = '';
}
class People {
firstName!: string;
}
const person: Person = new Person();
const people: People = new People();
const firstNameDescriptor = new DataDescriptors<string>()
.set({
configurable: false,
enumerable: false,
writable: false,
value: people.firstName
})
// After set, get the value.
.get;
// Defines the property `firstName` in the `person` object with the same value as the property in the `people` object.
Object.defineProperty(person, 'firstName', firstNameDescriptor);
Descriptor with its unique optional get()
and set()
functions, of the Value
type. For the accessor descriptor with also the object type, please use the type ThisAccessorDescriptor<Value, Obj>
. More about property descriptors here.
interface AccessorDescriptor<Value> extends CommonDescriptor {
get?: () => Value;
set?: (value: Value) => void;
}
Common keys configurable
and enumerable
of a boolean
type for accessor and data descriptor, picked from the default PropertyDescriptor
. More about property descriptors here.
interface CommonDescriptor
extends Pick<PropertyDescriptor, 'configurable' | 'enumerable'> {}
Descriptor with its unique optional keys, writable
of a boolean
type and value
of a generic Value
type. More about property descriptors here.
interface DataDescriptor<Value> extends CommonDescriptor {
writable?: boolean;
value?: Value;
}
AccessorDescriptor
interface as a type cause of ease of use this
of an Obj
type in the get()
and set()
functions. More about property descriptors here.
type ThisAccessorDescriptor<Value, Obj> = AccessorDescriptor<Value> &
ThisType<Obj>;
Property descriptors container.
export class Descriptors<
Obj extends object | Function,
Keys extends keyof Obj
> { ... }
Given a version number MAJOR.MINOR.PATCH, increment the:
- MAJOR version when you make incompatible API changes,
- MINOR version when you add functionality in a backwards-compatible manner, and
- PATCH version when you make backwards-compatible bug fixes.
Additional labels for pre-release and build metadata are available as extensions to the MAJOR.MINOR.PATCH format.
FAQ How should I deal with revisions in the 0.y.z initial development phase?
The simplest thing to do is start your initial development release at 0.1.0 and then increment the minor version for each subsequent release.
How do I know when to release 1.0.0?
If your software is being used in production, it should probably already be 1.0.0. If you have a stable API on which users have come to depend, you should be 1.0.0. If you’re worrying a lot about backwards compatibility, you should probably already be 1.0.0.
MIT © angular-package (license)
Useful and simple to use packages.
Package | Description | Status |
---|---|---|
callback | Manages the callback function . |
|
change-detection | Improves application performance. | |
component-loader | Handles dynamic loading components. | |
core | Core features. | |
error | Manages an Error . |
|
indexeddb | Wrapper to IndexedDB client-side storage. | |
name | The name with prefix and suffix. | |
preferences | Preferences, settings, options, configuration and setup in steps. | |
prism | Prism highlighter module. |
|
property | Handles object properties. | |
range | The range between a minimum and maximum. | |
reactive | Automatize the process of creating some rxjs features. | |
sass | Extension for sass modules and new modules. | |
sass-list | Modified list Sass module. | |
sass-string | Modified string Sass module. | |
spectre.css | Modified Spectre.css - a lightweight, responsive, and modern CSS framework originally designed by Yan Zhu. | |
storage | The storage of data under allowed names. | |
tag | Any tag with optional attributes. | |
testing | Support for testing other packages. | |
text | Text on the template with replaceable tags. | |
type | Common types, type guards, and type checkers. | |
ui | User interface. | |
wrapper | Wrap the text with the opening and closing chars. |
Click on the package name to visit the package GitHub README.md